@backstage/core-components 0.16.4-next.0 → 0.16.4

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @backstage/core-components
 
+## 0.16.4
+
+### Patch Changes
+
+- 9c9f4ff: Added `nestedValuesAsYaml` option to `StructuredMetadataTable` to render data as yaml.
+- 47c27c2: Upgrade `dagre` to `@dagrejs/dagre`
+- 17088d2: Updating the `TaskLogStream` to take up all space in a running task, and also show the last line of the log by default
+- 58ec9e7: Removed older versions of React packages as a preparatory step for upgrading to React 19. This commit does not introduce any functional changes, but removes dependencies on previous React versions, allowing for a cleaner upgrade path in subsequent commits.
+- Updated dependencies
+  - @backstage/core-plugin-api@1.10.4
+  - @backstage/version-bridge@1.0.11
+  - @backstage/theme@0.6.4
+  - @backstage/config@1.3.2
+  - @backstage/errors@1.2.7
+
+## 0.16.4-next.1
+
+### Patch Changes
+
+- 47c27c2: Upgrade `dagre` to `@dagrejs/dagre`
+- Updated dependencies
+  - @backstage/config@1.3.2
+  - @backstage/core-plugin-api@1.10.4-next.0
+  - @backstage/errors@1.2.7
+  - @backstage/theme@0.6.4-next.0
+  - @backstage/version-bridge@1.0.11-next.0
+
 ## 0.16.4-next.0
 
 ### Patch Changes

package/dist/components/DependencyGraph/DependencyGraph.esm.js

@@ -2,7 +2,7 @@ import React__default from 'react';
 import * as d3Zoom from 'd3-zoom';
 import * as d3Selection from 'd3-selection';
 import useTheme from '@material-ui/core/styles/useTheme';
-import dagre from 'dagre';
+import dagre from '@dagrejs/dagre';
 import debounce from 'lodash/debounce';
 import { DependencyGraphTypes } from './types.esm.js';
 import { Node } from './Node.esm.js';

package/dist/components/DependencyGraph/DependencyGraph.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DependencyGraph.esm.js","sources":["../../../src/components/DependencyGraph/DependencyGraph.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport * as d3Zoom from 'd3-zoom';\nimport * as d3Selection from 'd3-selection';\nimport useTheme from '@material-ui/core/styles/useTheme';\nimport dagre from 'dagre';\nimport debounce from 'lodash/debounce';\nimport { DependencyGraphTypes as Types } from './types';\nimport { Node } from './Node';\nimport { Edge, GraphEdge } from './Edge';\nimport { ARROW_MARKER_ID } from './constants';\n\n/**\n * Properties of {@link DependencyGraph}\n *\n * @public\n * @remarks\n * `<NodeData>` and `<EdgeData>` are useful when rendering custom or edge labels\n */\nexport interface DependencyGraphProps<NodeData, EdgeData>\n  extends React.SVGProps<SVGSVGElement> {\n  /**\n   * Edges of graph\n   */\n  edges: Types.DependencyEdge<EdgeData>[];\n  /**\n   * Nodes of Graph\n   */\n  nodes: Types.DependencyNode<NodeData>[];\n  /**\n   * Graph {@link DependencyGraphTypes.Direction | direction}\n   *\n   * @remarks\n   *\n   * Default: `DependencyGraphTypes.Direction.TOP_BOTTOM`\n   */\n  direction?: Types.Direction;\n  /**\n   * Node {@link DependencyGraphTypes.Alignment | alignment}\n   */\n  align?: Types.Alignment;\n  /**\n   * Margin between nodes on each rank\n   *\n   * @remarks\n   *\n   * Default: 50\n   */\n  nodeMargin?: number;\n  /**\n   * Margin between edges\n   *\n   * @remarks\n   *\n   * Default: 10\n   */\n  edgeMargin?: number;\n  /**\n   * Margin between each rank\n   *\n   * @remarks\n   *\n   * Default: 50\n   */\n  rankMargin?: number;\n  /**\n   * Margin on left and right of whole graph\n   *\n   * @remarks\n   *\n   * Default: 0\n   */\n  paddingX?: number;\n  /**\n   * Margin on top and bottom of whole graph\n   *\n   * @remarks\n   *\n   * Default: 0\n   */\n  paddingY?: number;\n  /**\n   * Heuristic used to find set of edges that will make graph acyclic\n   */\n  acyclicer?: 'greedy';\n  /**\n   * {@link DependencyGraphTypes.Ranker | Algorithm} used to rank nodes\n   *\n   * @remarks\n   *\n   * Default: `DependencyGraphTypes.Ranker.NETWORK_SIMPLEX`\n   */\n  ranker?: Types.Ranker;\n  /**\n   * {@link DependencyGraphTypes.LabelPosition | Position} of label in relation to edge\n   *\n   * @remarks\n   *\n   * Default: `DependencyGraphTypes.LabelPosition.RIGHT`\n   */\n  labelPosition?: Types.LabelPosition;\n  /**\n   * How much to move label away from edge\n   *\n   * @remarks\n   *\n   * Applies only when {@link DependencyGraphProps.labelPosition} is `DependencyGraphTypes.LabelPosition.LEFT` or\n   * `DependencyGraphTypes.LabelPosition.RIGHT`\n   */\n  labelOffset?: number;\n  /**\n   * Minimum number of ranks to keep between connected nodes\n   */\n  edgeRanks?: number;\n  /**\n   * Weight applied to edges in graph\n   */\n  edgeWeight?: number;\n  /**\n   * Custom node rendering component\n   */\n  renderNode?: Types.RenderNodeFunction<NodeData>;\n  /**\n   * Custom label rendering component\n   */\n  renderLabel?: Types.RenderLabelFunction<EdgeData>;\n  /**\n   * {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Element/defs | Defs} shared by rendered SVG to be used by\n   * {@link DependencyGraphProps.renderNode} and/or {@link DependencyGraphProps.renderLabel}\n   */\n  defs?: JSX.Element | JSX.Element[];\n  /**\n   * Controls zoom behavior of graph\n   *\n   * @remarks\n   *\n   * Default: `enabled`\n   */\n  zoom?: 'enabled' | 'disabled' | 'enable-on-click';\n  /**\n   * A factory for curve generators addressing both lines and areas.\n   *\n   * @remarks\n   *\n   * Default: 'curveMonotoneX'\n   */\n  curve?: 'curveStepBefore' | 'curveMonotoneX';\n  /**\n   * Controls if the arrow heads should be rendered or not.\n   *\n   * Default: false\n   */\n  showArrowHeads?: boolean;\n  /**\n   * Controls if the graph should be contained or grow\n   *\n   * @remarks\n   *\n   * Default: 'grow'\n   */\n  fit?: 'grow' | 'contain';\n}\n\nconst WORKSPACE_ID = 'workspace';\n\n/**\n * Graph component used to visualize relations between entities\n *\n * @public\n */\nexport function DependencyGraph<NodeData, EdgeData>(\n  props: DependencyGraphProps<NodeData, EdgeData>,\n) {\n  const {\n    edges,\n    nodes,\n    renderNode,\n    direction = Types.Direction.TOP_BOTTOM,\n    align,\n    nodeMargin = 50,\n    edgeMargin = 10,\n    rankMargin = 50,\n    paddingX = 0,\n    paddingY = 0,\n    acyclicer,\n    ranker = Types.Ranker.NETWORK_SIMPLEX,\n    labelPosition = Types.LabelPosition.RIGHT,\n    labelOffset = 10,\n    edgeRanks = 1,\n    edgeWeight = 1,\n    renderLabel,\n    defs,\n    zoom = 'enabled',\n    curve = 'curveMonotoneX',\n    showArrowHeads = false,\n    fit = 'grow',\n    ...svgProps\n  } = props;\n  const theme = useTheme();\n  const [containerWidth, setContainerWidth] = React.useState<number>(100);\n  const [containerHeight, setContainerHeight] = React.useState<number>(100);\n\n  const graph = React.useRef<\n    dagre.graphlib.Graph<Types.DependencyNode<NodeData>>\n  >(new dagre.graphlib.Graph());\n  const [graphWidth, setGraphWidth] = React.useState<number>(\n    graph.current.graph()?.width || 0,\n  );\n  const [graphHeight, setGraphHeight] = React.useState<number>(\n    graph.current.graph()?.height || 0,\n  );\n  const [graphNodes, setGraphNodes] = React.useState<string[]>([]);\n  const [graphEdges, setGraphEdges] = React.useState<dagre.Edge[]>([]);\n\n  const maxWidth = Math.max(graphWidth, containerWidth);\n  const maxHeight = Math.max(graphHeight, containerHeight);\n  const minHeight = Math.min(graphHeight, containerHeight);\n\n  const scalableHeight = fit === 'grow' ? maxHeight : minHeight;\n\n  const containerRef = React.useMemo(\n    () =>\n      debounce((node: SVGSVGElement) => {\n        if (!node) {\n          return;\n        }\n        // Set up zooming + panning\n        const container = d3Selection.select<SVGSVGElement, null>(node);\n        const workspace = d3Selection.select(node.getElementById(WORKSPACE_ID));\n\n        function enableZoom() {\n          container.call(\n            d3Zoom\n              .zoom<SVGSVGElement, null>()\n              .scaleExtent([1, Infinity])\n              .on('zoom', event => {\n                event.transform.x = Math.min(\n                  0,\n                  Math.max(\n                    event.transform.x,\n                    maxWidth - maxWidth * event.transform.k,\n                  ),\n                );\n                event.transform.y = Math.min(\n                  0,\n                  Math.max(\n                    event.transform.y,\n                    maxHeight - maxHeight * event.transform.k,\n                  ),\n                );\n                workspace.attr('transform', event.transform);\n              }),\n          );\n        }\n\n        if (zoom === 'enabled') {\n          enableZoom();\n        } else if (zoom === 'enable-on-click') {\n          container.on('click', () => enableZoom());\n        }\n\n        const { width: newContainerWidth, height: newContainerHeight } =\n          node.getBoundingClientRect();\n        if (containerWidth !== newContainerWidth) {\n          setContainerWidth(newContainerWidth);\n        }\n        if (containerHeight !== newContainerHeight) {\n          setContainerHeight(newContainerHeight);\n        }\n      }, 100),\n    [containerHeight, containerWidth, maxWidth, maxHeight, zoom],\n  );\n\n  const setNodesAndEdges = React.useCallback(() => {\n    // Cleaning up lingering nodes and edges\n    const currentGraphNodes = graph.current.nodes();\n    const currentGraphEdges = graph.current.edges();\n\n    currentGraphNodes.forEach(nodeId => {\n      const remainingNode = nodes.some(node => node.id === nodeId);\n      if (!remainingNode) {\n        graph.current.removeNode(nodeId);\n      }\n    });\n\n    currentGraphEdges.forEach(e => {\n      const remainingEdge = edges.some(\n        edge => edge.from === e.v && edge.to === e.w,\n      );\n      if (!remainingEdge) {\n        graph.current.removeEdge(e.v, e.w);\n      }\n    });\n\n    // Adding/updating nodes and edges\n    nodes.forEach(node => {\n      const existingNode = graph.current\n        .nodes()\n        .find(nodeId => node.id === nodeId);\n\n      if (existingNode && graph.current.node(existingNode)) {\n        const { width, height, x, y } = graph.current.node(existingNode);\n        graph.current.setNode(existingNode, { ...node, width, height, x, y });\n      } else {\n        graph.current.setNode(node.id, { ...node, width: 0, height: 0 });\n      }\n    });\n\n    edges.forEach(e => {\n      graph.current.setEdge(e.from, e.to, {\n        ...e,\n        label: e.label,\n        width: 0,\n        height: 0,\n        labelpos: labelPosition,\n        labeloffset: labelOffset,\n        weight: edgeWeight,\n        minlen: edgeRanks,\n      });\n    });\n  }, [edges, nodes, labelPosition, labelOffset, edgeWeight, edgeRanks]);\n\n  const updateGraph = React.useMemo(\n    () =>\n      debounce(\n        () => {\n          dagre.layout(graph.current);\n          const { height, width } = graph.current.graph();\n          const newHeight = Math.max(0, height || 0);\n          const newWidth = Math.max(0, width || 0);\n          setGraphWidth(newWidth);\n          setGraphHeight(newHeight);\n\n          setGraphNodes(graph.current.nodes());\n          setGraphEdges(graph.current.edges());\n        },\n        250,\n        { leading: true },\n      ),\n    [],\n  );\n\n  React.useEffect(() => {\n    graph.current.setGraph({\n      rankdir: direction,\n      align,\n      nodesep: nodeMargin,\n      edgesep: edgeMargin,\n      ranksep: rankMargin,\n      marginx: paddingX,\n      marginy: paddingY,\n      acyclicer,\n      ranker,\n    });\n\n    setNodesAndEdges();\n    updateGraph();\n\n    return updateGraph.cancel;\n  }, [\n    acyclicer,\n    align,\n    direction,\n    edgeMargin,\n    paddingX,\n    paddingY,\n    nodeMargin,\n    rankMargin,\n    ranker,\n    setNodesAndEdges,\n    updateGraph,\n  ]);\n\n  function setNode(id: string, node: Types.DependencyNode<NodeData>) {\n    graph.current.setNode(id, node);\n    updateGraph();\n    return graph.current;\n  }\n\n  function setEdge(id: dagre.Edge, edge: Types.DependencyEdge<EdgeData>) {\n    graph.current.setEdge(id, edge);\n    updateGraph();\n    return graph.current;\n  }\n\n  return (\n    <svg\n      ref={containerRef}\n      {...svgProps}\n      width=\"100%\"\n      height={scalableHeight}\n      viewBox={`0 0 ${maxWidth} ${maxHeight}`}\n    >\n      <defs>\n        <marker\n          id={ARROW_MARKER_ID}\n          viewBox=\"0 0 24 24\"\n          markerWidth=\"14\"\n          markerHeight=\"14\"\n          refX=\"16\"\n          refY=\"12\"\n          orient=\"auto\"\n          markerUnits=\"strokeWidth\"\n        >\n          <path\n            fill={theme.palette.textSubtle}\n            d=\"M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z\"\n          />\n        </marker>\n        {defs}\n      </defs>\n      <g id={WORKSPACE_ID}>\n        <svg\n          width={graphWidth}\n          height={graphHeight}\n          y={maxHeight / 2 - graphHeight / 2}\n          x={maxWidth / 2 - graphWidth / 2}\n          viewBox={`0 0 ${graphWidth} ${graphHeight}`}\n        >\n          {graphEdges.map(e => {\n            const edge = graph.current.edge(e) as GraphEdge<EdgeData>;\n            if (!edge) return null;\n            return (\n              <Edge\n                key={`${e.v}-${e.w}`}\n                id={e}\n                setEdge={setEdge}\n                render={renderLabel}\n                edge={edge}\n                curve={curve}\n                showArrowHeads={showArrowHeads}\n              />\n            );\n          })}\n          {graphNodes.map((id: string) => {\n            const node = graph.current.node(id);\n            if (!node) return null;\n            return (\n              <Node\n                key={id}\n                setNode={setNode}\n                render={renderNode}\n                node={node}\n              />\n            );\n          })}\n        </svg>\n      </g>\n    </svg>\n  );\n}\n"],"names":["Types","React"],"mappings":"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"}
+{"version":3,"file":"DependencyGraph.esm.js","sources":["../../../src/components/DependencyGraph/DependencyGraph.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport * as d3Zoom from 'd3-zoom';\nimport * as d3Selection from 'd3-selection';\nimport useTheme from '@material-ui/core/styles/useTheme';\nimport dagre from '@dagrejs/dagre';\nimport debounce from 'lodash/debounce';\nimport { DependencyGraphTypes as Types } from './types';\nimport { Node } from './Node';\nimport { Edge, GraphEdge } from './Edge';\nimport { ARROW_MARKER_ID } from './constants';\n\n/**\n * Properties of {@link DependencyGraph}\n *\n * @public\n * @remarks\n * `<NodeData>` and `<EdgeData>` are useful when rendering custom or edge labels\n */\nexport interface DependencyGraphProps<NodeData, EdgeData>\n  extends React.SVGProps<SVGSVGElement> {\n  /**\n   * Edges of graph\n   */\n  edges: Types.DependencyEdge<EdgeData>[];\n  /**\n   * Nodes of Graph\n   */\n  nodes: Types.DependencyNode<NodeData>[];\n  /**\n   * Graph {@link DependencyGraphTypes.Direction | direction}\n   *\n   * @remarks\n   *\n   * Default: `DependencyGraphTypes.Direction.TOP_BOTTOM`\n   */\n  direction?: Types.Direction;\n  /**\n   * Node {@link DependencyGraphTypes.Alignment | alignment}\n   */\n  align?: Types.Alignment;\n  /**\n   * Margin between nodes on each rank\n   *\n   * @remarks\n   *\n   * Default: 50\n   */\n  nodeMargin?: number;\n  /**\n   * Margin between edges\n   *\n   * @remarks\n   *\n   * Default: 10\n   */\n  edgeMargin?: number;\n  /**\n   * Margin between each rank\n   *\n   * @remarks\n   *\n   * Default: 50\n   */\n  rankMargin?: number;\n  /**\n   * Margin on left and right of whole graph\n   *\n   * @remarks\n   *\n   * Default: 0\n   */\n  paddingX?: number;\n  /**\n   * Margin on top and bottom of whole graph\n   *\n   * @remarks\n   *\n   * Default: 0\n   */\n  paddingY?: number;\n  /**\n   * Heuristic used to find set of edges that will make graph acyclic\n   */\n  acyclicer?: 'greedy';\n  /**\n   * {@link DependencyGraphTypes.Ranker | Algorithm} used to rank nodes\n   *\n   * @remarks\n   *\n   * Default: `DependencyGraphTypes.Ranker.NETWORK_SIMPLEX`\n   */\n  ranker?: Types.Ranker;\n  /**\n   * {@link DependencyGraphTypes.LabelPosition | Position} of label in relation to edge\n   *\n   * @remarks\n   *\n   * Default: `DependencyGraphTypes.LabelPosition.RIGHT`\n   */\n  labelPosition?: Types.LabelPosition;\n  /**\n   * How much to move label away from edge\n   *\n   * @remarks\n   *\n   * Applies only when {@link DependencyGraphProps.labelPosition} is `DependencyGraphTypes.LabelPosition.LEFT` or\n   * `DependencyGraphTypes.LabelPosition.RIGHT`\n   */\n  labelOffset?: number;\n  /**\n   * Minimum number of ranks to keep between connected nodes\n   */\n  edgeRanks?: number;\n  /**\n   * Weight applied to edges in graph\n   */\n  edgeWeight?: number;\n  /**\n   * Custom node rendering component\n   */\n  renderNode?: Types.RenderNodeFunction<NodeData>;\n  /**\n   * Custom label rendering component\n   */\n  renderLabel?: Types.RenderLabelFunction<EdgeData>;\n  /**\n   * {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Element/defs | Defs} shared by rendered SVG to be used by\n   * {@link DependencyGraphProps.renderNode} and/or {@link DependencyGraphProps.renderLabel}\n   */\n  defs?: JSX.Element | JSX.Element[];\n  /**\n   * Controls zoom behavior of graph\n   *\n   * @remarks\n   *\n   * Default: `enabled`\n   */\n  zoom?: 'enabled' | 'disabled' | 'enable-on-click';\n  /**\n   * A factory for curve generators addressing both lines and areas.\n   *\n   * @remarks\n   *\n   * Default: 'curveMonotoneX'\n   */\n  curve?: 'curveStepBefore' | 'curveMonotoneX';\n  /**\n   * Controls if the arrow heads should be rendered or not.\n   *\n   * Default: false\n   */\n  showArrowHeads?: boolean;\n  /**\n   * Controls if the graph should be contained or grow\n   *\n   * @remarks\n   *\n   * Default: 'grow'\n   */\n  fit?: 'grow' | 'contain';\n}\n\nconst WORKSPACE_ID = 'workspace';\n\n/**\n * Graph component used to visualize relations between entities\n *\n * @public\n */\nexport function DependencyGraph<NodeData, EdgeData>(\n  props: DependencyGraphProps<NodeData, EdgeData>,\n) {\n  const {\n    edges,\n    nodes,\n    renderNode,\n    direction = Types.Direction.TOP_BOTTOM,\n    align,\n    nodeMargin = 50,\n    edgeMargin = 10,\n    rankMargin = 50,\n    paddingX = 0,\n    paddingY = 0,\n    acyclicer,\n    ranker = Types.Ranker.NETWORK_SIMPLEX,\n    labelPosition = Types.LabelPosition.RIGHT,\n    labelOffset = 10,\n    edgeRanks = 1,\n    edgeWeight = 1,\n    renderLabel,\n    defs,\n    zoom = 'enabled',\n    curve = 'curveMonotoneX',\n    showArrowHeads = false,\n    fit = 'grow',\n    ...svgProps\n  } = props;\n  const theme = useTheme();\n  const [containerWidth, setContainerWidth] = React.useState<number>(100);\n  const [containerHeight, setContainerHeight] = React.useState<number>(100);\n\n  const graph = React.useRef<\n    dagre.graphlib.Graph<Types.DependencyNode<NodeData>>\n  >(new dagre.graphlib.Graph());\n  const [graphWidth, setGraphWidth] = React.useState<number>(\n    graph.current.graph()?.width || 0,\n  );\n  const [graphHeight, setGraphHeight] = React.useState<number>(\n    graph.current.graph()?.height || 0,\n  );\n  const [graphNodes, setGraphNodes] = React.useState<string[]>([]);\n  const [graphEdges, setGraphEdges] = React.useState<dagre.Edge[]>([]);\n\n  const maxWidth = Math.max(graphWidth, containerWidth);\n  const maxHeight = Math.max(graphHeight, containerHeight);\n  const minHeight = Math.min(graphHeight, containerHeight);\n\n  const scalableHeight = fit === 'grow' ? maxHeight : minHeight;\n\n  const containerRef = React.useMemo(\n    () =>\n      debounce((node: SVGSVGElement) => {\n        if (!node) {\n          return;\n        }\n        // Set up zooming + panning\n        const container = d3Selection.select<SVGSVGElement, null>(node);\n        const workspace = d3Selection.select(node.getElementById(WORKSPACE_ID));\n\n        function enableZoom() {\n          container.call(\n            d3Zoom\n              .zoom<SVGSVGElement, null>()\n              .scaleExtent([1, Infinity])\n              .on('zoom', event => {\n                event.transform.x = Math.min(\n                  0,\n                  Math.max(\n                    event.transform.x,\n                    maxWidth - maxWidth * event.transform.k,\n                  ),\n                );\n                event.transform.y = Math.min(\n                  0,\n                  Math.max(\n                    event.transform.y,\n                    maxHeight - maxHeight * event.transform.k,\n                  ),\n                );\n                workspace.attr('transform', event.transform);\n              }),\n          );\n        }\n\n        if (zoom === 'enabled') {\n          enableZoom();\n        } else if (zoom === 'enable-on-click') {\n          container.on('click', () => enableZoom());\n        }\n\n        const { width: newContainerWidth, height: newContainerHeight } =\n          node.getBoundingClientRect();\n        if (containerWidth !== newContainerWidth) {\n          setContainerWidth(newContainerWidth);\n        }\n        if (containerHeight !== newContainerHeight) {\n          setContainerHeight(newContainerHeight);\n        }\n      }, 100),\n    [containerHeight, containerWidth, maxWidth, maxHeight, zoom],\n  );\n\n  const setNodesAndEdges = React.useCallback(() => {\n    // Cleaning up lingering nodes and edges\n    const currentGraphNodes = graph.current.nodes();\n    const currentGraphEdges = graph.current.edges();\n\n    currentGraphNodes.forEach(nodeId => {\n      const remainingNode = nodes.some(node => node.id === nodeId);\n      if (!remainingNode) {\n        graph.current.removeNode(nodeId);\n      }\n    });\n\n    currentGraphEdges.forEach(e => {\n      const remainingEdge = edges.some(\n        edge => edge.from === e.v && edge.to === e.w,\n      );\n      if (!remainingEdge) {\n        graph.current.removeEdge(e.v, e.w);\n      }\n    });\n\n    // Adding/updating nodes and edges\n    nodes.forEach(node => {\n      const existingNode = graph.current\n        .nodes()\n        .find(nodeId => node.id === nodeId);\n\n      if (existingNode && graph.current.node(existingNode)) {\n        const { width, height, x, y } = graph.current.node(existingNode);\n        graph.current.setNode(existingNode, { ...node, width, height, x, y });\n      } else {\n        graph.current.setNode(node.id, { ...node, width: 0, height: 0 });\n      }\n    });\n\n    edges.forEach(e => {\n      graph.current.setEdge(e.from, e.to, {\n        ...e,\n        label: e.label,\n        width: 0,\n        height: 0,\n        labelpos: labelPosition,\n        labeloffset: labelOffset,\n        weight: edgeWeight,\n        minlen: edgeRanks,\n      });\n    });\n  }, [edges, nodes, labelPosition, labelOffset, edgeWeight, edgeRanks]);\n\n  const updateGraph = React.useMemo(\n    () =>\n      debounce(\n        () => {\n          dagre.layout(graph.current);\n          const { height, width } = graph.current.graph();\n          const newHeight = Math.max(0, height || 0);\n          const newWidth = Math.max(0, width || 0);\n          setGraphWidth(newWidth);\n          setGraphHeight(newHeight);\n\n          setGraphNodes(graph.current.nodes());\n          setGraphEdges(graph.current.edges());\n        },\n        250,\n        { leading: true },\n      ),\n    [],\n  );\n\n  React.useEffect(() => {\n    graph.current.setGraph({\n      rankdir: direction,\n      align,\n      nodesep: nodeMargin,\n      edgesep: edgeMargin,\n      ranksep: rankMargin,\n      marginx: paddingX,\n      marginy: paddingY,\n      acyclicer,\n      ranker,\n    });\n\n    setNodesAndEdges();\n    updateGraph();\n\n    return updateGraph.cancel;\n  }, [\n    acyclicer,\n    align,\n    direction,\n    edgeMargin,\n    paddingX,\n    paddingY,\n    nodeMargin,\n    rankMargin,\n    ranker,\n    setNodesAndEdges,\n    updateGraph,\n  ]);\n\n  function setNode(id: string, node: Types.DependencyNode<NodeData>) {\n    graph.current.setNode(id, node);\n    updateGraph();\n    return graph.current;\n  }\n\n  function setEdge(id: dagre.Edge, edge: Types.DependencyEdge<EdgeData>) {\n    graph.current.setEdge(id, edge);\n    updateGraph();\n    return graph.current;\n  }\n\n  return (\n    <svg\n      ref={containerRef}\n      {...svgProps}\n      width=\"100%\"\n      height={scalableHeight}\n      viewBox={`0 0 ${maxWidth} ${maxHeight}`}\n    >\n      <defs>\n        <marker\n          id={ARROW_MARKER_ID}\n          viewBox=\"0 0 24 24\"\n          markerWidth=\"14\"\n          markerHeight=\"14\"\n          refX=\"16\"\n          refY=\"12\"\n          orient=\"auto\"\n          markerUnits=\"strokeWidth\"\n        >\n          <path\n            fill={theme.palette.textSubtle}\n            d=\"M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z\"\n          />\n        </marker>\n        {defs}\n      </defs>\n      <g id={WORKSPACE_ID}>\n        <svg\n          width={graphWidth}\n          height={graphHeight}\n          y={maxHeight / 2 - graphHeight / 2}\n          x={maxWidth / 2 - graphWidth / 2}\n          viewBox={`0 0 ${graphWidth} ${graphHeight}`}\n        >\n          {graphEdges.map(e => {\n            const edge = graph.current.edge(e) as GraphEdge<EdgeData>;\n            if (!edge) return null;\n            return (\n              <Edge\n                key={`${e.v}-${e.w}`}\n                id={e}\n                setEdge={setEdge}\n                render={renderLabel}\n                edge={edge}\n                curve={curve}\n                showArrowHeads={showArrowHeads}\n              />\n            );\n          })}\n          {graphNodes.map((id: string) => {\n            const node = graph.current.node(id);\n            if (!node) return null;\n            return (\n              <Node\n                key={id}\n                setNode={setNode}\n                render={renderNode}\n                node={node}\n              />\n            );\n          })}\n        </svg>\n      </g>\n    </svg>\n  );\n}\n"],"names":["Types","React"],"mappings":"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"}

package/dist/components/DependencyGraph/Edge.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Edge.esm.js","sources":["../../../src/components/DependencyGraph/Edge.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport * as d3Shape from 'd3-shape';\nimport isFinite from 'lodash/isFinite';\nimport makeStyles from '@material-ui/core/styles/makeStyles';\nimport { DependencyGraphTypes as Types } from './types';\nimport { ARROW_MARKER_ID, EDGE_TEST_ID, LABEL_TEST_ID } from './constants';\nimport { DefaultLabel } from './DefaultLabel';\nimport dagre from 'dagre';\n\n/* Based on: https://github.com/dagrejs/dagre/wiki#configuring-the-layout  */\nexport type EdgeProperties = {\n  label?: string;\n  width?: number;\n  height?: number;\n  labeloffset?: number;\n  labelpos?: Types.LabelPosition;\n  minlen?: number;\n  weight?: number;\n};\nexport type GraphEdge<T> = Types.DependencyEdge<T> &\n  dagre.GraphEdge &\n  EdgeProperties;\n\n/** @public */\nexport type DependencyGraphEdgeClassKey = 'path' | 'label';\n\nconst useStyles = makeStyles(\n  theme => ({\n    path: {\n      strokeWidth: 1.3,\n      stroke: theme.palette.textSubtle,\n      fill: 'none',\n      transition: `${theme.transitions.duration.shortest}ms`,\n    },\n    label: {\n      transition: `${theme.transitions.duration.shortest}ms`,\n    },\n  }),\n  { name: 'BackstageDependencyGraphEdge' },\n);\n\ntype EdgePoint = dagre.GraphEdge['points'][0];\n\n/** @public */\nexport type EdgeComponentProps<T = unknown> = {\n  id: dagre.Edge;\n  edge: GraphEdge<T>;\n  render?: Types.RenderLabelFunction<T>;\n  setEdge: (\n    id: dagre.Edge,\n    edge: Types.DependencyEdge<T>,\n  ) => dagre.graphlib.Graph<{}>;\n  curve: 'curveStepBefore' | 'curveMonotoneX';\n  showArrowHeads?: boolean;\n};\n\nconst renderDefault = (props: Types.RenderLabelProps<unknown>) => (\n  <DefaultLabel {...props} />\n);\n\nexport function Edge<EdgeData>({\n  render = renderDefault,\n  setEdge,\n  id,\n  edge,\n  curve,\n  showArrowHeads,\n}: EdgeComponentProps<EdgeData>) {\n  const { x = 0, y = 0, width, height, points } = edge;\n  const labelProps: Types.DependencyEdge<EdgeData> = edge;\n  const classes = useStyles();\n\n  const labelRef = React.useRef<SVGGElement>(null);\n\n  React.useLayoutEffect(() => {\n    // set the label width to the actual rendered width to properly layout graph\n    if (labelRef.current) {\n      let { height: renderedHeight, width: renderedWidth } =\n        labelRef.current.getBBox();\n      renderedHeight = Math.round(renderedHeight);\n      renderedWidth = Math.round(renderedWidth);\n\n      if (renderedHeight !== height || renderedWidth !== width) {\n        setEdge(id, {\n          ...edge,\n          height: renderedHeight,\n          width: renderedWidth,\n        });\n      }\n    }\n  }, [edge, height, width, setEdge, id]);\n\n  let path: string = '';\n\n  const createPath = React.useMemo(\n    () =>\n      d3Shape\n        .line<EdgePoint>()\n        .x(d => d.x)\n        .y(d => d.y)\n        .curve(d3Shape[curve]),\n    [curve],\n  );\n\n  if (points) {\n    const finitePoints = points.filter(\n      (point: EdgePoint) => isFinite(point.x) && isFinite(point.y),\n    );\n    path = createPath(finitePoints) || '';\n  }\n\n  return (\n    <>\n      {path && (\n        <path\n          data-testid={EDGE_TEST_ID}\n          className={classes.path}\n          markerEnd={showArrowHeads ? `url(#${ARROW_MARKER_ID})` : undefined}\n          d={path}\n        />\n      )}\n      {labelProps.label ? (\n        <g\n          ref={labelRef}\n          data-testid={LABEL_TEST_ID}\n          className={classes.label}\n          transform={`translate(${x},${y})`}\n        >\n          {render({ edge: labelProps })}\n        </g>\n      ) : null}\n    </>\n  );\n}\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"Edge.esm.js","sources":["../../../src/components/DependencyGraph/Edge.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport * as d3Shape from 'd3-shape';\nimport isFinite from 'lodash/isFinite';\nimport makeStyles from '@material-ui/core/styles/makeStyles';\nimport { DependencyGraphTypes as Types } from './types';\nimport { ARROW_MARKER_ID, EDGE_TEST_ID, LABEL_TEST_ID } from './constants';\nimport { DefaultLabel } from './DefaultLabel';\nimport dagre from '@dagrejs/dagre';\n\n/* Based on: https://github.com/dagrejs/dagre/wiki#configuring-the-layout  */\nexport type EdgeProperties = {\n  label?: string;\n  width?: number;\n  height?: number;\n  labeloffset?: number;\n  labelpos?: Types.LabelPosition;\n  minlen?: number;\n  weight?: number;\n};\nexport type GraphEdge<T> = Types.DependencyEdge<T> &\n  dagre.GraphEdge &\n  EdgeProperties;\n\n/** @public */\nexport type DependencyGraphEdgeClassKey = 'path' | 'label';\n\nconst useStyles = makeStyles(\n  theme => ({\n    path: {\n      strokeWidth: 1.3,\n      stroke: theme.palette.textSubtle,\n      fill: 'none',\n      transition: `${theme.transitions.duration.shortest}ms`,\n    },\n    label: {\n      transition: `${theme.transitions.duration.shortest}ms`,\n    },\n  }),\n  { name: 'BackstageDependencyGraphEdge' },\n);\n\ntype EdgePoint = dagre.GraphEdge['points'][0];\n\n/** @public */\nexport type EdgeComponentProps<T = unknown> = {\n  id: dagre.Edge;\n  edge: GraphEdge<T>;\n  render?: Types.RenderLabelFunction<T>;\n  setEdge: (\n    id: dagre.Edge,\n    edge: Types.DependencyEdge<T>,\n  ) => dagre.graphlib.Graph<{}>;\n  curve: 'curveStepBefore' | 'curveMonotoneX';\n  showArrowHeads?: boolean;\n};\n\nconst renderDefault = (props: Types.RenderLabelProps<unknown>) => (\n  <DefaultLabel {...props} />\n);\n\nexport function Edge<EdgeData>({\n  render = renderDefault,\n  setEdge,\n  id,\n  edge,\n  curve,\n  showArrowHeads,\n}: EdgeComponentProps<EdgeData>) {\n  const { x = 0, y = 0, width, height, points } = edge;\n  const labelProps: Types.DependencyEdge<EdgeData> = edge;\n  const classes = useStyles();\n\n  const labelRef = React.useRef<SVGGElement>(null);\n\n  React.useLayoutEffect(() => {\n    // set the label width to the actual rendered width to properly layout graph\n    if (labelRef.current) {\n      let { height: renderedHeight, width: renderedWidth } =\n        labelRef.current.getBBox();\n      renderedHeight = Math.round(renderedHeight);\n      renderedWidth = Math.round(renderedWidth);\n\n      if (renderedHeight !== height || renderedWidth !== width) {\n        setEdge(id, {\n          ...edge,\n          height: renderedHeight,\n          width: renderedWidth,\n        });\n      }\n    }\n  }, [edge, height, width, setEdge, id]);\n\n  let path: string = '';\n\n  const createPath = React.useMemo(\n    () =>\n      d3Shape\n        .line<EdgePoint>()\n        .x(d => d.x)\n        .y(d => d.y)\n        .curve(d3Shape[curve]),\n    [curve],\n  );\n\n  if (points) {\n    const finitePoints = points.filter(\n      (point: EdgePoint) => isFinite(point.x) && isFinite(point.y),\n    );\n    path = createPath(finitePoints) || '';\n  }\n\n  return (\n    <>\n      {path && (\n        <path\n          data-testid={EDGE_TEST_ID}\n          className={classes.path}\n          markerEnd={showArrowHeads ? `url(#${ARROW_MARKER_ID})` : undefined}\n          d={path}\n        />\n      )}\n      {labelProps.label ? (\n        <g\n          ref={labelRef}\n          data-testid={LABEL_TEST_ID}\n          className={classes.label}\n          transform={`translate(${x},${y})`}\n        >\n          {render({ edge: labelProps })}\n        </g>\n      ) : null}\n    </>\n  );\n}\n"],"names":["React"],"mappings":"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"}

package/dist/components/DependencyGraph/Node.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Node.esm.js","sources":["../../../src/components/DependencyGraph/Node.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport makeStyles from '@material-ui/core/styles/makeStyles';\nimport { DefaultNode } from './DefaultNode';\nimport { DependencyGraphTypes as Types } from './types';\nimport { NODE_TEST_ID } from './constants';\nimport dagre from 'dagre';\n\n/** @public */\nexport type DependencyGraphNodeClassKey = 'node';\n\nconst useStyles = makeStyles(\n  theme => ({\n    node: {\n      transition: `${theme.transitions.duration.shortest}ms`,\n    },\n  }),\n  { name: 'BackstageDependencyGraphNode' },\n);\n\nexport type GraphNode<T> = dagre.Node<Types.DependencyNode<T>>;\n\nexport type NodeComponentProps<T> = {\n  node: GraphNode<T>;\n  render?: Types.RenderNodeFunction<T>;\n  setNode: dagre.graphlib.Graph['setNode'];\n};\n\nconst renderDefault = (props: Types.RenderNodeProps) => (\n  <DefaultNode {...props} />\n);\n\nexport function Node<T>({\n  render = renderDefault,\n  setNode,\n  node,\n}: NodeComponentProps<T>) {\n  const { width, height, x = 0, y = 0 } = node;\n  const nodeProps: Types.DependencyNode<T> = node;\n  const classes = useStyles();\n  const nodeRef = React.useRef<SVGGElement | null>(null);\n\n  React.useLayoutEffect(() => {\n    // set the node width to the actual rendered width to properly layout graph\n    if (nodeRef.current) {\n      let { height: renderedHeight, width: renderedWidth } =\n        nodeRef.current.getBBox();\n      renderedHeight = Math.round(renderedHeight);\n      renderedWidth = Math.round(renderedWidth);\n\n      if (renderedHeight !== height || renderedWidth !== width) {\n        setNode(node.id, {\n          ...node,\n          height: renderedHeight,\n          width: renderedWidth,\n        });\n      }\n    }\n  }, [node, width, height, setNode]);\n\n  return (\n    <g\n      ref={nodeRef}\n      data-testid={NODE_TEST_ID}\n      className={classes.node}\n      transform={`translate(${x - width / 2},${y - height / 2})`}\n    >\n      {render({ node: nodeProps })}\n    </g>\n  );\n}\n"],"names":["React"],"mappings":";;;;;AA0BA,MAAM,SAAY,GAAA,UAAA;AAAA,EAChB,CAAU,KAAA,MAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,UAAY,EAAA,CAAA,EAAG,KAAM,CAAA,WAAA,CAAY,SAAS,QAAQ,CAAA,EAAA;AAAA;AACpD,GACF,CAAA;AAAA,EACA,EAAE,MAAM,8BAA+B;AACzC,CAAA;AAUA,MAAM,gBAAgB,CAAC,KAAA,qBACpBA,cAAA,CAAA,aAAA,CAAA,WAAA,EAAA,EAAa,GAAG,KAAO,EAAA,CAAA;AAGnB,SAAS,IAAQ,CAAA;AAAA,EACtB,MAAS,GAAA,aAAA;AAAA,EACT,OAAA;AAAA,EACA;AACF,CAA0B,EAAA;AACxB,EAAA,MAAM,EAAE,KAAO,EAAA,MAAA,EAAQ,IAAI,CAAG,EAAA,CAAA,GAAI,GAAM,GAAA,IAAA;AACxC,EAAA,MAAM,SAAqC,GAAA,IAAA;AAC3C,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EAAM,MAAA,OAAA,GAAUA,cAAM,CAAA,MAAA,CAA2B,IAAI,CAAA;AAErD,EAAAA,cAAA,CAAM,gBAAgB,MAAM;AAE1B,IAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,MAAI,IAAA,EAAE,QAAQ,cAAgB,EAAA,KAAA,EAAO,eACnC,GAAA,OAAA,CAAQ,QAAQ,OAAQ,EAAA;AAC1B,MAAiB,cAAA,GAAA,IAAA,CAAK,MAAM,cAAc,CAAA;AAC1C,MAAgB,aAAA,GAAA,IAAA,CAAK,MAAM,aAAa,CAAA;AAExC,MAAI,IAAA,cAAA,KAAmB,MAAU,IAAA,aAAA,KAAkB,KAAO,EAAA;AACxD,QAAA,OAAA,CAAQ,KAAK,EAAI,EAAA;AAAA,UACf,GAAG,IAAA;AAAA,UACH,MAAQ,EAAA,cAAA;AAAA,UACR,KAAO,EAAA;AAAA,SACR,CAAA;AAAA;AACH;AACF,KACC,CAAC,IAAA,EAAM,KAAO,EAAA,MAAA,EAAQ,OAAO,CAAC,CAAA;AAEjC,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,GAAK,EAAA,OAAA;AAAA,MACL,aAAa,EAAA,YAAA;AAAA,MACb,WAAW,OAAQ,CAAA,IAAA;AAAA,MACnB,SAAA,EAAW,aAAa,CAAI,GAAA,KAAA,GAAQ,CAAC,CAAI,CAAA,EAAA,CAAA,GAAI,SAAS,CAAC,CAAA,CAAA;AAAA,KAAA;AAAA,IAEtD,MAAO,CAAA,EAAE,IAAM,EAAA,SAAA,EAAW;AAAA,GAC7B;AAEJ;;;;"}
+{"version":3,"file":"Node.esm.js","sources":["../../../src/components/DependencyGraph/Node.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport makeStyles from '@material-ui/core/styles/makeStyles';\nimport { DefaultNode } from './DefaultNode';\nimport { DependencyGraphTypes as Types } from './types';\nimport { NODE_TEST_ID } from './constants';\nimport dagre from '@dagrejs/dagre';\n\n/** @public */\nexport type DependencyGraphNodeClassKey = 'node';\n\nconst useStyles = makeStyles(\n  theme => ({\n    node: {\n      transition: `${theme.transitions.duration.shortest}ms`,\n    },\n  }),\n  { name: 'BackstageDependencyGraphNode' },\n);\n\nexport type GraphNode<T> = dagre.Node<Types.DependencyNode<T>>;\n\nexport type NodeComponentProps<T> = {\n  node: GraphNode<T>;\n  render?: Types.RenderNodeFunction<T>;\n  setNode: dagre.graphlib.Graph['setNode'];\n};\n\nconst renderDefault = (props: Types.RenderNodeProps) => (\n  <DefaultNode {...props} />\n);\n\nexport function Node<T>({\n  render = renderDefault,\n  setNode,\n  node,\n}: NodeComponentProps<T>) {\n  const { width, height, x = 0, y = 0 } = node;\n  const nodeProps: Types.DependencyNode<T> = node;\n  const classes = useStyles();\n  const nodeRef = React.useRef<SVGGElement | null>(null);\n\n  React.useLayoutEffect(() => {\n    // set the node width to the actual rendered width to properly layout graph\n    if (nodeRef.current) {\n      let { height: renderedHeight, width: renderedWidth } =\n        nodeRef.current.getBBox();\n      renderedHeight = Math.round(renderedHeight);\n      renderedWidth = Math.round(renderedWidth);\n\n      if (renderedHeight !== height || renderedWidth !== width) {\n        setNode(node.id, {\n          ...node,\n          height: renderedHeight,\n          width: renderedWidth,\n        });\n      }\n    }\n  }, [node, width, height, setNode]);\n\n  return (\n    <g\n      ref={nodeRef}\n      data-testid={NODE_TEST_ID}\n      className={classes.node}\n      transform={`translate(${x - width / 2},${y - height / 2})`}\n    >\n      {render({ node: nodeProps })}\n    </g>\n  );\n}\n"],"names":["React"],"mappings":";;;;;AA0BA,MAAM,SAAY,GAAA,UAAA;AAAA,EAChB,CAAU,KAAA,MAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,UAAY,EAAA,CAAA,EAAG,KAAM,CAAA,WAAA,CAAY,SAAS,QAAQ,CAAA,EAAA;AAAA;AACpD,GACF,CAAA;AAAA,EACA,EAAE,MAAM,8BAA+B;AACzC,CAAA;AAUA,MAAM,gBAAgB,CAAC,KAAA,qBACpBA,cAAA,CAAA,aAAA,CAAA,WAAA,EAAA,EAAa,GAAG,KAAO,EAAA,CAAA;AAGnB,SAAS,IAAQ,CAAA;AAAA,EACtB,MAAS,GAAA,aAAA;AAAA,EACT,OAAA;AAAA,EACA;AACF,CAA0B,EAAA;AACxB,EAAA,MAAM,EAAE,KAAO,EAAA,MAAA,EAAQ,IAAI,CAAG,EAAA,CAAA,GAAI,GAAM,GAAA,IAAA;AACxC,EAAA,MAAM,SAAqC,GAAA,IAAA;AAC3C,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EAAM,MAAA,OAAA,GAAUA,cAAM,CAAA,MAAA,CAA2B,IAAI,CAAA;AAErD,EAAAA,cAAA,CAAM,gBAAgB,MAAM;AAE1B,IAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,MAAI,IAAA,EAAE,QAAQ,cAAgB,EAAA,KAAA,EAAO,eACnC,GAAA,OAAA,CAAQ,QAAQ,OAAQ,EAAA;AAC1B,MAAiB,cAAA,GAAA,IAAA,CAAK,MAAM,cAAc,CAAA;AAC1C,MAAgB,aAAA,GAAA,IAAA,CAAK,MAAM,aAAa,CAAA;AAExC,MAAI,IAAA,cAAA,KAAmB,MAAU,IAAA,aAAA,KAAkB,KAAO,EAAA;AACxD,QAAA,OAAA,CAAQ,KAAK,EAAI,EAAA;AAAA,UACf,GAAG,IAAA;AAAA,UACH,MAAQ,EAAA,cAAA;AAAA,UACR,KAAO,EAAA;AAAA,SACR,CAAA;AAAA;AACH;AACF,KACC,CAAC,IAAA,EAAM,KAAO,EAAA,MAAA,EAAQ,OAAO,CAAC,CAAA;AAEjC,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,GAAK,EAAA,OAAA;AAAA,MACL,aAAa,EAAA,YAAA;AAAA,MACb,WAAW,OAAQ,CAAA,IAAA;AAAA,MACnB,SAAA,EAAW,aAAa,CAAI,GAAA,KAAA,GAAQ,CAAC,CAAI,CAAA,EAAA,CAAA,GAAI,SAAS,CAAC,CAAA,CAAA;AAAA,KAAA;AAAA,IAEtD,MAAO,CAAA,EAAE,IAAM,EAAA,SAAA,EAAW;AAAA,GAC7B;AAEJ;;;;"}

package/dist/layout/ErrorPage/StackDetails.esm.js

@@ -27,7 +27,7 @@ import '@material-ui/icons/AddCircleOutline';
 import 'd3-zoom';
 import 'd3-selection';
 import '@material-ui/core/styles/useTheme';
-import 'dagre';
+import '@dagrejs/dagre';
 import 'lodash/debounce';
 import '../../components/DependencyGraph/types.esm.js';
 import '../../components/DependencyGraph/Node.esm.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/core-components",
-  "version": "0.16.4-next.0",
+  "version": "0.16.4",
   "description": "Core components used by Backstage plugins and apps",
   "backstage": {
     "role": "web-library"
@@ -66,11 +66,12 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/config": "1.3.2",
-    "@backstage/core-plugin-api": "1.10.4-next.0",
-    "@backstage/errors": "1.2.7",
-    "@backstage/theme": "0.6.4-next.0",
-    "@backstage/version-bridge": "1.0.11-next.0",
+    "@backstage/config": "^1.3.2",
+    "@backstage/core-plugin-api": "^1.10.4",
+    "@backstage/errors": "^1.2.7",
+    "@backstage/theme": "^0.6.4",
+    "@backstage/version-bridge": "^1.0.11",
+    "@dagrejs/dagre": "^1.1.4",
     "@date-io/core": "^1.3.13",
     "@material-table/core": "^3.1.0",
     "@material-ui/core": "^4.12.2",
@@ -84,7 +85,6 @@
     "d3-selection": "^3.0.0",
     "d3-shape": "^3.0.0",
     "d3-zoom": "^3.0.0",
-    "dagre": "^0.8.5",
     "js-yaml": "^4.1.0",
     "linkify-react": "4.1.3",
     "linkifyjs": "4.1.3",
@@ -106,10 +106,10 @@
     "zod": "^3.22.4"
   },
   "devDependencies": {
-    "@backstage/app-defaults": "1.5.17-next.0",
-    "@backstage/cli": "0.30.0-next.1",
-    "@backstage/core-app-api": "1.15.5-next.0",
-    "@backstage/test-utils": "1.7.5-next.0",
+    "@backstage/app-defaults": "^1.5.17",
+    "@backstage/cli": "^0.30.0",
+    "@backstage/core-app-api": "^1.15.5",
+    "@backstage/test-utils": "^1.7.5",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/user-event": "^14.0.0",
@@ -118,7 +118,6 @@
     "@types/d3-selection": "^3.0.1",
     "@types/d3-shape": "^3.0.1",
     "@types/d3-zoom": "^3.0.1",
-    "@types/dagre": "^0.7.44",
     "@types/google-protobuf": "^3.7.2",
     "@types/react": "^18.0.0",
     "@types/react-helmet": "^6.1.0",