npm - @backstage/plugin-app-visualizer - Versions diffs - 0.1.6 → 0.1.7-next.1 - Mend

@backstage/plugin-app-visualizer 0.1.6 → 0.1.7-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

package/CHANGELOG.md CHANGED Viewed

@@ -1,5 +1,23 @@
 # @backstage/plugin-app-visualizer
+## 0.1.7-next.1
+### Patch Changes
+- Updated dependencies
+  - @backstage/core-components@0.14.8-next.1
+  - @backstage/core-plugin-api@1.9.3-next.0
+  - @backstage/frontend-plugin-api@0.6.6-next.1
+## 0.1.7-next.0
+### Patch Changes
+- Updated dependencies
+  - @backstage/core-components@0.14.8-next.0
+  - @backstage/core-plugin-api@1.9.2
+  - @backstage/frontend-plugin-api@0.6.6-next.0
 ## 0.1.6
 ### Patch Changes

package/dist/components/AppVisualizerPage/AppVisualizerPage.esm.js CHANGED Viewed

@@ -9,7 +9,6 @@ import { TreeVisualizer } from './TreeVisualizer.esm.js';
 import { useLocation, useRoutes, useParams, matchRoutes, useNavigate } from 'react-router-dom';
 function AppVisualizerPage() {
-  var _a;
   const appTreeApi = useApi(appTreeApiRef);
   const { tree } = appTreeApi.getTree();
   const tabs = useMemo(
@@ -38,7 +37,7 @@ function AppVisualizerPage() {
   const location = useLocation();
   const element = useRoutes(tabs, location);
   const currentPath = `/${useParams()["*"]}`;
-  const [matchedRoute] = (_a = matchRoutes(tabs, currentPath)) != null ? _a : [];
+  const [matchedRoute] = matchRoutes(tabs, currentPath) ?? [];
   const currentTabIndex = matchedRoute ? tabs.findIndex((t) => t.path === matchedRoute.route.path) : 0;
   const navigate = useNavigate();
   const handleTabChange = useCallback(

package/dist/components/AppVisualizerPage/AppVisualizerPage.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppVisualizerPage.esm.js","sources":["../../../src/components/AppVisualizerPage/AppVisualizerPage.tsx"],"sourcesContent":["/\n Copyright 2023 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 { Content, Header, HeaderTabs, Page } from '@backstage/core-components';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { appTreeApiRef } from '@backstage/frontend-plugin-api';\nimport Box from '@material-ui/core/Box';\nimport React, { useCallback, useEffect, useMemo } from 'react';\nimport { DetailedVisualizer } from './DetailedVisualizer';\nimport { TextVisualizer } from './TextVisualizer';\nimport { TreeVisualizer } from './TreeVisualizer';\nimport {\n matchRoutes,\n useLocation,\n useNavigate,\n useParams,\n useRoutes,\n} from 'react-router-dom';\n\nexport function AppVisualizerPage() {\n const appTreeApi = useApi(appTreeApiRef);\n const { tree } = appTreeApi.getTree();\n\n const tabs = useMemo(\n () => [\n {\n id: 'tree',\n path: 'tree',\n label: 'Tree',\n element: <TreeVisualizer tree={tree} />,\n },\n {\n id: 'detailed',\n path: 'detailed',\n label: 'Detailed',\n element: <DetailedVisualizer tree={tree} />,\n },\n {\n id: 'text',\n path: 'text',\n label: 'Text',\n element: <TextVisualizer tree={tree} />,\n },\n ],\n [tree],\n );\n\n const location = useLocation();\n const element = useRoutes(tabs, location);\n\n const currentPath = `/${useParams()['']}`;\n const [matchedRoute] = matchRoutes(tabs, currentPath) ?? [];\n\n const currentTabIndex = matchedRoute\n ? tabs.findIndex(t => t.path === matchedRoute.route.path)\n : 0;\n\n const navigate = useNavigate();\n const handleTabChange = useCallback(\n (index: number) => {\n navigate(tabs[index].id);\n },\n [navigate, tabs],\n );\n\n useEffect(() => {\n if (!element) {\n navigate(tabs[0].path);\n }\n }, [element, navigate, tabs]);\n\n return (\n <Page themeId=\"tool\">\n <Header title=\"App Visualizer\" />\n <Content noPadding stretch>\n <Box display=\"flex\" flexDirection=\"column\" height=\"100%\">\n <HeaderTabs\n tabs={tabs}\n selectedIndex={currentTabIndex}\n onChange={handleTabChange}\n />\n {element}\n </Box>\n </Content>\n </Page>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;;AAgCO,SAAS,iBAAoB,GAAA;~~AAhCpC~~,~~EAAA,IAAA,EAAA,CAAA;AAiCE,~~EAAM,MAAA,UAAA,GAAa,OAAO,aAAa,CAAA,CAAA;AACvC,EAAA,MAAM,EAAE,IAAA,EAAS,GAAA,UAAA,CAAW,OAAQ,EAAA,CAAA;AAEpC,EAAA,MAAM,IAAO,GAAA,OAAA;AAAA,IACX,MAAM;AAAA,MACJ;AAAA,QACE,EAAI,EAAA,MAAA;AAAA,QACJ,IAAM,EAAA,MAAA;AAAA,QACN,KAAO,EAAA,MAAA;AAAA,QACP,OAAA,kBAAU,KAAA,CAAA,aAAA,CAAA,cAAA,EAAA,EAAe,IAAY,EAAA,CAAA;AAAA,OACvC;AAAA,MACA;AAAA,QACE,EAAI,EAAA,UAAA;AAAA,QACJ,IAAM,EAAA,UAAA;AAAA,QACN,KAAO,EAAA,UAAA;AAAA,QACP,OAAA,kBAAU,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA,EAAmB,IAAY,EAAA,CAAA;AAAA,OAC3C;AAAA,MACA;AAAA,QACE,EAAI,EAAA,MAAA;AAAA,QACJ,IAAM,EAAA,MAAA;AAAA,QACN,KAAO,EAAA,MAAA;AAAA,QACP,OAAA,kBAAU,KAAA,CAAA,aAAA,CAAA,cAAA,EAAA,EAAe,IAAY,EAAA,CAAA;AAAA,OACvC;AAAA,KACF;AAAA,IACA,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,MAAM,WAAW,WAAY,EAAA,CAAA;AAC7B,EAAM,MAAA,OAAA,GAAU,SAAU,CAAA,IAAA,EAAM,QAAQ,CAAA,CAAA;AAExC,EAAA,MAAM,WAAc,GAAA,CAAA,CAAA,EAAI,SAAU,EAAA,CAAE,GAAG,CAAC,CAAA,CAAA,CAAA;AACxC,~~EAAM~~,~~MAAA~~,CAAC,YAAY,~~CAAI,GAAA,~~CAAA,~~EAAA~~,~~GAAA~~,~~WAAA~~,~~CAAY~~,~~MAAM,~~WAAW,~~CAAA~~,~~KAA7B,YAAkC,~~EAAC,CAAA;AAE1D,EAAM,MAAA,eAAA,GAAkB,YACpB,GAAA,IAAA,CAAK,SAAU,CAAA,CAAA,CAAA,KAAK,EAAE,IAAS,KAAA,YAAA,CAAa,KAAM,CAAA,IAAI,CACtD,GAAA,CAAA,CAAA;AAEJ,EAAA,MAAM,WAAW,WAAY,EAAA,CAAA;AAC7B,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,KAAkB,KAAA;AACjB,MAAS,QAAA,CAAA,IAAA,CAAK,KAAK,CAAA,CAAE,EAAE,CAAA,CAAA;AAAA,KACzB;AAAA,IACA,CAAC,UAAU,IAAI,CAAA;AAAA,GACjB,CAAA;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,OAAS,EAAA;AACZ,MAAS,QAAA,CAAA,IAAA,CAAK,CAAC,CAAA,CAAE,IAAI,CAAA,CAAA;AAAA,KACvB;AAAA,GACC,EAAA,CAAC,OAAS,EAAA,QAAA,EAAU,IAAI,CAAC,CAAA,CAAA;AAE5B,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,OAAQ,EAAA,MAAA,EAAA,sCACX,MAAO,EAAA,EAAA,KAAA,EAAM,gBAAiB,EAAA,CAAA,kBAC9B,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAQ,WAAS,IAAC,EAAA,OAAA,EAAO,wBACvB,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAI,SAAQ,MAAO,EAAA,aAAA,EAAc,QAAS,EAAA,MAAA,EAAO,MAChD,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,aAAe,EAAA,eAAA;AAAA,MACf,QAAU,EAAA,eAAA;AAAA,KAAA;AAAA,GACZ,EACC,OACH,CACF,CACF,CAAA,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"AppVisualizerPage.esm.js","sources":["../../../src/components/AppVisualizerPage/AppVisualizerPage.tsx"],"sourcesContent":["/\n Copyright 2023 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 { Content, Header, HeaderTabs, Page } from '@backstage/core-components';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { appTreeApiRef } from '@backstage/frontend-plugin-api';\nimport Box from '@material-ui/core/Box';\nimport React, { useCallback, useEffect, useMemo } from 'react';\nimport { DetailedVisualizer } from './DetailedVisualizer';\nimport { TextVisualizer } from './TextVisualizer';\nimport { TreeVisualizer } from './TreeVisualizer';\nimport {\n matchRoutes,\n useLocation,\n useNavigate,\n useParams,\n useRoutes,\n} from 'react-router-dom';\n\nexport function AppVisualizerPage() {\n const appTreeApi = useApi(appTreeApiRef);\n const { tree } = appTreeApi.getTree();\n\n const tabs = useMemo(\n () => [\n {\n id: 'tree',\n path: 'tree',\n label: 'Tree',\n element: <TreeVisualizer tree={tree} />,\n },\n {\n id: 'detailed',\n path: 'detailed',\n label: 'Detailed',\n element: <DetailedVisualizer tree={tree} />,\n },\n {\n id: 'text',\n path: 'text',\n label: 'Text',\n element: <TextVisualizer tree={tree} />,\n },\n ],\n [tree],\n );\n\n const location = useLocation();\n const element = useRoutes(tabs, location);\n\n const currentPath = `/${useParams()['']}`;\n const [matchedRoute] = matchRoutes(tabs, currentPath) ?? [];\n\n const currentTabIndex = matchedRoute\n ? tabs.findIndex(t => t.path === matchedRoute.route.path)\n : 0;\n\n const navigate = useNavigate();\n const handleTabChange = useCallback(\n (index: number) => {\n navigate(tabs[index].id);\n },\n [navigate, tabs],\n );\n\n useEffect(() => {\n if (!element) {\n navigate(tabs[0].path);\n }\n }, [element, navigate, tabs]);\n\n return (\n <Page themeId=\"tool\">\n <Header title=\"App Visualizer\" />\n <Content noPadding stretch>\n <Box display=\"flex\" flexDirection=\"column\" height=\"100%\">\n <HeaderTabs\n tabs={tabs}\n selectedIndex={currentTabIndex}\n onChange={handleTabChange}\n />\n {element}\n </Box>\n </Content>\n </Page>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;;AAgCO,SAAS,iBAAoB,GAAA;AAClC,EAAM,MAAA,UAAA,GAAa,OAAO,aAAa,CAAA,CAAA;AACvC,EAAA,MAAM,EAAE,IAAA,EAAS,GAAA,UAAA,CAAW,OAAQ,EAAA,CAAA;AAEpC,EAAA,MAAM,IAAO,GAAA,OAAA;AAAA,IACX,MAAM;AAAA,MACJ;AAAA,QACE,EAAI,EAAA,MAAA;AAAA,QACJ,IAAM,EAAA,MAAA;AAAA,QACN,KAAO,EAAA,MAAA;AAAA,QACP,OAAA,kBAAU,KAAA,CAAA,aAAA,CAAA,cAAA,EAAA,EAAe,IAAY,EAAA,CAAA;AAAA,OACvC;AAAA,MACA;AAAA,QACE,EAAI,EAAA,UAAA;AAAA,QACJ,IAAM,EAAA,UAAA;AAAA,QACN,KAAO,EAAA,UAAA;AAAA,QACP,OAAA,kBAAU,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA,EAAmB,IAAY,EAAA,CAAA;AAAA,OAC3C;AAAA,MACA;AAAA,QACE,EAAI,EAAA,MAAA;AAAA,QACJ,IAAM,EAAA,MAAA;AAAA,QACN,KAAO,EAAA,MAAA;AAAA,QACP,OAAA,kBAAU,KAAA,CAAA,aAAA,CAAA,cAAA,EAAA,EAAe,IAAY,EAAA,CAAA;AAAA,OACvC;AAAA,KACF;AAAA,IACA,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,MAAM,WAAW,WAAY,EAAA,CAAA;AAC7B,EAAM,MAAA,OAAA,GAAU,SAAU,CAAA,IAAA,EAAM,QAAQ,CAAA,CAAA;AAExC,EAAA,MAAM,WAAc,GAAA,CAAA,CAAA,EAAI,SAAU,EAAA,CAAE,GAAG,CAAC,CAAA,CAAA,CAAA;AACxC,EAAA,MAAM,CAAC,YAAY,CAAA,GAAI,YAAY,IAAM,EAAA,WAAW,KAAK,EAAC,CAAA;AAE1D,EAAM,MAAA,eAAA,GAAkB,YACpB,GAAA,IAAA,CAAK,SAAU,CAAA,CAAA,CAAA,KAAK,EAAE,IAAS,KAAA,YAAA,CAAa,KAAM,CAAA,IAAI,CACtD,GAAA,CAAA,CAAA;AAEJ,EAAA,MAAM,WAAW,WAAY,EAAA,CAAA;AAC7B,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,KAAkB,KAAA;AACjB,MAAS,QAAA,CAAA,IAAA,CAAK,KAAK,CAAA,CAAE,EAAE,CAAA,CAAA;AAAA,KACzB;AAAA,IACA,CAAC,UAAU,IAAI,CAAA;AAAA,GACjB,CAAA;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,OAAS,EAAA;AACZ,MAAS,QAAA,CAAA,IAAA,CAAK,CAAC,CAAA,CAAE,IAAI,CAAA,CAAA;AAAA,KACvB;AAAA,GACC,EAAA,CAAC,OAAS,EAAA,QAAA,EAAU,IAAI,CAAC,CAAA,CAAA;AAE5B,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,OAAQ,EAAA,MAAA,EAAA,sCACX,MAAO,EAAA,EAAA,KAAA,EAAM,gBAAiB,EAAA,CAAA,kBAC9B,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAQ,WAAS,IAAC,EAAA,OAAA,EAAO,wBACvB,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAI,SAAQ,MAAO,EAAA,aAAA,EAAc,QAAS,EAAA,MAAA,EAAO,MAChD,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,aAAe,EAAA,eAAA;AAAA,MACf,QAAU,EAAA,eAAA;AAAA,KAAA;AAAA,GACZ,EACC,OACH,CACF,CACF,CAAA,CAAA;AAEJ;;;;"}

package/dist/components/AppVisualizerPage/DetailedVisualizer.esm.js CHANGED Viewed

@@ -122,20 +122,18 @@ const useOutputStyles = makeStyles((theme) => ({
   })
 }));
 function getFullPath(node) {
-  var _a, _b;
   if (!node) {
     return "";
   }
-  const parent = (_a = node.edges.attachedTo) == null ? void 0 : _a.node;
-  const part = (_b = node.instance) == null ? void 0 : _b.getData(coreExtensionData.routePath);
+  const parent = node.edges.attachedTo?.node;
+  const part = node.instance?.getData(coreExtensionData.routePath);
   if (!part) {
     return getFullPath(parent);
   }
   return getFullPath(parent) + part;
 }
 function OutputLink(props) {
-  var _a, _b;
-  const routeRef = (_b = (_a = props.node) == null ? void 0 : _a.instance) == null ? void 0 : _b.getData(coreExtensionData.routeRef);
+  const routeRef = props.node?.instance?.getData(coreExtensionData.routeRef);
   let link = void 0;
   try {
     link = useRouteRef(routeRef)();
@@ -144,13 +142,12 @@ function OutputLink(props) {
   return /* @__PURE__ */ React.createElement(Tooltip, { title: /* @__PURE__ */ React.createElement(Typography, null, props.dataRef.id) }, /* @__PURE__ */ React.createElement(Box, { className: props.className }, link ? /* @__PURE__ */ React.createElement(Link, { to: link }, "link") : null));
 }
 function Output(props) {
-  var _a;
   const { dataRef, node } = props;
   const { id } = dataRef;
-  const instance = node == null ? void 0 : node.instance;
+  const instance = node?.instance;
   const classes = useOutputStyles({ color: getOutputColor(id) });
   if (id === coreExtensionData.routePath.id) {
-    return /* @__PURE__ */ React.createElement(Tooltip, { title: /* @__PURE__ */ React.createElement(Typography, null, getFullPath(node)) }, /* @__PURE__ */ React.createElement(Box, { className: classes.output }, String((_a = instance == null ? void 0 : instance.getData(dataRef)) != null ? _a : "")));
+    return /* @__PURE__ */ React.createElement(Tooltip, { title: /* @__PURE__ */ React.createElement(Typography, null, getFullPath(node)) }, /* @__PURE__ */ React.createElement(Box, { className: classes.output }, String(instance?.getData(dataRef) ?? "")));
   }
   if (id === coreExtensionData.routeRef.id) {
     return /* @__PURE__ */ React.createElement(OutputLink, { ...props, className: classes.output });

package/dist/components/AppVisualizerPage/DetailedVisualizer.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DetailedVisualizer.esm.js","sources":["../../../src/components/AppVisualizerPage/DetailedVisualizer.tsx"],"sourcesContent":["/\n Copyright 2023 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 AppNode,\n AppTree,\n ExtensionDataRef,\n RouteRef,\n coreExtensionData,\n createApiExtension,\n createNavItemExtension,\n createThemeExtension,\n useRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport Box from '@material-ui/core/Box';\nimport Paper from '@material-ui/core/Paper';\nimport Tooltip from '@material-ui/core/Tooltip';\nimport Typography from '@material-ui/core/Typography';\nimport as colors from '@material-ui/core/colors';\nimport { makeStyles } from '@material-ui/core/styles';\nimport InputIcon from '@material-ui/icons/InputSharp';\nimport DisabledIcon from '@material-ui/icons/NotInterestedSharp';\nimport React from 'react';\nimport { Link } from 'react-router-dom';\n\nfunction createOutputColorGenerator(\n colorMap: { [extDataId: string]: string },\n availableColors: string[],\n) {\n const map = new Map<string, string>();\n let i = 0;\n\n return function getOutputColor(id: string) {\n if (id in colorMap) {\n return colorMap[id];\n }\n let color = map.get(id);\n if (color) {\n return color;\n }\n color = availableColors[i];\n i += 1;\n if (i >= availableColors.length) {\n i = 0;\n }\n map.set(id, color);\n return color;\n };\n}\n\nconst getOutputColor = createOutputColorGenerator(\n {\n [coreExtensionData.reactElement.id]: colors.green[500],\n [coreExtensionData.routePath.id]: colors.yellow[500],\n [coreExtensionData.routeRef.id]: colors.purple[500],\n [createApiExtension.factoryDataRef.id]: colors.blue[500],\n [createThemeExtension.themeDataRef.id]: colors.lime[500],\n [createNavItemExtension.targetDataRef.id]: colors.orange[500],\n },\n\n [\n colors.blue[200],\n colors.orange[200],\n colors.green[200],\n colors.red[200],\n colors.yellow[200],\n colors.purple[200],\n colors.lime[200],\n ],\n);\n\ninterface StyleProps {\n enabled: boolean;\n depth: number;\n}\n\nconst config = {\n borderWidth: 0.75,\n};\n\nconst useStyles = makeStyles(theme => ({\n extension: {\n borderLeftWidth: theme.spacing(config.borderWidth),\n borderLeftStyle: 'solid',\n borderLeftColor: ({ depth }: StyleProps) =>\n colors.grey[(700 - (depth % 6) * 100) as keyof typeof colors.grey],\n cursor: 'pointer',\n\n '&:hover $extensionHeader': {\n color: ({ enabled }: StyleProps) =>\n enabled ? theme.palette.primary.main : theme.palette.text.secondary,\n },\n },\n extensionHeader: {\n display: 'flex',\n alignItems: 'center',\n width: 'fit-content',\n\n padding: theme.spacing(0.5, 1),\n color: ({ enabled }: StyleProps) =>\n enabled ? theme.palette.text.primary : theme.palette.text.disabled,\n background: theme.palette.background.paper,\n\n borderTopRightRadius: theme.shape.borderRadius,\n borderBottomRightRadius: theme.shape.borderRadius,\n },\n extensionHeaderId: {\n userSelect: 'all',\n },\n extensionHeaderOutputs: {\n display: 'flex',\n alignItems: 'center',\n marginLeft: theme.spacing(1),\n gap: theme.spacing(1),\n },\n attachments: {\n gap: theme.spacing(2),\n display: 'flex',\n flexDirection: 'column',\n },\n attachmentsInput: {\n '&:first-child $attachmentsInputTitle': {\n borderTop: 0,\n },\n },\n attachmentsInputTitle: {\n display: 'flex',\n alignItems: 'center',\n width: 'fit-content',\n padding: theme.spacing(1),\n\n borderTopWidth: theme.spacing(config.borderWidth),\n borderTopStyle: 'solid',\n borderTopColor: ({ depth }: StyleProps) =>\n colors.grey[(700 - (depth % 6) * 100) as keyof typeof colors.grey],\n },\n attachmentsInputName: {\n marginLeft: theme.spacing(1),\n },\n attachmentsInputChildren: {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n gap: theme.spacing(0.5),\n marginLeft: theme.spacing(1),\n marginBottom: theme.spacing(1),\n },\n}));\n\nconst useOutputStyles = makeStyles(theme => ({\n output: ({ color }: { color: string }) => ({\n padding: `0 10px`,\n height: 20,\n borderRadius: 10,\n color: theme.palette.getContrastText(color),\n backgroundColor: color,\n }),\n}));\n\nfunction getFullPath(node?: AppNode): string {\n if (!node) {\n return '';\n }\n const parent = node.edges.attachedTo?.node;\n const part = node.instance?.getData(coreExtensionData.routePath);\n if (!part) {\n return getFullPath(parent);\n }\n return getFullPath(parent) + part;\n}\n\nfunction OutputLink(props: {\n dataRef: ExtensionDataRef<unknown>;\n node?: AppNode;\n className: string;\n}) {\n const routeRef = props.node?.instance?.getData(coreExtensionData.routeRef);\n\n let link: string \| undefined = undefined;\n try {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n link = useRouteRef(routeRef as RouteRef<undefined>)();\n } catch {\n /* ignore */\n }\n\n return (\n <Tooltip title={<Typography>{props.dataRef.id}</Typography>}>\n <Box className={props.className}>\n {link ? <Link to={link}>link</Link> : null}\n </Box>\n </Tooltip>\n );\n}\n\nfunction Output(props: { dataRef: ExtensionDataRef<unknown>; node?: AppNode }) {\n const { dataRef, node } = props;\n const { id } = dataRef;\n const instance = node?.instance;\n\n const classes = useOutputStyles({ color: getOutputColor(id) });\n\n if (id === coreExtensionData.routePath.id) {\n return (\n <Tooltip title={<Typography>{getFullPath(node)}</Typography>}>\n <Box className={classes.output}>\n {String(instance?.getData(dataRef) ?? '')}\n </Box>\n </Tooltip>\n );\n }\n\n if (id === coreExtensionData.routeRef.id) {\n return <OutputLink {...props} className={classes.output} />;\n }\n\n return (\n <Tooltip title={<Typography>{id}</Typography>}>\n <Box className={classes.output} />\n </Tooltip>\n );\n}\n\nfunction Attachments(props: {\n node: AppNode;\n enabled: boolean;\n depth: number;\n}) {\n const { node, enabled, depth } = props;\n const { attachments } = node.edges;\n\n const classes = useStyles({ enabled, depth });\n\n if (attachments.size === 0) {\n return null;\n }\n\n return (\n <Box className={classes.attachments}>\n {[...attachments.entries()]\n .sort(([a], [b]) => a.localeCompare(b))\n .map(([key, children]) => {\n return (\n <Box key={key} className={classes.attachmentsInput}>\n <Box className={classes.attachmentsInputTitle}>\n <InputIcon />\n <Typography className={classes.attachmentsInputName}>\n {key}\n </Typography>\n </Box>\n <Box className={classes.attachmentsInputChildren}>\n {children.map(childNode => (\n <Extension\n key={childNode.spec.id}\n node={childNode}\n depth={depth + 1}\n />\n ))}\n </Box>\n </Box>\n );\n })}\n </Box>\n );\n}\n\nfunction ExtensionTooltip(props: { node: AppNode }) {\n const parts = [];\n let node = props.node;\n parts.push(node.spec.id);\n while (node.edges.attachedTo) {\n const input = node.edges.attachedTo.input;\n node = node.edges.attachedTo.node;\n parts.push(`${node.spec.id} [${input}]`);\n }\n parts.reverse();\n\n return (\n <>\n {parts.map(part => (\n <Typography key={part}>{part}</Typography>\n ))}\n </>\n );\n}\n\nfunction Extension(props: { node: AppNode; depth: number }) {\n const { node, depth } = props;\n\n const enabled = Boolean(node.instance);\n const classes = useStyles({ enabled, depth });\n\n const dataRefs = node.instance && [...node.instance.getDataRefs()];\n\n return (\n <Box key={node.spec.id} className={classes.extension}>\n <Box className={classes.extensionHeader}>\n <Tooltip title={<ExtensionTooltip node={node} />}>\n <Typography className={classes.extensionHeaderId}>\n {node.spec.id}\n </Typography>\n </Tooltip>\n <Box className={classes.extensionHeaderOutputs}>\n {dataRefs &&\n dataRefs.length > 0 &&\n dataRefs\n .sort((a, b) => a.id.localeCompare(b.id))\n .map(ref => <Output key={ref.id} dataRef={ref} node={node} />)}\n {!enabled && <DisabledIcon fontSize=\"small\" />}\n </Box>\n </Box>\n <Attachments node={node} enabled={enabled} depth={depth} />\n </Box>\n );\n}\n\nconst legendMap = {\n 'React Element': coreExtensionData.reactElement,\n 'Utility API': createApiExtension.factoryDataRef,\n 'Route Path': coreExtensionData.routePath,\n 'Route Ref': coreExtensionData.routeRef,\n 'Nav Target': createNavItemExtension.targetDataRef,\n Theme: createThemeExtension.themeDataRef,\n};\n\nfunction Legend() {\n return (\n <Box\n display=\"grid\"\n maxWidth={600}\n p={1}\n style={{\n grid: 'auto-flow / repeat(3, 1fr)',\n gap: 16,\n }}\n >\n {Object.entries(legendMap).map(([label, dataRef]) => (\n <Box\n key={dataRef.id}\n display=\"flex\"\n style={{ gap: 8 }}\n alignItems=\"center\"\n >\n <Output dataRef={dataRef} />\n <Typography>{label}</Typography>\n </Box>\n ))}\n </Box>\n );\n}\n\nexport function DetailedVisualizer({ tree }: { tree: AppTree }) {\n return (\n <Box display=\"flex\" height=\"100%\" flex=\"1 1 100%\" flexDirection=\"column\">\n <Box flex=\"1 1 0\" overflow=\"auto\" ml={2} mt={2}>\n <Extension node={tree.root} depth={0} />\n </Box>\n\n <Box component={Paper} flex=\"0 0 auto\" m={1}>\n <Legend />\n </Box>\n </Box>\n );\n}\n"],"names":["getOutputColor"],"mappings":"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"}
1	+ {"version":3,"file":"DetailedVisualizer.esm.js","sources":["../../../src/components/AppVisualizerPage/DetailedVisualizer.tsx"],"sourcesContent":["/\n Copyright 2023 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 AppNode,\n AppTree,\n ExtensionDataRef,\n RouteRef,\n coreExtensionData,\n createApiExtension,\n createNavItemExtension,\n createThemeExtension,\n useRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport Box from '@material-ui/core/Box';\nimport Paper from '@material-ui/core/Paper';\nimport Tooltip from '@material-ui/core/Tooltip';\nimport Typography from '@material-ui/core/Typography';\nimport as colors from '@material-ui/core/colors';\nimport { makeStyles } from '@material-ui/core/styles';\nimport InputIcon from '@material-ui/icons/InputSharp';\nimport DisabledIcon from '@material-ui/icons/NotInterestedSharp';\nimport React from 'react';\nimport { Link } from 'react-router-dom';\n\nfunction createOutputColorGenerator(\n colorMap: { [extDataId: string]: string },\n availableColors: string[],\n) {\n const map = new Map<string, string>();\n let i = 0;\n\n return function getOutputColor(id: string) {\n if (id in colorMap) {\n return colorMap[id];\n }\n let color = map.get(id);\n if (color) {\n return color;\n }\n color = availableColors[i];\n i += 1;\n if (i >= availableColors.length) {\n i = 0;\n }\n map.set(id, color);\n return color;\n };\n}\n\nconst getOutputColor = createOutputColorGenerator(\n {\n [coreExtensionData.reactElement.id]: colors.green[500],\n [coreExtensionData.routePath.id]: colors.yellow[500],\n [coreExtensionData.routeRef.id]: colors.purple[500],\n [createApiExtension.factoryDataRef.id]: colors.blue[500],\n [createThemeExtension.themeDataRef.id]: colors.lime[500],\n [createNavItemExtension.targetDataRef.id]: colors.orange[500],\n },\n\n [\n colors.blue[200],\n colors.orange[200],\n colors.green[200],\n colors.red[200],\n colors.yellow[200],\n colors.purple[200],\n colors.lime[200],\n ],\n);\n\ninterface StyleProps {\n enabled: boolean;\n depth: number;\n}\n\nconst config = {\n borderWidth: 0.75,\n};\n\nconst useStyles = makeStyles(theme => ({\n extension: {\n borderLeftWidth: theme.spacing(config.borderWidth),\n borderLeftStyle: 'solid',\n borderLeftColor: ({ depth }: StyleProps) =>\n colors.grey[(700 - (depth % 6) * 100) as keyof typeof colors.grey],\n cursor: 'pointer',\n\n '&:hover $extensionHeader': {\n color: ({ enabled }: StyleProps) =>\n enabled ? theme.palette.primary.main : theme.palette.text.secondary,\n },\n },\n extensionHeader: {\n display: 'flex',\n alignItems: 'center',\n width: 'fit-content',\n\n padding: theme.spacing(0.5, 1),\n color: ({ enabled }: StyleProps) =>\n enabled ? theme.palette.text.primary : theme.palette.text.disabled,\n background: theme.palette.background.paper,\n\n borderTopRightRadius: theme.shape.borderRadius,\n borderBottomRightRadius: theme.shape.borderRadius,\n },\n extensionHeaderId: {\n userSelect: 'all',\n },\n extensionHeaderOutputs: {\n display: 'flex',\n alignItems: 'center',\n marginLeft: theme.spacing(1),\n gap: theme.spacing(1),\n },\n attachments: {\n gap: theme.spacing(2),\n display: 'flex',\n flexDirection: 'column',\n },\n attachmentsInput: {\n '&:first-child $attachmentsInputTitle': {\n borderTop: 0,\n },\n },\n attachmentsInputTitle: {\n display: 'flex',\n alignItems: 'center',\n width: 'fit-content',\n padding: theme.spacing(1),\n\n borderTopWidth: theme.spacing(config.borderWidth),\n borderTopStyle: 'solid',\n borderTopColor: ({ depth }: StyleProps) =>\n colors.grey[(700 - (depth % 6) * 100) as keyof typeof colors.grey],\n },\n attachmentsInputName: {\n marginLeft: theme.spacing(1),\n },\n attachmentsInputChildren: {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n gap: theme.spacing(0.5),\n marginLeft: theme.spacing(1),\n marginBottom: theme.spacing(1),\n },\n}));\n\nconst useOutputStyles = makeStyles(theme => ({\n output: ({ color }: { color: string }) => ({\n padding: `0 10px`,\n height: 20,\n borderRadius: 10,\n color: theme.palette.getContrastText(color),\n backgroundColor: color,\n }),\n}));\n\nfunction getFullPath(node?: AppNode): string {\n if (!node) {\n return '';\n }\n const parent = node.edges.attachedTo?.node;\n const part = node.instance?.getData(coreExtensionData.routePath);\n if (!part) {\n return getFullPath(parent);\n }\n return getFullPath(parent) + part;\n}\n\nfunction OutputLink(props: {\n dataRef: ExtensionDataRef<unknown>;\n node?: AppNode;\n className: string;\n}) {\n const routeRef = props.node?.instance?.getData(coreExtensionData.routeRef);\n\n let link: string \| undefined = undefined;\n try {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n link = useRouteRef(routeRef as RouteRef<undefined>)();\n } catch {\n /* ignore */\n }\n\n return (\n <Tooltip title={<Typography>{props.dataRef.id}</Typography>}>\n <Box className={props.className}>\n {link ? <Link to={link}>link</Link> : null}\n </Box>\n </Tooltip>\n );\n}\n\nfunction Output(props: { dataRef: ExtensionDataRef<unknown>; node?: AppNode }) {\n const { dataRef, node } = props;\n const { id } = dataRef;\n const instance = node?.instance;\n\n const classes = useOutputStyles({ color: getOutputColor(id) });\n\n if (id === coreExtensionData.routePath.id) {\n return (\n <Tooltip title={<Typography>{getFullPath(node)}</Typography>}>\n <Box className={classes.output}>\n {String(instance?.getData(dataRef) ?? '')}\n </Box>\n </Tooltip>\n );\n }\n\n if (id === coreExtensionData.routeRef.id) {\n return <OutputLink {...props} className={classes.output} />;\n }\n\n return (\n <Tooltip title={<Typography>{id}</Typography>}>\n <Box className={classes.output} />\n </Tooltip>\n );\n}\n\nfunction Attachments(props: {\n node: AppNode;\n enabled: boolean;\n depth: number;\n}) {\n const { node, enabled, depth } = props;\n const { attachments } = node.edges;\n\n const classes = useStyles({ enabled, depth });\n\n if (attachments.size === 0) {\n return null;\n }\n\n return (\n <Box className={classes.attachments}>\n {[...attachments.entries()]\n .sort(([a], [b]) => a.localeCompare(b))\n .map(([key, children]) => {\n return (\n <Box key={key} className={classes.attachmentsInput}>\n <Box className={classes.attachmentsInputTitle}>\n <InputIcon />\n <Typography className={classes.attachmentsInputName}>\n {key}\n </Typography>\n </Box>\n <Box className={classes.attachmentsInputChildren}>\n {children.map(childNode => (\n <Extension\n key={childNode.spec.id}\n node={childNode}\n depth={depth + 1}\n />\n ))}\n </Box>\n </Box>\n );\n })}\n </Box>\n );\n}\n\nfunction ExtensionTooltip(props: { node: AppNode }) {\n const parts = [];\n let node = props.node;\n parts.push(node.spec.id);\n while (node.edges.attachedTo) {\n const input = node.edges.attachedTo.input;\n node = node.edges.attachedTo.node;\n parts.push(`${node.spec.id} [${input}]`);\n }\n parts.reverse();\n\n return (\n <>\n {parts.map(part => (\n <Typography key={part}>{part}</Typography>\n ))}\n </>\n );\n}\n\nfunction Extension(props: { node: AppNode; depth: number }) {\n const { node, depth } = props;\n\n const enabled = Boolean(node.instance);\n const classes = useStyles({ enabled, depth });\n\n const dataRefs = node.instance && [...node.instance.getDataRefs()];\n\n return (\n <Box key={node.spec.id} className={classes.extension}>\n <Box className={classes.extensionHeader}>\n <Tooltip title={<ExtensionTooltip node={node} />}>\n <Typography className={classes.extensionHeaderId}>\n {node.spec.id}\n </Typography>\n </Tooltip>\n <Box className={classes.extensionHeaderOutputs}>\n {dataRefs &&\n dataRefs.length > 0 &&\n dataRefs\n .sort((a, b) => a.id.localeCompare(b.id))\n .map(ref => <Output key={ref.id} dataRef={ref} node={node} />)}\n {!enabled && <DisabledIcon fontSize=\"small\" />}\n </Box>\n </Box>\n <Attachments node={node} enabled={enabled} depth={depth} />\n </Box>\n );\n}\n\nconst legendMap = {\n 'React Element': coreExtensionData.reactElement,\n 'Utility API': createApiExtension.factoryDataRef,\n 'Route Path': coreExtensionData.routePath,\n 'Route Ref': coreExtensionData.routeRef,\n 'Nav Target': createNavItemExtension.targetDataRef,\n Theme: createThemeExtension.themeDataRef,\n};\n\nfunction Legend() {\n return (\n <Box\n display=\"grid\"\n maxWidth={600}\n p={1}\n style={{\n grid: 'auto-flow / repeat(3, 1fr)',\n gap: 16,\n }}\n >\n {Object.entries(legendMap).map(([label, dataRef]) => (\n <Box\n key={dataRef.id}\n display=\"flex\"\n style={{ gap: 8 }}\n alignItems=\"center\"\n >\n <Output dataRef={dataRef} />\n <Typography>{label}</Typography>\n </Box>\n ))}\n </Box>\n );\n}\n\nexport function DetailedVisualizer({ tree }: { tree: AppTree }) {\n return (\n <Box display=\"flex\" height=\"100%\" flex=\"1 1 100%\" flexDirection=\"column\">\n <Box flex=\"1 1 0\" overflow=\"auto\" ml={2} mt={2}>\n <Extension node={tree.root} depth={0} />\n </Box>\n\n <Box component={Paper} flex=\"0 0 auto\" m={1}>\n <Legend />\n </Box>\n </Box>\n );\n}\n"],"names":["getOutputColor"],"mappings":"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"}

package/dist/components/AppVisualizerPage/TextVisualizer.esm.js CHANGED Viewed

@@ -8,10 +8,10 @@ function mkDiv(children, options) {
   return /* @__PURE__ */ React.createElement(
     "div",
     {
-      key: options == null ? void 0 : options.key,
+      key: options?.key,
       style: {
-        color: options == null ? void 0 : options.color,
-        marginLeft: (options == null ? void 0 : options.indent) ? 16 : void 0
+        color: options?.color,
+        marginLeft: options?.indent ? 16 : void 0
       }
     },
     children
@@ -19,7 +19,7 @@ function mkDiv(children, options) {
 }
 function nodeToText(node, options) {
   const dataRefIds = node.instance && [...node.instance.getDataRefs()].map((r) => r.id);
-  const out = (options == null ? void 0 : options.showOutputs) && dataRefIds && dataRefIds.length > 0 ? ` out="${[...dataRefIds].sort().join(", ")}"` : "";
+  const out = options?.showOutputs && dataRefIds && dataRefIds.length > 0 ? ` out="${[...dataRefIds].sort().join(", ")}"` : "";
   const color = node.instance ? void 0 : "gray";
   if (node.edges.attachments.size === 0) {
     return mkDiv(`<${node.spec.id}${out}/>`, { color });
@@ -27,7 +27,7 @@ function nodeToText(node, options) {
   return mkDiv([
     mkDiv(`<${node.spec.id}${out}>`, { key: "start", color }),
     ...[...node.edges.attachments.entries()].sort(([a], [b]) => a.localeCompare(b)).map(([key, v]) => {
-      const children = v.filter((e) => (options == null ? void 0 : options.showDisabled) || e.instance).sort((a, b) => a.spec.id.localeCompare(b.spec.id));
+      const children = v.filter((e) => options?.showDisabled || e.instance).sort((a, b) => a.spec.id.localeCompare(b.spec.id));
       if (children.length === 0) {
         return mkDiv(`${key} []`, { indent: true });
       }

package/dist/components/AppVisualizerPage/TextVisualizer.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextVisualizer.esm.js","sources":["../../../src/components/AppVisualizerPage/TextVisualizer.tsx"],"sourcesContent":["/\n Copyright 2023 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 { AppNode, AppTree } from '@backstage/frontend-plugin-api';\nimport Box from '@material-ui/core/Box';\nimport Checkbox from '@material-ui/core/Checkbox';\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\nimport Paper from '@material-ui/core/Paper';\nimport React, { ReactNode, useState } from 'react';\n\nfunction mkDiv(\n children: ReactNode,\n options?: { indent?: boolean; key?: string \| number; color?: string },\n) {\n return (\n <div\n key={options?.key}\n style={{\n color: options?.color,\n marginLeft: options?.indent ? 16 : undefined,\n }}\n >\n {children}\n </div>\n );\n}\n\nfunction nodeToText(\n node: AppNode,\n options?: { showOutputs?: boolean; showDisabled?: boolean },\n): ReactNode {\n const dataRefIds =\n node.instance && [...node.instance.getDataRefs()].map(r => r.id);\n const out =\n options?.showOutputs && dataRefIds && dataRefIds.length > 0\n ? ` out=\"${[...dataRefIds].sort().join(', ')}\"`\n : '';\n const color = node.instance ? undefined : 'gray';\n\n if (node.edges.attachments.size === 0) {\n return mkDiv(`<${node.spec.id}${out}/>`, { color });\n }\n\n return mkDiv([\n mkDiv(`<${node.spec.id}${out}>`, { key: 'start', color }),\n ...[...node.edges.attachments.entries()]\n .sort(([a], [b]) => a.localeCompare(b))\n .map(([key, v]) => {\n const children = v\n .filter(e => options?.showDisabled \|\| e.instance)\n .sort((a, b) => a.spec.id.localeCompare(b.spec.id));\n if (children.length === 0) {\n return mkDiv(`${key} []`, { indent: true });\n }\n return mkDiv(\n [\n mkDiv(`${key} [`),\n ...children.map(e =>\n mkDiv(nodeToText(e, options), { indent: true }),\n ),\n mkDiv(']'),\n ],\n { key, indent: true },\n );\n }),\n mkDiv(`</${node.spec.id}>`, { key: 'end', color }),\n ]);\n}\n\nexport function TextVisualizer({ tree }: { tree: AppTree }) {\n const [showOutputs, setShowOutputs] = useState(false);\n const [showDisabled, setShowDisabled] = useState(false);\n\n return (\n <>\n <Box style={{ overflow: 'auto', flex: '1 0 0' }}>\n <div style={{ margin: 16, width: 'max-content' }}>\n {nodeToText(tree.root, { showOutputs, showDisabled })}\n </div>\n </Box>\n <Paper style={{ padding: '8px 16px' }}>\n <FormControlLabel\n control={\n <Checkbox\n checked={showOutputs}\n onChange={(_, value) => setShowOutputs(value)}\n />\n }\n label=\"Show Outputs\"\n />\n <FormControlLabel\n control={\n <Checkbox\n checked={showDisabled}\n onChange={(_, value) => setShowDisabled(value)}\n />\n }\n label=\"Show Disabled\"\n />\n </Paper>\n </>\n );\n}\n"],"names":[],"mappings":";;;;;;AAuBA,SAAS,KAAA,CACP,UACA,OACA,EAAA;AACA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAK,OAAS,~~IAAA~~,~~IAAA,~~GAAA~~,KAAA,CAAA,GAAA,OAAA,CAAA,GAAA~~;AAAA,MACd,KAAO,EAAA;AAAA,QACL,OAAO,OAAS,~~IAAA~~,~~IAAA,GAAA,~~KAAA~~,CAAA,GAAA,OAAA,CAAA,KAAA~~;AAAA,QAChB,UAAA,~~EAAA~~,~~CAAY,~~OAAS,~~IAAA~~,~~IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,~~MAAA,~~IAAS~~,EAAK,GAAA,KAAA,CAAA;AAAA,OACrC;AAAA,KAAA;AAAA,IAEC,QAAA;AAAA,GACH,CAAA;AAEJ,CAAA;AAEA,SAAS,UAAA,CACP,MACA,OACW,EAAA;AACX,EAAA,MAAM,UACJ,GAAA,IAAA,CAAK,QAAY,IAAA,CAAC,GAAG,IAAA,CAAK,QAAS,CAAA,WAAA,EAAa,CAAA,CAAE,GAAI,CAAA,CAAA,CAAA,KAAK,EAAE,EAAE,CAAA,CAAA;AACjE,EAAA,MAAM,~~OACJ~~,OAAS,~~IAAA~~,~~IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,~~WAAA,~~KAAe~~,UAAc,IAAA,UAAA,CAAW,SAAS,CACtD,GAAA,CAAA,MAAA,EAAS,CAAC,GAAG,UAAU,CAAE,CAAA,IAAA,GAAO,IAAK,CAAA,IAAI,CAAC,CAC1C,CAAA,CAAA,GAAA,EAAA,CAAA;AACN,EAAM,MAAA,KAAA,GAAQ,IAAK,CAAA,QAAA,GAAW,KAAY,CAAA,GAAA,MAAA,CAAA;AAE1C,EAAA,IAAI,IAAK,CAAA,KAAA,CAAM,WAAY,CAAA,IAAA,KAAS,CAAG,EAAA;AACrC,IAAO,OAAA,KAAA,CAAM,CAAI,CAAA,EAAA,IAAA,CAAK,IAAK,CAAA,EAAE,GAAG,GAAG,CAAA,EAAA,CAAA,EAAM,EAAE,KAAA,EAAO,CAAA,CAAA;AAAA,GACpD;AAEA,EAAA,OAAO,KAAM,CAAA;AAAA,IACX,KAAM,CAAA,CAAA,CAAA,EAAI,IAAK,CAAA,IAAA,CAAK,EAAE,CAAA,EAAG,GAAG,CAAA,CAAA,CAAA,EAAK,EAAE,GAAA,EAAK,OAAS,EAAA,KAAA,EAAO,CAAA;AAAA,IACxD,GAAG,CAAC,GAAG,IAAK,CAAA,KAAA,CAAM,WAAY,CAAA,OAAA,EAAS,CAAA,CACpC,IAAK,CAAA,CAAC,CAAC,CAAC,CAAG,EAAA,CAAC,CAAC,CAAA,KAAM,CAAE,CAAA,aAAA,CAAc,CAAC,CAAC,CACrC,CAAA,GAAA,CAAI,CAAC,CAAC,GAAK,EAAA,CAAC,CAAM,KAAA;AACjB,MAAM,MAAA,QAAA,GAAW,EACd,MAAO,CAAA,CAAA,CAAA,~~KAAA~~,~~CAAK~~,~~mCAAS,~~YAAgB,~~KAAA~~,CAAA,CAAE,QAAQ,CAC/C,CAAA,IAAA,CAAK,CAAC,CAAG,EAAA,CAAA,KAAM,EAAE,IAAK,CAAA,EAAA,CAAG,cAAc,CAAE,CAAA,IAAA,CAAK,EAAE,CAAC,CAAA,CAAA;AACpD,MAAI,IAAA,QAAA,CAAS,WAAW,CAAG,EAAA;AACzB,QAAA,OAAO,MAAM,CAAG,EAAA,GAAG,OAAO,EAAE,MAAA,EAAQ,MAAM,CAAA,CAAA;AAAA,OAC5C;AACA,MAAO,OAAA,KAAA;AAAA,QACL;AAAA,UACE,KAAA,CAAM,CAAG,EAAA,GAAG,CAAI,EAAA,CAAA,CAAA;AAAA,UAChB,GAAG,QAAS,CAAA,GAAA;AAAA,YAAI,CAAA,CAAA,KACd,MAAM,UAAW,CAAA,CAAA,EAAG,OAAO,CAAG,EAAA,EAAE,MAAQ,EAAA,IAAA,EAAM,CAAA;AAAA,WAChD;AAAA,UACA,MAAM,GAAG,CAAA;AAAA,SACX;AAAA,QACA,EAAE,GAAK,EAAA,MAAA,EAAQ,IAAK,EAAA;AAAA,OACtB,CAAA;AAAA,KACD,CAAA;AAAA,IACH,KAAA,CAAM,CAAK,EAAA,EAAA,IAAA,CAAK,IAAK,CAAA,EAAE,KAAK,EAAE,GAAA,EAAK,KAAO,EAAA,KAAA,EAAO,CAAA;AAAA,GAClD,CAAA,CAAA;AACH,CAAA;AAEgB,SAAA,cAAA,CAAe,EAAE,IAAA,EAA2B,EAAA;AAC1D,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AACpD,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAEtD,EAAA,uBAEI,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,GAAI,EAAA,EAAA,KAAA,EAAO,EAAE,QAAU,EAAA,MAAA,EAAQ,IAAM,EAAA,OAAA,sBACnC,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,KAAO,EAAA,EAAE,QAAQ,EAAI,EAAA,KAAA,EAAO,aAAc,EAAA,EAAA,EAC5C,WAAW,IAAK,CAAA,IAAA,EAAM,EAAE,WAAA,EAAa,cAAc,CACtD,CACF,CAAA,sCACC,KAAM,EAAA,EAAA,KAAA,EAAO,EAAE,OAAA,EAAS,YACvB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,OACE,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,OAAS,EAAA,WAAA;AAAA,UACT,QAAU,EAAA,CAAC,CAAG,EAAA,KAAA,KAAU,eAAe,KAAK,CAAA;AAAA,SAAA;AAAA,OAC9C;AAAA,MAEF,KAAM,EAAA,cAAA;AAAA,KAAA;AAAA,GAER,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,OACE,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,OAAS,EAAA,YAAA;AAAA,UACT,QAAU,EAAA,CAAC,CAAG,EAAA,KAAA,KAAU,gBAAgB,KAAK,CAAA;AAAA,SAAA;AAAA,OAC/C;AAAA,MAEF,KAAM,EAAA,eAAA;AAAA,KAAA;AAAA,GAEV,CACF,CAAA,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"TextVisualizer.esm.js","sources":["../../../src/components/AppVisualizerPage/TextVisualizer.tsx"],"sourcesContent":["/\n Copyright 2023 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 { AppNode, AppTree } from '@backstage/frontend-plugin-api';\nimport Box from '@material-ui/core/Box';\nimport Checkbox from '@material-ui/core/Checkbox';\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\nimport Paper from '@material-ui/core/Paper';\nimport React, { ReactNode, useState } from 'react';\n\nfunction mkDiv(\n children: ReactNode,\n options?: { indent?: boolean; key?: string \| number; color?: string },\n) {\n return (\n <div\n key={options?.key}\n style={{\n color: options?.color,\n marginLeft: options?.indent ? 16 : undefined,\n }}\n >\n {children}\n </div>\n );\n}\n\nfunction nodeToText(\n node: AppNode,\n options?: { showOutputs?: boolean; showDisabled?: boolean },\n): ReactNode {\n const dataRefIds =\n node.instance && [...node.instance.getDataRefs()].map(r => r.id);\n const out =\n options?.showOutputs && dataRefIds && dataRefIds.length > 0\n ? ` out=\"${[...dataRefIds].sort().join(', ')}\"`\n : '';\n const color = node.instance ? undefined : 'gray';\n\n if (node.edges.attachments.size === 0) {\n return mkDiv(`<${node.spec.id}${out}/>`, { color });\n }\n\n return mkDiv([\n mkDiv(`<${node.spec.id}${out}>`, { key: 'start', color }),\n ...[...node.edges.attachments.entries()]\n .sort(([a], [b]) => a.localeCompare(b))\n .map(([key, v]) => {\n const children = v\n .filter(e => options?.showDisabled \|\| e.instance)\n .sort((a, b) => a.spec.id.localeCompare(b.spec.id));\n if (children.length === 0) {\n return mkDiv(`${key} []`, { indent: true });\n }\n return mkDiv(\n [\n mkDiv(`${key} [`),\n ...children.map(e =>\n mkDiv(nodeToText(e, options), { indent: true }),\n ),\n mkDiv(']'),\n ],\n { key, indent: true },\n );\n }),\n mkDiv(`</${node.spec.id}>`, { key: 'end', color }),\n ]);\n}\n\nexport function TextVisualizer({ tree }: { tree: AppTree }) {\n const [showOutputs, setShowOutputs] = useState(false);\n const [showDisabled, setShowDisabled] = useState(false);\n\n return (\n <>\n <Box style={{ overflow: 'auto', flex: '1 0 0' }}>\n <div style={{ margin: 16, width: 'max-content' }}>\n {nodeToText(tree.root, { showOutputs, showDisabled })}\n </div>\n </Box>\n <Paper style={{ padding: '8px 16px' }}>\n <FormControlLabel\n control={\n <Checkbox\n checked={showOutputs}\n onChange={(_, value) => setShowOutputs(value)}\n />\n }\n label=\"Show Outputs\"\n />\n <FormControlLabel\n control={\n <Checkbox\n checked={showDisabled}\n onChange={(_, value) => setShowDisabled(value)}\n />\n }\n label=\"Show Disabled\"\n />\n </Paper>\n </>\n );\n}\n"],"names":[],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-app-visualizer",
-  "version": "0.1.6",
+  "version": "0.1.7-next.1",
   "description": "Visualizes the Backstage app structure",
   "backstage": {
     "role": "frontend-plugin"
@@ -30,14 +30,14 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/core-components": "^0.14.7",
-    "@backstage/core-plugin-api": "^1.9.2",
-    "@backstage/frontend-plugin-api": "^0.6.5",
+    "@backstage/core-components": "^0.14.8-next.1",
+    "@backstage/core-plugin-api": "^1.9.3-next.0",
+    "@backstage/frontend-plugin-api": "^0.6.6-next.1",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1"
   },
   "devDependencies": {
-    "@backstage/cli": "^0.26.5",
+    "@backstage/cli": "^0.26.7-next.2",
     "@types/react": "^16.13.1 || ^17.0.0"
   },
   "peerDependencies": {