opendash
Version:
open.DASH data visualization framework
97 lines • 4.69 kB
JavaScript
import * as React from "react";
import { useTranslation } from "../..";
import { Select } from "./select";
import { Description } from "./layout";
import { Collapse, Checkbox } from "antd";
export var Settings = function (_a) {
var state = _a.state, updateState = _a.updateState;
var _b;
var t = useTranslation(["opendash"])[0];
React.useEffect(function () {
if (Object.keys(state.settings).length === 0) {
updateState(function (draft) {
draft.settings.interaction_legend = true;
});
}
}, [(_b = state) === null || _b === void 0 ? void 0 : _b.settings]);
return (React.createElement(Collapse, { bordered: false, defaultActiveKey: ["general"] },
React.createElement(Collapse.Panel, { header: t("data_explorer.pie.general_options"), key: "general" },
React.createElement(Description, { children: t("data_explorer.pie.style") }),
React.createElement(Select, { value: state.settings.style, size: 3, onChange: function (nextValue) {
updateState(function (draft) {
draft.settings.style = nextValue;
});
}, options: [
{
label: t("data_explorer.pie.style_pie"),
icon: "pie-chart",
tooltip: null,
value: "pie",
disabled: false,
},
{
label: t("data_explorer.pie.style_donut"),
icon: "pie-chart",
tooltip: null,
value: "donut",
disabled: false,
},
{
label: t("data_explorer.pie.style_half_donut"),
icon: "pie-chart",
tooltip: null,
value: "half_donut",
disabled: false,
},
] }),
React.createElement(Description, { children: t("data_explorer.pie.aggregation") }),
React.createElement(Select, { value: state.settings.aggregation, size: 5, onChange: function (nextValue) {
updateState(function (draft) {
draft.settings.aggregation = nextValue;
});
}, options: [
{
label: t("data_explorer.pie.aggregation_sum"),
icon: "pie-chart",
tooltip: null,
value: "sum",
disabled: false,
},
{
label: t("data_explorer.pie.aggregation_mean"),
icon: "pie-chart",
tooltip: null,
value: "mean",
disabled: false,
},
{
label: t("data_explorer.pie.aggregation_max"),
icon: "pie-chart",
tooltip: null,
value: "max",
disabled: false,
},
{
label: t("data_explorer.pie.aggregation_min"),
icon: "pie-chart",
tooltip: null,
value: "min",
disabled: false,
},
{
label: t("data_explorer.pie.aggregation_count"),
icon: "pie-chart",
tooltip: null,
value: "count",
disabled: false,
},
] })),
React.createElement(Collapse.Panel, { header: t("data_explorer.pie.interaction_options"), key: "interaction" },
React.createElement("div", { style: { marginBottom: 24 } },
React.createElement(Checkbox, { children: t("data_explorer.pie.interaction_legend"), checked: state.settings.interaction_legend, onChange: function (event) {
var value = event.target.checked;
updateState(function (draft) { return void (draft.settings.interaction_legend = value); });
} })),
React.createElement(Description, { children: t("opendash.data_explorer.pie.interaction_options_description") }))));
};
//# sourceMappingURL=step_3_pie.js.map