react-kggraph 0.0.17 → 0.0.19

package/lib/index.es12.js

@@ -1,72 +1,32 @@
-import { jsxs as d, jsx as e } from "react/jsx-runtime";
-import { useMemo as b } from "react";
-/* empty css           */
-const L = ({
-  items: h = [
-    // { label: '知识卡片' },
-    // { label: '选中关联' },
-    // { label: '路径分析' },
-    // { label: '展收实体' },
-    // { label: '展收属性' },
-    // { label: '节点配置' },
-  ],
-  centerImage: f,
-  size: c = 200,
-  onClick: $
-}) => {
-  const t = c / 2, a = c / 2 - 10, s = 30, o = 360 / h.length, p = b(() => h.map((n, r) => {
-    const l = (r * o - 90) * (Math.PI / 180), i = ((r + 1) * o - 90) * (Math.PI / 180), m = ((r + 0.5) * o - 90) * (Math.PI / 180), y = t + a * Math.cos(l), v = t + a * Math.sin(l), w = t + a * Math.cos(i), A = t + a * Math.sin(i), N = t + s * Math.cos(i), k = t + s * Math.sin(i), u = t + s * Math.cos(l), x = t + s * Math.sin(l), g = o > 180 ? 1 : 0, I = `M ${u} ${x} L ${y} ${v} A ${a} ${a} 0 ${g} 1 ${w} ${A} L ${N} ${k} A ${s} ${s} 0 ${g} 0 ${u} ${x}`, M = (a + s) / 2 + 5, P = t + M * Math.cos(m), R = t + M * Math.sin(m);
-    return {
-      ...n,
-      path: I,
-      textX: P,
-      textY: R,
-      rotation: (r + 0.5) * o - 90
-    };
-  }), [h, o, t, a, s]);
-  return /* @__PURE__ */ d("div", { className: "radial-menu", style: { width: c, height: c }, children: [
-    /* @__PURE__ */ d("svg", { width: c, height: c, className: "radial-svg", children: [
-      /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ e("filter", { id: "shadow", x: "-20%", y: "-20%", width: "140%", height: "140%", children: /* @__PURE__ */ e("feDropShadow", { dx: "0", dy: "2", stdDeviation: "3", floodOpacity: "0.3" }) }) }),
-      /* @__PURE__ */ e("circle", { cx: t, cy: t, r: a, fill: "#f5f5f5", stroke: "#ddd", strokeWidth: "1" }),
-      p.map((n, r) => /* @__PURE__ */ d("g", { onClick: () => $(n), className: "sector-group", children: [
-        /* @__PURE__ */ e(
-          "path",
-          {
-            d: n.path,
-            fill: "#333",
-            stroke: "rgb(185, 185, 185)",
-            strokeWidth: "1",
-            filter: "url(#shadow)",
-            className: "sector-path"
-          }
-        ),
-        /* @__PURE__ */ e(
-          "text",
-          {
-            x: n.textX,
-            y: n.textY,
-            textAnchor: "middle",
-            dominantBaseline: "middle",
-            fill: "#fff",
-            fontSize: "12",
-            fontWeight: "500",
-            className: "sector-label",
-            children: n.label
-          }
-        )
-      ] }, r)),
-      /* @__PURE__ */ e("circle", { cx: t, cy: t, r: s + 2, fill: "#fff" })
-    ] }),
-    /* @__PURE__ */ e(
-      "div",
-      {
-        className: "center-avatar",
-        style: { width: s * 2, height: s * 2 },
-        children: f ? /* @__PURE__ */ e("img", { src: f, alt: "avatar" }) : /* @__PURE__ */ e("span", { className: "center-text", children: "菜单" })
-      }
-    )
-  ] });
+const t = (r) => {
+  if (n(r) || Array.isArray(r))
+    try {
+      return JSON.stringify(r);
+    } catch (e) {
+      console.log("JSON.stringify", e);
+    }
+  else
+    return r;
+}, c = (r) => {
+  if (n(r) || Array.isArray(r))
+    try {
+      return JSON.parse(JSON.stringify(r));
+    } catch (e) {
+      console.log("JSON.stringify-JSON.parse", e);
+    }
+  else
+    return r;
+};
+function n(r) {
+  return r !== null && typeof r == "object" && !Array.isArray(r);
+}
+const i = (r, e) => {
+  const o = document.createElement("a");
+  o.href = r, o.download = e, document.body.appendChild(o), o.click(), document.body.removeChild(o);
 };
 export {
-  L as default
+  i as downloadFile,
+  n as isObject,
+  t as jsonStringify,
+  c as jsonStringifyParse
 };

package/lib/index.es13.js

@@ -1,226 +1,66 @@
-import { jsx as e, jsxs as r } from "react/jsx-runtime";
-import { forwardRef as h, useState as s, useImperativeHandle as b } from "react";
-import { Drawer as x } from "antd";
-const N = h((y, d) => {
-  const [c, t] = s(!1), [a, o] = s({ style: {}, data: {} });
-  b(d, () => ({
-    open: (n) => {
-      t(!0), o(n);
-    },
-    close: () => t(!1)
-  }));
-  const i = () => {
-    t(!1);
-  }, l = (n) => {
-    const { name: p, value: m } = n.target;
-    o((u) => ({ ...u, [p]: m }));
-  };
-  return /* @__PURE__ */ e(
-    x,
-    {
-      title: "节点配置",
-      closable: { "aria-label": "Close Button" },
-      onClose: i,
-      open: c,
-      getContainer: !1,
-      children: /* @__PURE__ */ e("div", { className: "h-full overflow-y-auto z-50", children: /* @__PURE__ */ r("div", { className: "space-y-4", children: [
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "名称" }),
-          /* @__PURE__ */ e(
-            "input",
-            {
-              name: "name",
-              value: a.data.name,
-              onChange: l,
-              readOnly: !0,
-              className: "flex-1 px-3 py-1.5 border border-gray-300 rounded  focus:outline-none focus:ring-1 focus:ring-blue-500"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "类型" }),
-          /* @__PURE__ */ r(
-            "select",
-            {
-              name: "type",
-              value: a.type,
-              disabled: !0,
-              onChange: l,
-              className: "flex-1 px-3 py-1.5 border border-gray-300 rounded  bg-white",
-              children: [
-                /* @__PURE__ */ e("option", { value: "圆形", children: "圆形" }),
-                /* @__PURE__ */ e("option", { value: "矩形", children: "矩形" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "颜色" }),
-          /* @__PURE__ */ r("div", { className: "flex-1 flex gap-2 items-center", children: [
-            /* @__PURE__ */ e(
-              "input",
-              {
-                name: "color",
-                readOnly: !0,
-                value: a.style.color,
-                onChange: l,
-                className: "flex-1 px-3 py-1.5 border border-gray-300 rounded h-30px"
-              }
-            ),
-            /* @__PURE__ */ e(
-              "input",
-              {
-                type: "color",
-                readOnly: !0,
-                value: a.style.color,
-                onChange: (n) => o({ ...a, color: n.target.value }),
-                className: "h-20px w-20px rounded cursor-pointer border"
-              }
-            )
-          ] })
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "大小" }),
-          /* @__PURE__ */ e(
-            "input",
-            {
-              type: "number",
-              name: "size",
-              readOnly: !0,
-              value: parseInt(a.style.height),
-              onChange: l,
-              className: "flex-1 px-3 py-1.5 border border-gray-300 rounded "
-            }
-          )
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "边框宽度" }),
-          /* @__PURE__ */ e(
-            "input",
-            {
-              type: "number",
-              name: "borderWidth",
-              readOnly: !0,
-              value: parseInt(a.style.borderWidth),
-              onChange: l,
-              className: "flex-1 px-3 py-1.5 border border-gray-300 rounded "
-            }
-          )
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "边框虚线" }),
-          /* @__PURE__ */ r(
-            "select",
-            {
-              name: "borderDash",
-              value: a.style.borderDash,
-              disabled: !0,
-              onChange: l,
-              className: "flex-1 px-3 py-1.5 border border-gray-300 rounded  bg-white",
-              children: [
-                /* @__PURE__ */ e("option", { value: "否", children: "否" }),
-                /* @__PURE__ */ e("option", { value: "是", children: "是" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "边框颜色" }),
-          /* @__PURE__ */ r("div", { className: "flex-1 flex gap-2 items-center", children: [
-            /* @__PURE__ */ e(
-              "input",
-              {
-                name: "borderColor",
-                value: a.style.borderColor,
-                readOnly: !0,
-                onChange: l,
-                className: "flex-1 px-3 py-1.5 border border-gray-300 rounded h-30px"
-              }
-            ),
-            /* @__PURE__ */ e(
-              "input",
-              {
-                type: "color",
-                value: a.borderColor,
-                readOnly: !0,
-                onChange: (n) => o({ ...a, borderColor: n.target.value }),
-                className: "h-20px w-20px rounded cursor-pointer border"
-              }
-            )
-          ] })
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "字体位置" }),
-          /* @__PURE__ */ r(
-            "select",
-            {
-              name: "fontPosition",
-              value: a.style.textValign,
-              disabled: !0,
-              onChange: l,
-              className: "flex-1 px-3 py-1.5 border border-gray-300 rounded  bg-white",
-              children: [
-                /* @__PURE__ */ e("option", { value: "center", children: "居中" }),
-                /* @__PURE__ */ e("option", { value: "bottom", children: "底部" }),
-                /* @__PURE__ */ e("option", { value: "top", children: "顶部" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "字体样式" }),
-          /* @__PURE__ */ e(
-            "input",
-            {
-              name: "fontStyle",
-              value: a.style.fontStyle,
-              readOnly: !0,
-              onChange: l,
-              className: "flex-1 px-3 py-1.5 border border-gray-300 rounded "
-            }
-          )
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "字体颜色" }),
-          /* @__PURE__ */ r("div", { className: "flex-1 flex gap-2 items-center", children: [
-            /* @__PURE__ */ e(
-              "input",
-              {
-                name: "fontColor",
-                readOnly: !0,
-                value: a.style.textBorderColor,
-                onChange: l,
-                className: "flex-1 px-3 py-1.5 border border-gray-300 rounded h-30px"
-              }
-            ),
-            /* @__PURE__ */ e(
-              "input",
-              {
-                type: "color",
-                readOnly: !0,
-                value: a.style["font-color"],
-                onChange: (n) => o({ ...a, fontColor: n.target.value }),
-                className: "h-20px w-20px rounded cursor-pointer border"
-              }
-            )
-          ] })
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-4 !mb-20px", children: [
-          /* @__PURE__ */ e("label", { className: "w-40", children: "字体背色" }),
-          /* @__PURE__ */ e(
-            "input",
-            {
-              type: "text",
-              readOnly: !0,
-              value: a.style.textBackgroundColor,
-              className: "flex-1 px-3 py-1.5 border border-gray-300 rounded  bg-gray-50 text-gray-400 cursor-not-allowed"
-            }
-          )
-        ] })
-      ] }) })
-    }
-  );
-});
+import { jsxs as d, jsx as e } from "react/jsx-runtime";
+import { useMemo as C } from "react";
+/* empty css           */
+const S = ({
+  items: h = [],
+  centerImage: f,
+  size: c = 200,
+  onClick: $,
+  targetNode: p
+}) => {
+  const t = c / 2, a = c / 2 - 10, s = 30, o = 360 / h.length, y = C(() => h.map((n, r) => {
+    const l = (r * o - 90) * (Math.PI / 180), i = ((r + 1) * o - 90) * (Math.PI / 180), m = ((r + 0.5) * o - 90) * (Math.PI / 180), v = t + a * Math.cos(l), w = t + a * Math.sin(l), A = t + a * Math.cos(i), N = t + a * Math.sin(i), k = t + s * Math.cos(i), I = t + s * Math.sin(i), u = t + s * Math.cos(l), x = t + s * Math.sin(l), g = o > 180 ? 1 : 0, P = `M ${u} ${x} L ${v} ${w} A ${a} ${a} 0 ${g} 1 ${A} ${N} L ${k} ${I} A ${s} ${s} 0 ${g} 0 ${u} ${x}`, M = (a + s) / 2 + 5, R = t + M * Math.cos(m), b = t + M * Math.sin(m);
+    return {
+      ...n,
+      path: P,
+      textX: R,
+      textY: b,
+      rotation: (r + 0.5) * o - 90
+    };
+  }), [h, o, t, a, s]);
+  return /* @__PURE__ */ d("div", { className: "radial-menu", style: { width: c, height: c }, children: [
+    /* @__PURE__ */ d("svg", { width: c, height: c, className: "radial-svg", children: [
+      /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ e("filter", { id: "shadow", x: "-20%", y: "-20%", width: "140%", height: "140%", children: /* @__PURE__ */ e("feDropShadow", { dx: "0", dy: "2", stdDeviation: "3", floodOpacity: "0.3" }) }) }),
+      /* @__PURE__ */ e("circle", { cx: t, cy: t, r: a, fill: "#f5f5f5", stroke: "#ddd", strokeWidth: "1" }),
+      y.map((n, r) => /* @__PURE__ */ d("g", { onClick: () => $(n, p), className: "sector-group", children: [
+        /* @__PURE__ */ e(
+          "path",
+          {
+            d: n.path,
+            fill: "#333",
+            stroke: "rgb(185, 185, 185)",
+            strokeWidth: "1",
+            filter: "url(#shadow)",
+            className: "sector-path"
+          }
+        ),
+        /* @__PURE__ */ e(
+          "text",
+          {
+            x: n.textX,
+            y: n.textY,
+            textAnchor: "middle",
+            dominantBaseline: "middle",
+            fill: "#fff",
+            fontSize: "12",
+            fontWeight: "500",
+            className: "sector-label",
+            children: n.label
+          }
+        )
+      ] }, r)),
+      /* @__PURE__ */ e("circle", { cx: t, cy: t, r: s + 2, fill: "#fff" })
+    ] }),
+    /* @__PURE__ */ e(
+      "div",
+      {
+        className: "center-avatar",
+        style: { width: s * 2, height: s * 2 },
+        children: f ? /* @__PURE__ */ e("img", { src: f, alt: "avatar" }) : /* @__PURE__ */ e("span", { className: "center-text", children: "菜单" })
+      }
+    )
+  ] });
+};
 export {
-  N as default
+  S as default
 };

package/lib/index.es14.js

@@ -1,6 +1,71 @@
-import { createContext as r } from "react";
-const o = r({}), e = o.Provider;
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { forwardRef as w, useState as C, useImperativeHandle as D } from "react";
+import { Select as a, Form as l, Drawer as F, Input as r } from "antd";
+const { Option: o } = a, z = w((S, g) => {
+  const [v, d] = C(!1), [B, x] = C({ style: {}, data: {} }), [s] = l.useForm();
+  return D(g, () => ({
+    open: (t) => {
+      var c, h, i, m, b, y, p, u, f, I;
+      d(!0), x(t), s.setFieldsValue({
+        name: (c = t.data) == null ? void 0 : c.name,
+        type: t.type || "圆形",
+        color: (h = t.style) == null ? void 0 : h.color,
+        size: parseInt((i = t.style) == null ? void 0 : i.height) || 30,
+        borderWidth: parseInt((m = t.style) == null ? void 0 : m.borderWidth) || 2,
+        borderDash: ((b = t.style) == null ? void 0 : b.borderDash) === [5, 5] ? "是" : "否",
+        borderColor: (y = t.style) == null ? void 0 : y.borderColor,
+        textValign: ((p = t.style) == null ? void 0 : p.textValign) || "center",
+        fontStyle: ((u = t.style) == null ? void 0 : u.fontStyle) || "normal",
+        fontColor: ((f = t.style) == null ? void 0 : f["font-color"]) || "#000000",
+        textBackgroundColor: ((I = t.style) == null ? void 0 : I.textBackgroundColor) || "transparent"
+      });
+    },
+    close: () => d(!1)
+  })), /* @__PURE__ */ e(
+    F,
+    {
+      title: "节点配置",
+      closable: { "aria-label": "Close Button" },
+      onClose: () => {
+        d(!1), s.resetFields();
+      },
+      open: v,
+      getContainer: !1,
+      width: 360,
+      children: /* @__PURE__ */ n(
+        l,
+        {
+          form: s,
+          layout: "vertical",
+          disabled: !0,
+          children: [
+            /* @__PURE__ */ e(l.Item, { label: "名称", name: "name", children: /* @__PURE__ */ e(r, {}) }),
+            /* @__PURE__ */ e(l.Item, { label: "类型", name: "type", children: /* @__PURE__ */ n(a, { children: [
+              /* @__PURE__ */ e(o, { value: "圆形", children: "圆形" }),
+              /* @__PURE__ */ e(o, { value: "矩形", children: "矩形" })
+            ] }) }),
+            /* @__PURE__ */ e(l.Item, { label: "颜色", name: "color", children: /* @__PURE__ */ e(r, { type: "color", style: { width: "100%", height: 32 } }) }),
+            /* @__PURE__ */ e(l.Item, { label: "大小", name: "size", children: /* @__PURE__ */ e(r, { type: "number" }) }),
+            /* @__PURE__ */ e(l.Item, { label: "边框宽度", name: "borderWidth", children: /* @__PURE__ */ e(r, { type: "number" }) }),
+            /* @__PURE__ */ e(l.Item, { label: "边框虚线", name: "borderDash", children: /* @__PURE__ */ n(a, { children: [
+              /* @__PURE__ */ e(o, { value: "否", children: "否" }),
+              /* @__PURE__ */ e(o, { value: "是", children: "是" })
+            ] }) }),
+            /* @__PURE__ */ e(l.Item, { label: "边框颜色", name: "borderColor", children: /* @__PURE__ */ e(r, { type: "color", style: { width: "100%", height: 32 } }) }),
+            /* @__PURE__ */ e(l.Item, { label: "字体位置", name: "textValign", children: /* @__PURE__ */ n(a, { children: [
+              /* @__PURE__ */ e(o, { value: "center", children: "居中" }),
+              /* @__PURE__ */ e(o, { value: "bottom", children: "底部" }),
+              /* @__PURE__ */ e(o, { value: "top", children: "顶部" })
+            ] }) }),
+            /* @__PURE__ */ e(l.Item, { label: "字体样式", name: "fontStyle", children: /* @__PURE__ */ e(r, {}) }),
+            /* @__PURE__ */ e(l.Item, { label: "字体颜色", name: "fontColor", children: /* @__PURE__ */ e(r, { type: "color", style: { width: "100%", height: 32 } }) }),
+            /* @__PURE__ */ e(l.Item, { label: "字体背色", name: "textBackgroundColor", children: /* @__PURE__ */ e(r, {}) })
+          ]
+        }
+      )
+    }
+  );
+});
 export {
-  o as GraphContext,
-  e as GraphProvider
+  z as default
 };

package/lib/index.es15.js

@@ -1,37 +1,6 @@
-import { jsx as n } from "react/jsx-runtime";
-import { forwardRef as g, useContext as m, useState as o, useRef as w, useEffect as C, useImperativeHandle as h } from "react";
-import { Drawer as x } from "antd";
-import { GraphContext as y } from "./index.es14.js";
-const F = g((I, l) => {
-  const { graphInfo: d, knowledgeCardApi: f } = m(y), [t, a] = o(!1), [k, r] = o(!1), [D, c] = o(!1), [v, p] = o({ style: {}, data: {} }), s = w(null);
-  C(() => {
-    t && s.current && (s.current.scrollTop = 0);
-  }, [t]), h(l, () => ({
-    open: (e) => {
-      a(!0), p(e), i(e);
-    },
-    close: () => a(!1)
-  }));
-  const i = async (e) => {
-    r(!0);
-    const u = await f({ kgId: d.kgId, uri: e.id });
-    console.log(44, e), c(u.data), r(!1);
-  };
-  return /* @__PURE__ */ n(
-    x,
-    {
-      title: "知识卡片",
-      onClose: () => {
-        a(!1);
-      },
-      open: t,
-      getContainer: !1,
-      className: "knowledge-card-drawer",
-      styles: { body: { padding: "0 20px", overflow: "auto" } },
-      children: /* @__PURE__ */ n("div", { ref: s, style: { height: "100%" } })
-    }
-  );
-});
+import { createContext as r } from "react";
+const o = r({}), e = o.Provider;
 export {
-  F as default
+  o as GraphContext,
+  e as GraphProvider
 };

package/lib/index.es16.js

@@ -0,0 +1,37 @@
+import { jsx as n } from "react/jsx-runtime";
+import { forwardRef as g, useContext as m, useState as o, useRef as w, useEffect as C, useImperativeHandle as h } from "react";
+import { Drawer as x } from "antd";
+import { GraphContext as y } from "./index.es15.js";
+const F = g((I, l) => {
+  const { graphInfo: d, knowledgeCardApi: f } = m(y), [t, a] = o(!1), [k, r] = o(!1), [D, c] = o(!1), [v, p] = o({ style: {}, data: {} }), s = w(null);
+  C(() => {
+    t && s.current && (s.current.scrollTop = 0);
+  }, [t]), h(l, () => ({
+    open: (e) => {
+      a(!0), p(e), i(e);
+    },
+    close: () => a(!1)
+  }));
+  const i = async (e) => {
+    r(!0);
+    const u = await f({ kgId: d.kgId, uri: e.id });
+    console.log(44, e), c(u.data), r(!1);
+  };
+  return /* @__PURE__ */ n(
+    x,
+    {
+      title: "知识卡片",
+      onClose: () => {
+        a(!1);
+      },
+      open: t,
+      getContainer: !1,
+      className: "knowledge-card-drawer",
+      styles: { body: { padding: "0 20px", overflow: "auto" } },
+      children: /* @__PURE__ */ n("div", { ref: s, style: { height: "100%" } })
+    }
+  );
+});
+export {
+  F as default
+};