@backstage/plugin-catalog-graph 0.2.24-next.0 → 0.2.24-next.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/esm/{index-ce1d8556.esm.js → index-3b0f9dff.esm.js} +30 -23
  3. package/dist/esm/{index-ce1d8556.esm.js.map → index-3b0f9dff.esm.js.map} +1 -1
  4. package/dist/esm/{index-cb0bde74.esm.js → index-3f9f92d1.esm.js} +207 -216
  5. package/dist/esm/{index-cb0bde74.esm.js.map → index-3f9f92d1.esm.js.map} +1 -1
  6. package/dist/index.esm.js +65 -67
  7. package/dist/index.esm.js.map +1 -1
  8. package/package.json +12 -12
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @backstage/plugin-catalog-graph
2
2
 
3
+ ## 0.2.24-next.1
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+ - @backstage/core-components@0.12.1-next.1
9
+ - @backstage/core-plugin-api@1.1.1-next.1
10
+ - @backstage/plugin-catalog-react@1.2.2-next.1
11
+ - @backstage/catalog-client@1.2.0-next.1
12
+ - @backstage/catalog-model@1.1.4-next.1
13
+ - @backstage/theme@0.2.16
14
+
3
15
  ## 0.2.24-next.0
4
16
 
5
17
  ### Patch Changes
package/dist/esm/{index-ce1d8556.esm.js → index-3b0f9dff.esm.js} RENAMED
@@ -82,29 +82,36 @@ const CatalogGraphCard = (props) => {
82
82
  { arrayFormat: "brackets", addQueryPrefix: true }
83
83
  );
84
84
  const catalogGraphUrl = `${catalogGraphRoute()}${catalogGraphParams}`;
85
- return /* @__PURE__ */ React.createElement(InfoCard, {
86
- title,
87
- cardClassName: classes.card,
88
- variant,
89
- noPadding: true,
90
- deepLink: {
91
- title: "View graph",
92
- link: catalogGraphUrl
93
- }
94
- }, /* @__PURE__ */ React.createElement(EntityRelationsGraph, {
95
- rootEntityNames: entityName,
96
- maxDepth,
97
- unidirectional,
98
- mergeRelations,
99
- kinds,
100
- relations,
101
- direction,
102
- onNodeClick,
103
- className: classes.graph,
104
- relationPairs,
105
- zoom
106
- }));
85
+ return /* @__PURE__ */ React.createElement(
86
+ InfoCard,
87
+ {
88
+ title,
89
+ cardClassName: classes.card,
90
+ variant,
91
+ noPadding: true,
92
+ deepLink: {
93
+ title: "View graph",
94
+ link: catalogGraphUrl
95
+ }
96
+ },
97
+ /* @__PURE__ */ React.createElement(
98
+ EntityRelationsGraph,
99
+ {
100
+ rootEntityNames: entityName,
101
+ maxDepth,
102
+ unidirectional,
103
+ mergeRelations,
104
+ kinds,
105
+ relations,
106
+ direction,
107
+ onNodeClick,
108
+ className: classes.graph,
109
+ relationPairs,
110
+ zoom
111
+ }
112
+ )
113
+ );
107
114
  };
108
115
 
109
116
  export { CatalogGraphCard };
110
- //# sourceMappingURL=index-ce1d8556.esm.js.map
117
+ //# sourceMappingURL=index-3b0f9dff.esm.js.map
package/dist/esm/{index-ce1d8556.esm.js.map → index-3b0f9dff.esm.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"index-ce1d8556.esm.js","sources":["../../src/components/CatalogGraphCard/CatalogGraphCard.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 {\n getCompoundEntityRef,\n parseEntityRef,\n stringifyEntityRef,\n} from '@backstage/catalog-model';\nimport { InfoCard, InfoCardVariants } from '@backstage/core-components';\nimport { useAnalytics, useRouteRef } from '@backstage/core-plugin-api';\nimport {\n humanizeEntityRef,\n useEntity,\n entityRouteRef,\n} from '@backstage/plugin-catalog-react';\nimport { makeStyles, Theme } from '@material-ui/core';\nimport qs from 'qs';\nimport React, { MouseEvent, useCallback } from 'react';\nimport { useNavigate } from 'react-router';\nimport { catalogGraphRouteRef } from '../../routes';\nimport {\n ALL_RELATION_PAIRS,\n Direction,\n EntityNode,\n EntityRelationsGraph,\n RelationPairs,\n} from '../EntityRelationsGraph';\n\nconst useStyles = makeStyles<Theme, { height: number | undefined }>(\n {\n card: ({ height }) => ({\n display: 'flex',\n flexDirection: 'column',\n maxHeight: height,\n minHeight: height,\n }),\n graph: {\n flex: 1,\n minHeight: 0,\n },\n },\n { name: 'PluginCatalogGraphCatalogGraphCard' },\n);\n\nexport const CatalogGraphCard = (props: {\n variant?: InfoCardVariants;\n relationPairs?: RelationPairs;\n maxDepth?: number;\n unidirectional?: boolean;\n mergeRelations?: boolean;\n kinds?: string[];\n relations?: string[];\n direction?: Direction;\n height?: number;\n title?: string;\n zoom?: 'enabled' | 'disabled' | 'enable-on-click';\n}) => {\n const {\n variant = 'gridItem',\n relationPairs = ALL_RELATION_PAIRS,\n maxDepth = 1,\n unidirectional = true,\n mergeRelations = true,\n kinds,\n relations,\n direction = Direction.LEFT_RIGHT,\n height,\n title = 'Relations',\n zoom = 'enable-on-click',\n } = props;\n\n const { entity } = useEntity();\n const entityName = getCompoundEntityRef(entity);\n const catalogEntityRoute = useRouteRef(entityRouteRef);\n const catalogGraphRoute = useRouteRef(catalogGraphRouteRef);\n const navigate = useNavigate();\n const classes = useStyles({ height });\n const analytics = useAnalytics();\n\n const onNodeClick = useCallback(\n (node: EntityNode, _: MouseEvent<unknown>) => {\n const nodeEntityName = parseEntityRef(node.id);\n const path = catalogEntityRoute({\n kind: nodeEntityName.kind.toLocaleLowerCase('en-US'),\n namespace: nodeEntityName.namespace.toLocaleLowerCase('en-US'),\n name: nodeEntityName.name,\n });\n analytics.captureEvent(\n 'click',\n node.title ?? humanizeEntityRef(nodeEntityName),\n { attributes: { to: path } },\n );\n navigate(path);\n },\n [catalogEntityRoute, navigate, analytics],\n );\n\n const catalogGraphParams = qs.stringify(\n {\n rootEntityRefs: [stringifyEntityRef(entity)],\n maxDepth: maxDepth + 1,\n unidirectional,\n mergeRelations,\n kinds,\n relations,\n direction,\n },\n { arrayFormat: 'brackets', addQueryPrefix: true },\n );\n const catalogGraphUrl = `${catalogGraphRoute()}${catalogGraphParams}`;\n\n return (\n <InfoCard\n title={title}\n cardClassName={classes.card}\n variant={variant}\n noPadding\n deepLink={{\n title: 'View graph',\n link: catalogGraphUrl,\n }}\n >\n <EntityRelationsGraph\n rootEntityNames={entityName}\n maxDepth={maxDepth}\n unidirectional={unidirectional}\n mergeRelations={mergeRelations}\n kinds={kinds}\n relations={relations}\n direction={direction}\n onNodeClick={onNodeClick}\n className={classes.graph}\n relationPairs={relationPairs}\n zoom={zoom}\n />\n </InfoCard>\n );\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index-3b0f9dff.esm.js","sources":["../../src/components/CatalogGraphCard/CatalogGraphCard.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 {\n getCompoundEntityRef,\n parseEntityRef,\n stringifyEntityRef,\n} from '@backstage/catalog-model';\nimport { InfoCard, InfoCardVariants } from '@backstage/core-components';\nimport { useAnalytics, useRouteRef } from '@backstage/core-plugin-api';\nimport {\n humanizeEntityRef,\n useEntity,\n entityRouteRef,\n} from '@backstage/plugin-catalog-react';\nimport { makeStyles, Theme } from '@material-ui/core';\nimport qs from 'qs';\nimport React, { MouseEvent, useCallback } from 'react';\nimport { useNavigate } from 'react-router';\nimport { catalogGraphRouteRef } from '../../routes';\nimport {\n ALL_RELATION_PAIRS,\n Direction,\n EntityNode,\n EntityRelationsGraph,\n RelationPairs,\n} from '../EntityRelationsGraph';\n\nconst useStyles = makeStyles<Theme, { height: number | undefined }>(\n {\n card: ({ height }) => ({\n display: 'flex',\n flexDirection: 'column',\n maxHeight: height,\n minHeight: height,\n }),\n graph: {\n flex: 1,\n minHeight: 0,\n },\n },\n { name: 'PluginCatalogGraphCatalogGraphCard' },\n);\n\nexport const CatalogGraphCard = (props: {\n variant?: InfoCardVariants;\n relationPairs?: RelationPairs;\n maxDepth?: number;\n unidirectional?: boolean;\n mergeRelations?: boolean;\n kinds?: string[];\n relations?: string[];\n direction?: Direction;\n height?: number;\n title?: string;\n zoom?: 'enabled' | 'disabled' | 'enable-on-click';\n}) => {\n const {\n variant = 'gridItem',\n relationPairs = ALL_RELATION_PAIRS,\n maxDepth = 1,\n unidirectional = true,\n mergeRelations = true,\n kinds,\n relations,\n direction = Direction.LEFT_RIGHT,\n height,\n title = 'Relations',\n zoom = 'enable-on-click',\n } = props;\n\n const { entity } = useEntity();\n const entityName = getCompoundEntityRef(entity);\n const catalogEntityRoute = useRouteRef(entityRouteRef);\n const catalogGraphRoute = useRouteRef(catalogGraphRouteRef);\n const navigate = useNavigate();\n const classes = useStyles({ height });\n const analytics = useAnalytics();\n\n const onNodeClick = useCallback(\n (node: EntityNode, _: MouseEvent<unknown>) => {\n const nodeEntityName = parseEntityRef(node.id);\n const path = catalogEntityRoute({\n kind: nodeEntityName.kind.toLocaleLowerCase('en-US'),\n namespace: nodeEntityName.namespace.toLocaleLowerCase('en-US'),\n name: nodeEntityName.name,\n });\n analytics.captureEvent(\n 'click',\n node.title ?? humanizeEntityRef(nodeEntityName),\n { attributes: { to: path } },\n );\n navigate(path);\n },\n [catalogEntityRoute, navigate, analytics],\n );\n\n const catalogGraphParams = qs.stringify(\n {\n rootEntityRefs: [stringifyEntityRef(entity)],\n maxDepth: maxDepth + 1,\n unidirectional,\n mergeRelations,\n kinds,\n relations,\n direction,\n },\n { arrayFormat: 'brackets', addQueryPrefix: true },\n );\n const catalogGraphUrl = `${catalogGraphRoute()}${catalogGraphParams}`;\n\n return (\n <InfoCard\n title={title}\n cardClassName={classes.card}\n variant={variant}\n noPadding\n deepLink={{\n title: 'View graph',\n link: catalogGraphUrl,\n }}\n >\n <EntityRelationsGraph\n rootEntityNames={entityName}\n maxDepth={maxDepth}\n unidirectional={unidirectional}\n mergeRelations={mergeRelations}\n kinds={kinds}\n relations={relations}\n direction={direction}\n onNodeClick={onNodeClick}\n className={classes.graph}\n relationPairs={relationPairs}\n zoom={zoom}\n />\n </InfoCard>\n );\n};\n"],"names":[],"mappings":"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"}
package/dist/esm/{index-cb0bde74.esm.js → index-3f9f92d1.esm.js} RENAMED
@@ -31,18 +31,18 @@ const CURVE_DISPLAY_NAMES = {
31
31
  const curves = ["curveMonotoneX", "curveStepBefore"];
32
32
  const CurveFilter = ({ value, onChange }) => {
33
33
  const handleChange = useCallback((v) => onChange(v), [onChange]);
34
- return /* @__PURE__ */ React.createElement(Box, {
35
- pb: 1,
36
- pt: 1
37
- }, /* @__PURE__ */ React.createElement(Select, {
38
- label: "Curve",
39
- selected: value,
40
- items: curves.map((v) => ({
41
- label: CURVE_DISPLAY_NAMES[v],
42
- value: v
43
- })),
44
- onChange: handleChange
45
- }));
34
+ return /* @__PURE__ */ React.createElement(Box, { pb: 1, pt: 1 }, /* @__PURE__ */ React.createElement(
35
+ Select,
36
+ {
37
+ label: "Curve",
38
+ selected: value,
39
+ items: curves.map((v) => ({
40
+ label: CURVE_DISPLAY_NAMES[v],
41
+ value: v
42
+ })),
43
+ onChange: handleChange
44
+ }
45
+ ));
46
46
  };
47
47
 
48
48
  const DIRECTION_DISPLAY_NAMES = {
@@ -53,18 +53,18 @@ const DIRECTION_DISPLAY_NAMES = {
53
53
  };
54
54
  const DirectionFilter = ({ value, onChange }) => {
55
55
  const handleChange = useCallback((v) => onChange(v), [onChange]);
56
- return /* @__PURE__ */ React.createElement(Box, {
57
- pb: 1,
58
- pt: 1
59
- }, /* @__PURE__ */ React.createElement(Select, {
60
- label: "Direction",
61
- selected: value,
62
- items: Object.values(Direction).map((v) => ({
63
- label: DIRECTION_DISPLAY_NAMES[v],
64
- value: v
65
- })),
66
- onChange: handleChange
67
- }));
56
+ return /* @__PURE__ */ React.createElement(Box, { pb: 1, pt: 1 }, /* @__PURE__ */ React.createElement(
57
+ Select,
58
+ {
59
+ label: "Direction",
60
+ selected: value,
61
+ items: Object.values(Direction).map((v) => ({
62
+ label: DIRECTION_DISPLAY_NAMES[v],
63
+ value: v
64
+ })),
65
+ onChange: handleChange
66
+ }
67
+ ));
68
68
  };
69
69
 
70
70
  const useStyles$4 = makeStyles(
@@ -99,31 +99,28 @@ const MaxDepthFilter = ({ value, onChange }) => {
99
99
  setCurrentValue(Number.POSITIVE_INFINITY);
100
100
  onChangeRef.current(Number.POSITIVE_INFINITY);
101
101
  }, [onChangeRef]);
102
- return /* @__PURE__ */ React.createElement(Box, {
103
- pb: 1,
104
- pt: 1
105
- }, /* @__PURE__ */ React.createElement(FormControl, {
106
- variant: "outlined",
107
- className: classes.formControl
108
- }, /* @__PURE__ */ React.createElement(Typography, {
109
- variant: "button"
110
- }, "Max Depth"), /* @__PURE__ */ React.createElement(OutlinedInput, {
111
- type: "number",
112
- placeholder: "\u221E Infinite",
113
- value: Number.isFinite(currentValue) ? String(currentValue) : "",
114
- onChange: handleChange,
115
- endAdornment: /* @__PURE__ */ React.createElement(InputAdornment, {
116
- position: "end"
117
- }, /* @__PURE__ */ React.createElement(IconButton, {
118
- "aria-label": "clear max depth",
119
- onClick: reset,
120
- edge: "end"
121
- }, /* @__PURE__ */ React.createElement(ClearIcon, null))),
122
- inputProps: {
123
- "aria-label": "maxp"
124
- },
125
- labelWidth: 0
126
- })));
102
+ return /* @__PURE__ */ React.createElement(Box, { pb: 1, pt: 1 }, /* @__PURE__ */ React.createElement(FormControl, { variant: "outlined", className: classes.formControl }, /* @__PURE__ */ React.createElement(Typography, { variant: "button" }, "Max Depth"), /* @__PURE__ */ React.createElement(
103
+ OutlinedInput,
104
+ {
105
+ type: "number",
106
+ placeholder: "\u221E Infinite",
107
+ value: Number.isFinite(currentValue) ? String(currentValue) : "",
108
+ onChange: handleChange,
109
+ endAdornment: /* @__PURE__ */ React.createElement(InputAdornment, { position: "end" }, /* @__PURE__ */ React.createElement(
110
+ IconButton,
111
+ {
112
+ "aria-label": "clear max depth",
113
+ onClick: reset,
114
+ edge: "end"
115
+ },
116
+ /* @__PURE__ */ React.createElement(ClearIcon, null)
117
+ )),
118
+ inputProps: {
119
+ "aria-label": "maxp"
120
+ },
121
+ labelWidth: 0
122
+ }
123
+ )));
127
124
  };
128
125
 
129
126
  const useStyles$3 = makeStyles(
@@ -170,49 +167,44 @@ const SelectedKindsFilter = ({ value, onChange }) => {
170
167
  if (!(kinds == null ? void 0 : kinds.length) || !(normalizedKinds == null ? void 0 : normalizedKinds.length) || error) {
171
168
  return /* @__PURE__ */ React.createElement(React.Fragment, null);
172
169
  }
173
- return /* @__PURE__ */ React.createElement(Box, {
174
- pb: 1,
175
- pt: 1
176
- }, /* @__PURE__ */ React.createElement(Typography, {
177
- variant: "button"
178
- }, "Kinds"), /* @__PURE__ */ React.createElement(Autocomplete, {
179
- className: classes.formControl,
180
- multiple: true,
181
- limitTags: 4,
182
- disableCloseOnSelect: true,
183
- "aria-label": "Kinds",
184
- options: normalizedKinds,
185
- value: value != null ? value : normalizedKinds,
186
- getOptionLabel: (k) => {
187
- var _a;
188
- return (_a = kinds[normalizedKinds.indexOf(k)]) != null ? _a : k;
189
- },
190
- onChange: handleChange,
191
- onBlur: handleEmpty,
192
- renderOption: (option, { selected }) => {
193
- var _a;
194
- return /* @__PURE__ */ React.createElement(FormControlLabel, {
195
- control: /* @__PURE__ */ React.createElement(Checkbox, {
196
- icon: /* @__PURE__ */ React.createElement(CheckBoxOutlineBlankIcon, {
197
- fontSize: "small"
198
- }),
199
- checkedIcon: /* @__PURE__ */ React.createElement(CheckBoxIcon, {
200
- fontSize: "small"
201
- }),
202
- checked: selected
203
- }),
204
- label: (_a = kinds[normalizedKinds.indexOf(option)]) != null ? _a : option
205
- });
206
- },
207
- size: "small",
208
- popupIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, {
209
- "data-testid": "selected-kinds-expand"
210
- }),
211
- renderInput: (params) => /* @__PURE__ */ React.createElement(TextField, {
212
- ...params,
213
- variant: "outlined"
214
- })
215
- }));
170
+ return /* @__PURE__ */ React.createElement(Box, { pb: 1, pt: 1 }, /* @__PURE__ */ React.createElement(Typography, { variant: "button" }, "Kinds"), /* @__PURE__ */ React.createElement(
171
+ Autocomplete,
172
+ {
173
+ className: classes.formControl,
174
+ multiple: true,
175
+ limitTags: 4,
176
+ disableCloseOnSelect: true,
177
+ "aria-label": "Kinds",
178
+ options: normalizedKinds,
179
+ value: value != null ? value : normalizedKinds,
180
+ getOptionLabel: (k) => {
181
+ var _a;
182
+ return (_a = kinds[normalizedKinds.indexOf(k)]) != null ? _a : k;
183
+ },
184
+ onChange: handleChange,
185
+ onBlur: handleEmpty,
186
+ renderOption: (option, { selected }) => {
187
+ var _a;
188
+ return /* @__PURE__ */ React.createElement(
189
+ FormControlLabel,
190
+ {
191
+ control: /* @__PURE__ */ React.createElement(
192
+ Checkbox,
193
+ {
194
+ icon: /* @__PURE__ */ React.createElement(CheckBoxOutlineBlankIcon, { fontSize: "small" }),
195
+ checkedIcon: /* @__PURE__ */ React.createElement(CheckBoxIcon, { fontSize: "small" }),
196
+ checked: selected
197
+ }
198
+ ),
199
+ label: (_a = kinds[normalizedKinds.indexOf(option)]) != null ? _a : option
200
+ }
201
+ );
202
+ },
203
+ size: "small",
204
+ popupIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, { "data-testid": "selected-kinds-expand" }),
205
+ renderInput: (params) => /* @__PURE__ */ React.createElement(TextField, { ...params, variant: "outlined" })
206
+ }
207
+ ));
216
208
  };
217
209
 
218
210
  const useStyles$2 = makeStyles(
@@ -239,42 +231,37 @@ const SelectedRelationsFilter = ({
239
231
  const handleEmpty = useCallback(() => {
240
232
  onChange((value == null ? void 0 : value.length) ? value : void 0);
241
233
  }, [value, onChange]);
242
- return /* @__PURE__ */ React.createElement(Box, {
243
- pb: 1,
244
- pt: 1
245
- }, /* @__PURE__ */ React.createElement(Typography, {
246
- variant: "button"
247
- }, "Relations"), /* @__PURE__ */ React.createElement(Autocomplete, {
248
- className: classes.formControl,
249
- multiple: true,
250
- limitTags: 4,
251
- disableCloseOnSelect: true,
252
- "aria-label": "Relations",
253
- options: relations,
254
- value: value != null ? value : relations,
255
- onChange: handleChange,
256
- onBlur: handleEmpty,
257
- renderOption: (option, { selected }) => /* @__PURE__ */ React.createElement(FormControlLabel, {
258
- control: /* @__PURE__ */ React.createElement(Checkbox, {
259
- icon: /* @__PURE__ */ React.createElement(CheckBoxOutlineBlankIcon, {
260
- fontSize: "small"
261
- }),
262
- checkedIcon: /* @__PURE__ */ React.createElement(CheckBoxIcon, {
263
- fontSize: "small"
264
- }),
265
- checked: selected
266
- }),
267
- label: option
268
- }),
269
- size: "small",
270
- popupIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, {
271
- "data-testid": "selected-relations-expand"
272
- }),
273
- renderInput: (params) => /* @__PURE__ */ React.createElement(TextField, {
274
- ...params,
275
- variant: "outlined"
276
- })
277
- }));
234
+ return /* @__PURE__ */ React.createElement(Box, { pb: 1, pt: 1 }, /* @__PURE__ */ React.createElement(Typography, { variant: "button" }, "Relations"), /* @__PURE__ */ React.createElement(
235
+ Autocomplete,
236
+ {
237
+ className: classes.formControl,
238
+ multiple: true,
239
+ limitTags: 4,
240
+ disableCloseOnSelect: true,
241
+ "aria-label": "Relations",
242
+ options: relations,
243
+ value: value != null ? value : relations,
244
+ onChange: handleChange,
245
+ onBlur: handleEmpty,
246
+ renderOption: (option, { selected }) => /* @__PURE__ */ React.createElement(
247
+ FormControlLabel,
248
+ {
249
+ control: /* @__PURE__ */ React.createElement(
250
+ Checkbox,
251
+ {
252
+ icon: /* @__PURE__ */ React.createElement(CheckBoxOutlineBlankIcon, { fontSize: "small" }),
253
+ checkedIcon: /* @__PURE__ */ React.createElement(CheckBoxIcon, { fontSize: "small" }),
254
+ checked: selected
255
+ }
256
+ ),
257
+ label: option
258
+ }
259
+ ),
260
+ size: "small",
261
+ popupIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, { "data-testid": "selected-relations-expand" }),
262
+ renderInput: (params) => /* @__PURE__ */ React.createElement(TextField, { ...params, variant: "outlined" })
263
+ }
264
+ ));
278
265
  };
279
266
 
280
267
  const useStyles$1 = makeStyles(
@@ -294,19 +281,22 @@ const SwitchFilter = ({ label, value, onChange }) => {
294
281
  },
295
282
  [onChange]
296
283
  );
297
- return /* @__PURE__ */ React.createElement(Box, {
298
- pb: 1,
299
- pt: 1
300
- }, /* @__PURE__ */ React.createElement(FormControlLabel, {
301
- control: /* @__PURE__ */ React.createElement(Switch, {
302
- checked: value,
303
- onChange: handleChange,
304
- name: label,
305
- color: "primary"
306
- }),
307
- label,
308
- className: classes.root
309
- }));
284
+ return /* @__PURE__ */ React.createElement(Box, { pb: 1, pt: 1 }, /* @__PURE__ */ React.createElement(
285
+ FormControlLabel,
286
+ {
287
+ control: /* @__PURE__ */ React.createElement(
288
+ Switch,
289
+ {
290
+ checked: value,
291
+ onChange: handleChange,
292
+ name: label,
293
+ color: "primary"
294
+ }
295
+ ),
296
+ label,
297
+ className: classes.root
298
+ }
299
+ ));
310
300
  };
311
301
 
312
302
  function useCatalogGraphPage({
@@ -580,81 +570,82 @@ const CatalogGraphPage = (props) => {
580
570
  },
581
571
  [catalogEntityRoute, navigate, setRootEntityNames, analytics]
582
572
  );
583
- return /* @__PURE__ */ React.createElement(Page, {
584
- themeId: "home"
585
- }, /* @__PURE__ */ React.createElement(Header, {
586
- title: "Catalog Graph",
587
- subtitle: rootEntityNames.map((e) => humanizeEntityRef(e)).join(", ")
588
- }), /* @__PURE__ */ React.createElement(Content, {
589
- stretch: true,
590
- className: classes.content
591
- }, /* @__PURE__ */ React.createElement(ContentHeader, {
592
- titleComponent: /* @__PURE__ */ React.createElement(ToggleButton, {
593
- value: "show filters",
594
- selected: showFilters,
595
- onChange: () => toggleShowFilters()
596
- }, /* @__PURE__ */ React.createElement(FilterListIcon, null), " Filters")
597
- }, /* @__PURE__ */ React.createElement(SupportButton, null, "Start tracking your component in by adding it to the software catalog.")), /* @__PURE__ */ React.createElement(Grid, {
598
- container: true,
599
- alignItems: "stretch",
600
- className: classes.container
601
- }, showFilters && /* @__PURE__ */ React.createElement(Grid, {
602
- item: true,
603
- xs: 12,
604
- lg: 2,
605
- className: classes.filters
606
- }, /* @__PURE__ */ React.createElement(MaxDepthFilter, {
607
- value: maxDepth,
608
- onChange: setMaxDepth
609
- }), /* @__PURE__ */ React.createElement(SelectedKindsFilter, {
610
- value: selectedKinds,
611
- onChange: setSelectedKinds
612
- }), /* @__PURE__ */ React.createElement(SelectedRelationsFilter, {
613
- value: selectedRelations,
614
- onChange: setSelectedRelations,
615
- relationPairs
616
- }), /* @__PURE__ */ React.createElement(DirectionFilter, {
617
- value: direction,
618
- onChange: setDirection
619
- }), /* @__PURE__ */ React.createElement(CurveFilter, {
620
- value: curve,
621
- onChange: setCurve
622
- }), /* @__PURE__ */ React.createElement(SwitchFilter, {
623
- value: unidirectional,
624
- onChange: setUnidirectional,
625
- label: "Simplified"
626
- }), /* @__PURE__ */ React.createElement(SwitchFilter, {
627
- value: mergeRelations,
628
- onChange: setMergeRelations,
629
- label: "Merge Relations"
630
- })), /* @__PURE__ */ React.createElement(Grid, {
631
- item: true,
632
- xs: true,
633
- className: classes.fullHeight
634
- }, /* @__PURE__ */ React.createElement(Paper, {
635
- className: classes.graphWrapper
636
- }, /* @__PURE__ */ React.createElement(Typography, {
637
- variant: "caption",
638
- color: "textSecondary",
639
- display: "block",
640
- className: classes.legend
641
- }, /* @__PURE__ */ React.createElement(ZoomOutMap, {
642
- className: "icon"
643
- }), " Use pinch & zoom to move around the diagram. Click to change active node, shift click to navigate to entity."), /* @__PURE__ */ React.createElement(EntityRelationsGraph, {
644
- rootEntityNames,
645
- maxDepth,
646
- kinds: selectedKinds && selectedKinds.length > 0 ? selectedKinds : void 0,
647
- relations: selectedRelations && selectedRelations.length > 0 ? selectedRelations : void 0,
648
- mergeRelations,
649
- unidirectional,
650
- onNodeClick,
651
- direction,
652
- relationPairs,
653
- className: classes.graph,
654
- zoom: "enabled",
655
- curve
656
- }))))));
573
+ return /* @__PURE__ */ React.createElement(Page, { themeId: "home" }, /* @__PURE__ */ React.createElement(
574
+ Header,
575
+ {
576
+ title: "Catalog Graph",
577
+ subtitle: rootEntityNames.map((e) => humanizeEntityRef(e)).join(", ")
578
+ }
579
+ ), /* @__PURE__ */ React.createElement(Content, { stretch: true, className: classes.content }, /* @__PURE__ */ React.createElement(
580
+ ContentHeader,
581
+ {
582
+ titleComponent: /* @__PURE__ */ React.createElement(
583
+ ToggleButton,
584
+ {
585
+ value: "show filters",
586
+ selected: showFilters,
587
+ onChange: () => toggleShowFilters()
588
+ },
589
+ /* @__PURE__ */ React.createElement(FilterListIcon, null),
590
+ " Filters"
591
+ )
592
+ },
593
+ /* @__PURE__ */ React.createElement(SupportButton, null, "Start tracking your component in by adding it to the software catalog.")
594
+ ), /* @__PURE__ */ React.createElement(Grid, { container: true, alignItems: "stretch", className: classes.container }, showFilters && /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, lg: 2, className: classes.filters }, /* @__PURE__ */ React.createElement(MaxDepthFilter, { value: maxDepth, onChange: setMaxDepth }), /* @__PURE__ */ React.createElement(
595
+ SelectedKindsFilter,
596
+ {
597
+ value: selectedKinds,
598
+ onChange: setSelectedKinds
599
+ }
600
+ ), /* @__PURE__ */ React.createElement(
601
+ SelectedRelationsFilter,
602
+ {
603
+ value: selectedRelations,
604
+ onChange: setSelectedRelations,
605
+ relationPairs
606
+ }
607
+ ), /* @__PURE__ */ React.createElement(DirectionFilter, { value: direction, onChange: setDirection }), /* @__PURE__ */ React.createElement(CurveFilter, { value: curve, onChange: setCurve }), /* @__PURE__ */ React.createElement(
608
+ SwitchFilter,
609
+ {
610
+ value: unidirectional,
611
+ onChange: setUnidirectional,
612
+ label: "Simplified"
613
+ }
614
+ ), /* @__PURE__ */ React.createElement(
615
+ SwitchFilter,
616
+ {
617
+ value: mergeRelations,
618
+ onChange: setMergeRelations,
619
+ label: "Merge Relations"
620
+ }
621
+ )), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: true, className: classes.fullHeight }, /* @__PURE__ */ React.createElement(Paper, { className: classes.graphWrapper }, /* @__PURE__ */ React.createElement(
622
+ Typography,
623
+ {
624
+ variant: "caption",
625
+ color: "textSecondary",
626
+ display: "block",
627
+ className: classes.legend
628
+ },
629
+ /* @__PURE__ */ React.createElement(ZoomOutMap, { className: "icon" }),
630
+ " Use pinch & zoom to move around the diagram. Click to change active node, shift click to navigate to entity."
631
+ ), /* @__PURE__ */ React.createElement(
632
+ EntityRelationsGraph,
633
+ {
634
+ rootEntityNames,
635
+ maxDepth,
636
+ kinds: selectedKinds && selectedKinds.length > 0 ? selectedKinds : void 0,
637
+ relations: selectedRelations && selectedRelations.length > 0 ? selectedRelations : void 0,
638
+ mergeRelations,
639
+ unidirectional,
640
+ onNodeClick,
641
+ direction,
642
+ relationPairs,
643
+ className: classes.graph,
644
+ zoom: "enabled",
645
+ curve
646
+ }
647
+ ))))));
657
648
  };
658
649
 
659
650
  export { CatalogGraphPage };
660
- //# sourceMappingURL=index-cb0bde74.esm.js.map
651
+ //# sourceMappingURL=index-3f9f92d1.esm.js.map