@vunk/graph 0.0.1

package/components/hover-node/src/index.vue.d.ts

@@ -0,0 +1,148 @@
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    contextMenu: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modelValue: {
+        type: StringConstructor;
+        default: string;
+    };
+    leaveDelay: {
+        type: NumberConstructor;
+        default: number;
+    };
+    enterDelay: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>, {
+    changeContextmenuShow: (show: boolean) => void;
+    contextmenuState: {
+        node: string;
+        show: boolean;
+        options: {
+            x: number;
+            y: number;
+        };
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    'update:modelValue': null;
+    rightClick: (e: import("./types").RightClickEvent) => import("./types").RightClickEvent;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    contextMenu: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modelValue: {
+        type: StringConstructor;
+        default: string;
+    };
+    leaveDelay: {
+        type: NumberConstructor;
+        default: number;
+    };
+    enterDelay: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & Readonly<{
+    onRightClick?: ((e: import("./types").RightClickEvent) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}>, {
+    contextMenu: boolean;
+    modelValue: string;
+    leaveDelay: number;
+    enterDelay: number;
+}, {}, {
+    ContextMenu: {
+        new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
+            options: {
+                type: import("vue").PropType<import("@vunk/graph/components/context-menu").MenuOptions>;
+                default: null;
+            };
+            show: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & {
+            onClose?: ((...args: any[]) => any) | undefined;
+            "onUpdate:show"?: ((...args: any[]) => any) | undefined;
+        }, {
+            closeMenu: () => void;
+            isClosed: () => boolean;
+            getMenuRef: () => import("@vunk/graph/components/context-menu").ContextSubMenuInstance | undefined;
+            getMenuDimensions: () => {
+                width: number;
+                height: number;
+            };
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+            close: (...args: any[]) => void;
+            "update:show": (...args: any[]) => void;
+        }, import("vue").PublicProps, {
+            options: import("@vunk/graph/components/context-menu").MenuOptions;
+            show: boolean;
+        }, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import("vue").ExtractPropTypes<{
+            options: {
+                type: import("vue").PropType<import("@vunk/graph/components/context-menu").MenuOptions>;
+                default: null;
+            };
+            show: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & {
+            onClose?: ((...args: any[]) => any) | undefined;
+            "onUpdate:show"?: ((...args: any[]) => any) | undefined;
+        }, {
+            closeMenu: () => void;
+            isClosed: () => boolean;
+            getMenuRef: () => import("@vunk/graph/components/context-menu").ContextSubMenuInstance | undefined;
+            getMenuDimensions: () => {
+                width: number;
+                height: number;
+            };
+        }, {}, {}, {}, {
+            options: import("@vunk/graph/components/context-menu").MenuOptions;
+            show: boolean;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+        options: {
+            type: import("vue").PropType<import("@vunk/graph/components/context-menu").MenuOptions>;
+            default: null;
+        };
+        show: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & {
+        onClose?: ((...args: any[]) => any) | undefined;
+        "onUpdate:show"?: ((...args: any[]) => any) | undefined;
+    }, {
+        closeMenu: () => void;
+        isClosed: () => boolean;
+        getMenuRef: () => import("@vunk/graph/components/context-menu").ContextSubMenuInstance | undefined;
+        getMenuDimensions: () => {
+            width: number;
+            height: number;
+        };
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        close: (...args: any[]) => void;
+        "update:show": (...args: any[]) => void;
+    }, string, {
+        options: import("@vunk/graph/components/context-menu").MenuOptions;
+        show: boolean;
+    }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        $slots: Partial<Record<number, (_: any) => any>>;
+    });
+}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/components/hover-node/src/types.d.ts

@@ -0,0 +1,4 @@
+export interface RightClickEvent {
+    node: string;
+    original: MouseEvent;
+}

package/components/label/index.css

@@ -0,0 +1,30 @@
+.vkg-label-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+.vkg-label-item{
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  padding: 4px 0;
+  transition: opacity 0.2s;
+}
+.vkg-label-item:hover {
+  opacity: 0.8;
+}
+.vkg-label-item.is-hidden {
+  opacity: 0.4;
+}
+.vkg-label-dot {
+  display: inline-block;
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  margin-right: 0.8em;
+  flex-shrink: 0;
+}
+.vkg-label-text {
+  font-size: 14px;
+  user-select: none;
+}

package/components/label/index.d.ts

@@ -0,0 +1,6 @@
+import VkLabel from './src/index.vue';
+import VkLabelView from './src/view.vue';
+export { SegmentRenderer as VkLabelProvider } from './src/core';
+export * as __VkLabel from './src/types';
+export { VkLabel, VkLabelView, };
+export default VkLabel;

package/components/label/index.mjs

@@ -0,0 +1,145 @@
+import { defineComponent, resolveComponent, createBlock, openBlock, ref, unref, withCtx, createElementVNode, createElementBlock, Fragment, renderList, mergeProps, createCommentVNode, normalizeStyle, toDisplayString } from 'vue';
+import { createSegmentRenderer } from '@vunk/core/components/segment-renderer';
+import { _ as _export_sfc } from '../_plugin-vue_export-helper.mjs';
+import { useGraph } from '@vunk/graph/components/graph';
+
+const {
+  Segment,
+  SegmentRenderer,
+  SegmentView,
+  useSegmentRendererContext
+} = createSegmentRenderer("vunk-graph-label");
+
+const props = {
+  /**
+   * 标签的值，通常对应节点数据中的某个字段值
+   */
+  value: {
+    type: String,
+    required: true
+  },
+  /**
+   * 标签显示的文本
+   */
+  label: {
+    type: String,
+    default: ""
+  },
+  /**
+   * 标签的颜色
+   */
+  color: {
+    type: String,
+    default: "skyblue"
+  }
+};
+const emits = {};
+
+var _sfc_main$1 = defineComponent({
+  name: "VkLabel",
+  components: {
+    Segment
+  },
+  props,
+  emits
+});
+
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_Segment = resolveComponent("Segment");
+  return openBlock(), createBlock(_component_Segment, {
+    value: _ctx.value,
+    label: _ctx.label,
+    color: _ctx.color
+  }, null, 8, ["value", "label", "color"]);
+}
+var VkLabel = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render]]);
+
+const _hoisted_1 = { class: "vkg-label-list" };
+const _hoisted_2 = ["onClick"];
+const _hoisted_3 = { class: "vkg-label-text" };
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "view",
+  props: {
+    filterKey: {
+      type: String,
+      default: ""
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const graph = useGraph();
+    const hiddenValues = ref([]);
+    function updateGraph() {
+      if (!props.filterKey)
+        return;
+      graph.forEachNode((node, attrs) => {
+        const nodeValue = attrs[props.filterKey];
+        if (nodeValue !== void 0) {
+          graph.setNodeAttribute(node, "hidden", hiddenValues.value.includes(nodeValue));
+        }
+      });
+    }
+    function toggleItem(value) {
+      if (!props.filterKey)
+        return;
+      const index = hiddenValues.value.indexOf(value);
+      if (index > -1) {
+        hiddenValues.value.splice(index, 1);
+      } else {
+        hiddenValues.value.push(value);
+      }
+      updateGraph();
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(SegmentView), null, {
+        default: withCtx(({ items, attrs }) => [
+          createElementVNode("ul", _hoisted_1, [
+            (openBlock(true), createElementBlock(
+              Fragment,
+              null,
+              renderList(items, (item, index) => {
+                return openBlock(), createElementBlock("li", mergeProps({ key: index }, { ref_for: true }, attrs, {
+                  class: ["vkg-label-item", { "is-hidden": hiddenValues.value.includes(item.attrs.value) }],
+                  onClick: ($event) => toggleItem(item.attrs.value)
+                }), [
+                  createCommentVNode(" \u5C0F\u5706\u70B9 "),
+                  createElementVNode(
+                    "span",
+                    {
+                      class: "vkg-label-dot",
+                      style: normalizeStyle({ backgroundColor: item.attrs.color })
+                    },
+                    null,
+                    4
+                    /* STYLE */
+                  ),
+                  createElementVNode(
+                    "span",
+                    _hoisted_3,
+                    toDisplayString(item.attrs.label),
+                    1
+                    /* TEXT */
+                  )
+                ], 16, _hoisted_2);
+              }),
+              128
+              /* KEYED_FRAGMENT */
+            ))
+          ])
+        ]),
+        _: 1
+        /* STABLE */
+      });
+    };
+  }
+});
+
+var types = /*#__PURE__*/Object.freeze({
+  __proto__: null
+});
+
+VkLabel.install = (app) => {
+  app.component(VkLabel.name || "VkLabel", VkLabel);
+};
+
+export { VkLabel, SegmentRenderer as VkLabelProvider, _sfc_main as VkLabelView, types as __VkLabel, VkLabel as default };

package/components/label/src/core.d.ts

@@ -0,0 +1,5 @@
+export declare const Segment: import("vue").DefineComponent<{}, () => any, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, SegmentRenderer: import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, SegmentView: import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, useSegmentRendererContext: () => import("@vunk/core/components/segment-renderer/src/types").SegmentRendererContext;

package/components/label/src/ctx.d.ts

@@ -0,0 +1,24 @@
+export declare const props: {
+    /**
+     * 标签的值，通常对应节点数据中的某个字段值
+     */
+    value: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * 标签显示的文本
+     */
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * 标签的颜色
+     */
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+};
+export declare const emits: {};

package/components/label/src/index.vue.d.ts

@@ -0,0 +1,33 @@
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    value: {
+        type: StringConstructor;
+        required: true;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    value: {
+        type: StringConstructor;
+        required: true;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    label: string;
+    color: string;
+}, {}, {
+    Segment: import("vue").DefineComponent<{}, () => any, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/components/label/src/types.d.ts

@@ -0,0 +1 @@
+export {};

package/components/label/src/view.vue.d.ts

@@ -0,0 +1,28 @@
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    filterKey: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {
+    props: import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+        filterKey: {
+            type: StringConstructor;
+            default: string;
+        };
+    }>> & Readonly<{}> & {}>;
+    graph: import("graphology").default<import("graphology-types").Attributes, import("graphology-types").Attributes, import("graphology-types").Attributes>;
+    hiddenValues: import("vue").Ref<string[], string[]>;
+    updateGraph: () => void;
+    toggleItem: (value: string) => void;
+    readonly SegmentView: import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    filterKey: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    filterKey: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/components/layout-forceatlas2/index.d.ts

@@ -0,0 +1,5 @@
+import VkLayoutForceatlas2 from './src/index.vue';
+export * as __VkLayoutForceatlas2 from './src/types';
+export { useLayoutForceatlas2 } from './src/use';
+export { VkLayoutForceatlas2, };
+export default VkLayoutForceatlas2;