"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.BaseLayerSwitcher = void 0;
var tslib_1 = require("tslib");
var React = tslib_1.__importStar(require("react"));
var common_1 = require("../api/common");
var string_1 = require("../utils/string");
var i18n_1 = require("../api/i18n");
/**
 * The BaseLayerSwitcher component provides a user interface for switching the active external
 * base layer of the current map
 * @param props
 */
var BaseLayerSwitcher = function (props) {
    var locale = props.locale, externalBaseLayers = props.externalBaseLayers;
    var visLayers = externalBaseLayers.filter(function (layer) { return layer.visible === true; });
    var _a = React.useState(visLayers.length == 1 ? visLayers[0].name : string_1.STR_EMPTY), selected = _a[0], setSelected = _a[1];
    var onBaseLayerChanged = function (e) {
        var _a;
        var value = e.currentTarget.value;
        setSelected(value);
        (_a = props.onBaseLayerChanged) === null || _a === void 0 ? void 0 : _a.call(props, value);
    };
    React.useEffect(function () {
        setSelected(visLayers.length == 1 ? visLayers[0].name : string_1.STR_EMPTY);
    }, [visLayers]);
    return React.createElement("div", null,
        React.createElement("div", { className: "base-layer-switcher-item-container" },
            React.createElement("label", { className: "bp3-control bp3-radio" },
                React.createElement("input", { className: "base-layer-switcher-option", type: "radio", value: string_1.STR_EMPTY, checked: (0, string_1.strIsNullOrEmpty)(selected), onChange: onBaseLayerChanged }),
                React.createElement("span", { className: "bp3-control-indicator" }),
                (0, i18n_1.tr)("NONE", locale))),
        externalBaseLayers.filter(function (ebl) { return (0, common_1.isVisualBaseLayer)(ebl); }).map(function (layer) {
            return React.createElement("div", { className: "base-layer-switcher-item-container", key: "base-layer-".concat(layer.name) },
                React.createElement("label", { className: "bp3-control bp3-radio" },
                    React.createElement("input", { className: "base-layer-switcher-option", type: "radio", value: layer.name, checked: layer.name === selected, onChange: onBaseLayerChanged }),
                    React.createElement("span", { className: "bp3-control-indicator" }),
                    layer.name));
        }));
};
exports.BaseLayerSwitcher = BaseLayerSwitcher;
//# sourceMappingURL=base-layer-switcher.js.map