@likec4/diagram 1.55.0 → 1.56.0

package/dist/overlays/relationships-browser/const.js

@@ -1,8 +1,9 @@
-const ViewPadding = {
-  top: "40px",
-  bottom: "22px",
-  left: "22px",
-  right: "22px"
+//#region src/overlays/relationships-browser/const.ts
+var ViewPadding = {
+	top: "40px",
+	bottom: "22px",
+	left: "22px",
+	right: "22px"
 };
-
+//#endregion
 export { ViewPadding };

package/dist/overlays/relationships-browser/custom/ElementActions.js

@@ -1,65 +1,62 @@
-import { jsx } from 'react/jsx-runtime';
-import { useMemo } from 'react';
-import { useEnabledFeatures } from '../../../context/DiagramFeatures.js';
-import { useCurrentViewId } from '../../../hooks/useCurrentView.js';
-import '@xstate/react';
-import 'fast-equals';
-import { useDiagram } from '../../../hooks/safeContext.js';
-import { useRelationshipsBrowser, useRelationshipsBrowserState } from '../hooks.js';
-import IconZoomScan from '../../../node_modules/.pnpm/@tabler_icons-react@3.40.0_react@19.2.4/node_modules/@tabler/icons-react/dist/esm/icons/IconZoomScan.js';
-import IconTransform from '../../../node_modules/.pnpm/@tabler_icons-react@3.40.0_react@19.2.4/node_modules/@tabler/icons-react/dist/esm/icons/IconTransform.js';
-import IconFileSymlink from '../../../node_modules/.pnpm/@tabler_icons-react@3.40.0_react@19.2.4/node_modules/@tabler/icons-react/dist/esm/icons/IconFileSymlink.js';
-import { ElementActionButtons } from '../../../base-primitives/element/ElementActionButtons.js';
-
-const selectSubject = (state) => state.context.subject;
-const ElementActions = (props) => {
-  const { enableNavigateTo, enableVscode } = useEnabledFeatures();
-  const diagram = useDiagram();
-  const currentViewId = useCurrentViewId();
-  const browser = useRelationshipsBrowser();
-  const subject = useRelationshipsBrowserState(selectSubject);
-  const { navigateTo, fqn } = props.data;
-  const buttons = useMemo(() => {
-    const buttons2 = [];
-    if (navigateTo && enableNavigateTo && currentViewId !== navigateTo) {
-      buttons2.push({
-        key: "navigate",
-        icon: /* @__PURE__ */ jsx(IconZoomScan, {}),
-        onClick: (e) => {
-          e.stopPropagation();
-          diagram.navigateTo(navigateTo);
-        }
-      });
-    }
-    if (fqn !== subject) {
-      buttons2.push({
-        key: "relationships",
-        icon: /* @__PURE__ */ jsx(IconTransform, {}),
-        onClick: (e) => {
-          e.stopPropagation();
-          browser.navigateTo(fqn, props.id);
-        }
-      });
-    }
-    if (enableVscode) {
-      buttons2.push({
-        key: "goToSource",
-        icon: /* @__PURE__ */ jsx(IconFileSymlink, {}),
-        onClick: (e) => {
-          e.stopPropagation();
-          diagram.openSource({ element: fqn });
-        }
-      });
-    }
-    return buttons2;
-  }, [navigateTo, enableNavigateTo, currentViewId, fqn, subject, enableVscode, diagram, browser, props.id]);
-  return /* @__PURE__ */ jsx(
-    ElementActionButtons,
-    {
-      buttons,
-      ...props
-    }
-  );
+import "../../../_virtual/_rolldown/runtime.js";
+import { useEnabledFeatures } from "../../../context/DiagramFeatures.js";
+import { useDiagram } from "../../../hooks/safeContext.js";
+import { useCurrentViewId } from "../../../hooks/useCurrentView.js";
+import { ElementActionButtons } from "../../../base-primitives/element/ElementActionButtons.js";
+import { useRelationshipsBrowser, useRelationshipsBrowserState } from "../hooks.js";
+import { IconFileSymlink, IconTransform, IconZoomScan } from "@tabler/icons-react";
+import { useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/overlays/relationships-browser/custom/ElementActions.tsx
+var selectSubject = (state) => state.context.subject;
+var ElementActions = (props) => {
+	const { enableNavigateTo, enableVscode } = useEnabledFeatures();
+	const diagram = useDiagram();
+	const currentViewId = useCurrentViewId();
+	const browser = useRelationshipsBrowser();
+	const subject = useRelationshipsBrowserState(selectSubject);
+	const { navigateTo, fqn } = props.data;
+	return /* @__PURE__ */ jsx(ElementActionButtons, {
+		buttons: useMemo(() => {
+			const buttons = [];
+			if (navigateTo && enableNavigateTo && currentViewId !== navigateTo) buttons.push({
+				key: "navigate",
+				icon: /* @__PURE__ */ jsx(IconZoomScan, {}),
+				onClick: (e) => {
+					e.stopPropagation();
+					diagram.navigateTo(navigateTo);
+				}
+			});
+			if (fqn !== subject) buttons.push({
+				key: "relationships",
+				icon: /* @__PURE__ */ jsx(IconTransform, {}),
+				onClick: (e) => {
+					e.stopPropagation();
+					browser.navigateTo(fqn, props.id);
+				}
+			});
+			if (enableVscode) buttons.push({
+				key: "goToSource",
+				icon: /* @__PURE__ */ jsx(IconFileSymlink, {}),
+				onClick: (e) => {
+					e.stopPropagation();
+					diagram.openSource({ element: fqn });
+				}
+			});
+			return buttons;
+		}, [
+			navigateTo,
+			enableNavigateTo,
+			currentViewId,
+			fqn,
+			subject,
+			enableVscode,
+			diagram,
+			browser,
+			props.id
+		]),
+		...props
+	});
 };
-
+//#endregion
 export { ElementActions };

package/dist/overlays/relationships-browser/custom/EmptyNode.js

@@ -1,31 +1,27 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { Box } from '@likec4/styles/jsx';
-import { Text } from '@mantine/core';
-
-function EmptyNode({
-  data: {
-    column
-  }
-}) {
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      css: {
-        width: "100%",
-        height: "100%",
-        border: `3px dashed`,
-        borderColor: `default.border`,
-        borderRadius: "md",
-        display: "flex",
-        justifyContent: "center",
-        alignItems: "center"
-      },
-      children: /* @__PURE__ */ jsxs(Text, { c: "dimmed", fz: "lg", fw: 500, children: [
-        "No ",
-        column === "incomers" ? "incoming" : "outgoing"
-      ] })
-    }
-  );
+import "../../../_virtual/_rolldown/runtime.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Text } from "@mantine/core";
+import { Box as Box$1 } from "@likec4/styles/jsx";
+//#region src/overlays/relationships-browser/custom/EmptyNode.tsx
+function EmptyNode({ data: { column } }) {
+	return /* @__PURE__ */ jsx(Box$1, {
+		css: {
+			width: "100%",
+			height: "100%",
+			border: `3px dashed`,
+			borderColor: `default.border`,
+			borderRadius: "md",
+			display: "flex",
+			justifyContent: "center",
+			alignItems: "center"
+		},
+		children: /* @__PURE__ */ jsxs(Text, {
+			c: "dimmed",
+			fz: "lg",
+			fw: 500,
+			children: ["No ", column === "incomers" ? "incoming" : "outgoing"]
+		})
+	});
 }
-
+//#endregion
 export { EmptyNode };

package/dist/overlays/relationships-browser/custom/edgeTypes.js

@@ -1,101 +1,68 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { css } from '@likec4/styles/css';
-import { Tooltip } from '@mantine/core';
-import { getBezierPath } from '@xyflow/system';
-import '@xstate/react';
-import 'fast-equals';
-import 'react';
-import { useDiagram } from '../../../hooks/safeContext.js';
-import { useRelationshipsBrowser } from '../hooks.js';
-import { memoEdge } from '../../../base-primitives/memoEdge.js';
-import { useEnabledFeatures } from '../../../context/DiagramFeatures.js';
-import { EdgeLabel } from '../../../base-primitives/edge/EdgeLabel.js';
-import { EdgeActionButton } from '../../../base-primitives/edge/EdgeActionButton.js';
-import { EdgeContainer } from '../../../base-primitives/edge/EdgeContainer.js';
-import { EdgePath } from '../../../base-primitives/edge/EdgePath.js';
-import { EdgeLabelContainer } from '../../../base-primitives/edge/EdgeLabelContainer.js';
-
-const RelationshipEdge = memoEdge((props) => {
-  const browser = useRelationshipsBrowser();
-  const { enableNavigateTo } = useEnabledFeatures();
-  const {
-    data: {
-      navigateTo,
-      relations,
-      existsInCurrentView
-    }
-  } = props;
-  const [svgPath, labelX, labelY] = getBezierPath(props);
-  const diagram = useDiagram();
-  const markOrange = relations.length > 1 || !existsInCurrentView;
-  const edgeProps = markOrange ? {
-    ...props,
-    data: {
-      ...props.data,
-      color: "amber"
-    }
-  } : props;
-  let label = /* @__PURE__ */ jsx(
-    EdgeLabel,
-    {
-      edgeProps,
-      className: css({
-        transition: "fast"
-      }),
-      children: enableNavigateTo && navigateTo && /* @__PURE__ */ jsx(
-        EdgeActionButton,
-        {
-          ...props,
-          onClick: (e) => {
-            e.stopPropagation();
-            diagram.navigateTo(navigateTo);
-          }
-        }
-      )
-    }
-  );
-  if (!existsInCurrentView) {
-    label = /* @__PURE__ */ jsx(
-      Tooltip,
-      {
-        color: "orange",
-        c: "black",
-        label: "This relationship is not included in the current view",
-        portalProps: {
-          target: `#${browser.rootElementId}`
-        },
-        openDelay: 800,
-        children: label
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs(EdgeContainer, { ...edgeProps, children: [
-    /* @__PURE__ */ jsx(
-      EdgePath,
-      {
-        edgeProps,
-        svgPath,
-        ...markOrange && {
-          strokeWidth: 5
-        }
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      EdgeLabelContainer,
-      {
-        edgeProps,
-        labelPosition: {
-          x: labelX,
-          y: labelY,
-          translate: "translate(-50%, 0)"
-        },
-        style: {
-          maxWidth: Math.min(Math.abs(props.targetX - props.sourceX - 70), 250)
-        },
-        children: label
-      }
-    )
-  ] });
+import "../../../_virtual/_rolldown/runtime.js";
+import { useEnabledFeatures } from "../../../context/DiagramFeatures.js";
+import { useDiagram } from "../../../hooks/safeContext.js";
+import { EdgeActionButton } from "../../../base-primitives/edge/EdgeActionButton.js";
+import { EdgeContainer } from "../../../base-primitives/edge/EdgeContainer.js";
+import { EdgeLabel } from "../../../base-primitives/edge/EdgeLabel.js";
+import { EdgeLabelContainer } from "../../../base-primitives/edge/EdgeLabelContainer.js";
+import { EdgePath } from "../../../base-primitives/edge/EdgePath.js";
+import { memoEdge } from "../../../base-primitives/memoEdge.js";
+import { useRelationshipsBrowser } from "../hooks.js";
+import { css } from "@likec4/styles/css";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Tooltip } from "@mantine/core";
+import { getBezierPath } from "@xyflow/system";
+//#region src/overlays/relationships-browser/custom/edgeTypes.tsx
+var RelationshipEdge = memoEdge((props) => {
+	const browser = useRelationshipsBrowser();
+	const { enableNavigateTo } = useEnabledFeatures();
+	const { data: { navigateTo, relations, existsInCurrentView } } = props;
+	const [svgPath, labelX, labelY] = getBezierPath(props);
+	const diagram = useDiagram();
+	const markOrange = relations.length > 1 || !existsInCurrentView;
+	const edgeProps = markOrange ? {
+		...props,
+		data: {
+			...props.data,
+			color: "amber"
+		}
+	} : props;
+	let label = /* @__PURE__ */ jsx(EdgeLabel, {
+		edgeProps,
+		className: css({ transition: "fast" }),
+		children: enableNavigateTo && navigateTo && /* @__PURE__ */ jsx(EdgeActionButton, {
+			...props,
+			onClick: (e) => {
+				e.stopPropagation();
+				diagram.navigateTo(navigateTo);
+			}
+		})
+	});
+	if (!existsInCurrentView) label = /* @__PURE__ */ jsx(Tooltip, {
+		color: "orange",
+		c: "black",
+		label: "This relationship is not included in the current view",
+		portalProps: { target: `#${browser.rootElementId}` },
+		openDelay: 800,
+		children: label
+	});
+	return /* @__PURE__ */ jsxs(EdgeContainer, {
+		...edgeProps,
+		children: [/* @__PURE__ */ jsx(EdgePath, {
+			edgeProps,
+			svgPath,
+			...markOrange && { strokeWidth: 5 }
+		}), /* @__PURE__ */ jsx(EdgeLabelContainer, {
+			edgeProps,
+			labelPosition: {
+				x: labelX,
+				y: labelY,
+				translate: "translate(-50%, 0)"
+			},
+			style: { maxWidth: Math.min(Math.abs(props.targetX - props.sourceX - 70), 250) },
+			children: label
+		})]
+	});
 });
-
+//#endregion
 export { RelationshipEdge };

package/dist/overlays/relationships-browser/custom/nodeTypes.js

@@ -1,131 +1,106 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { Handle, Position } from '@xyflow/react';
-import { useEnabledFeatures } from '../../../context/DiagramFeatures.js';
-import '@xstate/react';
-import 'fast-equals';
-import 'react';
-import { useDiagram } from '../../../hooks/safeContext.js';
-import { useCallbackRef } from '../../../hooks/useCallbackRef.js';
-import { ElementActions } from './ElementActions.js';
-import { CompoundNodeContainer } from '../../../base-primitives/compound/CompoundNodeContainer.js';
-import { CompoundTitle } from '../../../base-primitives/compound/CompoundTitle.js';
-import { CompoundDetailsButton } from '../../../base-primitives/compound/CompoundDetailsButton.js';
-import { ElementNodeContainer } from '../../../base-primitives/element/ElementNodeContainer.js';
-import { ElementShape } from '../../../base-primitives/element/ElementShape.js';
-import { ElementData } from '../../../base-primitives/element/ElementData.js';
-import { ElementTags as ElementTags$1 } from '../../../base-primitives/element/ElementTags.js';
-import { ElementDetailsButton } from '../../../base-primitives/element/ElementDetailsButton.js';
-
+import "../../../_virtual/_rolldown/runtime.js";
+import { useCallbackRef } from "../../../hooks/useCallbackRef.js";
+import { useEnabledFeatures } from "../../../context/DiagramFeatures.js";
+import { useDiagram } from "../../../hooks/safeContext.js";
+import { CompoundDetailsButton } from "../../../base-primitives/compound/CompoundDetailsButton.js";
+import { CompoundNodeContainer } from "../../../base-primitives/compound/CompoundNodeContainer.js";
+import { CompoundTitle } from "../../../base-primitives/compound/CompoundTitle.js";
+import { ElementData } from "../../../base-primitives/element/ElementData.js";
+import { ElementDetailsButton } from "../../../base-primitives/element/ElementDetailsButton.js";
+import { ElementNodeContainer } from "../../../base-primitives/element/ElementNodeContainer.js";
+import { ElementShape } from "../../../base-primitives/element/ElementShape.js";
+import { ElementTags as ElementTags$1 } from "../../../base-primitives/element/ElementTags.js";
+import { ElementActions } from "./ElementActions.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Handle, Position } from "@xyflow/react";
+//#region src/overlays/relationships-browser/custom/nodeTypes.tsx
 function ElementTags(props) {
-  const diagram = useDiagram();
-  return /* @__PURE__ */ jsx(
-    ElementTags$1,
-    {
-      onTagClick: useCallbackRef((tag) => {
-        diagram.openSearch(tag);
-      }),
-      ...props
-    }
-  );
+	const diagram = useDiagram();
+	return /* @__PURE__ */ jsx(ElementTags$1, {
+		onTagClick: useCallbackRef((tag) => {
+			diagram.openSearch(tag);
+		}),
+		...props
+	});
 }
-const ElementDetailsButtonWithHandler = (props) => {
-  const diagram = useDiagram();
-  return /* @__PURE__ */ jsx(
-    ElementDetailsButton,
-    {
-      ...props,
-      onClick: (e) => {
-        e.stopPropagation();
-        diagram.openElementDetails(props.data.fqn);
-      }
-    }
-  );
+var ElementDetailsButtonWithHandler = (props) => {
+	const diagram = useDiagram();
+	return /* @__PURE__ */ jsx(ElementDetailsButton, {
+		...props,
+		onClick: (e) => {
+			e.stopPropagation();
+			diagram.openElementDetails(props.data.fqn);
+		}
+	});
 };
 function ElementNode(props) {
-  const { enableElementTags } = useEnabledFeatures();
-  return /* @__PURE__ */ jsxs(ElementNodeContainer, { layoutId: props.id, nodeProps: props, children: [
-    /* @__PURE__ */ jsx(ElementShape, { ...props }),
-    /* @__PURE__ */ jsx(ElementData, { ...props }),
-    enableElementTags && /* @__PURE__ */ jsx(ElementTags, { ...props }),
-    /* @__PURE__ */ jsx(ElementDetailsButtonWithHandler, { ...props }),
-    /* @__PURE__ */ jsx(ElementActions, { ...props }),
-    /* @__PURE__ */ jsx(ElementPorts, { ...props })
-  ] }, props.id);
+	const { enableElementTags } = useEnabledFeatures();
+	return /* @__PURE__ */ jsxs(ElementNodeContainer, {
+		layoutId: props.id,
+		nodeProps: props,
+		children: [
+			/* @__PURE__ */ jsx(ElementShape, { ...props }),
+			/* @__PURE__ */ jsx(ElementData, { ...props }),
+			enableElementTags && /* @__PURE__ */ jsx(ElementTags, { ...props }),
+			/* @__PURE__ */ jsx(ElementDetailsButtonWithHandler, { ...props }),
+			/* @__PURE__ */ jsx(ElementActions, { ...props }),
+			/* @__PURE__ */ jsx(ElementPorts, { ...props })
+		]
+	}, props.id);
 }
 function CompoundNode(props) {
-  const diagram = useDiagram();
-  return /* @__PURE__ */ jsxs(CompoundNodeContainer, { layoutId: props.id, nodeProps: props, children: [
-    /* @__PURE__ */ jsx(CompoundTitle, { ...props }),
-    /* @__PURE__ */ jsx(
-      CompoundDetailsButton,
-      {
-        ...props,
-        onClick: (e) => {
-          e.stopPropagation();
-          diagram.openElementDetails(props.data.fqn);
-        }
-      }
-    ),
-    /* @__PURE__ */ jsx(CompoundPorts, { ...props })
-  ] }, props.id);
+	const diagram = useDiagram();
+	return /* @__PURE__ */ jsxs(CompoundNodeContainer, {
+		layoutId: props.id,
+		nodeProps: props,
+		children: [
+			/* @__PURE__ */ jsx(CompoundTitle, { ...props }),
+			/* @__PURE__ */ jsx(CompoundDetailsButton, {
+				...props,
+				onClick: (e) => {
+					e.stopPropagation();
+					diagram.openElementDetails(props.data.fqn);
+				}
+			}),
+			/* @__PURE__ */ jsx(CompoundPorts, { ...props })
+		]
+	}, props.id);
 }
-const ElementPorts = ({ data: { ports, height: h } }) => {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    ports.in.map((id, i) => /* @__PURE__ */ jsx(
-      Handle,
-      {
-        id,
-        type: "target",
-        position: Position.Left,
-        style: {
-          visibility: "hidden",
-          top: `${15 + (i + 1) * ((h - 30) / (ports.in.length + 1))}px`
-        }
-      },
-      id
-    )),
-    ports.out.map((id, i) => /* @__PURE__ */ jsx(
-      Handle,
-      {
-        id,
-        type: "source",
-        position: Position.Right,
-        style: {
-          visibility: "hidden",
-          top: `${15 + (i + 1) * ((h - 30) / (ports.out.length + 1))}px`
-        }
-      },
-      id
-    ))
-  ] });
+var ElementPorts = ({ data: { ports, height: h } }) => {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [ports.in.map((id, i) => /* @__PURE__ */ jsx(Handle, {
+		id,
+		type: "target",
+		position: Position.Left,
+		style: {
+			visibility: "hidden",
+			top: `${15 + (i + 1) * ((h - 30) / (ports.in.length + 1))}px`
+		}
+	}, id)), ports.out.map((id, i) => /* @__PURE__ */ jsx(Handle, {
+		id,
+		type: "source",
+		position: Position.Right,
+		style: {
+			visibility: "hidden",
+			top: `${15 + (i + 1) * ((h - 30) / (ports.out.length + 1))}px`
+		}
+	}, id))] });
 };
-const CompoundPorts = ({ data }) => /* @__PURE__ */ jsxs(Fragment, { children: [
-  data.ports.in.map((id, i) => /* @__PURE__ */ jsx(
-    Handle,
-    {
-      id,
-      type: "target",
-      position: Position.Left,
-      style: {
-        visibility: "hidden",
-        top: `${20 * (i + 1)}px`
-      }
-    },
-    id
-  )),
-  data.ports.out.map((id, i) => /* @__PURE__ */ jsx(
-    Handle,
-    {
-      id,
-      type: "source",
-      position: Position.Right,
-      style: {
-        visibility: "hidden",
-        top: `${20 * (i + 1)}px`
-      }
-    },
-    id
-  ))
-] });
-
-export { CompoundNode, CompoundPorts, ElementNode, ElementPorts };
+var CompoundPorts = ({ data }) => /* @__PURE__ */ jsxs(Fragment, { children: [data.ports.in.map((id, i) => /* @__PURE__ */ jsx(Handle, {
+	id,
+	type: "target",
+	position: Position.Left,
+	style: {
+		visibility: "hidden",
+		top: `${20 * (i + 1)}px`
+	}
+}, id)), data.ports.out.map((id, i) => /* @__PURE__ */ jsx(Handle, {
+	id,
+	type: "source",
+	position: Position.Right,
+	style: {
+		visibility: "hidden",
+		top: `${20 * (i + 1)}px`
+	}
+}, id))] });
+//#endregion
+export { CompoundNode, ElementNode };