import { __assign, __rest } from "tslib";
import React from "react";
import { Card, Row, Space, Toggle, Icons } from "v-eris";
import { ColorPicker } from "./types.color";
import "./types.zoom.scss";
export var ZoomParams = function (props) {
    var className = props.className, range = props.range, value = props.value, onChange = props.onChange, rest = __rest(props, ["className", "range", "value", "onChange"]);
    if (!range || !Array.isArray(range))
        range = [0, 0];
    if (!value)
        value = {};
    var change = function (key, valueArg) {
        var v = __assign({}, value);
        v[key] = valueArg;
        if (!onChange)
            return;
        onChange({ value: v });
    };
    return (React.createElement(Card, { header: React.createElement("span", null,
            React.createElement(Icons.road, null),
            React.createElement(Space, null),
            "Маштаб",
            " ",
            range[0] + "-" + range[1]) },
        React.createElement(Row, null,
            "Отображать метки",
            ":",
            React.createElement(Space, null),
            React.createElement(Toggle, { value: value.marks, onChange: function (e) { change("marks", e.value); } })),
        React.createElement(Row, null,
            "Обьеденять метки в класстеры",
            ":",
            React.createElement(Space, null),
            React.createElement(Toggle, { value: value.clusters, onChange: function (e) { change("clusters", e.value); } })),
        React.createElement(Row, null,
            "Цвет метки",
            ":",
            React.createElement(Space, null),
            React.createElement(ColorPicker, { value: value.marksColor, onChange: function (e) { change("marksColor", e.value); } })),
        React.createElement(Row, null,
            "Цвет тени метки",
            ":",
            React.createElement(Space, null),
            React.createElement(ColorPicker, { value: value.marksShadow, onChange: function (e) { change("marksShadow", e.value); } })),
        React.createElement(Row, null,
            "Отображать формуляр неактивной метки",
            ":",
            React.createElement(Space, null),
            React.createElement(Toggle, { value: value.tooltipInactive, onChange: function (e) { change("tooltipInactive", e.value); } })),
        React.createElement(Row, null,
            "Использовать интерактивный формуляр",
            ":",
            React.createElement(Space, null),
            React.createElement(Toggle, { value: value.tooltipInteractive, onChange: function (e) { change("tooltipInteractive", e.value); } }))));
};
//# sourceMappingURL=types.zoom.js.map