geostyler
Version:
Framework for styling geodata
80 lines (79 loc) • 1.98 kB
JavaScript
import { jsx as t, jsxs as a } from "react/jsx-runtime";
import { useCallback as y } from "react";
import k from "color";
import { ColorPicker as x, Button as n } from "antd";
/* empty css */
import { useGeoStylerLocale as S } from "../../../../context/GeoStylerContext/GeoStylerContext.js";
import { isGeoStylerFunction as m } from "geostyler-style";
import { FunctionUI as g } from "../../../FunctionUI/FunctionUI.js";
import { FunctionOutlined as C } from "@ant-design/icons";
const B = ({
onChange: o = () => {
},
value: r,
defaultValue: i = "#FFFFFF",
...F
}) => {
const p = S("ColorField"), e = y((s) => {
if (!s) {
o(void 0);
return;
}
const f = s.toHexString();
o(f);
}, [o]);
function d() {
o(i);
}
if (m(r))
return /* @__PURE__ */ t("span", { className: "editor-field gs-color-field", children: /* @__PURE__ */ t(
g,
{
type: "string",
value: r,
onChange: o,
onCancel: d
}
) });
let c;
try {
c = k(r || i).isLight() ? "#000000" : "#FFFFFF";
} catch {
c = "#000000";
}
const l = r || (m(i) ? "#FFFFF" : i);
return /* @__PURE__ */ a("span", { className: "editor-field gs-color-field", children: [
/* @__PURE__ */ t(
x,
{
allowClear: !0,
...F,
disabledAlpha: !0,
onChange: e,
onClear: () => e(),
value: l,
rootClassName: "color-picker-popover",
children: /* @__PURE__ */ t(n, { style: {
backgroundColor: l,
color: c
}, className: "color-picker-trigger", children: r ? r.toString() : p.chooseText })
}
),
/* @__PURE__ */ t(
n,
{
className: "function-ui-trigger",
icon: /* @__PURE__ */ t(C, {}),
onClick: () => {
o == null || o({
name: "property",
args: [""]
});
}
}
)
] });
};
export {
B as ColorField
};