@eventcatalog/visualiser 3.20.1 → 3.20.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -6741,8 +6741,7 @@ var StepWalkthrough_default = memo32(function StepWalkthrough({
6741
6741
  nodes,
6742
6742
  edges,
6743
6743
  isFlowVisualization,
6744
- onStepChange,
6745
- mode = "full"
6744
+ onStepChange
6746
6745
  }) {
6747
6746
  const [currentNodeId, setCurrentNodeId] = useState6(null);
6748
6747
  const [pathHistory, setPathHistory] = useState6([]);
@@ -6862,7 +6861,7 @@ var StepWalkthrough_default = memo32(function StepWalkthrough({
6862
6861
  setPathHistory([]);
6863
6862
  onStepChange(null, [], true);
6864
6863
  }, [onStepChange]);
6865
- if (!isFlowVisualization || nodes.length === 0 || mode !== "full") {
6864
+ if (!isFlowVisualization || nodes.length === 0) {
6866
6865
  return null;
6867
6866
  }
6868
6867
  const { title, description } = useMemo15(() => {
@@ -11779,6 +11778,9 @@ var NodeGraphBuilder = ({
11779
11778
  () => edges.some((edge) => edge.type === "flow-edge"),
11780
11779
  [edges]
11781
11780
  );
11781
+ const isCompactMenuButton = !title;
11782
+ const menuButtonClassName = isCompactMenuButton ? "h-9 w-9 p-0 bg-[rgb(var(--ec-card-bg))] hover:bg-[rgb(var(--ec-accent-subtle))] border border-[rgb(var(--ec-page-border))] rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[rgb(var(--ec-accent))] flex items-center justify-center transition-colors duration-150 hover:border-[rgb(var(--ec-accent)/0.3)] group" : "py-2.5 px-4 bg-[rgb(var(--ec-card-bg))] hover:bg-[rgb(var(--ec-accent-subtle))] border border-[rgb(var(--ec-page-border))] rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[rgb(var(--ec-accent))] flex items-center gap-3 transition-colors duration-150 hover:border-[rgb(var(--ec-accent)/0.3)] group whitespace-nowrap";
11783
+ const menuIconClassName = isCompactMenuButton ? "h-4 w-4 text-[rgb(var(--ec-page-text-muted))] flex-shrink-0 group-hover:text-[rgb(var(--ec-accent))] transition-colors duration-150" : "h-5 w-5 text-[rgb(var(--ec-page-text-muted))] flex-shrink-0 group-hover:text-[rgb(var(--ec-accent))] transition-colors duration-150";
11782
11784
  return /* @__PURE__ */ jsx43(
11783
11785
  "div",
11784
11786
  {
@@ -11798,11 +11800,11 @@ var NodeGraphBuilder = ({
11798
11800
  /* @__PURE__ */ jsx43(DropdownMenu2.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs41(
11799
11801
  "button",
11800
11802
  {
11801
- className: "py-2.5 px-4 bg-[rgb(var(--ec-page-bg))] hover:bg-[rgb(var(--ec-accent-subtle)/0.4)] border border-[rgb(var(--ec-page-border))] rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[rgb(var(--ec-accent))] flex items-center gap-3 transition-all duration-200 hover:border-[rgb(var(--ec-accent)/0.3)] group whitespace-nowrap",
11803
+ className: menuButtonClassName,
11802
11804
  "aria-label": "Open menu",
11803
11805
  children: [
11804
11806
  title && /* @__PURE__ */ jsx43("span", { className: "text-base font-medium text-[rgb(var(--ec-page-text))] leading-tight", children: title }),
11805
- /* @__PURE__ */ jsx43(MoreVertical, { className: "h-5 w-5 text-[rgb(var(--ec-page-text-muted))] flex-shrink-0 group-hover:text-[rgb(var(--ec-accent))] transition-colors duration-150" })
11807
+ /* @__PURE__ */ jsx43(MoreVertical, { className: menuIconClassName })
11806
11808
  ]
11807
11809
  }
11808
11810
  ) }),
@@ -11900,11 +11902,11 @@ var NodeGraphBuilder = ({
11900
11902
  /* @__PURE__ */ jsx43(DropdownMenu2.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs41(
11901
11903
  "button",
11902
11904
  {
11903
- className: "py-2.5 px-4 bg-[rgb(var(--ec-page-bg))] hover:bg-[rgb(var(--ec-accent-subtle)/0.4)] border border-[rgb(var(--ec-page-border))] rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[rgb(var(--ec-accent))] flex items-center gap-3 transition-all duration-200 hover:border-[rgb(var(--ec-accent)/0.3)] group whitespace-nowrap",
11905
+ className: menuButtonClassName,
11904
11906
  "aria-label": "Open menu",
11905
11907
  children: [
11906
11908
  title && /* @__PURE__ */ jsx43("span", { className: "text-base font-medium text-[rgb(var(--ec-page-text))] leading-tight", children: title }),
11907
- /* @__PURE__ */ jsx43(MoreVertical, { className: "h-5 w-5 text-[rgb(var(--ec-page-text-muted))] flex-shrink-0 group-hover:text-[rgb(var(--ec-accent))] transition-colors duration-150" })
11909
+ /* @__PURE__ */ jsx43(MoreVertical, { className: menuIconClassName })
11908
11910
  ]
11909
11911
  }
11910
11912
  ) }),