import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
import {
  DataSpaceSelector,
  PanelContainer,
  useDevtoolsState
} from "./chunk-SXXO7MP3.mjs";

// src/panels/mesh/NetworkPanel/NetworkPanel.tsx
import React, { useEffect, useMemo, useRef, useState } from "react";
import { GraphModel } from "@dxos/graph";
import { useMembers } from "@dxos/react-client/echo";
import { useIdentity } from "@dxos/react-client/halo";
import { Toolbar } from "@dxos/react-ui";
import { GraphForceProjector, SVG } from "@dxos/react-ui-graph";
var NetworkGraphModel = class extends GraphModel.GraphModel {
  setData(graph) {
  }
  setFromMemberList(members) {
  }
};
var NetworkPanel = (props) => {
  const state = useDevtoolsState();
  const space = props.space ?? state.space;
  const identity = useIdentity();
  const isMe = (node) => identity ? node?.member?.identity.identityKey.equals(identity.identityKey) : false;
  const members = useMembers(space?.key);
  const [model] = useState(() => new NetworkGraphModel());
  useEffect(() => {
    if (members) {
      model.setFromMemberList(members);
    }
  }, [
    members
  ]);
  const context = useRef(null);
  const projector = useMemo(() => context.current ? new GraphForceProjector(context.current, {
    forces: {
      manyBody: {
        strength: -160
      },
      link: {
        distance: 120,
        iterations: 5
      },
      radial: {
        radius: 60,
        strength: 0.2
      }
    },
    attributes: {
      radius: (node) => isMe(node.data) ? 24 : 16
    }
  }) : void 0, [
    context
  ]);
  return /* @__PURE__ */ React.createElement(PanelContainer, {
    toolbar: props.space ? void 0 : /* @__PURE__ */ React.createElement(Toolbar.Root, null, /* @__PURE__ */ React.createElement(DataSpaceSelector, null))
  }, /* @__PURE__ */ React.createElement(SVG.Root, {
    ref: context
  }, /* @__PURE__ */ React.createElement(SVG.Markers, null), /* @__PURE__ */ React.createElement(SVG.Graph, {
    model,
    drag: true,
    arrows: true,
    projector,
    labels: {
      text: (node, highlight) => {
        const identity2 = node.data.member?.identity.profile?.displayName ?? node.data.member?.identity.identityKey.truncate();
        const peer = node.data.peer?.peerId?.truncate();
        return `${peer} [${identity2}]`;
      }
    }
  })));
};

// src/panels/mesh/NetworkPanel/index.ts
var NetworkPanel_default = NetworkPanel;
export {
  NetworkPanel_default as default
};
//# sourceMappingURL=NetworkPanel-IT6V4IDZ.mjs.map
