geostyler
Version:
Framework for styling geodata
276 lines (275 loc) • 7.72 kB
JavaScript
import { jsx as e, jsxs as g } from "react/jsx-runtime";
import { useState as t } from "react";
import { Form as r, Radio as F, InputNumber as oe, Tooltip as le, Button as O } from "antd";
import { AttributeCombo as te } from "../Filter/AttributeCombo/AttributeCombo.js";
/* empty css */
import f from "../../Util/RuleGeneratorUtil.js";
import { KindField as ne } from "../Symbolizer/Field/KindField/KindField.js";
import { WellKnownNameField as re } from "../Symbolizer/Field/WellKnownNameField/WellKnownNameField.js";
import { brewer as se } from "chroma-js";
import { ColorRampCombo as ie } from "./ColorRampCombo/ColorRampCombo.js";
import { ColorSpaceCombo as ae } from "./ColorSpaceCombo/ColorSpaceCombo.js";
import { ColorsPreview as ce } from "./ColorsPreview/ColorsPreview.js";
import { ClassificationCombo as me } from "./ClassificationCombo/ClassificationCombo.js";
import ue from "lodash-es/get.js";
import { PlusSquareOutlined as de } from "@ant-design/icons";
import { useGeoStylerData as he, useGeoStylerComposition as W, useGeoStylerLocale as pe } from "../../context/GeoStylerContext/GeoStylerContext.js";
import { getFormItemConfig as ge } from "../../Util/FormItemUtil.js";
import { ElseRuleField as fe } from "../Symbolizer/Field/ElseRuleField/ElseRuleField.js";
const $e = ($) => {
const u = he(), L = W("RuleGenerator"), C = W("Rule"), P = { ...$, ...L, elseRuleField: C == null ? void 0 : C.elseRuleField }, {
onRulesChange: G,
colorSpaces: M = ["hsl", "hsv", "hsi", "lab", "lch", "hcl", "rgb"],
// rgba, cmyk and gl crash
colorRamps: m = {
GeoStyler: ["#E7000E", "#F48E00", "#FFED00", "#00943D", "#272C82", "#611E82"],
GreenRed: ["#00FF00", "#FF0000"],
...se
},
elseRuleField: b
} = P, o = pe("RuleGenerator"), a = 2, [v, V] = t(
f.guessSymbolizerFromData(u)
), [R, I] = t("circle"), [y, x] = t(m && m.GeoStyler ? "GeoStyler" : void 0), [w, z] = t("hsl"), [i, S] = t(2), [k, A] = t([]), [T, E] = t(), [B, j] = t(), [d, U] = t(), [c, N] = t(), [h, D] = t(), [p, q] = t(!1), H = (l) => {
try {
const s = ue(u, `schema.properties[${l}].type`);
let K = c;
s === "string" && c === "kmeans" && (K = void 0);
const ee = f.getDistinctValues(u, l) || [];
U(l), j(s), A(ee), D(s === "string" ? "nominal" : "cardinal"), N(K);
} catch {
E(!0);
}
}, _ = (l) => {
q(l);
}, J = (l) => {
D(l.target.value);
}, Q = () => {
S(k.length);
}, X = (l) => {
let s;
l === "Mark" && !R ? s = "circle" : s = void 0, I(s), V(l);
}, Y = () => {
try {
const l = f.generateRules({
attributeName: d,
classificationMethod: c,
colors: m[y],
data: u,
levelOfMeasurement: h,
numberOfRules: i,
symbolizerKind: v,
wellKnownName: R,
elseRule: p
});
if (c === "kmeans") {
const s = p ? l.length : l.length - 1;
S(s);
}
G && G(l);
} catch {
E(!0);
}
};
if (T)
return /* @__PURE__ */ e("h1", { children: "An error occurred in the RuleGenerator UI." });
const Z = f.generateColors(
m[y],
p ? i + 1 : i,
w
), n = ge();
return /* @__PURE__ */ g("div", { className: "gs-rule-generator", children: [
/* @__PURE__ */ e(
te,
{
value: d,
onAttributeChange: H,
validateStatus: d ? "success" : "warning"
}
),
/* @__PURE__ */ e(
r.Item,
{
...n,
label: o.levelOfMeasurement,
children: /* @__PURE__ */ g(
F.Group,
{
onChange: J,
value: h,
buttonStyle: "solid",
children: [
/* @__PURE__ */ e(
F.Button,
{
value: "nominal",
children: o.nominal
}
),
/* @__PURE__ */ e(
F.Button,
{
value: "cardinal",
disabled: B === "string",
children: o.cardinal
}
)
]
}
)
}
),
h !== "cardinal" ? null : /* @__PURE__ */ e(
r.Item,
{
...n,
label: o.classification,
children: /* @__PURE__ */ e(
me,
{
classification: c,
onChange: N
}
)
}
),
/* @__PURE__ */ e(
r.Item,
{
...n,
label: o.numberOfRules,
validateStatus: c === "kmeans" ? "warning" : i < a ? "error" : void 0,
help: c === "kmeans" ? o.numberOfRulesViaKmeans : i < a ? `${o.colorRampMinClassesWarningPre} ${a} ${o.colorRampMinClassesWarningPost}` : void 0,
children: /* @__PURE__ */ g("div", { children: [
/* @__PURE__ */ e(
oe,
{
min: a,
max: 100,
value: i,
onChange: S
}
),
h === "nominal" && k.length > 0 && /* @__PURE__ */ e(le, { title: o.allDistinctValues, children: /* @__PURE__ */ e(
O,
{
className: "all-distinct-values-button",
icon: /* @__PURE__ */ e(de, {}),
onClick: Q
}
) })
] })
}
),
/* @__PURE__ */ g("fieldset", { children: [
/* @__PURE__ */ e("legend", { children: o.symbolizer }),
/* @__PURE__ */ e(
r.Item,
{
...n,
children: /* @__PURE__ */ e(
ne,
{
value: v,
symbolizerKinds: [
"Fill",
"Mark",
"Line"
],
onChange: X
}
)
}
),
v !== "Mark" ? null : /* @__PURE__ */ e(
r.Item,
{
...n,
children: /* @__PURE__ */ e(
re,
{
value: R,
onChange: I
}
)
}
),
/* @__PURE__ */ e(
r.Item,
{
...n,
label: o.colorRamp,
help: i < a ? `${o.colorRampMinClassesWarningPre} ${a} ${o.colorRampMinClassesWarningPost}` : void 0,
children: /* @__PURE__ */ e(
ie,
{
colorRamps: m,
colorRamp: y,
onChange: x
}
)
}
),
M.length > 0 ? /* @__PURE__ */ e(
r.Item,
{
...n,
label: o.colorSpace,
children: /* @__PURE__ */ e(
ae,
{
colorSpace: w,
colorSpaces: M,
onChange: z
}
)
}
) : null,
/* @__PURE__ */ e(
r.Item,
{
...n,
label: o.preview,
children: /* @__PURE__ */ e(
ce,
{
colors: Z
}
)
}
)
] }),
(b == null ? void 0 : b.visibility) === !1 ? null : /* @__PURE__ */ e(
r.Item,
{
...n,
label: o.elseRuleFieldLabel,
children: /* @__PURE__ */ e(
fe,
{
value: p,
onChange: _
}
)
}
),
/* @__PURE__ */ e(
r.Item,
{
...n,
children: /* @__PURE__ */ e(
O,
{
className: "gs-rule-generator-submit-button",
type: "primary",
onClick: Y,
disabled: i < a || !d,
children: o.generateButtonText
}
)
}
)
] });
};
export {
$e as RuleGenerator
};