@backstage/plugin-techdocs 1.10.5 → 1.10.6-next.1

package/dist/home/components/Tables/DocsTable.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DocsTable.esm.js","sources":["../../../../src/home/components/Tables/DocsTable.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 React from 'react';\nimport useCopyToClipboard from 'react-use/esm/useCopyToClipboard';\n\nimport { configApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { Entity, RELATION_OWNED_BY } from '@backstage/catalog-model';\nimport {\n  getEntityRelations,\n  humanizeEntityRef,\n} from '@backstage/plugin-catalog-react';\nimport { rootDocsRouteRef } from '../../../routes';\nimport {\n  EmptyState,\n  LinkButton,\n  Table,\n  TableColumn,\n  TableOptions,\n  TableProps,\n} from '@backstage/core-components';\nimport { actionFactories } from './actions';\nimport { columnFactories } from './columns';\nimport { toLowerMaybe } from '../../../helpers';\nimport { DocsTableRow } from './types';\n\n/**\n * Props for {@link DocsTable}.\n *\n * @public\n */\nexport type DocsTableProps = {\n  entities: Entity[] | undefined;\n  title?: string | undefined;\n  loading?: boolean | undefined;\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  options?: TableOptions<DocsTableRow>;\n};\n\n/**\n * Component which renders a table documents\n *\n * @public\n */\nexport const DocsTable = (props: DocsTableProps) => {\n  const { entities, title, loading, columns, actions, options } = props;\n  const [, copyToClipboard] = useCopyToClipboard();\n  const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);\n  const config = useApi(configApiRef);\n  if (!entities) return null;\n\n  const documents = entities.map(entity => {\n    const ownedByRelations = getEntityRelations(entity, RELATION_OWNED_BY);\n    return {\n      entity,\n      resolved: {\n        docsUrl: getRouteToReaderPageFor({\n          namespace: toLowerMaybe(\n            entity.metadata.namespace ?? 'default',\n            config,\n          ),\n          kind: toLowerMaybe(entity.kind, config),\n          name: toLowerMaybe(entity.metadata.name, config),\n        }),\n        ownedByRelations,\n        ownedByRelationsTitle: ownedByRelations\n          .map(r => humanizeEntityRef(r, { defaultKind: 'group' }))\n          .join(', '),\n      },\n    };\n  });\n\n  const defaultColumns: TableColumn<DocsTableRow>[] = [\n    columnFactories.createNameColumn(),\n    columnFactories.createOwnerColumn(),\n    columnFactories.createKindColumn(),\n    columnFactories.createTypeColumn(),\n  ];\n\n  const defaultActions: TableProps<DocsTableRow>['actions'] = [\n    actionFactories.createCopyDocsUrlAction(copyToClipboard),\n  ];\n\n  const pageSize = 20;\n  const paging = documents && documents.length > pageSize;\n\n  return (\n    <>\n      {loading || (documents && documents.length > 0) ? (\n        <Table<DocsTableRow>\n          isLoading={loading}\n          options={{\n            paging,\n            pageSize,\n            search: true,\n            actionsColumnIndex: -1,\n            ...options,\n          }}\n          data={documents}\n          columns={columns || defaultColumns}\n          actions={actions || defaultActions}\n          title={\n            title\n              ? `${title} (${documents.length})`\n              : `All (${documents.length})`\n          }\n        />\n      ) : (\n        <EmptyState\n          missing=\"data\"\n          title=\"No documents to show\"\n          description=\"Create your own document. Check out our Getting Started Information\"\n          action={\n            <LinkButton\n              color=\"primary\"\n              to=\"https://backstage.io/docs/features/techdocs/getting-started\"\n              variant=\"contained\"\n            >\n              DOCS\n            </LinkButton>\n          }\n        />\n      )}\n    </>\n  );\n};\n\nDocsTable.columns = columnFactories;\nDocsTable.actions = actionFactories;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"DocsTable.esm.js","sources":["../../../../src/home/components/Tables/DocsTable.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 React from 'react';\nimport useCopyToClipboard from 'react-use/esm/useCopyToClipboard';\n\nimport { configApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { Entity, RELATION_OWNED_BY } from '@backstage/catalog-model';\nimport {\n  getEntityRelations,\n  humanizeEntityRef,\n} from '@backstage/plugin-catalog-react';\nimport { rootDocsRouteRef } from '../../../routes';\nimport {\n  EmptyState,\n  LinkButton,\n  Table,\n  TableColumn,\n  TableOptions,\n  TableProps,\n} from '@backstage/core-components';\nimport { actionFactories } from './actions';\nimport { columnFactories } from './columns';\nimport { toLowerMaybe } from '../../../helpers';\nimport { DocsTableRow } from './types';\n\n/**\n * Props for {@link DocsTable}.\n *\n * @public\n */\nexport type DocsTableProps = {\n  entities: Entity[] | undefined;\n  title?: string | undefined;\n  loading?: boolean | undefined;\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  options?: TableOptions<DocsTableRow>;\n};\n\n/**\n * Component which renders a table documents\n *\n * @public\n */\nexport const DocsTable = (props: DocsTableProps) => {\n  const { entities, title, loading, columns, actions, options } = props;\n  const [, copyToClipboard] = useCopyToClipboard();\n  const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef);\n  const config = useApi(configApiRef);\n  if (!entities) return null;\n\n  const documents = entities.map(entity => {\n    const ownedByRelations = getEntityRelations(entity, RELATION_OWNED_BY);\n    return {\n      entity,\n      resolved: {\n        docsUrl: getRouteToReaderPageFor({\n          namespace: toLowerMaybe(\n            entity.metadata.namespace ?? 'default',\n            config,\n          ),\n          kind: toLowerMaybe(entity.kind, config),\n          name: toLowerMaybe(entity.metadata.name, config),\n        }),\n        ownedByRelations,\n        ownedByRelationsTitle: ownedByRelations\n          .map(r => humanizeEntityRef(r, { defaultKind: 'group' }))\n          .join(', '),\n      },\n    };\n  });\n\n  const defaultColumns: TableColumn<DocsTableRow>[] = [\n    columnFactories.createNameColumn(),\n    columnFactories.createOwnerColumn(),\n    columnFactories.createKindColumn(),\n    columnFactories.createTypeColumn(),\n  ];\n\n  const defaultActions: TableProps<DocsTableRow>['actions'] = [\n    actionFactories.createCopyDocsUrlAction(copyToClipboard),\n  ];\n\n  const pageSize = 20;\n  const paging = documents && documents.length > pageSize;\n\n  return (\n    <>\n      {loading || (documents && documents.length > 0) ? (\n        <Table<DocsTableRow>\n          isLoading={loading}\n          options={{\n            paging,\n            pageSize,\n            search: true,\n            actionsColumnIndex: -1,\n            ...options,\n          }}\n          data={documents}\n          columns={columns || defaultColumns}\n          actions={actions || defaultActions}\n          title={\n            title\n              ? `${title} (${documents.length})`\n              : `All (${documents.length})`\n          }\n        />\n      ) : (\n        <EmptyState\n          missing=\"data\"\n          title=\"No documents to show\"\n          description=\"Create your own document. Check out our Getting Started Information\"\n          action={\n            <LinkButton\n              color=\"primary\"\n              to=\"https://backstage.io/docs/features/techdocs/getting-started\"\n              variant=\"contained\"\n            >\n              DOCS\n            </LinkButton>\n          }\n        />\n      )}\n    </>\n  );\n};\n\nDocsTable.columns = columnFactories;\nDocsTable.actions = actionFactories;\n"],"names":[],"mappings":"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"}

package/dist/home/components/Tables/EntityListDocsTable.esm.js

@@ -8,12 +8,11 @@ import { actionFactories } from './actions.esm.js';
 import { columnFactories } from './columns.esm.js';
 
 const EntityListDocsTable = (props) => {
-  var _a, _b;
   const { columns, actions, options } = props;
   const { loading, error, entities, filters } = useEntityList();
   const { isStarredEntity, toggleStarredEntity } = useStarredEntities();
   const [, copyToClipboard] = useCopyToClipboard();
-  const title = capitalize((_b = (_a = filters.user) == null ? void 0 : _a.value) != null ? _b : "all");
+  const title = capitalize(filters.user?.value ?? "all");
   const defaultActions = [
     actionFactories.createCopyDocsUrlAction(copyToClipboard),
     actionFactories.createStarEntityAction(

package/dist/home/components/Tables/EntityListDocsTable.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityListDocsTable.esm.js","sources":["../../../../src/home/components/Tables/EntityListDocsTable.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 React from 'react';\nimport useCopyToClipboard from 'react-use/esm/useCopyToClipboard';\nimport { capitalize } from 'lodash';\nimport {\n  CodeSnippet,\n  TableColumn,\n  TableOptions,\n  TableProps,\n  WarningPanel,\n} from '@backstage/core-components';\nimport {\n  useEntityList,\n  useStarredEntities,\n} from '@backstage/plugin-catalog-react';\nimport { DocsTable } from './DocsTable';\nimport { actionFactories } from './actions';\nimport { columnFactories } from './columns';\nimport { DocsTableRow } from './types';\n\n/**\n * Props for {@link EntityListDocsTable}.\n *\n * @public\n */\nexport type EntityListDocsTableProps = {\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  options?: TableOptions<DocsTableRow>;\n};\n\n/**\n * Component which renders a table with entities from catalog.\n *\n * @public\n */\nexport const EntityListDocsTable = (props: EntityListDocsTableProps) => {\n  const { columns, actions, options } = props;\n  const { loading, error, entities, filters } = useEntityList();\n  const { isStarredEntity, toggleStarredEntity } = useStarredEntities();\n  const [, copyToClipboard] = useCopyToClipboard();\n\n  const title = capitalize(filters.user?.value ?? 'all');\n\n  const defaultActions = [\n    actionFactories.createCopyDocsUrlAction(copyToClipboard),\n    actionFactories.createStarEntityAction(\n      isStarredEntity,\n      toggleStarredEntity,\n    ),\n  ];\n\n  if (error) {\n    return (\n      <WarningPanel\n        severity=\"error\"\n        title=\"Could not load available documentation.\"\n      >\n        <CodeSnippet language=\"text\" text={error.toString()} />\n      </WarningPanel>\n    );\n  }\n\n  return (\n    <DocsTable\n      title={title}\n      entities={entities}\n      loading={loading}\n      actions={actions || defaultActions}\n      columns={columns}\n      options={options}\n    />\n  );\n};\n\nEntityListDocsTable.columns = columnFactories;\nEntityListDocsTable.actions = actionFactories;\n"],"names":[],"mappings":";;;;;;;;;AAmDa,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AAnDxE,EAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AAoDE,EAAA,MAAM,EAAE,OAAA,EAAS,OAAS,EAAA,OAAA,EAAY,GAAA,KAAA,CAAA;AACtC,EAAA,MAAM,EAAE,OAAS,EAAA,KAAA,EAAO,QAAU,EAAA,OAAA,KAAY,aAAc,EAAA,CAAA;AAC5D,EAAA,MAAM,EAAE,eAAA,EAAiB,mBAAoB,EAAA,GAAI,kBAAmB,EAAA,CAAA;AACpE,EAAA,MAAM,GAAG,eAAe,CAAA,GAAI,kBAAmB,EAAA,CAAA;AAE/C,EAAA,MAAM,QAAQ,UAAW,CAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,OAAA,CAAQ,SAAR,IAAc,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,KAAd,YAAuB,KAAK,CAAA,CAAA;AAErD,EAAA,MAAM,cAAiB,GAAA;AAAA,IACrB,eAAA,CAAgB,wBAAwB,eAAe,CAAA;AAAA,IACvD,eAAgB,CAAA,sBAAA;AAAA,MACd,eAAA;AAAA,MACA,mBAAA;AAAA,KACF;AAAA,GACF,CAAA;AAEA,EAAA,IAAI,KAAO,EAAA;AACT,IACE,uBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,QAAS,EAAA,OAAA;AAAA,QACT,KAAM,EAAA,yCAAA;AAAA,OAAA;AAAA,0CAEL,WAAY,EAAA,EAAA,QAAA,EAAS,QAAO,IAAM,EAAA,KAAA,CAAM,UAAY,EAAA,CAAA;AAAA,KACvD,CAAA;AAAA,GAEJ;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAS,OAAW,IAAA,cAAA;AAAA,MACpB,OAAA;AAAA,MACA,OAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ,EAAA;AAEA,mBAAA,CAAoB,OAAU,GAAA,eAAA,CAAA;AAC9B,mBAAA,CAAoB,OAAU,GAAA,eAAA;;;;"}
+{"version":3,"file":"EntityListDocsTable.esm.js","sources":["../../../../src/home/components/Tables/EntityListDocsTable.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 React from 'react';\nimport useCopyToClipboard from 'react-use/esm/useCopyToClipboard';\nimport { capitalize } from 'lodash';\nimport {\n  CodeSnippet,\n  TableColumn,\n  TableOptions,\n  TableProps,\n  WarningPanel,\n} from '@backstage/core-components';\nimport {\n  useEntityList,\n  useStarredEntities,\n} from '@backstage/plugin-catalog-react';\nimport { DocsTable } from './DocsTable';\nimport { actionFactories } from './actions';\nimport { columnFactories } from './columns';\nimport { DocsTableRow } from './types';\n\n/**\n * Props for {@link EntityListDocsTable}.\n *\n * @public\n */\nexport type EntityListDocsTableProps = {\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  options?: TableOptions<DocsTableRow>;\n};\n\n/**\n * Component which renders a table with entities from catalog.\n *\n * @public\n */\nexport const EntityListDocsTable = (props: EntityListDocsTableProps) => {\n  const { columns, actions, options } = props;\n  const { loading, error, entities, filters } = useEntityList();\n  const { isStarredEntity, toggleStarredEntity } = useStarredEntities();\n  const [, copyToClipboard] = useCopyToClipboard();\n\n  const title = capitalize(filters.user?.value ?? 'all');\n\n  const defaultActions = [\n    actionFactories.createCopyDocsUrlAction(copyToClipboard),\n    actionFactories.createStarEntityAction(\n      isStarredEntity,\n      toggleStarredEntity,\n    ),\n  ];\n\n  if (error) {\n    return (\n      <WarningPanel\n        severity=\"error\"\n        title=\"Could not load available documentation.\"\n      >\n        <CodeSnippet language=\"text\" text={error.toString()} />\n      </WarningPanel>\n    );\n  }\n\n  return (\n    <DocsTable\n      title={title}\n      entities={entities}\n      loading={loading}\n      actions={actions || defaultActions}\n      columns={columns}\n      options={options}\n    />\n  );\n};\n\nEntityListDocsTable.columns = columnFactories;\nEntityListDocsTable.actions = actionFactories;\n"],"names":[],"mappings":";;;;;;;;;AAmDa,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AACtE,EAAA,MAAM,EAAE,OAAA,EAAS,OAAS,EAAA,OAAA,EAAY,GAAA,KAAA,CAAA;AACtC,EAAA,MAAM,EAAE,OAAS,EAAA,KAAA,EAAO,QAAU,EAAA,OAAA,KAAY,aAAc,EAAA,CAAA;AAC5D,EAAA,MAAM,EAAE,eAAA,EAAiB,mBAAoB,EAAA,GAAI,kBAAmB,EAAA,CAAA;AACpE,EAAA,MAAM,GAAG,eAAe,CAAA,GAAI,kBAAmB,EAAA,CAAA;AAE/C,EAAA,MAAM,KAAQ,GAAA,UAAA,CAAW,OAAQ,CAAA,IAAA,EAAM,SAAS,KAAK,CAAA,CAAA;AAErD,EAAA,MAAM,cAAiB,GAAA;AAAA,IACrB,eAAA,CAAgB,wBAAwB,eAAe,CAAA;AAAA,IACvD,eAAgB,CAAA,sBAAA;AAAA,MACd,eAAA;AAAA,MACA,mBAAA;AAAA,KACF;AAAA,GACF,CAAA;AAEA,EAAA,IAAI,KAAO,EAAA;AACT,IACE,uBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,QAAS,EAAA,OAAA;AAAA,QACT,KAAM,EAAA,yCAAA;AAAA,OAAA;AAAA,0CAEL,WAAY,EAAA,EAAA,QAAA,EAAS,QAAO,IAAM,EAAA,KAAA,CAAM,UAAY,EAAA,CAAA;AAAA,KACvD,CAAA;AAAA,GAEJ;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAS,OAAW,IAAA,cAAA;AAAA,MACpB,OAAA;AAAA,MACA,OAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ,EAAA;AAEA,mBAAA,CAAoB,OAAU,GAAA,eAAA,CAAA;AAC9B,mBAAA,CAAoB,OAAU,GAAA,eAAA;;;;"}

package/dist/home/components/TechDocsCustomHome.esm.js

@@ -62,8 +62,7 @@ const TechDocsCustomHome = (props) => {
       ]
     });
     return response.items.filter((entity) => {
-      var _a;
-      return !!((_a = entity.metadata.annotations) == null ? void 0 : _a["backstage.io/techdocs-ref"]);
+      return !!entity.metadata.annotations?.["backstage.io/techdocs-ref"];
     });
   });
   const currentTabConfig = tabsConfig[selectedTab];

package/dist/home/components/TechDocsCustomHome.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TechDocsCustomHome.esm.js","sources":["../../../src/home/components/TechDocsCustomHome.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 React, { useState } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { CSSProperties } from '@material-ui/styles/withStyles';\nimport {\n  CATALOG_FILTER_EXISTS,\n  catalogApiRef,\n  CatalogApi,\n  useEntityOwnership,\n} from '@backstage/plugin-catalog-react';\nimport { Entity } from '@backstage/catalog-model';\nimport { DocsTable } from './Tables';\nimport { DocsCardGrid } from './Grids';\nimport { TechDocsPageWrapper } from './TechDocsPageWrapper';\n\nimport {\n  CodeSnippet,\n  Content,\n  HeaderTabs,\n  Progress,\n  WarningPanel,\n  SupportButton,\n  ContentHeader,\n} from '@backstage/core-components';\nimport { useApi } from '@backstage/core-plugin-api';\n\nconst panels = {\n  DocsTable: DocsTable,\n  DocsCardGrid: DocsCardGrid,\n};\n\n/**\n * Available panel types\n *\n * @public\n */\nexport type PanelType = 'DocsCardGrid' | 'DocsTable';\n\n/**\n * Type representing a TechDocsCustomHome panel.\n *\n * @public\n */\nexport interface PanelConfig {\n  title: string;\n  description: string;\n  panelType: PanelType;\n  panelCSS?: CSSProperties;\n  filterPredicate: ((entity: Entity) => boolean) | string;\n}\n\n/**\n * Type representing a TechDocsCustomHome tab.\n *\n * @public\n */\nexport interface TabConfig {\n  label: string;\n  panels: PanelConfig[];\n}\n\n/**\n * Type representing a list of TechDocsCustomHome tabs.\n *\n * @public\n */\nexport type TabsConfig = TabConfig[];\n\nconst CustomPanel = ({\n  config,\n  entities,\n  index,\n}: {\n  config: PanelConfig;\n  entities: Entity[];\n  index: number;\n}) => {\n  const useStyles = makeStyles({\n    panelContainer: {\n      marginBottom: '2rem',\n      ...(config.panelCSS ? config.panelCSS : {}),\n    },\n  });\n  const classes = useStyles();\n  const { loading: loadingOwnership, isOwnedEntity } = useEntityOwnership();\n\n  const Panel = panels[config.panelType];\n\n  const shownEntities = entities.filter(entity => {\n    if (config.filterPredicate === 'ownedByUser') {\n      if (loadingOwnership) {\n        return false;\n      }\n      return isOwnedEntity(entity);\n    }\n\n    return (\n      typeof config.filterPredicate === 'function' &&\n      config.filterPredicate(entity)\n    );\n  });\n\n  return (\n    <>\n      <ContentHeader title={config.title} description={config.description}>\n        {index === 0 ? (\n          <SupportButton>\n            Discover documentation in your ecosystem.\n          </SupportButton>\n        ) : null}\n      </ContentHeader>\n      <div className={classes.panelContainer}>\n        <Panel data-testid=\"techdocs-custom-panel\" entities={shownEntities} />\n      </div>\n    </>\n  );\n};\n\n/**\n * Props for {@link TechDocsCustomHome}\n *\n * @public\n */\nexport type TechDocsCustomHomeProps = {\n  tabsConfig: TabsConfig;\n};\n\nexport const TechDocsCustomHome = (props: TechDocsCustomHomeProps) => {\n  const { tabsConfig } = props;\n  const [selectedTab, setSelectedTab] = useState<number>(0);\n  const catalogApi: CatalogApi = useApi(catalogApiRef);\n\n  const {\n    value: entities,\n    loading,\n    error,\n  } = useAsync(async () => {\n    const response = await catalogApi.getEntities({\n      filter: {\n        'metadata.annotations.backstage.io/techdocs-ref': CATALOG_FILTER_EXISTS,\n      },\n      fields: [\n        'apiVersion',\n        'kind',\n        'metadata',\n        'relations',\n        'spec.owner',\n        'spec.type',\n      ],\n    });\n    return response.items.filter((entity: Entity) => {\n      return !!entity.metadata.annotations?.['backstage.io/techdocs-ref'];\n    });\n  });\n\n  const currentTabConfig = tabsConfig[selectedTab];\n\n  if (loading) {\n    return (\n      <TechDocsPageWrapper>\n        <Content>\n          <Progress />\n        </Content>\n      </TechDocsPageWrapper>\n    );\n  }\n\n  if (error) {\n    return (\n      <TechDocsPageWrapper>\n        <Content>\n          <WarningPanel\n            severity=\"error\"\n            title=\"Could not load available documentation.\"\n          >\n            <CodeSnippet language=\"text\" text={error.toString()} />\n          </WarningPanel>\n        </Content>\n      </TechDocsPageWrapper>\n    );\n  }\n\n  return (\n    <TechDocsPageWrapper>\n      <HeaderTabs\n        selectedIndex={selectedTab}\n        onChange={index => setSelectedTab(index)}\n        tabs={tabsConfig.map(({ label }, index) => ({\n          id: index.toString(),\n          label,\n        }))}\n      />\n      <Content data-testid=\"techdocs-content\">\n        {currentTabConfig.panels.map((config, index) => (\n          <CustomPanel\n            key={index}\n            config={config}\n            entities={!!entities ? entities : []}\n            index={index}\n          />\n        ))}\n      </Content>\n    </TechDocsPageWrapper>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"TechDocsCustomHome.esm.js","sources":["../../../src/home/components/TechDocsCustomHome.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 React, { useState } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { CSSProperties } from '@material-ui/styles/withStyles';\nimport {\n  CATALOG_FILTER_EXISTS,\n  catalogApiRef,\n  CatalogApi,\n  useEntityOwnership,\n} from '@backstage/plugin-catalog-react';\nimport { Entity } from '@backstage/catalog-model';\nimport { DocsTable } from './Tables';\nimport { DocsCardGrid } from './Grids';\nimport { TechDocsPageWrapper } from './TechDocsPageWrapper';\n\nimport {\n  CodeSnippet,\n  Content,\n  HeaderTabs,\n  Progress,\n  WarningPanel,\n  SupportButton,\n  ContentHeader,\n} from '@backstage/core-components';\nimport { useApi } from '@backstage/core-plugin-api';\n\nconst panels = {\n  DocsTable: DocsTable,\n  DocsCardGrid: DocsCardGrid,\n};\n\n/**\n * Available panel types\n *\n * @public\n */\nexport type PanelType = 'DocsCardGrid' | 'DocsTable';\n\n/**\n * Type representing a TechDocsCustomHome panel.\n *\n * @public\n */\nexport interface PanelConfig {\n  title: string;\n  description: string;\n  panelType: PanelType;\n  panelCSS?: CSSProperties;\n  filterPredicate: ((entity: Entity) => boolean) | string;\n}\n\n/**\n * Type representing a TechDocsCustomHome tab.\n *\n * @public\n */\nexport interface TabConfig {\n  label: string;\n  panels: PanelConfig[];\n}\n\n/**\n * Type representing a list of TechDocsCustomHome tabs.\n *\n * @public\n */\nexport type TabsConfig = TabConfig[];\n\nconst CustomPanel = ({\n  config,\n  entities,\n  index,\n}: {\n  config: PanelConfig;\n  entities: Entity[];\n  index: number;\n}) => {\n  const useStyles = makeStyles({\n    panelContainer: {\n      marginBottom: '2rem',\n      ...(config.panelCSS ? config.panelCSS : {}),\n    },\n  });\n  const classes = useStyles();\n  const { loading: loadingOwnership, isOwnedEntity } = useEntityOwnership();\n\n  const Panel = panels[config.panelType];\n\n  const shownEntities = entities.filter(entity => {\n    if (config.filterPredicate === 'ownedByUser') {\n      if (loadingOwnership) {\n        return false;\n      }\n      return isOwnedEntity(entity);\n    }\n\n    return (\n      typeof config.filterPredicate === 'function' &&\n      config.filterPredicate(entity)\n    );\n  });\n\n  return (\n    <>\n      <ContentHeader title={config.title} description={config.description}>\n        {index === 0 ? (\n          <SupportButton>\n            Discover documentation in your ecosystem.\n          </SupportButton>\n        ) : null}\n      </ContentHeader>\n      <div className={classes.panelContainer}>\n        <Panel data-testid=\"techdocs-custom-panel\" entities={shownEntities} />\n      </div>\n    </>\n  );\n};\n\n/**\n * Props for {@link TechDocsCustomHome}\n *\n * @public\n */\nexport type TechDocsCustomHomeProps = {\n  tabsConfig: TabsConfig;\n};\n\nexport const TechDocsCustomHome = (props: TechDocsCustomHomeProps) => {\n  const { tabsConfig } = props;\n  const [selectedTab, setSelectedTab] = useState<number>(0);\n  const catalogApi: CatalogApi = useApi(catalogApiRef);\n\n  const {\n    value: entities,\n    loading,\n    error,\n  } = useAsync(async () => {\n    const response = await catalogApi.getEntities({\n      filter: {\n        'metadata.annotations.backstage.io/techdocs-ref': CATALOG_FILTER_EXISTS,\n      },\n      fields: [\n        'apiVersion',\n        'kind',\n        'metadata',\n        'relations',\n        'spec.owner',\n        'spec.type',\n      ],\n    });\n    return response.items.filter((entity: Entity) => {\n      return !!entity.metadata.annotations?.['backstage.io/techdocs-ref'];\n    });\n  });\n\n  const currentTabConfig = tabsConfig[selectedTab];\n\n  if (loading) {\n    return (\n      <TechDocsPageWrapper>\n        <Content>\n          <Progress />\n        </Content>\n      </TechDocsPageWrapper>\n    );\n  }\n\n  if (error) {\n    return (\n      <TechDocsPageWrapper>\n        <Content>\n          <WarningPanel\n            severity=\"error\"\n            title=\"Could not load available documentation.\"\n          >\n            <CodeSnippet language=\"text\" text={error.toString()} />\n          </WarningPanel>\n        </Content>\n      </TechDocsPageWrapper>\n    );\n  }\n\n  return (\n    <TechDocsPageWrapper>\n      <HeaderTabs\n        selectedIndex={selectedTab}\n        onChange={index => setSelectedTab(index)}\n        tabs={tabsConfig.map(({ label }, index) => ({\n          id: index.toString(),\n          label,\n        }))}\n      />\n      <Content data-testid=\"techdocs-content\">\n        {currentTabConfig.panels.map((config, index) => (\n          <CustomPanel\n            key={index}\n            config={config}\n            entities={!!entities ? entities : []}\n            index={index}\n          />\n        ))}\n      </Content>\n    </TechDocsPageWrapper>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/home/components/TechDocsIndexPage.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TechDocsIndexPage.esm.js","sources":["../../../src/home/components/TechDocsIndexPage.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 React from 'react';\nimport { useOutlet } from 'react-router-dom';\nimport { TableColumn, TableProps } from '@backstage/core-components';\nimport { UserListFilterKind } from '@backstage/plugin-catalog-react';\nimport { DefaultTechDocsHome } from './DefaultTechDocsHome';\nimport { DocsTableRow } from './Tables';\n\n/**\n * Props for {@link TechDocsIndexPage}\n *\n * @public\n */\nexport type TechDocsIndexPageProps = {\n  initialFilter?: UserListFilterKind;\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n};\n\nexport const TechDocsIndexPage = (props: TechDocsIndexPageProps) => {\n  const outlet = useOutlet();\n\n  return outlet || <DefaultTechDocsHome {...props} />;\n};\n"],"names":[],"mappings":";;;;AAkCa,MAAA,iBAAA,GAAoB,CAAC,KAAkC,KAAA;AAClE,EAAA,MAAM,SAAS,SAAU,EAAA,CAAA;AAEzB,EAAA,OAAO,MAAU,oBAAA,KAAA,CAAA,aAAA,CAAC,mBAAqB,EAAA,EAAA,GAAG,KAAO,EAAA,CAAA,CAAA;AACnD;;;;"}
+{"version":3,"file":"TechDocsIndexPage.esm.js","sources":["../../../src/home/components/TechDocsIndexPage.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 React from 'react';\nimport { useOutlet } from 'react-router-dom';\nimport { TableColumn, TableProps } from '@backstage/core-components';\nimport {\n  EntityOwnerPickerProps,\n  UserListFilterKind,\n} from '@backstage/plugin-catalog-react';\nimport { DefaultTechDocsHome } from './DefaultTechDocsHome';\nimport { DocsTableRow } from './Tables';\n\n/**\n * Props for {@link TechDocsIndexPage}\n *\n * @public\n */\nexport type TechDocsIndexPageProps = {\n  initialFilter?: UserListFilterKind;\n  columns?: TableColumn<DocsTableRow>[];\n  actions?: TableProps<DocsTableRow>['actions'];\n  ownerPickerMode?: EntityOwnerPickerProps['mode'];\n};\n\nexport const TechDocsIndexPage = (props: TechDocsIndexPageProps) => {\n  const outlet = useOutlet();\n\n  return outlet || <DefaultTechDocsHome {...props} />;\n};\n"],"names":[],"mappings":";;;;AAsCa,MAAA,iBAAA,GAAoB,CAAC,KAAkC,KAAA;AAClE,EAAA,MAAM,SAAS,SAAU,EAAA,CAAA;AAEzB,EAAA,OAAO,MAAU,oBAAA,KAAA,CAAA,aAAA,CAAC,mBAAqB,EAAA,EAAA,GAAG,KAAO,EAAA,CAAA,CAAA;AACnD;;;;"}

package/dist/home/components/TechDocsPageWrapper.esm.js

@@ -3,10 +3,9 @@ import { PageWithHeader } from '@backstage/core-components';
 import { useApi, configApiRef } from '@backstage/core-plugin-api';
 
 const TechDocsPageWrapper = (props) => {
-  var _a;
   const { children } = props;
   const configApi = useApi(configApiRef);
-  const generatedSubtitle = `Documentation available in ${(_a = configApi.getOptionalString("organization.name")) != null ? _a : "Backstage"}`;
+  const generatedSubtitle = `Documentation available in ${configApi.getOptionalString("organization.name") ?? "Backstage"}`;
   return /* @__PURE__ */ React.createElement(
     PageWithHeader,
     {

package/dist/home/components/TechDocsPageWrapper.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TechDocsPageWrapper.esm.js","sources":["../../../src/home/components/TechDocsPageWrapper.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 React from 'react';\n\nimport { PageWithHeader } from '@backstage/core-components';\nimport { useApi, configApiRef } from '@backstage/core-plugin-api';\n\n/**\n * Props for {@link TechDocsPageWrapper}\n *\n * @public\n */\nexport type TechDocsPageWrapperProps = {\n  children?: React.ReactNode;\n};\n\n/**\n * Component wrapping a TechDocs page with Page and Header components\n *\n * @public\n */\nexport const TechDocsPageWrapper = (props: TechDocsPageWrapperProps) => {\n  const { children } = props;\n  const configApi = useApi(configApiRef);\n  const generatedSubtitle = `Documentation available in ${\n    configApi.getOptionalString('organization.name') ?? 'Backstage'\n  }`;\n\n  return (\n    <PageWithHeader\n      title=\"Documentation\"\n      subtitle={generatedSubtitle}\n      themeId=\"documentation\"\n    >\n      {children}\n    </PageWithHeader>\n  );\n};\n"],"names":[],"mappings":";;;;AAmCa,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AAnCxE,EAAA,IAAA,EAAA,CAAA;AAoCE,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA,CAAA;AACrB,EAAM,MAAA,SAAA,GAAY,OAAO,YAAY,CAAA,CAAA;AACrC,EAAA,MAAM,oBAAoB,CACxB,2BAAA,EAAA,CAAA,EAAA,GAAA,SAAA,CAAU,kBAAkB,mBAAmB,CAAA,KAA/C,YAAoD,WACtD,CAAA,CAAA,CAAA;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,eAAA;AAAA,MACN,QAAU,EAAA,iBAAA;AAAA,MACV,OAAQ,EAAA,eAAA;AAAA,KAAA;AAAA,IAEP,QAAA;AAAA,GACH,CAAA;AAEJ;;;;"}
+{"version":3,"file":"TechDocsPageWrapper.esm.js","sources":["../../../src/home/components/TechDocsPageWrapper.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 React from 'react';\n\nimport { PageWithHeader } from '@backstage/core-components';\nimport { useApi, configApiRef } from '@backstage/core-plugin-api';\n\n/**\n * Props for {@link TechDocsPageWrapper}\n *\n * @public\n */\nexport type TechDocsPageWrapperProps = {\n  children?: React.ReactNode;\n};\n\n/**\n * Component wrapping a TechDocs page with Page and Header components\n *\n * @public\n */\nexport const TechDocsPageWrapper = (props: TechDocsPageWrapperProps) => {\n  const { children } = props;\n  const configApi = useApi(configApiRef);\n  const generatedSubtitle = `Documentation available in ${\n    configApi.getOptionalString('organization.name') ?? 'Backstage'\n  }`;\n\n  return (\n    <PageWithHeader\n      title=\"Documentation\"\n      subtitle={generatedSubtitle}\n      themeId=\"documentation\"\n    >\n      {children}\n    </PageWithHeader>\n  );\n};\n"],"names":[],"mappings":";;;;AAmCa,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AACtE,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA,CAAA;AACrB,EAAM,MAAA,SAAA,GAAY,OAAO,YAAY,CAAA,CAAA;AACrC,EAAA,MAAM,oBAAoB,CACxB,2BAAA,EAAA,SAAA,CAAU,iBAAkB,CAAA,mBAAmB,KAAK,WACtD,CAAA,CAAA,CAAA;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,eAAA;AAAA,MACN,QAAU,EAAA,iBAAA;AAAA,MACV,OAAQ,EAAA,eAAA;AAAA,KAAA;AAAA,IAEP,QAAA;AAAA,GACH,CAAA;AAEJ;;;;"}

package/dist/index.d.ts

@@ -8,7 +8,7 @@ import * as React from 'react';
 import React__default, { ReactNode, PropsWithChildren } from 'react';
 import { ToolbarProps } from '@material-ui/core/Toolbar';
 import { TableColumn, TableProps, TableOptions } from '@backstage/core-components';
-import { UserListFilterKind } from '@backstage/plugin-catalog-react';
+import { UserListFilterKind, EntityOwnerPickerProps } from '@backstage/plugin-catalog-react';
 import { CSSProperties } from '@material-ui/styles/withStyles';
 import { SearchResultListItemExtensionProps } from '@backstage/plugin-search-react';
 import { ResultHighlight } from '@backstage/plugin-search-common';
@@ -121,13 +121,13 @@ declare class TechDocsClient implements TechDocsApi$1 {
 declare class TechDocsStorageClient implements TechDocsStorageApi$1 {
     configApi: Config;
     discoveryApi: DiscoveryApi;
-    identityApi: IdentityApi;
     private fetchApi;
     constructor(options: {
         configApi: Config;
         discoveryApi: DiscoveryApi;
-        identityApi: IdentityApi;
         fetchApi: FetchApi;
+        /** @deprecated identityApi is not needed any more */
+        identityApi?: IdentityApi;
     });
     getApiOrigin(): Promise<string>;
     getStorageUrl(): Promise<string>;
@@ -449,6 +449,7 @@ type TechDocsIndexPageProps = {
     initialFilter?: UserListFilterKind;
     columns?: TableColumn<DocsTableRow>[];
     actions?: TableProps<DocsTableRow>['actions'];
+    ownerPickerMode?: EntityOwnerPickerProps['mode'];
 };
 
 /**

package/dist/plugin.esm.js

@@ -1,7 +1,7 @@
 import { techdocsStorageApiRef, techdocsApiRef } from '@backstage/plugin-techdocs-react';
 import { TechDocsStorageClient, TechDocsClient } from './client.esm.js';
 import { rootRouteRef, rootDocsRouteRef, rootCatalogDocsRouteRef } from './routes.esm.js';
-import { createPlugin, createApiFactory, configApiRef, discoveryApiRef, identityApiRef, fetchApiRef, createRoutableExtension } from '@backstage/core-plugin-api';
+import { createPlugin, createApiFactory, configApiRef, discoveryApiRef, fetchApiRef, createRoutableExtension } from '@backstage/core-plugin-api';
 import { createSearchResultListItemExtension } from '@backstage/plugin-search-react';
 
 const techdocsPlugin = createPlugin({
@@ -12,13 +12,11 @@ const techdocsPlugin = createPlugin({
       deps: {
         configApi: configApiRef,
         discoveryApi: discoveryApiRef,
-        identityApi: identityApiRef,
         fetchApi: fetchApiRef
       },
-      factory: ({ configApi, discoveryApi, identityApi, fetchApi }) => new TechDocsStorageClient({
+      factory: ({ configApi, discoveryApi, fetchApi }) => new TechDocsStorageClient({
         configApi,
         discoveryApi,
-        identityApi,
         fetchApi
       })
     }),

package/dist/plugin.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"plugin.esm.js","sources":["../src/plugin.ts"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  techdocsApiRef,\n  techdocsStorageApiRef,\n} from '@backstage/plugin-techdocs-react';\nimport { TechDocsClient, TechDocsStorageClient } from './client';\nimport {\n  rootDocsRouteRef,\n  rootRouteRef,\n  rootCatalogDocsRouteRef,\n} from './routes';\nimport {\n  configApiRef,\n  createApiFactory,\n  createPlugin,\n  createRoutableExtension,\n  discoveryApiRef,\n  fetchApiRef,\n  identityApiRef,\n} from '@backstage/core-plugin-api';\nimport {\n  createSearchResultListItemExtension,\n  SearchResultListItemExtensionProps,\n} from '@backstage/plugin-search-react';\nimport { TechDocsSearchResultListItemProps } from './search/components/TechDocsSearchResultListItem';\n\n/**\n * The Backstage plugin that renders technical documentation for your components\n *\n * @public\n */\nexport const techdocsPlugin = createPlugin({\n  id: 'techdocs',\n  apis: [\n    createApiFactory({\n      api: techdocsStorageApiRef,\n      deps: {\n        configApi: configApiRef,\n        discoveryApi: discoveryApiRef,\n        identityApi: identityApiRef,\n        fetchApi: fetchApiRef,\n      },\n      factory: ({ configApi, discoveryApi, identityApi, fetchApi }) =>\n        new TechDocsStorageClient({\n          configApi,\n          discoveryApi,\n          identityApi,\n          fetchApi,\n        }),\n    }),\n    createApiFactory({\n      api: techdocsApiRef,\n      deps: {\n        configApi: configApiRef,\n        discoveryApi: discoveryApiRef,\n        fetchApi: fetchApiRef,\n      },\n      factory: ({ configApi, discoveryApi, fetchApi }) =>\n        new TechDocsClient({\n          configApi,\n          discoveryApi,\n          fetchApi,\n        }),\n    }),\n  ],\n  routes: {\n    root: rootRouteRef,\n    docRoot: rootDocsRouteRef,\n    entityContent: rootCatalogDocsRouteRef,\n  },\n});\n\n/**\n * Routable extension used to render docs\n *\n * @public\n */\nexport const TechdocsPage = techdocsPlugin.provide(\n  createRoutableExtension({\n    name: 'TechdocsPage',\n    component: () => import('./Router').then(m => m.Router),\n    mountPoint: rootRouteRef,\n  }),\n);\n\n/**\n * Routable extension used to render docs on Entity page\n *\n * @public\n */\nexport const EntityTechdocsContent = techdocsPlugin.provide(\n  createRoutableExtension({\n    name: 'EntityTechdocsContent',\n    component: () => import('./Router').then(m => m.EmbeddedDocsRouter),\n    mountPoint: rootCatalogDocsRouteRef,\n  }),\n);\n\n/**\n * Component which takes a custom tabs config object and renders a documentation landing page.\n *\n * @public\n */\nexport const TechDocsCustomHome = techdocsPlugin.provide(\n  createRoutableExtension({\n    name: 'TechDocsCustomHome',\n    component: () =>\n      import('./home/components/TechDocsCustomHome').then(\n        m => m.TechDocsCustomHome,\n      ),\n    mountPoint: rootRouteRef,\n  }),\n);\n\n/**\n * Responsible for rendering the provided router element\n *\n * @public\n */\nexport const TechDocsIndexPage = techdocsPlugin.provide(\n  createRoutableExtension({\n    name: 'TechDocsIndexPage',\n    component: () =>\n      import('./home/components/TechDocsIndexPage').then(\n        m => m.TechDocsIndexPage,\n      ),\n    mountPoint: rootRouteRef,\n  }),\n);\n\n/**\n * Component responsible for composing a TechDocs reader page experience\n *\n * @public\n */\nexport const TechDocsReaderPage = techdocsPlugin.provide(\n  createRoutableExtension({\n    name: 'TechDocsReaderPage',\n    component: () =>\n      import('./reader/components/TechDocsReaderPage').then(\n        m => m.TechDocsReaderPage,\n      ),\n    mountPoint: rootDocsRouteRef,\n  }),\n);\n\n/**\n * React extension used to render results on Search page or modal\n *\n * @public\n */\nexport const TechDocsSearchResultListItem: (\n  props: SearchResultListItemExtensionProps<TechDocsSearchResultListItemProps>,\n) => JSX.Element | null = techdocsPlugin.provide(\n  createSearchResultListItemExtension({\n    name: 'TechDocsSearchResultListItem',\n    component: () =>\n      import('./search/components/TechDocsSearchResultListItem').then(\n        m => m.TechDocsSearchResultListItem,\n      ),\n    predicate: result => result.type === 'techdocs',\n  }),\n);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"plugin.esm.js","sources":["../src/plugin.ts"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  techdocsApiRef,\n  techdocsStorageApiRef,\n} from '@backstage/plugin-techdocs-react';\nimport { TechDocsClient, TechDocsStorageClient } from './client';\nimport {\n  rootDocsRouteRef,\n  rootRouteRef,\n  rootCatalogDocsRouteRef,\n} from './routes';\nimport {\n  configApiRef,\n  createApiFactory,\n  createPlugin,\n  createRoutableExtension,\n  discoveryApiRef,\n  fetchApiRef,\n} from '@backstage/core-plugin-api';\nimport {\n  createSearchResultListItemExtension,\n  SearchResultListItemExtensionProps,\n} from '@backstage/plugin-search-react';\nimport { TechDocsSearchResultListItemProps } from './search/components/TechDocsSearchResultListItem';\n\n/**\n * The Backstage plugin that renders technical documentation for your components\n *\n * @public\n */\nexport const techdocsPlugin = createPlugin({\n  id: 'techdocs',\n  apis: [\n    createApiFactory({\n      api: techdocsStorageApiRef,\n      deps: {\n        configApi: configApiRef,\n        discoveryApi: discoveryApiRef,\n        fetchApi: fetchApiRef,\n      },\n      factory: ({ configApi, discoveryApi, fetchApi }) =>\n        new TechDocsStorageClient({\n          configApi,\n          discoveryApi,\n          fetchApi,\n        }),\n    }),\n    createApiFactory({\n      api: techdocsApiRef,\n      deps: {\n        configApi: configApiRef,\n        discoveryApi: discoveryApiRef,\n        fetchApi: fetchApiRef,\n      },\n      factory: ({ configApi, discoveryApi, fetchApi }) =>\n        new TechDocsClient({\n          configApi,\n          discoveryApi,\n          fetchApi,\n        }),\n    }),\n  ],\n  routes: {\n    root: rootRouteRef,\n    docRoot: rootDocsRouteRef,\n    entityContent: rootCatalogDocsRouteRef,\n  },\n});\n\n/**\n * Routable extension used to render docs\n *\n * @public\n */\nexport const TechdocsPage = techdocsPlugin.provide(\n  createRoutableExtension({\n    name: 'TechdocsPage',\n    component: () => import('./Router').then(m => m.Router),\n    mountPoint: rootRouteRef,\n  }),\n);\n\n/**\n * Routable extension used to render docs on Entity page\n *\n * @public\n */\nexport const EntityTechdocsContent = techdocsPlugin.provide(\n  createRoutableExtension({\n    name: 'EntityTechdocsContent',\n    component: () => import('./Router').then(m => m.EmbeddedDocsRouter),\n    mountPoint: rootCatalogDocsRouteRef,\n  }),\n);\n\n/**\n * Component which takes a custom tabs config object and renders a documentation landing page.\n *\n * @public\n */\nexport const TechDocsCustomHome = techdocsPlugin.provide(\n  createRoutableExtension({\n    name: 'TechDocsCustomHome',\n    component: () =>\n      import('./home/components/TechDocsCustomHome').then(\n        m => m.TechDocsCustomHome,\n      ),\n    mountPoint: rootRouteRef,\n  }),\n);\n\n/**\n * Responsible for rendering the provided router element\n *\n * @public\n */\nexport const TechDocsIndexPage = techdocsPlugin.provide(\n  createRoutableExtension({\n    name: 'TechDocsIndexPage',\n    component: () =>\n      import('./home/components/TechDocsIndexPage').then(\n        m => m.TechDocsIndexPage,\n      ),\n    mountPoint: rootRouteRef,\n  }),\n);\n\n/**\n * Component responsible for composing a TechDocs reader page experience\n *\n * @public\n */\nexport const TechDocsReaderPage = techdocsPlugin.provide(\n  createRoutableExtension({\n    name: 'TechDocsReaderPage',\n    component: () =>\n      import('./reader/components/TechDocsReaderPage').then(\n        m => m.TechDocsReaderPage,\n      ),\n    mountPoint: rootDocsRouteRef,\n  }),\n);\n\n/**\n * React extension used to render results on Search page or modal\n *\n * @public\n */\nexport const TechDocsSearchResultListItem: (\n  props: SearchResultListItemExtensionProps<TechDocsSearchResultListItemProps>,\n) => JSX.Element | null = techdocsPlugin.provide(\n  createSearchResultListItemExtension({\n    name: 'TechDocsSearchResultListItem',\n    component: () =>\n      import('./search/components/TechDocsSearchResultListItem').then(\n        m => m.TechDocsSearchResultListItem,\n      ),\n    predicate: result => result.type === 'techdocs',\n  }),\n);\n"],"names":[],"mappings":"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"}

package/dist/reader/components/TechDocsReaderPage/TechDocsReaderPage.esm.js

@@ -20,10 +20,7 @@ const TechDocsReaderPage = (props) => {
   if (!children) {
     const childrenList = outlet ? Children.toArray(outlet.props.children) : [];
     const grandChildren = childrenList.flatMap(
-      (child) => {
-        var _a, _b;
-        return (_b = (_a = child == null ? void 0 : child.props) == null ? void 0 : _a.children) != null ? _b : [];
-      }
+      (child) => child?.props?.children ?? []
     );
     const page = grandChildren.find(
       (grandChild) => !getComponentData(grandChild, TECHDOCS_ADDONS_WRAPPER_KEY) && !getComponentData(grandChild, TECHDOCS_ADDONS_KEY)

package/dist/reader/components/TechDocsReaderPage/TechDocsReaderPage.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TechDocsReaderPage.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPage/TechDocsReaderPage.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { ReactNode, Children, ReactElement } from 'react';\nimport { useOutlet } from 'react-router-dom';\n\nimport { Page } from '@backstage/core-components';\nimport { CompoundEntityRef } from '@backstage/catalog-model';\nimport {\n  TECHDOCS_ADDONS_WRAPPER_KEY,\n  TECHDOCS_ADDONS_KEY,\n  TechDocsReaderPageProvider,\n} from '@backstage/plugin-techdocs-react';\n\nimport { TechDocsReaderPageRenderFunction } from '../../../types';\n\nimport { TechDocsReaderPageContent } from '../TechDocsReaderPageContent';\nimport { TechDocsReaderPageHeader } from '../TechDocsReaderPageHeader';\nimport { TechDocsReaderPageSubheader } from '../TechDocsReaderPageSubheader';\nimport { rootDocsRouteRef } from '../../../routes';\nimport {\n  getComponentData,\n  useRouteRefParams,\n} from '@backstage/core-plugin-api';\n\nimport { CookieAuthRefreshProvider } from '@backstage/plugin-auth-react';\n\n/* An explanation for the multiple ways of customizing the TechDocs reader page\n\nPlease refer to this page on the microsite for the latest recommended approach:\nhttps://backstage.io/docs/features/techdocs/how-to-guides#how-to-customize-the-techdocs-reader-page\n\nThe <TechDocsReaderPage> component is responsible for rendering the <TechDocsReaderPageProvider> and\nits contained version of a <Page>, which in turn renders the <TechDocsReaderPageContent>.\n\nHistorically, there have been different approaches on how this <Page> can be customized, and how the\n<TechDocsReaderPageContent> inside could be exchanged for a custom implementation (which was not\npossible before). Also, the current implementation supports every scenario to avoid breaking default\nconfigurations of TechDocs.\n\nIn particular, there are 4 different TechDocs page configurations:\n\nCONFIGURATION 1: <TechDocsReaderPage> only, no children\n\n<Route path=\"/docs/:namespace/:kind/:name/*\" element={<TechDocsReaderPage />} >\n\nThis is the simplest way to use TechDocs. Only a full page is passed, assuming that it comes with\nits content inside. Since we allowed customizing it, we started providing <TechDocsReaderLayout> as\na default implementation (which contains <TechDocsReaderPageContent>).\n\nCONFIGURATION 2 (not advised): <TechDocsReaderPage> with element children\n\n<Route\n  path=\"/docs/:namespace/:kind/:name/*\"\n  element={\n    <TechDocsReaderPage>\n      {techdocsPage}\n    </TechDocsReaderPage>\n  }\n/>\n\nPreviously, there were two ways of passing children to <TechDocsReaderPage>: either as elements (as\nshown above), or as a render function (described below in CONFIGURATION 3). The \"techdocsPage\" is\nlocated in packages/app/src/components/techdocs and is the default implementation of the content\ninside.\n\nCONFIGURATION 3 (not advised): <TechDocsReaderPage> with render function as child\n\n<Route\n  path=\"/docs/:namespace/:kind/:name/*\"\n  element={\n    <TechDocsReaderPage>\n      {({ metadata, entityMetadata, onReady }) => (\n        techdocsPage\n      )}\n    </TechDocsReaderPage>\n  }\n/>\n\nSimilar to CONFIGURATION 2, the direct children will be passed to the <TechDocsReaderPage> but in\nthis case interpreted as render prop.\n\nCONFIGURATION 4: <TechDocsReaderPage> and provided content in <Route>\n\n<Route\n  path=\"/docs/:namespace/:kind/:name/*\"\n  element={<TechDocsReaderPage />}\n>\n  {techDocsPage}\n  <TechDocsAddons>\n    <ExpandableNavigation />\n    <ReportIssue />\n    <TextSize />\n    <LightBox />\n  </TechDocsAddons>\n</Route>\n\nThis is the current state in packages/app/src/App.tsx and moved the location of children from inside\nthe element prop in the <Route> to the children of the <Route>. Then, in <TechDocsReaderPage> they\nare retrieved using the useOutlet hook from React Router.\n\nNOTE: Render functions are no longer supported in this approach.\n*/\n\n/**\n * Props for {@link TechDocsReaderLayout}\n * @public\n */\nexport type TechDocsReaderLayoutProps = {\n  /**\n   * Show or hide the header, defaults to true.\n   */\n  withHeader?: boolean;\n  /**\n   * Show or hide the content search bar, defaults to true.\n   */\n  withSearch?: boolean;\n};\n\n/**\n * Default TechDocs reader page structure composed with a header and content\n * @public\n */\nexport const TechDocsReaderLayout = (props: TechDocsReaderLayoutProps) => {\n  const { withSearch, withHeader = true } = props;\n  return (\n    <Page themeId=\"documentation\">\n      {withHeader && <TechDocsReaderPageHeader />}\n      <TechDocsReaderPageSubheader />\n      <TechDocsReaderPageContent withSearch={withSearch} />\n    </Page>\n  );\n};\n\n/**\n * @public\n */\nexport type TechDocsReaderPageProps = {\n  entityRef?: CompoundEntityRef;\n  children?: TechDocsReaderPageRenderFunction | ReactNode;\n};\n\n/**\n * An addon-aware implementation of the TechDocsReaderPage.\n *\n * @public\n */\nexport const TechDocsReaderPage = (props: TechDocsReaderPageProps) => {\n  const { kind, name, namespace } = useRouteRefParams(rootDocsRouteRef);\n  const { children, entityRef = { kind, name, namespace } } = props;\n\n  const outlet = useOutlet();\n\n  if (!children) {\n    const childrenList = outlet ? Children.toArray(outlet.props.children) : [];\n\n    const grandChildren = childrenList.flatMap<ReactElement>(\n      child => (child as ReactElement)?.props?.children ?? [],\n    );\n\n    const page: React.ReactNode = grandChildren.find(\n      grandChild =>\n        !getComponentData(grandChild, TECHDOCS_ADDONS_WRAPPER_KEY) &&\n        !getComponentData(grandChild, TECHDOCS_ADDONS_KEY),\n    );\n\n    // As explained above, \"page\" is configuration 4 and <TechDocsReaderLayout> is 1\n    return (\n      <CookieAuthRefreshProvider pluginId=\"techdocs\">\n        <TechDocsReaderPageProvider entityRef={entityRef}>\n          {(page as JSX.Element) || <TechDocsReaderLayout />}\n        </TechDocsReaderPageProvider>\n      </CookieAuthRefreshProvider>\n    );\n  }\n\n  // As explained above, a render function is configuration 3 and React element is 2\n  return (\n    <CookieAuthRefreshProvider pluginId=\"techdocs\">\n      <TechDocsReaderPageProvider entityRef={entityRef}>\n        {({ metadata, entityMetadata, onReady }) => (\n          <div className=\"techdocs-reader-page\">\n            <Page themeId=\"documentation\">\n              {children instanceof Function\n                ? children({\n                    entityRef,\n                    techdocsMetadataValue: metadata.value,\n                    entityMetadataValue: entityMetadata.value,\n                    onReady,\n                  })\n                : children}\n            </Page>\n          </div>\n        )}\n      </TechDocsReaderPageProvider>\n    </CookieAuthRefreshProvider>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAwIa,MAAA,oBAAA,GAAuB,CAAC,KAAqC,KAAA;AACxE,EAAA,MAAM,EAAE,UAAA,EAAY,UAAa,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAC1C,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,OAAQ,EAAA,eAAA,EAAA,EACX,8BAAe,KAAA,CAAA,aAAA,CAAA,wBAAA,EAAA,IAAyB,CACzC,kBAAA,KAAA,CAAA,aAAA,CAAC,2BAA4B,EAAA,IAAA,CAAA,kBAC5B,KAAA,CAAA,aAAA,CAAA,yBAAA,EAAA,EAA0B,YAAwB,CACrD,CAAA,CAAA;AAEJ,EAAA;AAea,MAAA,kBAAA,GAAqB,CAAC,KAAmC,KAAA;AACpE,EAAA,MAAM,EAAE,IAAM,EAAA,IAAA,EAAM,SAAU,EAAA,GAAI,kBAAkB,gBAAgB,CAAA,CAAA;AACpE,EAAM,MAAA,EAAE,UAAU,SAAY,GAAA,EAAE,MAAM,IAAM,EAAA,SAAA,IAAgB,GAAA,KAAA,CAAA;AAE5D,EAAA,MAAM,SAAS,SAAU,EAAA,CAAA;AAEzB,EAAA,IAAI,CAAC,QAAU,EAAA;AACb,IAAM,MAAA,YAAA,GAAe,SAAS,QAAS,CAAA,OAAA,CAAQ,OAAO,KAAM,CAAA,QAAQ,IAAI,EAAC,CAAA;AAEzE,IAAA,MAAM,gBAAgB,YAAa,CAAA,OAAA;AAAA,MACjC,CAAM,KAAA,KAAA;AA1KZ,QAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AA0KgB,QAAA,OAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,KAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,CAAwB,KAAxB,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAA+B,QAA/B,KAAA,IAAA,GAAA,EAAA,GAA2C,EAAC,CAAA;AAAA,OAAA;AAAA,KACxD,CAAA;AAEA,IAAA,MAAM,OAAwB,aAAc,CAAA,IAAA;AAAA,MAC1C,CAAA,UAAA,KACE,CAAC,gBAAiB,CAAA,UAAA,EAAY,2BAA2B,CACzD,IAAA,CAAC,gBAAiB,CAAA,UAAA,EAAY,mBAAmB,CAAA;AAAA,KACrD,CAAA;AAGA,IACE,uBAAA,KAAA,CAAA,aAAA,CAAC,yBAA0B,EAAA,EAAA,QAAA,EAAS,UAClC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,0BAA2B,EAAA,EAAA,SAAA,EAAA,EACxB,IAAwB,oBAAA,KAAA,CAAA,aAAA,CAAC,oBAAqB,EAAA,IAAA,CAClD,CACF,CAAA,CAAA;AAAA,GAEJ;AAGA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,6BAA0B,QAAS,EAAA,UAAA,EAAA,sCACjC,0BAA2B,EAAA,EAAA,SAAA,EAAA,EACzB,CAAC,EAAE,QAAU,EAAA,cAAA,EAAgB,SAC5B,qBAAA,KAAA,CAAA,aAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,sBACb,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,OAAQ,EAAA,eAAA,EAAA,EACX,QAAoB,YAAA,QAAA,GACjB,QAAS,CAAA;AAAA,IACP,SAAA;AAAA,IACA,uBAAuB,QAAS,CAAA,KAAA;AAAA,IAChC,qBAAqB,cAAe,CAAA,KAAA;AAAA,IACpC,OAAA;AAAA,GACD,CAAA,GACD,QACN,CACF,CAEJ,CACF,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"TechDocsReaderPage.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPage/TechDocsReaderPage.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { ReactNode, Children, ReactElement } from 'react';\nimport { useOutlet } from 'react-router-dom';\n\nimport { Page } from '@backstage/core-components';\nimport { CompoundEntityRef } from '@backstage/catalog-model';\nimport {\n  TECHDOCS_ADDONS_WRAPPER_KEY,\n  TECHDOCS_ADDONS_KEY,\n  TechDocsReaderPageProvider,\n} from '@backstage/plugin-techdocs-react';\n\nimport { TechDocsReaderPageRenderFunction } from '../../../types';\n\nimport { TechDocsReaderPageContent } from '../TechDocsReaderPageContent';\nimport { TechDocsReaderPageHeader } from '../TechDocsReaderPageHeader';\nimport { TechDocsReaderPageSubheader } from '../TechDocsReaderPageSubheader';\nimport { rootDocsRouteRef } from '../../../routes';\nimport {\n  getComponentData,\n  useRouteRefParams,\n} from '@backstage/core-plugin-api';\n\nimport { CookieAuthRefreshProvider } from '@backstage/plugin-auth-react';\n\n/* An explanation for the multiple ways of customizing the TechDocs reader page\n\nPlease refer to this page on the microsite for the latest recommended approach:\nhttps://backstage.io/docs/features/techdocs/how-to-guides#how-to-customize-the-techdocs-reader-page\n\nThe <TechDocsReaderPage> component is responsible for rendering the <TechDocsReaderPageProvider> and\nits contained version of a <Page>, which in turn renders the <TechDocsReaderPageContent>.\n\nHistorically, there have been different approaches on how this <Page> can be customized, and how the\n<TechDocsReaderPageContent> inside could be exchanged for a custom implementation (which was not\npossible before). Also, the current implementation supports every scenario to avoid breaking default\nconfigurations of TechDocs.\n\nIn particular, there are 4 different TechDocs page configurations:\n\nCONFIGURATION 1: <TechDocsReaderPage> only, no children\n\n<Route path=\"/docs/:namespace/:kind/:name/*\" element={<TechDocsReaderPage />} >\n\nThis is the simplest way to use TechDocs. Only a full page is passed, assuming that it comes with\nits content inside. Since we allowed customizing it, we started providing <TechDocsReaderLayout> as\na default implementation (which contains <TechDocsReaderPageContent>).\n\nCONFIGURATION 2 (not advised): <TechDocsReaderPage> with element children\n\n<Route\n  path=\"/docs/:namespace/:kind/:name/*\"\n  element={\n    <TechDocsReaderPage>\n      {techdocsPage}\n    </TechDocsReaderPage>\n  }\n/>\n\nPreviously, there were two ways of passing children to <TechDocsReaderPage>: either as elements (as\nshown above), or as a render function (described below in CONFIGURATION 3). The \"techdocsPage\" is\nlocated in packages/app/src/components/techdocs and is the default implementation of the content\ninside.\n\nCONFIGURATION 3 (not advised): <TechDocsReaderPage> with render function as child\n\n<Route\n  path=\"/docs/:namespace/:kind/:name/*\"\n  element={\n    <TechDocsReaderPage>\n      {({ metadata, entityMetadata, onReady }) => (\n        techdocsPage\n      )}\n    </TechDocsReaderPage>\n  }\n/>\n\nSimilar to CONFIGURATION 2, the direct children will be passed to the <TechDocsReaderPage> but in\nthis case interpreted as render prop.\n\nCONFIGURATION 4: <TechDocsReaderPage> and provided content in <Route>\n\n<Route\n  path=\"/docs/:namespace/:kind/:name/*\"\n  element={<TechDocsReaderPage />}\n>\n  {techDocsPage}\n  <TechDocsAddons>\n    <ExpandableNavigation />\n    <ReportIssue />\n    <TextSize />\n    <LightBox />\n  </TechDocsAddons>\n</Route>\n\nThis is the current state in packages/app/src/App.tsx and moved the location of children from inside\nthe element prop in the <Route> to the children of the <Route>. Then, in <TechDocsReaderPage> they\nare retrieved using the useOutlet hook from React Router.\n\nNOTE: Render functions are no longer supported in this approach.\n*/\n\n/**\n * Props for {@link TechDocsReaderLayout}\n * @public\n */\nexport type TechDocsReaderLayoutProps = {\n  /**\n   * Show or hide the header, defaults to true.\n   */\n  withHeader?: boolean;\n  /**\n   * Show or hide the content search bar, defaults to true.\n   */\n  withSearch?: boolean;\n};\n\n/**\n * Default TechDocs reader page structure composed with a header and content\n * @public\n */\nexport const TechDocsReaderLayout = (props: TechDocsReaderLayoutProps) => {\n  const { withSearch, withHeader = true } = props;\n  return (\n    <Page themeId=\"documentation\">\n      {withHeader && <TechDocsReaderPageHeader />}\n      <TechDocsReaderPageSubheader />\n      <TechDocsReaderPageContent withSearch={withSearch} />\n    </Page>\n  );\n};\n\n/**\n * @public\n */\nexport type TechDocsReaderPageProps = {\n  entityRef?: CompoundEntityRef;\n  children?: TechDocsReaderPageRenderFunction | ReactNode;\n};\n\n/**\n * An addon-aware implementation of the TechDocsReaderPage.\n *\n * @public\n */\nexport const TechDocsReaderPage = (props: TechDocsReaderPageProps) => {\n  const { kind, name, namespace } = useRouteRefParams(rootDocsRouteRef);\n  const { children, entityRef = { kind, name, namespace } } = props;\n\n  const outlet = useOutlet();\n\n  if (!children) {\n    const childrenList = outlet ? Children.toArray(outlet.props.children) : [];\n\n    const grandChildren = childrenList.flatMap<ReactElement>(\n      child => (child as ReactElement)?.props?.children ?? [],\n    );\n\n    const page: React.ReactNode = grandChildren.find(\n      grandChild =>\n        !getComponentData(grandChild, TECHDOCS_ADDONS_WRAPPER_KEY) &&\n        !getComponentData(grandChild, TECHDOCS_ADDONS_KEY),\n    );\n\n    // As explained above, \"page\" is configuration 4 and <TechDocsReaderLayout> is 1\n    return (\n      <CookieAuthRefreshProvider pluginId=\"techdocs\">\n        <TechDocsReaderPageProvider entityRef={entityRef}>\n          {(page as JSX.Element) || <TechDocsReaderLayout />}\n        </TechDocsReaderPageProvider>\n      </CookieAuthRefreshProvider>\n    );\n  }\n\n  // As explained above, a render function is configuration 3 and React element is 2\n  return (\n    <CookieAuthRefreshProvider pluginId=\"techdocs\">\n      <TechDocsReaderPageProvider entityRef={entityRef}>\n        {({ metadata, entityMetadata, onReady }) => (\n          <div className=\"techdocs-reader-page\">\n            <Page themeId=\"documentation\">\n              {children instanceof Function\n                ? children({\n                    entityRef,\n                    techdocsMetadataValue: metadata.value,\n                    entityMetadataValue: entityMetadata.value,\n                    onReady,\n                  })\n                : children}\n            </Page>\n          </div>\n        )}\n      </TechDocsReaderPageProvider>\n    </CookieAuthRefreshProvider>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAwIa,MAAA,oBAAA,GAAuB,CAAC,KAAqC,KAAA;AACxE,EAAA,MAAM,EAAE,UAAA,EAAY,UAAa,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAC1C,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,OAAQ,EAAA,eAAA,EAAA,EACX,8BAAe,KAAA,CAAA,aAAA,CAAA,wBAAA,EAAA,IAAyB,CACzC,kBAAA,KAAA,CAAA,aAAA,CAAC,2BAA4B,EAAA,IAAA,CAAA,kBAC5B,KAAA,CAAA,aAAA,CAAA,yBAAA,EAAA,EAA0B,YAAwB,CACrD,CAAA,CAAA;AAEJ,EAAA;AAea,MAAA,kBAAA,GAAqB,CAAC,KAAmC,KAAA;AACpE,EAAA,MAAM,EAAE,IAAM,EAAA,IAAA,EAAM,SAAU,EAAA,GAAI,kBAAkB,gBAAgB,CAAA,CAAA;AACpE,EAAM,MAAA,EAAE,UAAU,SAAY,GAAA,EAAE,MAAM,IAAM,EAAA,SAAA,IAAgB,GAAA,KAAA,CAAA;AAE5D,EAAA,MAAM,SAAS,SAAU,EAAA,CAAA;AAEzB,EAAA,IAAI,CAAC,QAAU,EAAA;AACb,IAAM,MAAA,YAAA,GAAe,SAAS,QAAS,CAAA,OAAA,CAAQ,OAAO,KAAM,CAAA,QAAQ,IAAI,EAAC,CAAA;AAEzE,IAAA,MAAM,gBAAgB,YAAa,CAAA,OAAA;AAAA,MACjC,CAAU,KAAA,KAAA,KAAA,EAAwB,KAAO,EAAA,QAAA,IAAY,EAAC;AAAA,KACxD,CAAA;AAEA,IAAA,MAAM,OAAwB,aAAc,CAAA,IAAA;AAAA,MAC1C,CAAA,UAAA,KACE,CAAC,gBAAiB,CAAA,UAAA,EAAY,2BAA2B,CACzD,IAAA,CAAC,gBAAiB,CAAA,UAAA,EAAY,mBAAmB,CAAA;AAAA,KACrD,CAAA;AAGA,IACE,uBAAA,KAAA,CAAA,aAAA,CAAC,yBAA0B,EAAA,EAAA,QAAA,EAAS,UAClC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,0BAA2B,EAAA,EAAA,SAAA,EAAA,EACxB,IAAwB,oBAAA,KAAA,CAAA,aAAA,CAAC,oBAAqB,EAAA,IAAA,CAClD,CACF,CAAA,CAAA;AAAA,GAEJ;AAGA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,6BAA0B,QAAS,EAAA,UAAA,EAAA,sCACjC,0BAA2B,EAAA,EAAA,SAAA,EAAA,EACzB,CAAC,EAAE,QAAU,EAAA,cAAA,EAAgB,SAC5B,qBAAA,KAAA,CAAA,aAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,sBACb,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,OAAQ,EAAA,eAAA,EAAA,EACX,QAAoB,YAAA,QAAA,GACjB,QAAS,CAAA;AAAA,IACP,SAAA;AAAA,IACA,uBAAuB,QAAS,CAAA,KAAA;AAAA,IAChC,qBAAqB,cAAe,CAAA,KAAA;AAAA,IACpC,OAAA;AAAA,GACD,CAAA,GACD,QACN,CACF,CAEJ,CACF,CAAA,CAAA;AAEJ;;;;"}

package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.esm.js

@@ -23,7 +23,6 @@ const useStyles = makeStyles({
 });
 const TechDocsReaderPageContent = withTechDocsReaderProvider(
   (props) => {
-    var _a;
     const { withSearch = true, onReady } = props;
     const classes = useStyles();
     const {
@@ -37,7 +36,6 @@ const TechDocsReaderPageContent = withTechDocsReaderProvider(
     const isStyleLoading = useShadowDomStylesLoading(dom);
     const [hashElement] = useShadowRootElements([`[id="${hash.slice(1)}"]`]);
     useEffect(() => {
-      var _a2;
       if (isStyleLoading)
         return;
       if (hash) {
@@ -45,7 +43,7 @@ const TechDocsReaderPageContent = withTechDocsReaderProvider(
           hashElement.scrollIntoView();
         }
       } else {
-        (_a2 = document == null ? void 0 : document.querySelector("header")) == null ? void 0 : _a2.scrollIntoView();
+        document?.querySelector("header")?.scrollIntoView();
       }
     }, [path, hash, hashElement, isStyleLoading]);
     const handleAppend = useCallback(
@@ -66,7 +64,7 @@ const TechDocsReaderPageContent = withTechDocsReaderProvider(
       TechDocsSearch,
       {
         entityId: entityRef,
-        entityTitle: (_a = entityMetadata == null ? void 0 : entityMetadata.metadata) == null ? void 0 : _a.title
+        entityTitle: entityMetadata?.metadata?.title
       }
     )), /* @__PURE__ */ React.createElement(Grid, { xs: 12, item: true }, /* @__PURE__ */ React.createElement(TechDocsShadowDom, { element: dom, onAppend: handleAppend }, /* @__PURE__ */ React.createElement(TechDocsReaderPageContentAddons, null)))));
   }

package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TechDocsReaderPageContent.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useCallback, useEffect } from 'react';\n\nimport Grid from '@material-ui/core/Grid';\nimport { makeStyles } from '@material-ui/core/styles';\n\nimport {\n  TechDocsShadowDom,\n  useShadowDomStylesLoading,\n  useShadowRootElements,\n  useTechDocsReaderPage,\n} from '@backstage/plugin-techdocs-react';\nimport { CompoundEntityRef } from '@backstage/catalog-model';\nimport { Content, ErrorPage } from '@backstage/core-components';\n\nimport { TechDocsSearch } from '../../../search';\nimport { TechDocsStateIndicator } from '../TechDocsStateIndicator';\n\nimport { useTechDocsReaderDom } from './dom';\nimport { withTechDocsReaderProvider } from '../TechDocsReaderProvider';\nimport { TechDocsReaderPageContentAddons } from './TechDocsReaderPageContentAddons';\n\nconst useStyles = makeStyles({\n  search: {\n    width: '100%',\n    '@media (min-width: 76.1875em)': {\n      width: 'calc(100% - 34.4rem)',\n      margin: '0 auto',\n    },\n    '@media print': {\n      display: 'none',\n    },\n  },\n});\n\n/**\n * Props for {@link TechDocsReaderPageContent}\n * @public\n */\nexport type TechDocsReaderPageContentProps = {\n  /**\n   * @deprecated No need to pass down entityRef as property anymore. Consumes the entityName from `TechDocsReaderPageContext`. Use the {@link @backstage/plugin-techdocs-react#useTechDocsReaderPage} hook for custom reader page content.\n   */\n  entityRef?: CompoundEntityRef;\n  /**\n   * Show or hide the search bar, defaults to true.\n   */\n  withSearch?: boolean;\n  /**\n   * Callback called when the content is rendered.\n   */\n  onReady?: () => void;\n};\n\n/**\n * Renders the reader page content\n * @public\n */\nexport const TechDocsReaderPageContent = withTechDocsReaderProvider(\n  (props: TechDocsReaderPageContentProps) => {\n    const { withSearch = true, onReady } = props;\n    const classes = useStyles();\n\n    const {\n      entityMetadata: { value: entityMetadata, loading: entityMetadataLoading },\n      entityRef,\n      setShadowRoot,\n    } = useTechDocsReaderPage();\n    const dom = useTechDocsReaderDom(entityRef);\n    const path = window.location.pathname;\n    const hash = window.location.hash;\n    const isStyleLoading = useShadowDomStylesLoading(dom);\n    const [hashElement] = useShadowRootElements([`[id=\"${hash.slice(1)}\"]`]);\n\n    useEffect(() => {\n      if (isStyleLoading) return;\n\n      if (hash) {\n        if (hashElement) {\n          hashElement.scrollIntoView();\n        }\n      } else {\n        document?.querySelector('header')?.scrollIntoView();\n      }\n    }, [path, hash, hashElement, isStyleLoading]);\n\n    const handleAppend = useCallback(\n      (newShadowRoot: ShadowRoot) => {\n        setShadowRoot(newShadowRoot);\n        if (onReady instanceof Function) {\n          onReady();\n        }\n      },\n      [setShadowRoot, onReady],\n    );\n\n    // No entity metadata = 404. Don't render content at all.\n    if (entityMetadataLoading === false && !entityMetadata)\n      return <ErrorPage status=\"404\" statusMessage=\"PAGE NOT FOUND\" />;\n\n    // Do not return content until dom is ready; instead, render a state\n    // indicator, which handles progress and content errors on our behalf.\n    if (!dom) {\n      return (\n        <Content>\n          <Grid container>\n            <Grid xs={12} item>\n              <TechDocsStateIndicator />\n            </Grid>\n          </Grid>\n        </Content>\n      );\n    }\n\n    return (\n      <Content>\n        <Grid container>\n          <Grid xs={12} item>\n            <TechDocsStateIndicator />\n          </Grid>\n          {withSearch && (\n            <Grid className={classes.search} xs=\"auto\" item>\n              <TechDocsSearch\n                entityId={entityRef}\n                entityTitle={entityMetadata?.metadata?.title}\n              />\n            </Grid>\n          )}\n          <Grid xs={12} item>\n            {/* Centers the styles loaded event to avoid having multiple locations setting the opacity style in Shadow Dom causing the screen to flash multiple times */}\n            <TechDocsShadowDom element={dom} onAppend={handleAppend}>\n              <TechDocsReaderPageContentAddons />\n            </TechDocsShadowDom>\n          </Grid>\n        </Grid>\n      </Content>\n    );\n  },\n);\n\n/**\n * Props for {@link Reader}\n *\n * @public\n * @deprecated use `TechDocsReaderPageContentProps` instead.\n */\nexport type ReaderProps = TechDocsReaderPageContentProps;\n\n/**\n * Component responsible for rendering TechDocs documentation\n * @public\n * @deprecated use `TechDocsReaderPageContent` component instead.\n */\nexport const Reader = TechDocsReaderPageContent;\n"],"names":["_a"],"mappings":"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"}
+{"version":3,"file":"TechDocsReaderPageContent.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useCallback, useEffect } from 'react';\n\nimport Grid from '@material-ui/core/Grid';\nimport { makeStyles } from '@material-ui/core/styles';\n\nimport {\n  TechDocsShadowDom,\n  useShadowDomStylesLoading,\n  useShadowRootElements,\n  useTechDocsReaderPage,\n} from '@backstage/plugin-techdocs-react';\nimport { CompoundEntityRef } from '@backstage/catalog-model';\nimport { Content, ErrorPage } from '@backstage/core-components';\n\nimport { TechDocsSearch } from '../../../search';\nimport { TechDocsStateIndicator } from '../TechDocsStateIndicator';\n\nimport { useTechDocsReaderDom } from './dom';\nimport { withTechDocsReaderProvider } from '../TechDocsReaderProvider';\nimport { TechDocsReaderPageContentAddons } from './TechDocsReaderPageContentAddons';\n\nconst useStyles = makeStyles({\n  search: {\n    width: '100%',\n    '@media (min-width: 76.1875em)': {\n      width: 'calc(100% - 34.4rem)',\n      margin: '0 auto',\n    },\n    '@media print': {\n      display: 'none',\n    },\n  },\n});\n\n/**\n * Props for {@link TechDocsReaderPageContent}\n * @public\n */\nexport type TechDocsReaderPageContentProps = {\n  /**\n   * @deprecated No need to pass down entityRef as property anymore. Consumes the entityName from `TechDocsReaderPageContext`. Use the {@link @backstage/plugin-techdocs-react#useTechDocsReaderPage} hook for custom reader page content.\n   */\n  entityRef?: CompoundEntityRef;\n  /**\n   * Show or hide the search bar, defaults to true.\n   */\n  withSearch?: boolean;\n  /**\n   * Callback called when the content is rendered.\n   */\n  onReady?: () => void;\n};\n\n/**\n * Renders the reader page content\n * @public\n */\nexport const TechDocsReaderPageContent = withTechDocsReaderProvider(\n  (props: TechDocsReaderPageContentProps) => {\n    const { withSearch = true, onReady } = props;\n    const classes = useStyles();\n\n    const {\n      entityMetadata: { value: entityMetadata, loading: entityMetadataLoading },\n      entityRef,\n      setShadowRoot,\n    } = useTechDocsReaderPage();\n    const dom = useTechDocsReaderDom(entityRef);\n    const path = window.location.pathname;\n    const hash = window.location.hash;\n    const isStyleLoading = useShadowDomStylesLoading(dom);\n    const [hashElement] = useShadowRootElements([`[id=\"${hash.slice(1)}\"]`]);\n\n    useEffect(() => {\n      if (isStyleLoading) return;\n\n      if (hash) {\n        if (hashElement) {\n          hashElement.scrollIntoView();\n        }\n      } else {\n        document?.querySelector('header')?.scrollIntoView();\n      }\n    }, [path, hash, hashElement, isStyleLoading]);\n\n    const handleAppend = useCallback(\n      (newShadowRoot: ShadowRoot) => {\n        setShadowRoot(newShadowRoot);\n        if (onReady instanceof Function) {\n          onReady();\n        }\n      },\n      [setShadowRoot, onReady],\n    );\n\n    // No entity metadata = 404. Don't render content at all.\n    if (entityMetadataLoading === false && !entityMetadata)\n      return <ErrorPage status=\"404\" statusMessage=\"PAGE NOT FOUND\" />;\n\n    // Do not return content until dom is ready; instead, render a state\n    // indicator, which handles progress and content errors on our behalf.\n    if (!dom) {\n      return (\n        <Content>\n          <Grid container>\n            <Grid xs={12} item>\n              <TechDocsStateIndicator />\n            </Grid>\n          </Grid>\n        </Content>\n      );\n    }\n\n    return (\n      <Content>\n        <Grid container>\n          <Grid xs={12} item>\n            <TechDocsStateIndicator />\n          </Grid>\n          {withSearch && (\n            <Grid className={classes.search} xs=\"auto\" item>\n              <TechDocsSearch\n                entityId={entityRef}\n                entityTitle={entityMetadata?.metadata?.title}\n              />\n            </Grid>\n          )}\n          <Grid xs={12} item>\n            {/* Centers the styles loaded event to avoid having multiple locations setting the opacity style in Shadow Dom causing the screen to flash multiple times */}\n            <TechDocsShadowDom element={dom} onAppend={handleAppend}>\n              <TechDocsReaderPageContentAddons />\n            </TechDocsShadowDom>\n          </Grid>\n        </Grid>\n      </Content>\n    );\n  },\n);\n\n/**\n * Props for {@link Reader}\n *\n * @public\n * @deprecated use `TechDocsReaderPageContentProps` instead.\n */\nexport type ReaderProps = TechDocsReaderPageContentProps;\n\n/**\n * Component responsible for rendering TechDocs documentation\n * @public\n * @deprecated use `TechDocsReaderPageContent` component instead.\n */\nexport const Reader = TechDocsReaderPageContent;\n"],"names":[],"mappings":"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"}

package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContentAddons.esm.js

@@ -5,13 +5,13 @@ import { useTechDocsAddons, useTechDocsReaderPage, TechDocsAddonLocations } from
 const TechDocsReaderPageContentAddons = () => {
   const addons = useTechDocsAddons();
   const { shadowRoot } = useTechDocsReaderPage();
-  const contentElement = shadowRoot == null ? void 0 : shadowRoot.querySelector(
+  const contentElement = shadowRoot?.querySelector(
     '[data-md-component="content"]'
   );
-  const primarySidebarElement = shadowRoot == null ? void 0 : shadowRoot.querySelector(
+  const primarySidebarElement = shadowRoot?.querySelector(
     'div[data-md-component="sidebar"][data-md-type="navigation"], div[data-md-component="navigation"]'
   );
-  let primarySidebarAddonLocation = primarySidebarElement == null ? void 0 : primarySidebarElement.querySelector(
+  let primarySidebarAddonLocation = primarySidebarElement?.querySelector(
     '[data-techdocs-addons-location="primary sidebar"]'
   );
   if (!primarySidebarAddonLocation) {
@@ -20,12 +20,12 @@ const TechDocsReaderPageContentAddons = () => {
       "data-techdocs-addons-location",
       "primary sidebar"
     );
-    primarySidebarElement == null ? void 0 : primarySidebarElement.prepend(primarySidebarAddonLocation);
+    primarySidebarElement?.prepend(primarySidebarAddonLocation);
   }
-  const secondarySidebarElement = shadowRoot == null ? void 0 : shadowRoot.querySelector(
+  const secondarySidebarElement = shadowRoot?.querySelector(
     'div[data-md-component="sidebar"][data-md-type="toc"], div[data-md-component="toc"]'
   );
-  let secondarySidebarAddonLocation = secondarySidebarElement == null ? void 0 : secondarySidebarElement.querySelector(
+  let secondarySidebarAddonLocation = secondarySidebarElement?.querySelector(
     '[data-techdocs-addons-location="secondary sidebar"]'
   );
   if (!secondarySidebarAddonLocation) {
@@ -34,7 +34,7 @@ const TechDocsReaderPageContentAddons = () => {
       "data-techdocs-addons-location",
       "secondary sidebar"
     );
-    secondarySidebarElement == null ? void 0 : secondarySidebarElement.prepend(secondarySidebarAddonLocation);
+    secondarySidebarElement?.prepend(secondarySidebarAddonLocation);
   }
   return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Portal, { container: primarySidebarAddonLocation }, addons.renderComponentsByLocation(TechDocsAddonLocations.PrimarySidebar)), /* @__PURE__ */ React.createElement(Portal, { container: contentElement }, addons.renderComponentsByLocation(TechDocsAddonLocations.Content)), /* @__PURE__ */ React.createElement(Portal, { container: secondarySidebarAddonLocation }, addons.renderComponentsByLocation(TechDocsAddonLocations.SecondarySidebar)));
 };

package/dist/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContentAddons.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TechDocsReaderPageContentAddons.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContentAddons.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport Portal from '@material-ui/core/Portal';\nimport {\n  useTechDocsAddons,\n  TechDocsAddonLocations as locations,\n  useTechDocsReaderPage,\n} from '@backstage/plugin-techdocs-react';\n\nexport const TechDocsReaderPageContentAddons = () => {\n  const addons = useTechDocsAddons();\n\n  const { shadowRoot } = useTechDocsReaderPage();\n\n  const contentElement = shadowRoot?.querySelector(\n    '[data-md-component=\"content\"]',\n  );\n\n  const primarySidebarElement = shadowRoot?.querySelector(\n    'div[data-md-component=\"sidebar\"][data-md-type=\"navigation\"], div[data-md-component=\"navigation\"]',\n  );\n  let primarySidebarAddonLocation = primarySidebarElement?.querySelector(\n    '[data-techdocs-addons-location=\"primary sidebar\"]',\n  );\n  if (!primarySidebarAddonLocation) {\n    primarySidebarAddonLocation = document.createElement('div');\n    primarySidebarAddonLocation.setAttribute(\n      'data-techdocs-addons-location',\n      'primary sidebar',\n    );\n    primarySidebarElement?.prepend(primarySidebarAddonLocation);\n  }\n\n  const secondarySidebarElement = shadowRoot?.querySelector(\n    'div[data-md-component=\"sidebar\"][data-md-type=\"toc\"], div[data-md-component=\"toc\"]',\n  );\n  let secondarySidebarAddonLocation = secondarySidebarElement?.querySelector(\n    '[data-techdocs-addons-location=\"secondary sidebar\"]',\n  );\n  if (!secondarySidebarAddonLocation) {\n    secondarySidebarAddonLocation = document.createElement('div');\n    secondarySidebarAddonLocation.setAttribute(\n      'data-techdocs-addons-location',\n      'secondary sidebar',\n    );\n    secondarySidebarElement?.prepend(secondarySidebarAddonLocation);\n  }\n\n  return (\n    <>\n      <Portal container={primarySidebarAddonLocation}>\n        {addons.renderComponentsByLocation(locations.PrimarySidebar)}\n      </Portal>\n      <Portal container={contentElement}>\n        {addons.renderComponentsByLocation(locations.Content)}\n      </Portal>\n      <Portal container={secondarySidebarAddonLocation}>\n        {addons.renderComponentsByLocation(locations.SecondarySidebar)}\n      </Portal>\n    </>\n  );\n};\n"],"names":["locations"],"mappings":";;;;AAwBO,MAAM,kCAAkC,MAAM;AACnD,EAAA,MAAM,SAAS,iBAAkB,EAAA,CAAA;AAEjC,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,qBAAsB,EAAA,CAAA;AAE7C,EAAA,MAAM,iBAAiB,UAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,aAAA;AAAA,IACjC,+BAAA;AAAA,GAAA,CAAA;AAGF,EAAA,MAAM,wBAAwB,UAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,aAAA;AAAA,IACxC,kGAAA;AAAA,GAAA,CAAA;AAEF,EAAA,IAAI,8BAA8B,qBAAuB,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,qBAAA,CAAA,aAAA;AAAA,IACvD,mDAAA;AAAA,GAAA,CAAA;AAEF,EAAA,IAAI,CAAC,2BAA6B,EAAA;AAChC,IAA8B,2BAAA,GAAA,QAAA,CAAS,cAAc,KAAK,CAAA,CAAA;AAC1D,IAA4B,2BAAA,CAAA,YAAA;AAAA,MAC1B,+BAAA;AAAA,MACA,iBAAA;AAAA,KACF,CAAA;AACA,IAAA,qBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,qBAAA,CAAuB,OAAQ,CAAA,2BAAA,CAAA,CAAA;AAAA,GACjC;AAEA,EAAA,MAAM,0BAA0B,UAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,aAAA;AAAA,IAC1C,oFAAA;AAAA,GAAA,CAAA;AAEF,EAAA,IAAI,gCAAgC,uBAAyB,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,uBAAA,CAAA,aAAA;AAAA,IAC3D,qDAAA;AAAA,GAAA,CAAA;AAEF,EAAA,IAAI,CAAC,6BAA+B,EAAA;AAClC,IAAgC,6BAAA,GAAA,QAAA,CAAS,cAAc,KAAK,CAAA,CAAA;AAC5D,IAA8B,6BAAA,CAAA,YAAA;AAAA,MAC5B,+BAAA;AAAA,MACA,mBAAA;AAAA,KACF,CAAA;AACA,IAAA,uBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,uBAAA,CAAyB,OAAQ,CAAA,6BAAA,CAAA,CAAA;AAAA,GACnC;AAEA,EAAA,uBAEI,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,MAAO,EAAA,EAAA,SAAA,EAAW,2BAChB,EAAA,EAAA,MAAA,CAAO,0BAA2B,CAAAA,sBAAA,CAAU,cAAc,CAC7D,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAO,SAAW,EAAA,cAAA,EAAA,EAChB,MAAO,CAAA,0BAAA,CAA2BA,sBAAU,CAAA,OAAO,CACtD,CAAA,kBACC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAO,SAAW,EAAA,6BAAA,EAAA,EAChB,MAAO,CAAA,0BAAA,CAA2BA,sBAAU,CAAA,gBAAgB,CAC/D,CACF,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"TechDocsReaderPageContentAddons.esm.js","sources":["../../../../src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContentAddons.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport Portal from '@material-ui/core/Portal';\nimport {\n  useTechDocsAddons,\n  TechDocsAddonLocations as locations,\n  useTechDocsReaderPage,\n} from '@backstage/plugin-techdocs-react';\n\nexport const TechDocsReaderPageContentAddons = () => {\n  const addons = useTechDocsAddons();\n\n  const { shadowRoot } = useTechDocsReaderPage();\n\n  const contentElement = shadowRoot?.querySelector(\n    '[data-md-component=\"content\"]',\n  );\n\n  const primarySidebarElement = shadowRoot?.querySelector(\n    'div[data-md-component=\"sidebar\"][data-md-type=\"navigation\"], div[data-md-component=\"navigation\"]',\n  );\n  let primarySidebarAddonLocation = primarySidebarElement?.querySelector(\n    '[data-techdocs-addons-location=\"primary sidebar\"]',\n  );\n  if (!primarySidebarAddonLocation) {\n    primarySidebarAddonLocation = document.createElement('div');\n    primarySidebarAddonLocation.setAttribute(\n      'data-techdocs-addons-location',\n      'primary sidebar',\n    );\n    primarySidebarElement?.prepend(primarySidebarAddonLocation);\n  }\n\n  const secondarySidebarElement = shadowRoot?.querySelector(\n    'div[data-md-component=\"sidebar\"][data-md-type=\"toc\"], div[data-md-component=\"toc\"]',\n  );\n  let secondarySidebarAddonLocation = secondarySidebarElement?.querySelector(\n    '[data-techdocs-addons-location=\"secondary sidebar\"]',\n  );\n  if (!secondarySidebarAddonLocation) {\n    secondarySidebarAddonLocation = document.createElement('div');\n    secondarySidebarAddonLocation.setAttribute(\n      'data-techdocs-addons-location',\n      'secondary sidebar',\n    );\n    secondarySidebarElement?.prepend(secondarySidebarAddonLocation);\n  }\n\n  return (\n    <>\n      <Portal container={primarySidebarAddonLocation}>\n        {addons.renderComponentsByLocation(locations.PrimarySidebar)}\n      </Portal>\n      <Portal container={contentElement}>\n        {addons.renderComponentsByLocation(locations.Content)}\n      </Portal>\n      <Portal container={secondarySidebarAddonLocation}>\n        {addons.renderComponentsByLocation(locations.SecondarySidebar)}\n      </Portal>\n    </>\n  );\n};\n"],"names":["locations"],"mappings":";;;;AAwBO,MAAM,kCAAkC,MAAM;AACnD,EAAA,MAAM,SAAS,iBAAkB,EAAA,CAAA;AAEjC,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,qBAAsB,EAAA,CAAA;AAE7C,EAAA,MAAM,iBAAiB,UAAY,EAAA,aAAA;AAAA,IACjC,+BAAA;AAAA,GACF,CAAA;AAEA,EAAA,MAAM,wBAAwB,UAAY,EAAA,aAAA;AAAA,IACxC,kGAAA;AAAA,GACF,CAAA;AACA,EAAA,IAAI,8BAA8B,qBAAuB,EAAA,aAAA;AAAA,IACvD,mDAAA;AAAA,GACF,CAAA;AACA,EAAA,IAAI,CAAC,2BAA6B,EAAA;AAChC,IAA8B,2BAAA,GAAA,QAAA,CAAS,cAAc,KAAK,CAAA,CAAA;AAC1D,IAA4B,2BAAA,CAAA,YAAA;AAAA,MAC1B,+BAAA;AAAA,MACA,iBAAA;AAAA,KACF,CAAA;AACA,IAAA,qBAAA,EAAuB,QAAQ,2BAA2B,CAAA,CAAA;AAAA,GAC5D;AAEA,EAAA,MAAM,0BAA0B,UAAY,EAAA,aAAA;AAAA,IAC1C,oFAAA;AAAA,GACF,CAAA;AACA,EAAA,IAAI,gCAAgC,uBAAyB,EAAA,aAAA;AAAA,IAC3D,qDAAA;AAAA,GACF,CAAA;AACA,EAAA,IAAI,CAAC,6BAA+B,EAAA;AAClC,IAAgC,6BAAA,GAAA,QAAA,CAAS,cAAc,KAAK,CAAA,CAAA;AAC5D,IAA8B,6BAAA,CAAA,YAAA;AAAA,MAC5B,+BAAA;AAAA,MACA,mBAAA;AAAA,KACF,CAAA;AACA,IAAA,uBAAA,EAAyB,QAAQ,6BAA6B,CAAA,CAAA;AAAA,GAChE;AAEA,EAAA,uBAEI,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,MAAO,EAAA,EAAA,SAAA,EAAW,2BAChB,EAAA,EAAA,MAAA,CAAO,0BAA2B,CAAAA,sBAAA,CAAU,cAAc,CAC7D,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAO,SAAW,EAAA,cAAA,EAAA,EAChB,MAAO,CAAA,0BAAA,CAA2BA,sBAAU,CAAA,OAAO,CACtD,CAAA,kBACC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAO,SAAW,EAAA,6BAAA,EAAA,EAChB,MAAO,CAAA,0BAAA,CAA2BA,sBAAU,CAAA,gBAAgB,CAC/D,CACF,CAAA,CAAA;AAEJ;;;;"}

package/dist/reader/components/TechDocsReaderPageContent/dom.esm.js

@@ -38,22 +38,21 @@ const useTechDocsReaderDom = (entityRef) => {
       return;
     const sidebars = dom.querySelectorAll(".md-sidebar");
     sidebars.forEach((element) => {
-      var _a, _b, _c, _d;
       if (isMobileMedia) {
         element.style.top = "0px";
       } else {
-        const page = document == null ? void 0 : document.querySelector(".techdocs-reader-page");
-        const pageTop = (_a = page == null ? void 0 : page.getBoundingClientRect().top) != null ? _a : 0;
-        let domTop = (_b = dom.getBoundingClientRect().top) != null ? _b : 0;
+        const page = document?.querySelector(".techdocs-reader-page");
+        const pageTop = page?.getBoundingClientRect().top ?? 0;
+        let domTop = dom.getBoundingClientRect().top ?? 0;
         const tabs = dom.querySelector(".md-container > .md-tabs");
-        const tabsHeight = (_c = tabs == null ? void 0 : tabs.getBoundingClientRect().height) != null ? _c : 0;
+        const tabsHeight = tabs?.getBoundingClientRect().height ?? 0;
         if (domTop < pageTop) {
           domTop = pageTop;
         }
         const scrollbarTopPx = Math.max(domTop, 0) + tabsHeight;
         element.style.top = `${scrollbarTopPx}px`;
         const footer = dom.querySelector(".md-container > .md-footer");
-        const scrollbarEndPx = (_d = footer == null ? void 0 : footer.getBoundingClientRect().top) != null ? _d : window.innerHeight;
+        const scrollbarEndPx = footer?.getBoundingClientRect().top ?? window.innerHeight;
         element.style.height = `${scrollbarEndPx - scrollbarTopPx}px`;
       }
       element.style.setProperty("opacity", "1");
@@ -127,10 +126,9 @@ const useTechDocsReaderDom = (entityRef) => {
       addLinkClickListener({
         baseUrl: window.location.origin,
         onClick: (event, url) => {
-          var _a, _b;
           const modifierActive = event.ctrlKey || event.metaKey;
           const parsedUrl = new URL(url);
-          const linkText = ((_a = event.target) == null ? void 0 : _a.innerText) || url;
+          const linkText = event.target?.innerText || url;
           const to = url.replace(window.location.origin, "");
           analytics.captureEvent("click", linkText, { attributes: { to } });
           if (parsedUrl.hash) {
@@ -138,7 +136,7 @@ const useTechDocsReaderDom = (entityRef) => {
               window.open(url, "_blank");
             } else {
               navigate(url);
-              (_b = transformedElement == null ? void 0 : transformedElement.querySelector(`[id="${parsedUrl.hash.slice(1)}"]`)) == null ? void 0 : _b.scrollIntoView();
+              transformedElement?.querySelector(`[id="${parsedUrl.hash.slice(1)}"]`)?.scrollIntoView();
             }
           } else {
             if (modifierActive) {
@@ -154,8 +152,7 @@ const useTechDocsReaderDom = (entityRef) => {
         onLoading: () => {
         },
         onLoaded: () => {
-          var _a;
-          (_a = transformedElement.querySelector(".md-nav__title")) == null ? void 0 : _a.removeAttribute("for");
+          transformedElement.querySelector(".md-nav__title")?.removeAttribute("for");
         }
       }),
       // hide sidebars until their positions are updated
@@ -180,7 +177,7 @@ const useTechDocsReaderDom = (entityRef) => {
       };
     let shouldReplaceContent = true;
     preRender(rawPage, path).then(async (preTransformedDomElement) => {
-      if (!(preTransformedDomElement == null ? void 0 : preTransformedDomElement.innerHTML)) {
+      if (!preTransformedDomElement?.innerHTML) {
         return;
       }
       if (!shouldReplaceContent) {