@teambit/graph 0.0.881 → 0.0.883

package/dist/ui/component-node/component-node.js

@@ -1,165 +1,119 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 require("core-js/modules/es.array.iterator.js");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ComponentNode = ComponentNode;
-
 function _extends2() {
   const data = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
   _extends2 = function () {
     return data;
   };
-
   return data;
 }
-
 function _objectWithoutProperties2() {
   const data = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
   _objectWithoutProperties2 = function () {
     return data;
   };
-
   return data;
 }
-
 function _react() {
   const data = _interopRequireWildcard(require("react"));
-
   _react = function () {
     return data;
   };
-
   return data;
 }
-
 function _classnames() {
   const data = _interopRequireDefault(require("classnames"));
-
   _classnames = function () {
     return data;
   };
-
   return data;
 }
-
 function _baseUiText() {
   const data = require("@teambit/base-ui.text.muted-text");
-
   _baseUiText = function () {
     return data;
   };
-
   return data;
 }
-
 function _componentUi() {
   const data = require("@teambit/component.ui.deprecation-icon");
-
   _componentUi = function () {
     return data;
   };
-
   return data;
 }
-
 function _envsUi() {
   const data = require("@teambit/envs.ui.env-icon");
-
   _envsUi = function () {
     return data;
   };
-
   return data;
 }
-
 function _designUiStyles() {
   const data = require("@teambit/design.ui.styles.ellipsis");
-
   _designUiStyles = function () {
     return data;
   };
-
   return data;
 }
-
 function _baseUiSurfaces() {
   const data = require("@teambit/base-ui.surfaces.card");
-
   _baseUiSurfaces = function () {
     return data;
   };
-
   return data;
 }
-
 function _baseUiRouting() {
   const data = require("@teambit/base-ui.routing.nav-link");
-
   _baseUiRouting = function () {
     return data;
   };
-
   return data;
 }
-
 function _componentModules() {
   const data = require("@teambit/component.modules.component-url");
-
   _componentModules = function () {
     return data;
   };
-
   return data;
 }
-
 function _dependenciesGraph() {
   const data = require("../dependencies-graph/");
-
   _dependenciesGraph = function () {
     return data;
   };
-
   return data;
 }
-
 function _componentNodeModule() {
   const data = _interopRequireDefault(require("./component-node.module.scss"));
-
   _componentNodeModule = function () {
     return data;
   };
-
   return data;
 }
-
 function _variantsModule() {
   const data = _interopRequireDefault(require("./variants.module.scss"));
-
   _variantsModule = function () {
     return data;
   };
-
   return data;
 }
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 // keep order: styles, then variants
+
 function ComponentNode(_ref) {
   let {
-    node,
-    type = 'defaultNode'
-  } = _ref,
-      rest = (0, _objectWithoutProperties2().default)(_ref, ["node", "type"]);
+      node,
+      type = 'defaultNode'
+    } = _ref,
+    rest = (0, _objectWithoutProperties2().default)(_ref, ["node", "type"]);
   const graphContext = (0, _react().useContext)(_dependenciesGraph().ComponentGraphContext);
   const {
     component
@@ -199,13 +153,12 @@ function ComponentNode(_ref) {
     component: component
   })))));
 }
-
 function Breadcrumbs(_ref2) {
   let {
-    componentId,
-    className
-  } = _ref2,
-      rest = (0, _objectWithoutProperties2().default)(_ref2, ["componentId", "className"]);
+      componentId,
+      className
+    } = _ref2,
+    rest = (0, _objectWithoutProperties2().default)(_ref2, ["componentId", "className"]);
   const {
     scope,
     namespace

package/dist/ui/component-node/component-node.js.map

@@ -1 +1 @@
-{"version":3,"names":["ComponentNode","node","type","rest","graphContext","useContext","ComponentGraphContext","component","id","classnames","styles","compNode","variants","firstRow","envIcon","mutedText","nameLine","link","ComponentUrl","toUrl","includeVersion","name","ellipsis","version","buffs","componentWidgets","toArray","map","widgetId","Widget","Breadcrumbs","componentId","className","scope","namespace","showSep","breadcrumbs"],"sources":["component-node.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport classnames from 'classnames';\nimport { mutedText } from '@teambit/base-ui.text.muted-text';\nimport { ComponentID } from '@teambit/component';\nimport { DeprecationIcon } from '@teambit/component.ui.deprecation-icon';\nimport { EnvIcon } from '@teambit/envs.ui.env-icon';\nimport { ellipsis } from '@teambit/design.ui.styles.ellipsis';\nimport { Card, CardProps } from '@teambit/base-ui.surfaces.card';\nimport { NavLink } from '@teambit/base-ui.routing.nav-link';\nimport { ComponentUrl } from '@teambit/component.modules.component-url';\nimport { NodeModel } from '../query/node-model';\nimport { ComponentGraphContext } from '../dependencies-graph/';\n\n// keep order: styles, then variants\nimport styles from './component-node.module.scss';\nimport variants from './variants.module.scss';\n\nexport interface ComponentNode extends CardProps {\n  node: NodeModel;\n  type: string;\n}\n\nexport function ComponentNode({ node, type = 'defaultNode', ...rest }: ComponentNode) {\n  const graphContext = useContext(ComponentGraphContext);\n  const { component } = node;\n  const { id } = component;\n\n  return (\n    <Card className={classnames(styles.compNode, variants[type])} elevation=\"none\" {...rest}>\n      <div className={styles.firstRow}>\n        <EnvIcon component={component} className={styles.envIcon} />\n        <Breadcrumbs componentId={id} className={mutedText} />\n      </div>\n      <div className={styles.nameLine}>\n        <NavLink className={styles.link} external={true} href={ComponentUrl.toUrl(id, { includeVersion: false })}>\n          <span className={classnames(styles.name, ellipsis)}>{id.name}</span>\n        </NavLink>\n        {id.version && <span className={classnames(styles.version, ellipsis)}>{id.version}</span>}\n\n        <div className={styles.buffs}>\n          <DeprecationIcon component={component} />\n          {graphContext &&\n            graphContext.componentWidgets\n              .toArray()\n              .map(([widgetId, Widget]) => <Widget key={widgetId} component={component} />)}\n        </div>\n      </div>\n    </Card>\n  );\n}\n\ntype BreadcrumbsProps = { componentId: ComponentID } & React.HTMLAttributes<HTMLDivElement>;\n\nfunction Breadcrumbs({ componentId, className, ...rest }: BreadcrumbsProps) {\n  const { scope, namespace } = componentId;\n  const showSep = !!scope && !!namespace;\n\n  return (\n    <div {...rest} className={classnames(styles.breadcrumbs, ellipsis, className)}>\n      {scope}\n      {showSep && '/'}\n      {namespace}\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"names":["ComponentNode","node","type","rest","graphContext","useContext","ComponentGraphContext","component","id","classnames","styles","compNode","variants","firstRow","envIcon","mutedText","nameLine","link","ComponentUrl","toUrl","includeVersion","name","ellipsis","version","buffs","componentWidgets","toArray","map","widgetId","Widget","Breadcrumbs","componentId","className","scope","namespace","showSep","breadcrumbs"],"sources":["component-node.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport classnames from 'classnames';\nimport { mutedText } from '@teambit/base-ui.text.muted-text';\nimport { ComponentID } from '@teambit/component';\nimport { DeprecationIcon } from '@teambit/component.ui.deprecation-icon';\nimport { EnvIcon } from '@teambit/envs.ui.env-icon';\nimport { ellipsis } from '@teambit/design.ui.styles.ellipsis';\nimport { Card, CardProps } from '@teambit/base-ui.surfaces.card';\nimport { NavLink } from '@teambit/base-ui.routing.nav-link';\nimport { ComponentUrl } from '@teambit/component.modules.component-url';\nimport { NodeModel } from '../query/node-model';\nimport { ComponentGraphContext } from '../dependencies-graph/';\n\n// keep order: styles, then variants\nimport styles from './component-node.module.scss';\nimport variants from './variants.module.scss';\n\nexport interface ComponentNode extends CardProps {\n  node: NodeModel;\n  type: string;\n}\n\nexport function ComponentNode({ node, type = 'defaultNode', ...rest }: ComponentNode) {\n  const graphContext = useContext(ComponentGraphContext);\n  const { component } = node;\n  const { id } = component;\n\n  return (\n    <Card className={classnames(styles.compNode, variants[type])} elevation=\"none\" {...rest}>\n      <div className={styles.firstRow}>\n        <EnvIcon component={component} className={styles.envIcon} />\n        <Breadcrumbs componentId={id} className={mutedText} />\n      </div>\n      <div className={styles.nameLine}>\n        <NavLink className={styles.link} external={true} href={ComponentUrl.toUrl(id, { includeVersion: false })}>\n          <span className={classnames(styles.name, ellipsis)}>{id.name}</span>\n        </NavLink>\n        {id.version && <span className={classnames(styles.version, ellipsis)}>{id.version}</span>}\n\n        <div className={styles.buffs}>\n          <DeprecationIcon component={component} />\n          {graphContext &&\n            graphContext.componentWidgets\n              .toArray()\n              .map(([widgetId, Widget]) => <Widget key={widgetId} component={component} />)}\n        </div>\n      </div>\n    </Card>\n  );\n}\n\ntype BreadcrumbsProps = { componentId: ComponentID } & React.HTMLAttributes<HTMLDivElement>;\n\nfunction Breadcrumbs({ componentId, className, ...rest }: BreadcrumbsProps) {\n  const { scope, namespace } = componentId;\n  const showSep = !!scope && !!namespace;\n\n  return (\n    <div {...rest} className={classnames(styles.breadcrumbs, ellipsis, className)}>\n      {scope}\n      {showSep && '/'}\n      {namespace}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/ui/component-node/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -48,37 +47,27 @@ Object.defineProperty(exports, "rootNodeColor", {
   }
 });
 exports.styles = void 0;
-
 function _componentNodeModule() {
   const data = _interopRequireDefault(require("./component-node.module.scss"));
-
   _componentNodeModule = function () {
     return data;
   };
-
   return data;
 }
-
 function _componentNode() {
   const data = require("./component-node");
-
   _componentNode = function () {
     return data;
   };
-
   return data;
 }
-
 function _variants() {
   const data = require("./variants");
-
   _variants = function () {
     return data;
   };
-
   return data;
 }
-
 const {
   compNode,
   firstRow,
@@ -90,7 +79,6 @@ const {
   buffs,
   link
 } = _componentNodeModule().default;
-
 const styles = {
   compNode,
   firstRow,

package/dist/ui/component-node/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["compNode","firstRow","envIcon","breadcrumbs","nameLine","name","version","buffs","link","componentStyles","styles"],"sources":["index.ts"],"sourcesContent":["import componentStyles from './component-node.module.scss';\n\nexport { ComponentNode } from './component-node';\n\nexport { defaultNodeColor, rootNodeColor, externalNodeColor, root, defaultNode, external } from './variants';\n\nconst { compNode, firstRow, envIcon, breadcrumbs, nameLine, name, version, buffs, link } = componentStyles;\nexport const styles = { compNode, firstRow, envIcon, breadcrumbs, nameLine, name, version, buffs, link };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AAEA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AAEA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AAEA,MAAM;EAAEA,QAAF;EAAYC,QAAZ;EAAsBC,OAAtB;EAA+BC,WAA/B;EAA4CC,QAA5C;EAAsDC,IAAtD;EAA4DC,OAA5D;EAAqEC,KAArE;EAA4EC;AAA5E,IAAqFC,8BAA3F;;AACO,MAAMC,MAAM,GAAG;EAAEV,QAAF;EAAYC,QAAZ;EAAsBC,OAAtB;EAA+BC,WAA/B;EAA4CC,QAA5C;EAAsDC,IAAtD;EAA4DC,OAA5D;EAAqEC,KAArE;EAA4EC;AAA5E,CAAf"}
+{"version":3,"names":["compNode","firstRow","envIcon","breadcrumbs","nameLine","name","version","buffs","link","componentStyles","styles"],"sources":["index.ts"],"sourcesContent":["import componentStyles from './component-node.module.scss';\n\nexport { ComponentNode } from './component-node';\n\nexport { defaultNodeColor, rootNodeColor, externalNodeColor, root, defaultNode, external } from './variants';\n\nconst { compNode, firstRow, envIcon, breadcrumbs, nameLine, name, version, buffs, link } = componentStyles;\nexport const styles = { compNode, firstRow, envIcon, breadcrumbs, nameLine, name, version, buffs, link };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAEA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAEA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAEA,MAAM;EAAEA,QAAQ;EAAEC,QAAQ;EAAEC,OAAO;EAAEC,WAAW;EAAEC,QAAQ;EAAEC,IAAI;EAAEC,OAAO;EAAEC,KAAK;EAAEC;AAAK,CAAC,GAAGC,8BAAe;AACnG,MAAMC,MAAM,GAAG;EAAEV,QAAQ;EAAEC,QAAQ;EAAEC,OAAO;EAAEC,WAAW;EAAEC,QAAQ;EAAEC,IAAI;EAAEC,OAAO;EAAEC,KAAK;EAAEC;AAAK,CAAC;AAAC"}

package/dist/ui/component-node/variants.js

@@ -1,22 +1,17 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.rootNodeColor = exports.root = exports.externalNodeColor = exports.external = exports.defaultNodeColor = exports.defaultNode = void 0;
-
 function _variantsModule() {
   const data = _interopRequireDefault(require("./variants.module.scss"));
-
   _variantsModule = function () {
     return data;
   };
-
   return data;
 }
-
 const {
   root,
   defaultNode,
@@ -25,7 +20,6 @@ const {
   defaultNodeColor,
   externalNodeColor
 } = _variantsModule().default;
-
 exports.externalNodeColor = externalNodeColor;
 exports.defaultNodeColor = defaultNodeColor;
 exports.rootNodeColor = rootNodeColor;

package/dist/ui/component-node/variants.js.map

@@ -1 +1 @@
-{"version":3,"names":["root","defaultNode","external","rootNodeColor","defaultNodeColor","externalNodeColor","variants"],"sources":["variants.ts"],"sourcesContent":["import variants from './variants.module.scss';\n\nconst { root, defaultNode, external, rootNodeColor, defaultNodeColor, externalNodeColor } = variants;\n\nexport { root, defaultNode, external, rootNodeColor, defaultNodeColor, externalNodeColor };\n"],"mappings":";;;;;;;;;AAAA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AAEA,MAAM;EAAEA,IAAF;EAAQC,WAAR;EAAqBC,QAArB;EAA+BC,aAA/B;EAA8CC,gBAA9C;EAAgEC;AAAhE,IAAsFC,yBAA5F"}
+{"version":3,"names":["root","defaultNode","external","rootNodeColor","defaultNodeColor","externalNodeColor","variants"],"sources":["variants.ts"],"sourcesContent":["import variants from './variants.module.scss';\n\nconst { root, defaultNode, external, rootNodeColor, defaultNodeColor, externalNodeColor } = variants;\n\nexport { root, defaultNode, external, rootNodeColor, defaultNodeColor, externalNodeColor };\n"],"mappings":";;;;;;;AAAA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAEA,MAAM;EAAEA,IAAI;EAAEC,WAAW;EAAEC,QAAQ;EAAEC,aAAa;EAAEC,gBAAgB;EAAEC;AAAkB,CAAC,GAAGC,yBAAQ;AAAC;AAAA;AAAA;AAAA;AAAA;AAAA"}

package/dist/ui/dependencies-compare/compare-graph-model.js

@@ -4,26 +4,20 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.CompareGraphModel = void 0;
-
 function _graph() {
   const data = require("@teambit/graph");
-
   _graph = function () {
     return data;
   };
-
   return data;
 }
-
 class CompareGraphModel extends _graph().GraphModel {
   constructor(nodes, edges) {
     super(nodes, edges);
     this.nodes = nodes;
     this.edges = edges;
   }
-
 }
-
 exports.CompareGraphModel = CompareGraphModel;
 
 //# sourceMappingURL=compare-graph-model.js.map

package/dist/ui/dependencies-compare/compare-graph-model.js.map

@@ -1 +1 @@
-{"version":3,"names":["CompareGraphModel","GraphModel","constructor","nodes","edges"],"sources":["compare-graph-model.ts"],"sourcesContent":["import { EdgeModel, GraphModel } from '@teambit/graph';\nimport { CompareNodeModel } from './compare-node-model';\n\nexport class CompareGraphModel extends GraphModel<CompareNodeModel, EdgeModel> {\n  constructor(public nodes: CompareNodeModel[], public edges: EdgeModel[]) {\n    super(nodes, edges);\n  }\n}\n"],"mappings":";;;;;;;AAAA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AAGO,MAAMA,iBAAN,SAAgCC,mBAAhC,CAAwE;EAC7EC,WAAW,CAAQC,KAAR,EAA0CC,KAA1C,EAA8D;IACvE,MAAMD,KAAN,EAAaC,KAAb;IADuE,KAAtDD,KAAsD,GAAtDA,KAAsD;IAAA,KAApBC,KAAoB,GAApBA,KAAoB;EAExE;;AAH4E"}
+{"version":3,"names":["CompareGraphModel","GraphModel","constructor","nodes","edges"],"sources":["compare-graph-model.ts"],"sourcesContent":["import { EdgeModel, GraphModel } from '@teambit/graph';\nimport { CompareNodeModel } from './compare-node-model';\n\nexport class CompareGraphModel extends GraphModel<CompareNodeModel, EdgeModel> {\n  constructor(public nodes: CompareNodeModel[], public edges: EdgeModel[]) {\n    super(nodes, edges);\n  }\n}\n"],"mappings":";;;;;;AAAA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAGO,MAAMA,iBAAiB,SAASC,mBAAU,CAA8B;EAC7EC,WAAW,CAAQC,KAAyB,EAASC,KAAkB,EAAE;IACvE,KAAK,CAACD,KAAK,EAAEC,KAAK,CAAC;IAAC,KADHD,KAAyB,GAAzBA,KAAyB;IAAA,KAASC,KAAkB,GAAlBA,KAAkB;EAEvE;AACF;AAAC"}

package/dist/ui/dependencies-compare/compare-node-model.js

@@ -1,34 +1,25 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 require("core-js/modules/es.array.iterator.js");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.CompareNodeModel = void 0;
-
 function _defineProperty2() {
   const data = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
   _defineProperty2 = function () {
     return data;
   };
-
   return data;
 }
-
 function _graph() {
   const data = require("@teambit/graph");
-
   _graph = function () {
     return data;
   };
-
   return data;
 }
-
 class CompareNodeModel extends _graph().NodeModel {
   constructor(...args) {
     super(...args);
@@ -37,9 +28,7 @@ class CompareNodeModel extends _graph().NodeModel {
     (0, _defineProperty2().default)(this, "compareVersion", void 0);
     (0, _defineProperty2().default)(this, "status", void 0);
   }
-
 }
-
 exports.CompareNodeModel = CompareNodeModel;
 
 //# sourceMappingURL=compare-node-model.js.map

package/dist/ui/dependencies-compare/compare-node-model.js.map

@@ -1 +1 @@
-{"version":3,"names":["CompareNodeModel","NodeModel"],"sources":["compare-node-model.ts"],"sourcesContent":["import { ComponentModel } from '@teambit/component';\nimport { NodeModel } from '@teambit/graph';\n\nexport type CompareStatus = 'modified' | 'new' | 'deleted' | undefined;\n\nexport class CompareNodeModel extends NodeModel {\n  id: string;\n  component: ComponentModel;\n  compareVersion: string;\n  status: CompareStatus;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AACA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AAIO,MAAMA,gBAAN,SAA+BC,kBAA/B,CAAyC;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;;AAAA"}
+{"version":3,"names":["CompareNodeModel","NodeModel"],"sources":["compare-node-model.ts"],"sourcesContent":["import { ComponentModel } from '@teambit/component';\nimport { NodeModel } from '@teambit/graph';\n\nexport type CompareStatus = 'modified' | 'new' | 'deleted' | undefined;\n\nexport class CompareNodeModel extends NodeModel {\n  id: string;\n  component: ComponentModel;\n  compareVersion: string;\n  status: CompareStatus;\n}\n"],"mappings":";;;;;;;;;;;;;;;AACA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAIO,MAAMA,gBAAgB,SAASC,kBAAS,CAAC;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAKhD;AAAC"}

package/dist/ui/dependencies-compare/dependencies-compare.js

@@ -1,108 +1,76 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 require("core-js/modules/es.array.iterator.js");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DependenciesCompare = DependenciesCompare;
-
 function _classnames() {
   const data = _interopRequireDefault(require("classnames"));
-
   _classnames = function () {
     return data;
   };
-
   return data;
 }
-
 function _componentUi() {
   const data = require("@teambit/component.ui.compare");
-
   _componentUi = function () {
     return data;
   };
-
   return data;
 }
-
 function _designUi() {
   const data = require("@teambit/design.ui.round-loader");
-
   _designUi = function () {
     return data;
   };
-
   return data;
 }
-
 function _graph() {
   const data = require("@teambit/graph");
-
   _graph = function () {
     return data;
   };
-
   return data;
 }
-
 function _react() {
   const data = _interopRequireWildcard(require("react"));
-
   _react = function () {
     return data;
   };
-
   return data;
 }
-
 function _reactFlowRenderer() {
   const data = _interopRequireWildcard(require("react-flow-renderer"));
-
   _reactFlowRenderer = function () {
     return data;
   };
-
   return data;
 }
-
 function _dependenciesCompareModule() {
   const data = _interopRequireDefault(require("./dependencies-compare.module.scss"));
-
   _dependenciesCompareModule = function () {
     return data;
   };
-
   return data;
 }
-
 function _dependencyCompareNode() {
   const data = require("./dependency-compare-node");
-
   _dependencyCompareNode = function () {
     return data;
   };
-
   return data;
 }
-
 function _diffGraph2() {
   const data = require("./diff-graph");
-
   _diffGraph2 = function () {
     return data;
   };
-
   return data;
 }
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function ComponentNodeContainer(props) {
   const {
     sourcePosition = _reactFlowRenderer().Position.Top,
@@ -125,14 +93,11 @@ function ComponentNodeContainer(props) {
     type: data.type
   }));
 }
-
 const NodeTypes = {
   ComponentNode: ComponentNodeContainer
 };
-
 function DependenciesCompare() {
   var _componentCompare$bas, _componentCompare$com, _diffGraph;
-
   const graphRef = (0, _react().useRef)();
   const componentCompare = (0, _componentUi().useComponentCompare)();
   const baseId = componentCompare === null || componentCompare === void 0 ? void 0 : (_componentCompare$bas = componentCompare.base) === null || _componentCompare$bas === void 0 ? void 0 : _componentCompare$bas.model.id;
@@ -154,25 +119,19 @@ function DependenciesCompare() {
   });
   (0, _react().useEffect)(() => {
     var _graphRef$current;
-
     (_graphRef$current = graphRef.current) === null || _graphRef$current === void 0 ? void 0 : _graphRef$current.fitView();
   }, [elements]);
-
   function handleLoad(instance) {
     var _graphRef$current2;
-
     graphRef.current = instance;
     (_graphRef$current2 = graphRef.current) === null || _graphRef$current2 === void 0 ? void 0 : _graphRef$current2.fitView();
   }
-
   const onCheckFilter = _isFiltered => {
     setFilter(_isFiltered ? 'runtimeOnly' : undefined);
   };
-
   if (!loading && (!baseGraph || !compareGraph)) {
     return /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null);
   }
-
   return /*#__PURE__*/_react().default.createElement("div", {
     className: (0, _classnames().default)([_dependenciesCompareModule().default.page, _graph().graphPageStyles.graph])
   }, loading && /*#__PURE__*/_react().default.createElement("div", {

package/dist/ui/dependencies-compare/dependencies-compare.js.map

@@ -1 +1 @@
-{"version":3,"names":["ComponentNodeContainer","props","sourcePosition","Position","Top","targetPosition","Bottom","data","id","node","type","NodeTypes","ComponentNode","DependenciesCompare","graphRef","useRef","componentCompare","useComponentCompare","baseId","base","model","compareId","compare","filter","setFilter","useState","isFiltered","loading","baseLoading","graph","baseGraph","useGraphQuery","toString","compareLoading","compareGraph","diffGraph","undefined","elements","calcElements","rootNode","useEffect","current","fitView","handleLoad","instance","onCheckFilter","_isFiltered","classNames","styles","page","graphPageStyles","loader","dependenciesGraphStyles","controls","calcMinimapColors","minimap","filters"],"sources":["dependencies-compare.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useComponentCompare } from '@teambit/component.ui.compare';\nimport { RoundLoader } from '@teambit/design.ui.round-loader';\nimport {\n  calcElements,\n  calcMinimapColors,\n  dependenciesGraphStyles,\n  GraphFilter,\n  GraphFilters,\n  graphPageStyles,\n  useGraphQuery,\n} from '@teambit/graph';\nimport React, { useEffect, useRef, useState } from 'react';\nimport ReactFlow, {\n  Background,\n  Controls,\n  Handle,\n  MiniMap,\n  NodeProps,\n  NodeTypesType,\n  OnLoadParams,\n  Position,\n  ReactFlowProvider,\n} from 'react-flow-renderer';\nimport styles from './dependencies-compare.module.scss';\nimport { DependencyCompareNode } from './dependency-compare-node';\nimport { diffGraph } from './diff-graph';\n\nfunction ComponentNodeContainer(props: NodeProps) {\n  const { sourcePosition = Position.Top, targetPosition = Position.Bottom, data, id } = props;\n\n  return (\n    <div key={id}>\n      <Handle type=\"target\" position={targetPosition} isConnectable={false} />\n      <Handle type=\"source\" position={sourcePosition} isConnectable={false} />\n      <DependencyCompareNode node={data.node} type={data.type} />\n    </div>\n  );\n}\n\nconst NodeTypes: NodeTypesType = { ComponentNode: ComponentNodeContainer };\n\nexport function DependenciesCompare() {\n  const graphRef = useRef<OnLoadParams>();\n  const componentCompare = useComponentCompare();\n\n  const baseId = componentCompare?.base?.model.id;\n  const compareId = componentCompare?.compare?.model.id;\n\n  const [filter, setFilter] = useState<GraphFilter>('runtimeOnly');\n  const isFiltered = filter === 'runtimeOnly';\n  const { loading: baseLoading, graph: baseGraph } = useGraphQuery(baseId && [baseId.toString()], filter);\n  const { loading: compareLoading, graph: compareGraph } = useGraphQuery(compareId && [compareId.toString()], filter);\n  const loading = baseLoading || compareLoading;\n  const graph = diffGraph(baseGraph, compareGraph, baseId) ?? undefined;\n  const elements = calcElements(graph, { rootNode: baseId });\n\n  useEffect(() => {\n    graphRef.current?.fitView();\n  }, [elements]);\n\n  function handleLoad(instance: OnLoadParams) {\n    graphRef.current = instance;\n    graphRef.current?.fitView();\n  }\n\n  const onCheckFilter = (_isFiltered: boolean) => {\n    setFilter(_isFiltered ? 'runtimeOnly' : undefined);\n  };\n\n  if (!loading && (!baseGraph || !compareGraph)) {\n    return <></>;\n  }\n\n  return (\n    <div className={classNames([styles.page, graphPageStyles.graph])}>\n      {loading && (\n        <div className={styles.loader}>\n          <RoundLoader />\n        </div>\n      )}\n      <ReactFlowProvider>\n        <ReactFlow\n          draggable={false}\n          nodesDraggable={true}\n          selectNodesOnDrag={false}\n          nodesConnectable={false}\n          zoomOnDoubleClick={false}\n          elementsSelectable={false}\n          maxZoom={1}\n          className={dependenciesGraphStyles.graph}\n          elements={elements}\n          nodeTypes={NodeTypes}\n          onLoad={handleLoad}\n        >\n          <Background />\n          <Controls className={dependenciesGraphStyles.controls} />\n          <MiniMap nodeColor={calcMinimapColors} className={dependenciesGraphStyles.minimap} />\n          <GraphFilters\n            className={graphPageStyles.filters}\n            disable={loading}\n            isFiltered={isFiltered}\n            onChangeFilter={onCheckFilter}\n          />\n        </ReactFlow>\n      </ReactFlowProvider>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"names":["ComponentNodeContainer","props","sourcePosition","Position","Top","targetPosition","Bottom","data","id","node","type","NodeTypes","ComponentNode","DependenciesCompare","graphRef","useRef","componentCompare","useComponentCompare","baseId","base","model","compareId","compare","filter","setFilter","useState","isFiltered","loading","baseLoading","graph","baseGraph","useGraphQuery","toString","compareLoading","compareGraph","diffGraph","undefined","elements","calcElements","rootNode","useEffect","current","fitView","handleLoad","instance","onCheckFilter","_isFiltered","classNames","styles","page","graphPageStyles","loader","dependenciesGraphStyles","controls","calcMinimapColors","minimap","filters"],"sources":["dependencies-compare.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useComponentCompare } from '@teambit/component.ui.compare';\nimport { RoundLoader } from '@teambit/design.ui.round-loader';\nimport {\n  calcElements,\n  calcMinimapColors,\n  dependenciesGraphStyles,\n  GraphFilter,\n  GraphFilters,\n  graphPageStyles,\n  useGraphQuery,\n} from '@teambit/graph';\nimport React, { useEffect, useRef, useState } from 'react';\nimport ReactFlow, {\n  Background,\n  Controls,\n  Handle,\n  MiniMap,\n  NodeProps,\n  NodeTypesType,\n  OnLoadParams,\n  Position,\n  ReactFlowProvider,\n} from 'react-flow-renderer';\nimport styles from './dependencies-compare.module.scss';\nimport { DependencyCompareNode } from './dependency-compare-node';\nimport { diffGraph } from './diff-graph';\n\nfunction ComponentNodeContainer(props: NodeProps) {\n  const { sourcePosition = Position.Top, targetPosition = Position.Bottom, data, id } = props;\n\n  return (\n    <div key={id}>\n      <Handle type=\"target\" position={targetPosition} isConnectable={false} />\n      <Handle type=\"source\" position={sourcePosition} isConnectable={false} />\n      <DependencyCompareNode node={data.node} type={data.type} />\n    </div>\n  );\n}\n\nconst NodeTypes: NodeTypesType = { ComponentNode: ComponentNodeContainer };\n\nexport function DependenciesCompare() {\n  const graphRef = useRef<OnLoadParams>();\n  const componentCompare = useComponentCompare();\n\n  const baseId = componentCompare?.base?.model.id;\n  const compareId = componentCompare?.compare?.model.id;\n\n  const [filter, setFilter] = useState<GraphFilter>('runtimeOnly');\n  const isFiltered = filter === 'runtimeOnly';\n  const { loading: baseLoading, graph: baseGraph } = useGraphQuery(baseId && [baseId.toString()], filter);\n  const { loading: compareLoading, graph: compareGraph } = useGraphQuery(compareId && [compareId.toString()], filter);\n  const loading = baseLoading || compareLoading;\n  const graph = diffGraph(baseGraph, compareGraph, baseId) ?? undefined;\n  const elements = calcElements(graph, { rootNode: baseId });\n\n  useEffect(() => {\n    graphRef.current?.fitView();\n  }, [elements]);\n\n  function handleLoad(instance: OnLoadParams) {\n    graphRef.current = instance;\n    graphRef.current?.fitView();\n  }\n\n  const onCheckFilter = (_isFiltered: boolean) => {\n    setFilter(_isFiltered ? 'runtimeOnly' : undefined);\n  };\n\n  if (!loading && (!baseGraph || !compareGraph)) {\n    return <></>;\n  }\n\n  return (\n    <div className={classNames([styles.page, graphPageStyles.graph])}>\n      {loading && (\n        <div className={styles.loader}>\n          <RoundLoader />\n        </div>\n      )}\n      <ReactFlowProvider>\n        <ReactFlow\n          draggable={false}\n          nodesDraggable={true}\n          selectNodesOnDrag={false}\n          nodesConnectable={false}\n          zoomOnDoubleClick={false}\n          elementsSelectable={false}\n          maxZoom={1}\n          className={dependenciesGraphStyles.graph}\n          elements={elements}\n          nodeTypes={NodeTypes}\n          onLoad={handleLoad}\n        >\n          <Background />\n          <Controls className={dependenciesGraphStyles.controls} />\n          <MiniMap nodeColor={calcMinimapColors} className={dependenciesGraphStyles.minimap} />\n          <GraphFilters\n            className={graphPageStyles.filters}\n            disable={loading}\n            isFiltered={isFiltered}\n            onChangeFilter={onCheckFilter}\n          />\n        </ReactFlow>\n      </ReactFlowProvider>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AAAA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AACA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AACA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AACA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AASA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AACA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAWA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AACA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AACA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAAyC;AAAA;AAEzC,SAASA,sBAAsB,CAACC,KAAgB,EAAE;EAChD,MAAM;IAAEC,cAAc,GAAGC,6BAAQ,CAACC,GAAG;IAAEC,cAAc,GAAGF,6BAAQ,CAACG,MAAM;IAAEC,IAAI;IAAEC;EAAG,CAAC,GAAGP,KAAK;EAE3F,oBACE;IAAK,GAAG,EAAEO;EAAG,gBACX,+BAAC,2BAAM;IAAC,IAAI,EAAC,QAAQ;IAAC,QAAQ,EAAEH,cAAe;IAAC,aAAa,EAAE;EAAM,EAAG,eACxE,+BAAC,2BAAM;IAAC,IAAI,EAAC,QAAQ;IAAC,QAAQ,EAAEH,cAAe;IAAC,aAAa,EAAE;EAAM,EAAG,eACxE,+BAAC,8CAAqB;IAAC,IAAI,EAAEK,IAAI,CAACE,IAAK;IAAC,IAAI,EAAEF,IAAI,CAACG;EAAK,EAAG,CACvD;AAEV;AAEA,MAAMC,SAAwB,GAAG;EAAEC,aAAa,EAAEZ;AAAuB,CAAC;AAEnE,SAASa,mBAAmB,GAAG;EAAA;EACpC,MAAMC,QAAQ,GAAG,IAAAC,eAAM,GAAgB;EACvC,MAAMC,gBAAgB,GAAG,IAAAC,kCAAmB,GAAE;EAE9C,MAAMC,MAAM,GAAGF,gBAAgB,aAAhBA,gBAAgB,gDAAhBA,gBAAgB,CAAEG,IAAI,0DAAtB,sBAAwBC,KAAK,CAACZ,EAAE;EAC/C,MAAMa,SAAS,GAAGL,gBAAgB,aAAhBA,gBAAgB,gDAAhBA,gBAAgB,CAAEM,OAAO,0DAAzB,sBAA2BF,KAAK,CAACZ,EAAE;EAErD,MAAM,CAACe,MAAM,EAAEC,SAAS,CAAC,GAAG,IAAAC,iBAAQ,EAAc,aAAa,CAAC;EAChE,MAAMC,UAAU,GAAGH,MAAM,KAAK,aAAa;EAC3C,MAAM;IAAEI,OAAO,EAAEC,WAAW;IAAEC,KAAK,EAAEC;EAAU,CAAC,GAAG,IAAAC,sBAAa,EAACb,MAAM,IAAI,CAACA,MAAM,CAACc,QAAQ,EAAE,CAAC,EAAET,MAAM,CAAC;EACvG,MAAM;IAAEI,OAAO,EAAEM,cAAc;IAAEJ,KAAK,EAAEK;EAAa,CAAC,GAAG,IAAAH,sBAAa,EAACV,SAAS,IAAI,CAACA,SAAS,CAACW,QAAQ,EAAE,CAAC,EAAET,MAAM,CAAC;EACnH,MAAMI,OAAO,GAAGC,WAAW,IAAIK,cAAc;EAC7C,MAAMJ,KAAK,iBAAG,IAAAM,uBAAS,EAACL,SAAS,EAAEI,YAAY,EAAEhB,MAAM,CAAC,mDAAIkB,SAAS;EACrE,MAAMC,QAAQ,GAAG,IAAAC,qBAAY,EAACT,KAAK,EAAE;IAAEU,QAAQ,EAAErB;EAAO,CAAC,CAAC;EAE1D,IAAAsB,kBAAS,EAAC,MAAM;IAAA;IACd,qBAAA1B,QAAQ,CAAC2B,OAAO,sDAAhB,kBAAkBC,OAAO,EAAE;EAC7B,CAAC,EAAE,CAACL,QAAQ,CAAC,CAAC;EAEd,SAASM,UAAU,CAACC,QAAsB,EAAE;IAAA;IAC1C9B,QAAQ,CAAC2B,OAAO,GAAGG,QAAQ;IAC3B,sBAAA9B,QAAQ,CAAC2B,OAAO,uDAAhB,mBAAkBC,OAAO,EAAE;EAC7B;EAEA,MAAMG,aAAa,GAAIC,WAAoB,IAAK;IAC9CtB,SAAS,CAACsB,WAAW,GAAG,aAAa,GAAGV,SAAS,CAAC;EACpD,CAAC;EAED,IAAI,CAACT,OAAO,KAAK,CAACG,SAAS,IAAI,CAACI,YAAY,CAAC,EAAE;IAC7C,oBAAO,+DAAK;EACd;EAEA,oBACE;IAAK,SAAS,EAAE,IAAAa,qBAAU,EAAC,CAACC,oCAAM,CAACC,IAAI,EAAEC,wBAAe,CAACrB,KAAK,CAAC;EAAE,GAC9DF,OAAO,iBACN;IAAK,SAAS,EAAEqB,oCAAM,CAACG;EAAO,gBAC5B,+BAAC,uBAAW,OAAG,CAElB,eACD,+BAAC,sCAAiB,qBAChB,+BAAC,4BAAS;IACR,SAAS,EAAE,KAAM;IACjB,cAAc,EAAE,IAAK;IACrB,iBAAiB,EAAE,KAAM;IACzB,gBAAgB,EAAE,KAAM;IACxB,iBAAiB,EAAE,KAAM;IACzB,kBAAkB,EAAE,KAAM;IAC1B,OAAO,EAAE,CAAE;IACX,SAAS,EAAEC,gCAAuB,CAACvB,KAAM;IACzC,QAAQ,EAAEQ,QAAS;IACnB,SAAS,EAAE1B,SAAU;IACrB,MAAM,EAAEgC;EAAW,gBAEnB,+BAAC,+BAAU,OAAG,eACd,+BAAC,6BAAQ;IAAC,SAAS,EAAES,gCAAuB,CAACC;EAAS,EAAG,eACzD,+BAAC,4BAAO;IAAC,SAAS,EAAEC,0BAAkB;IAAC,SAAS,EAAEF,gCAAuB,CAACG;EAAQ,EAAG,eACrF,+BAAC,qBAAY;IACX,SAAS,EAAEL,wBAAe,CAACM,OAAQ;IACnC,OAAO,EAAE7B,OAAQ;IACjB,UAAU,EAAED,UAAW;IACvB,cAAc,EAAEmB;EAAc,EAC9B,CACQ,CACM,CAChB;AAEV"}