Each(layering, function(layer) {\n    var maxHeight = _.max(_.map(layer, function(v) { return g.node(v).height; }));\n    _.forEach(layer, function(v) {\n      g.node(v).y = prevY + maxHeight / 2;\n    });\n    prevY += maxHeight + rankSep;\n  });\n}\n\n","\"use strict\";\n\nvar _ = require(\"../lodash\");\nvar Graph = require(\"../graphlib\").Graph;\nvar util = require(\"../util\");\n\n/*\n * This module provides coordinate assignment based on Brandes and Köpf, \"Fast\n * and Simple Horizontal Coordinate Assignment.\"\n */\n\nmodule.exports = {\n  positionX: positionX,\n  findType1Conflicts: findType1Conflicts,\n  findType2Conflicts: findType2Conflicts,\n  addConflict: addConflict,\n  hasConflict: hasConflict,\n  verticalAlignment: verticalAlignment,\n  horizontalCompaction: horizontalCompaction,\n  alignCoordinates: alignCoordinates,\n  findSmallestWidthAlignment: findSmallestWidthAlignment,\n  balance: balance\n};\n\n/*\n * Marks all edges in the graph with a type-1 conflict with the \"type1Conflict\"\n * property. A type-1 conflict is one where a non-inner segment crosses an\n * inner segment. An inner segment is an edge with both incident nodes marked\n * with the \"dummy\" property.\n *\n * This algorithm scans layer by layer, starting with the second, for type-1\n * conflicts between the current layer and the previous layer. For each layer\n * it scans the nodes from left to right until it reaches one that is incident\n * on an inner segment. It then scans predecessors to determine if they have\n * edges that cross that inner segment. At the end a final scan is done for all\n * nodes on the current rank to see if they cross the last visited inner\n * segment.\n *\n * This algorithm (safely) assumes that a dummy node will only be incident on a\n * single node in the layers being scanned.\n */\nfunction findType1Conflicts(g, layering) {\n  var conflicts = {};\n\n  function visitLayer(prevLayer, layer) {\n    var\n      // last visited node in the previous layer that is incident on an inner\n      // segment.\n      k0 = 0,\n      // Tracks the last node in this layer scanned for crossings with a type-1\n      // segment.\n      scanPos = 0,\n      prevLayerLength = prevLayer.length,\n      lastNode = _.last(layer);\n\n    _.forEach(layer, function(v, i) {\n      var w = findOtherInnerSegmentNode(g, v),\n        k1 = w ? g.node(w).order : prevLayerLength;\n\n      if (w || v === lastNode) {\n        _.forEach(layer.slice(scanPos, i +1), function(scanNode) {\n          _.forEach(g.predecessors(scanNode), function(u) {\n            var uLabel = g.node(u),\n              uPos = uLabel.order;\n            if ((uPos < k0 || k1 < uPos) &&\n                !(uLabel.dummy && g.node(scanNode).dummy)) {\n              addConflict(conflicts, u, scanNode);\n            }\n          });\n        });\n        scanPos = i + 1;\n        k0 = k1;\n      }\n    });\n\n    return layer;\n  }\n\n  _.reduce(layering, visitLayer);\n  return conflicts;\n}\n\nfunction findType2Conflicts(g, layering) {\n  var conflicts = {};\n\n  function scan(south, southPos, southEnd, prevNorthBorder, nextNorthBorder) {\n    var v;\n    _.forEach(_.range(southPos, southEnd), function(i) {\n      v = south[i];\n      if (g.node(v).dummy) {\n        _.forEach(g.predecessors(v), function(u) {\n          var uNode = g.node(u);\n          if (uNode.dummy &&\n              (uNode.order < prevNorthBorder || uNode.order > nextNorthBorder)) {\n            addConflict(conflicts, u, v);\n          }\n        });\n      }\n    });\n  }\n\n\n  function visitLayer(north, south) {\n    var prevNorthPos = -1,\n      nextNorthPos,\n      southPos = 0;\n\n    _.forEach(south, function(v, southLookahead) {\n      if (g.node(v).dummy === \"border\") {\n        var predecessors = g.predecessors(v);\n        if (predecessors.length) {\n          nextNorthPos = g.node(predecessors[0]).order;\n          scan(south, southPos, southLookahead, prevNorthPos, nextNorthPos);\n          southPos = southLookahead;\n          prevNorthPos = nextNorthPos;\n        }\n      }\n      scan(south, southPos, south.length, nextNorthPos, north.length);\n    });\n\n    return south;\n  }\n\n  _.reduce(layering, visitLayer);\n  return conflicts;\n}\n\nfunction findOtherInnerSegmentNode(g, v) {\n  if (g.node(v).dummy) {\n    return _.find(g.predecessors(v), function(u) {\n      return g.node(u).dummy;\n    });\n  }\n}\n\nfunction addConflict(conflicts, v, w) {\n  if (v > w) {\n    var tmp = v;\n    v = w;\n    w = tmp;\n  }\n\n  var conflictsV = conflicts[v];\n  if (!conflictsV) {\n    conflicts[v] = conflictsV = {};\n  }\n  conflictsV[w] = true;\n}\n\nfunction hasConflict(conflicts, v, w) {\n  if (v > w) {\n    var tmp = v;\n    v = w;\n    w = tmp;\n  }\n  return _.has(conflicts[v], w);\n}\n\n/*\n * Try to align nodes into vertical \"blocks\" where possible. This algorithm\n * attempts to align a node with one of its median neighbors. If the edge\n * connecting a neighbor is a type-1 conflict then we ignore that possibility.\n * If a previous node has already formed a block with a node after the node\n * we're trying to form a block with, we also ignore that possibility - our\n * blocks would be split in that scenario.\n */\nfunction verticalAlignment(g, layering, conflicts, neighborFn) {\n  var root = {},\n    align = {},\n    pos = {};\n\n  // We cache the position here based on the layering because the graph and\n  // layering may be out of sync. The layering matrix is manipulated to\n  // generate different extreme alignments.\n  _.forEach(layering, function(layer) {\n    _.forEach(layer, function(v, order) {\n      root[v] = v;\n      align[v] = v;\n      pos[v] = order;\n    });\n  });\n\n  _.forEach(layering, function(layer) {\n    var prevIdx = -1;\n    _.forEach(layer, function(v) {\n      var ws = neighborFn(v);\n      if (ws.length) {\n        ws = _.sortBy(ws, function(w) { return pos[w]; });\n        var mp = (ws.length - 1) / 2;\n        for (var i = Math.floor(mp), il = Math.ceil(mp); i <= il; ++i) {\n          var w = ws[i];\n          if (align[v] === v &&\n              prevIdx < pos[w] &&\n              !hasConflict(conflicts, v, w)) {\n            align[w] = v;\n            align[v] = root[v] = root[w];\n            prevIdx = pos[w];\n          }\n        }\n      }\n    });\n  });\n\n  return { root: root, align: align };\n}\n\nfunction horizontalCompaction(g, layering, root, align, reverseSep) {\n  // This portion of the algorithm differs from BK due to a number of problems.\n  // Instead of their algorithm we construct a new block graph and do two\n  // sweeps. The first sweep places blocks with the smallest possible\n  // coordinates. The second sweep removes unused space by moving blocks to the\n  // greatest coordinates without violating separation.\n  var xs = {},\n    blockG = buildBlockGraph(g, layering, root, reverseSep),\n    borderType = reverseSep ? \"borderLeft\" : \"borderRight\";\n\n  function iterate(setXsFunc, nextNodesFunc) {\n    var stack = blockG.nodes();\n    var elem = stack.pop();\n    var visited = {};\n    while (elem) {\n      if (visited[elem]) {\n        setXsFunc(elem);\n      } else {\n        visited[elem] = true;\n        stack.push(elem);\n        stack = stack.concat(nextNodesFunc(elem));\n      }\n\n      elem = stack.pop();\n    }\n  }\n\n  // First pass, assign smallest coordinates\n  function pass1(elem) {\n    xs[elem] = blockG.inEdges(elem).reduce(function(acc, e) {\n      return Math.max(acc, xs[e.v] + blockG.edge(e));\n    }, 0);\n  }\n\n  // Second pass, assign greatest coordinates\n  function pass2(elem) {\n    var min = blockG.outEdges(elem).reduce(function(acc, e) {\n      return Math.min(acc, xs[e.w] - blockG.edge(e));\n    }, Number.POSITIVE_INFINITY);\n\n    var node = g.node(elem);\n    if (min !== Number.POSITIVE_INFINITY && node.borderType !== borderType) {\n      xs[elem] = Math.max(xs[elem], min);\n    }\n  }\n\n  iterate(pass1, blockG.predecessors.bind(blockG));\n  iterate(pass2, blockG.successors.bind(blockG));\n\n  // Assign x coordinates to all nodes\n  _.forEach(align, function(v) {\n    xs[v] = xs[root[v]];\n  });\n\n  return xs;\n}\n\n\nfunction buildBlockGraph(g, layering, root, reverseSep) {\n  var blockGraph = new Graph(),\n    graphLabel = g.graph(),\n    sepFn = sep(graphLabel.nodesep, graphLabel.edgesep, reverseSep);\n\n  _.forEach(layering, function(layer) {\n    var u;\n    _.forEach(layer, function(v) {\n      var vRoot = root[v];\n      blockGraph.setNode(vRoot);\n      if (u) {\n        var uRoot = root[u],\n          prevMax = blockGraph.edge(uRoot, vRoot);\n        blockGraph.setEdge(uRoot, vRoot, Math.max(sepFn(g, v, u), prevMax || 0));\n      }\n      u = v;\n    });\n  });\n\n  return blockGraph;\n}\n\n/*\n * Returns the alignment that has the smallest width of the given alignments.\n */\nfunction findSmallestWidthAlignment(g, xss) {\n  return _.minBy(_.values(xss), function (xs) {\n    var max = Number.NEGATIVE_INFINITY;\n    var min = Number.POSITIVE_INFINITY;\n\n    _.forIn(xs, function (x, v) {\n      var halfWidth = width(g, v) / 2;\n\n      max = Math.max(x + halfWidth, max);\n      min = Math.min(x - halfWidth, min);\n    });\n\n    return max - min;\n  });\n}\n\n/*\n * Align the coordinates of each of the layout alignments such that\n * left-biased alignments have their minimum coordinate at the same point as\n * the minimum coordinate of the smallest width alignment and right-biased\n * alignments have their maximum coordinate at the same point as the maximum\n * coordinate of the smallest width alignment.\n */\nfunction alignCoordinates(xss, alignTo) {\n  var alignToVals = _.values(alignTo),\n    alignToMin = _.min(alignToVals),\n    alignToMax = _.max(alignToVals);\n\n  _.forEach([\"u\", \"d\"], function(vert) {\n    _.forEach([\"l\", \"r\"], function(horiz) {\n      var alignment = vert + horiz,\n        xs = xss[alignment],\n        delta;\n      if (xs === alignTo) return;\n\n      var xsVals = _.values(xs);\n      delta = horiz === \"l\" ? alignToMin - _.min(xsVals) : alignToMax - _.max(xsVals);\n\n      if (delta) {\n        xss[alignment] = _.mapValues(xs, function(x) { return x + delta; });\n      }\n    });\n  });\n}\n\nfunction balance(xss, align) {\n  return _.mapValues(xss.ul, function(ignore, v) {\n    if (align) {\n      return xss[align.toLowerCase()][v];\n    } else {\n      var xs = _.sortBy(_.map(xss, v));\n      return (xs[1] + xs[2]) / 2;\n    }\n  });\n}\n\nfunction positionX(g) {\n  var layering = util.buildLayerMatrix(g);\n  var conflicts = _.merge(\n    findType1Conflicts(g, layering),\n    findType2Conflicts(g, layering));\n\n  var xss = {};\n  var adjustedLayering;\n  _.forEach([\"u\", \"d\"], function(vert) {\n    adjustedLayering = vert === \"u\" ? layering : _.values(layering).reverse();\n    _.forEach([\"l\", \"r\"], function(horiz) {\n      if (horiz === \"r\") {\n        adjustedLayering = _.map(adjustedLayering, function(inner) {\n          return _.values(inner).reverse();\n        });\n      }\n\n      var neighborFn = (vert === \"u\" ? g.predecessors : g.successors).bind(g);\n      var align = verticalAlignment(g, adjustedLayering, conflicts, neighborFn);\n      var xs = horizontalCompaction(g, adjustedLayering,\n        align.root, align.align, horiz === \"r\");\n      if (horiz === \"r\") {\n        xs = _.mapValues(xs, function(x) { return -x; });\n      }\n      xss[vert + horiz] = xs;\n    });\n  });\n\n  var smallestWidth = findSmallestWidthAlignment(g, xss);\n  alignCoordinates(xss, smallestWidth);\n  return balance(xss, g.graph().align);\n}\n\nfunction sep(nodeSep, edgeSep, reverseSep) {\n  return function(g, v, w) {\n    var vLabel = g.node(v);\n    var wLabel = g.node(w);\n    var sum = 0;\n    var delta;\n\n    sum += vLabel.width / 2;\n    if (_.has(vLabel, \"labelpos\")) {\n      switch (vLabel.labelpos.toLowerCase()) {\n      case \"l\": delta = -vLabel.width / 2; break;\n      case \"r\": delta = vLabel.width / 2; break;\n      }\n    }\n    if (delta) {\n      sum += reverseSep ? delta : -delta;\n    }\n    delta = 0;\n\n    sum += (vLabel.dummy ? edgeSep : nodeSep) / 2;\n    sum += (wLabel.dummy ? edgeSep : nodeSep) / 2;\n\n    sum += wLabel.width / 2;\n    if (_.has(wLabel, \"labelpos\")) {\n      switch (wLabel.labelpos.toLowerCase()) {\n      case \"l\": delta = wLabel.width / 2; break;\n      case \"r\": delta = -wLabel.width / 2; break;\n      }\n    }\n    if (delta) {\n      sum += reverseSep ? delta : -delta;\n    }\n    delta = 0;\n\n    return sum;\n  };\n}\n\nfunction width(g, v) {\n  return g.node(v).width;\n}\n","var _ = require(\"./lodash\");\nvar util = require(\"./util\");\nvar Graph = require(\"./graphlib\").Graph;\n\nmodule.exports = {\n  debugOrdering: debugOrdering\n};\n\n/* istanbul ignore next */\nfunction debugOrdering(g) {\n  var layerMatrix = util.buildLayerMatrix(g);\n\n  var h = new Graph({ compound: true, multigraph: true }).setGraph({});\n\n  _.forEach(g.nodes(), function(v) {\n    h.setNode(v, { label: v });\n    h.setParent(v, \"layer\" + g.node(v).rank);\n  });\n\n  _.forEach(g.edges(), function(e) {\n    h.setEdge(e.v, e.w, {}, e.name);\n  });\n\n  _.forEach(layerMatrix, function(layer, i) {\n    var layerV = \"layer\" + i;\n    h.setNode(layerV, { rank: \"same\" });\n    _.reduce(layer, function(u, v) {\n      h.setEdge(u, v, { style: \"invis\" });\n      return v;\n    });\n  });\n\n  return h;\n}\n","module.exports = \"0.8.5\";\n","function _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nfunction asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }\n\nfunction _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"next\", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"throw\", err); } _next(undefined); }); }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\n\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && Symbol.iterator in Object(iter)) return Array.from(iter); }\n\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nimport React from 'react';\nimport cytoscape from 'cytoscape';\nimport dagre from 'cytoscape-dagre';\nimport { getCodecOrNull } from '../../lib/cid';\nimport { colorForNode } from '../object-info/ObjectInfo';\ncytoscape.use(dagre);\nvar graphOpts = {\n  wheelSensitivity: 0.05,\n  layout: {\n    name: 'dagre',\n    rankSep: 80,\n    nodeSep: 1\n  },\n  style: [{\n    selector: 'node',\n    style: {\n      shape: 'ellipse',\n      width: '14px',\n      height: '14px',\n      'background-color': 'data(bg)'\n    }\n  }, {\n    selector: 'edge',\n    style: {\n      'source-distance-from-node': 3,\n      'target-distance-from-node': 4,\n      'curve-style': 'bezier',\n      'control-point-weight': 0.5,\n      width: 1,\n      'line-color': '#979797',\n      'line-style': 'dotted',\n      'target-label': 'data(index)',\n      'font-family': 'Consolas, monaco, monospace',\n      'font-size': '8px',\n      'target-text-margin-x': '-5px',\n      color: '#ccc',\n      'target-text-margin-y': '-2px',\n      'text-halign': 'center',\n      'text-valign': 'bottom'\n    }\n  }]\n};\n\nvar IpldGraphCytoscape = /*#__PURE__*/function (_React$Component) {\n  _inherits(IpldGraphCytoscape, _React$Component);\n\n  var _super = _createSuper(IpldGraphCytoscape);\n\n  function IpldGraphCytoscape(props) {\n    var _this;\n\n    _classCallCheck(this, IpldGraphCytoscape);\n\n    _this = _super.call(this, props);\n    _this.graphRef = /*#__PURE__*/React.createRef();\n    _this.renderTree = _this.renderTree.bind(_assertThisInitialized(_this));\n    _this.ipfsLinksToCy = _this.ipfsLinksToCy.bind(_assertThisInitialized(_this));\n    _this.cy = null;\n    _this.state = {};\n    return _this;\n  }\n\n  _createClass(IpldGraphCytoscape, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      var path = this.props.path;\n      var links = this.state.truncatedLinks;\n      var container = this.graphRef.current;\n      this.cy = this.renderTree({\n        path: path,\n        links: links,\n        container: container\n      });\n    }\n  }, {\n    key: \"componentDidUpdate\",\n    value: function componentDidUpdate() {\n      this.cy.destroy();\n      var path = this.props.path;\n      var links = this.state.truncatedLinks;\n      var container = this.graphRef.current;\n      this.cy = this.renderTree({\n        path: path,\n        links: links,\n        container: container\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      // pluck out custom props. Pass anything else on\n      var _this$props = this.props,\n          onNodeClick = _this$props.onNodeClick,\n          path = _this$props.path,\n          cid = _this$props.cid,\n          className = _this$props.className,\n          props = _objectWithoutProperties(_this$props, [\"onNodeClick\", \"path\", \"cid\", \"className\"]);\n\n      return /*#__PURE__*/React.createElement(\"div\", _extends({\n        className: className,\n        ref: this.graphRef\n      }, props));\n    }\n  }, {\n    key: \"renderTree\",\n    value: function renderTree(_ref) {\n      var _this2 = this;\n\n      var path = _ref.path,\n          links = _ref.links,\n          container = _ref.container;\n      var cyLinks = this.ipfsLinksToCy(links); // TODO: path is currently alwasys the root cid, but this will change.\n\n      var root = this.makeNode({\n        target: path\n      }, ''); // list of graph elements to start with\n\n      var elements = [root].concat(_toConsumableArray(cyLinks));\n      var cy = cytoscape(_objectSpread({\n        elements: elements,\n        container: container\n      }, graphOpts));\n\n      if (this.props.onNodeClick) {\n        cy.on('tap', /*#__PURE__*/function () {\n          var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(e) {\n            var data, link;\n            return regeneratorRuntime.wrap(function _callee$(_context) {\n              while (1) {\n                switch (_context.prev = _context.next) {\n                  case 0:\n                    if (e.target.data) {\n                      _context.next = 2;\n                      break;\n                    }\n\n                    return _context.abrupt(\"return\");\n\n                  case 2:\n                    data = e.target.data();\n                    link = _this2.state.truncatedLinks[data.index];\n\n                    _this2.props.onNodeClick(link);\n\n                  case 5:\n                  case \"end\":\n                    return _context.stop();\n                }\n              }\n            }, _callee);\n          }));\n\n          return function (_x) {\n            return _ref2.apply(this, arguments);\n          };\n        }());\n      }\n\n      return cy;\n    }\n  }, {\n    key: \"ipfsLinksToCy\",\n    value: function ipfsLinksToCy(links) {\n      var edges = links.map(this.makeLink);\n      var nodes = links.map(this.makeNode);\n      return [].concat(_toConsumableArray(nodes), _toConsumableArray(edges));\n    }\n  }, {\n    key: \"makeNode\",\n    value: function makeNode(_ref3, index) {\n      var target = _ref3.target,\n          path = _ref3.path;\n      var type = getCodecOrNull(target);\n      var bg = colorForNode(type);\n      return {\n        group: 'nodes',\n        data: {\n          id: target,\n          path: path,\n          bg: bg,\n          index: index\n        }\n      };\n    }\n  }, {\n    key: \"makeLink\",\n    value: function makeLink(_ref4, index) {\n      var source = _ref4.source,\n          target = _ref4.target,\n          path = _ref4.path;\n      return {\n        group: 'edges',\n        data: {\n          source: source,\n          target: target,\n          index: index\n        }\n      };\n    }\n  }, {\n    key: \"runLayout\",\n    value: function runLayout(cy) {\n      cy.layout(this.layoutOpts).run();\n    }\n  }], [{\n    key: \"getDerivedStateFromProps\",\n    value: function getDerivedStateFromProps(props, state) {\n      // TODO: Show that links have been truncated.\n      return {\n        truncatedLinks: props.links.slice(0, 100)\n      };\n    }\n  }]);\n\n  return IpldGraphCytoscape;\n}(React.Component);\n\nexport { IpldGraphCytoscape as default };","/* global window */\n\nvar lodash;\n\nif (typeof require === \"function\") {\n  try {\n    lodash = {\n      cloneDeep: require(\"lodash/cloneDeep\"),\n      constant: require(\"lodash/constant\"),\n      defaults: require(\"lodash/defaults\"),\n      each: require(\"lodash/each\"),\n      filter: require(\"lodash/filter\"),\n      find: require(\"lodash/find\"),\n      flatten: require(\"lodash/flatten\"),\n      forEach: require(\"lodash/forEach\"),\n      forIn: require(\"lodash/forIn\"),\n      has:  require(\"lodash/has\"),\n      isUndefined: require(\"lodash/isUndefined\"),\n      last: require(\"lodash/last\"),\n      map: require(\"lodash/map\"),\n      mapValues: require(\"lodash/mapValues\"),\n      max: require(\"lodash/max\"),\n      merge: require(\"lodash/merge\"),\n      min: require(\"lodash/min\"),\n      minBy: require(\"lodash/minBy\"),\n      now: require(\"lodash/now\"),\n      pick: require(\"lodash/pick\"),\n      range: require(\"lodash/range\"),\n      reduce: require(\"lodash/reduce\"),\n      sortBy: require(\"lodash/sortBy\"),\n      uniqueId: require(\"lodash/uniqueId\"),\n      values: require(\"lodash/values\"),\n      zipObject: require(\"lodash/zipObject\"),\n    };\n  } catch (e) {\n    // continue regardless of error\n  }\n}\n\nif (!lodash) {\n  lodash = window._;\n}\n\nmodule.exports = lodash;\n","/* eslint \"no-console\": off */\n\n\"use strict\";\n\nvar _ = require(\"./lodash\");\nvar Graph = require(\"./graphlib\").Graph;\n\nmodule.exports = {\n  addDummyNode: addDummyNode,\n  simplify: simplify,\n  asNonCompoundGraph: asNonCompoundGraph,\n  successorWeights: successorWeights,\n  predecessorWeights: predecessorWeights,\n  intersectRect: intersectRect,\n  buildLayerMatrix: buildLayerMatrix,\n  normalizeRanks: normalizeRanks,\n  removeEmptyRanks: removeEmptyRanks,\n  addBorderNode: addBorderNode,\n  maxRank: maxRank,\n  partition: partition,\n  time: time,\n  notime: notime\n};\n\n/*\n * Adds a dummy node to the graph and return v.\n */\nfunction addDummyNode(g, type, attrs, name) {\n  var v;\n  do {\n    v = _.uniqueId(name);\n  } while (g.hasNode(v));\n\n  attrs.dummy = type;\n  g.setNode(v, attrs);\n  return v;\n}\n\n/*\n * Returns a new graph with only simple edges. Handles aggregation of data\n * associated with multi-edges.\n */\nfunction simplify(g) {\n  var simplified = new Graph().setGraph(g.graph());\n  _.forEach(g.nodes(), function(v) { simplified.setNode(v, g.node(v)); });\n  _.forEach(g.edges(), function(e) {\n    var simpleLabel = simplified.edge(e.v, e.w) || { weight: 0, minlen: 1 };\n    var label = g.edge(e);\n    simplified.setEdge(e.v, e.w, {\n      weight: simpleLabel.weight + label.weight,\n      minlen: Math.max(simpleLabel.minlen, label.minlen)\n    });\n  });\n  return simplified;\n}\n\nfunction asNonCompoundGraph(g) {\n  var simplified = new Graph({ multigraph: g.isMultigraph() }).setGraph(g.graph());\n  _.forEach(g.nodes(), function(v) {\n    if (!g.children(v).length) {\n      simplified.setNode(v, g.node(v));\n    }\n  });\n  _.forEach(g.edges(), function(e) {\n    simplified.setEdge(e, g.edge(e));\n  });\n  return simplified;\n}\n\nfunction successorWeights(g) {\n  var weightMap = _.map(g.nodes(), function(v) {\n    var sucs = {};\n    _.forEach(g.outEdges(v), function(e) {\n      sucs[e.w] = (sucs[e.w] || 0) + g.edge(e).weight;\n    });\n    return sucs;\n  });\n  return _.zipObject(g.nodes(), weightMap);\n}\n\nfunction predecessorWeights(g) {\n  var weightMap = _.map(g.nodes(), function(v) {\n    var preds = {};\n    _.forEach(g.inEdges(v), function(e) {\n      preds[e.v] = (preds[e.v] || 0) + g.edge(e).weight;\n    });\n    return preds;\n  });\n  return _.zipObject(g.nodes(), weightMap);\n}\n\n/*\n * Finds where a line starting at point ({x, y}) would intersect a rectangle\n * ({x, y, width, height}) if it were pointing at the rectangle's center.\n */\nfunction intersectRect(rect, point) {\n  var x = rect.x;\n  var y = rect.y;\n\n  // Rectangle intersection algorithm from:\n  // http://math.stackexchange.com/questions/108113/find-edge-between-two-boxes\n  var dx = point.x - x;\n  var dy = point.y - y;\n  var w = rect.width / 2;\n  var h = rect.height / 2;\n\n  if (!dx && !dy) {\n    throw new Error(\"Not possible to find intersection inside of the rectangle\");\n  }\n\n  var sx, sy;\n  if (Math.abs(dy) * w > Math.abs(dx) * h) {\n    // Intersection is top or bottom of rect.\n    if (dy < 0) {\n      h = -h;\n    }\n    sx = h * dx / dy;\n    sy = h;\n  } else {\n    // Intersection is left or right of rect.\n    if (dx < 0) {\n      w = -w;\n    }\n    sx = w;\n    sy = w * dy / dx;\n  }\n\n  return { x: x + sx, y: y + sy };\n}\n\n/*\n * Given a DAG with each node assigned \"rank\" and \"order\" properties, this\n * function will produce a matrix with the ids of each node.\n */\nfunction buildLayerMatrix(g) {\n  var layering = _.map(_.range(maxRank(g) + 1), function() { return []; });\n  _.forEach(g.nodes(), function(v) {\n    var node = g.node(v);\n    var rank = node.rank;\n    if (!_.isUndefined(rank)) {\n      layering[rank][node.order] = v;\n    }\n  });\n  return layering;\n}\n\n/*\n * Adjusts the ranks for all nodes in the graph such that all nodes v have\n * rank(v) >= 0 and at least one node w has rank(w) = 0.\n */\nfunction normalizeRanks(g) {\n  var min = _.min(_.map(g.nodes(), function(v) { return g.node(v).rank; }));\n  _.forEach(g.nodes(), function(v) {\n    var node = g.node(v);\n    if (_.has(node, \"rank\")) {\n      node.rank -= min;\n    }\n  });\n}\n\nfunction removeEmptyRanks(g) {\n  // Ranks may not start at 0, so we need to offset them\n  var offset = _.min(_.map(g.nodes(), function(v) { return g.node(v).rank; }));\n\n  var layers = [];\n  _.forEach(g.nodes(), function(v) {\n    var rank = g.node(v).rank - offset;\n    if (!layers[rank]) {\n      layers[rank] = [];\n    }\n    layers[rank].push(v);\n  });\n\n  var delta = 0;\n  var nodeRankFactor = g.graph().nodeRankFactor;\n  _.forEach(layers, function(vs, i) {\n    if (_.isUndefined(vs) && i % nodeRankFactor !== 0) {\n      --delta;\n    } else if (delta) {\n      _.forEach(vs, function(v) { g.node(v).rank += delta; });\n    }\n  });\n}\n\nfunction addBorderNode(g, prefix, rank, order) {\n  var node = {\n    width: 0,\n    height: 0\n  };\n  if (arguments.length >= 4) {\n    node.rank = rank;\n    node.order = order;\n  }\n  return addDummyNode(g, \"border\", node, prefix);\n}\n\nfunction maxRank(g) {\n  return _.max(_.map(g.nodes(), function(v) {\n    var rank = g.node(v).rank;\n    if (!_.isUndefined(rank)) {\n      return rank;\n    }\n  }));\n}\n\n/*\n * Partition a collection into two groups: `lhs` and `rhs`. If the supplied\n * function returns true for an entry it goes into `lhs`. Otherwise it goes\n * into `rhs.\n */\nfunction partition(collection, fn) {\n  var result = { lhs: [], rhs: [] };\n  _.forEach(collection, function(value) {\n    if (fn(value)) {\n      result.lhs.push(value);\n    } else {\n      result.rhs.push(value);\n    }\n  });\n  return result;\n}\n\n/*\n * Returns a new function that wraps `fn` with a timer. The wrapper logs the\n * time it takes to execute the function.\n */\nfunction time(name, fn) {\n  var start = _.now();\n  try {\n    return fn();\n  } finally {\n    console.log(name + \" time: \" + (_.now() - start) + \"ms\");\n  }\n}\n\nfunction notime(name, fn) {\n  return fn();\n}\n","/* global window */\n\nvar lodash;\n\nif (typeof require === \"function\") {\n  try {\n    lodash = {\n      clone: require(\"lodash/clone\"),\n      constant: require(\"lodash/constant\"),\n      each: require(\"lodash/each\"),\n      filter: require(\"lodash/filter\"),\n      has:  require(\"lodash/has\"),\n      isArray: require(\"lodash/isArray\"),\n      isEmpty: require(\"lodash/isEmpty\"),\n      isFunction: require(\"lodash/isFunction\"),\n      isUndefined: require(\"lodash/isUndefined\"),\n      keys: require(\"lodash/keys\"),\n      map: require(\"lodash/map\"),\n      reduce: require(\"lodash/reduce\"),\n      size: require(\"lodash/size\"),\n      transform: require(\"lodash/transform\"),\n      union: require(\"lodash/union\"),\n      values: require(\"lodash/values\")\n    };\n  } catch (e) {\n    // continue regardless of error\n  }\n}\n\nif (!lodash) {\n  lodash = window._;\n}\n\nmodule.exports = lodash;\n","/* global window */\n\nvar graphlib;\n\nif (typeof require === \"function\") {\n  try {\n    graphlib = require(\"graphlib\");\n  } catch (e) {\n    // continue regardless of error\n  }\n}\n\nif (!graphlib) {\n  graphlib = window.graphlib;\n}\n\nmodule.exports = graphlib;\n","var arrayLikeKeys = require('./_arrayLikeKeys'),\n    baseKeysIn = require('./_baseKeysIn'),\n    isArrayLike = require('./isArrayLike');\n\n/**\n * Creates an array of the own and inherited enumerable property names of `object`.\n *\n * **Note:** Non-object values are coerced to objects.\n *\n * @static\n * @memberOf _\n * @since 3.0.0\n * @category Object\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of property names.\n * @example\n *\n * function Foo() {\n *   this.a = 1;\n *   this.b = 2;\n * }\n *\n * Foo.prototype.c = 3;\n *\n * _.keysIn(new Foo);\n * // => ['a', 'b', 'c'] (iteration order is not guaranteed)\n */\nfunction keysIn(object) {\n  return isArrayLike(object) ? arrayLikeKeys(object, true) : baseKeysIn(object);\n}\n\nmodule.exports = keysIn;\n"],"sourceRoot":""}