@backstage/plugin-api-docs 0.6.20 → 0.6.21

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @backstage/plugin-api-docs
 
+## 0.6.21
+
+### Patch Changes
+
+- 11b81683a9: Support customizing index page layouts via outlets
+- Updated dependencies
+  - @backstage/core-plugin-api@0.4.1
+  - @backstage/plugin-catalog-react@0.6.10
+  - @backstage/core-components@0.8.3
+  - @backstage/plugin-catalog@0.7.7
+
 ## 0.6.20
 
 ### Patch Changes

package/dist/esm/{index-00af9be1.esm.js → index-02cb4cdc.esm.js}

@@ -1,9 +1,11 @@
-export { A as ApiDefinitionCard, a as ApiTypeTitle, d as defaultDefinitionWidgets } from './index-83f082c6.esm.js';
-import '@backstage/plugin-catalog-react';
-import '@material-ui/lab';
+export { ApiExplorerIndexPage, DefaultApiExplorerPage } from '../index.esm.js';
 import 'react';
-import '@backstage/core-plugin-api';
+import 'react-router';
 import '@backstage/core-components';
+import '@backstage/core-plugin-api';
+import '@backstage/plugin-catalog';
+import '@backstage/plugin-catalog-react';
+import '@material-ui/lab';
 import '@backstage/catalog-model';
 import '@material-ui/core';
-//# sourceMappingURL=index-00af9be1.esm.js.map
+//# sourceMappingURL=index-02cb4cdc.esm.js.map

package/dist/esm/index-02cb4cdc.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-02cb4cdc.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/esm/{index-a8bf5768.esm.js → index-30e4d7f8.esm.js}

@@ -1,9 +1,11 @@
-export { C as ConsumedApisCard, H as HasApisCard, P as ProvidedApisCard } from './index-83f082c6.esm.js';
-import '@backstage/plugin-catalog-react';
-import '@material-ui/lab';
+export { ConsumingComponentsCard, ProvidingComponentsCard } from '../index.esm.js';
 import 'react';
-import '@backstage/core-plugin-api';
+import 'react-router';
 import '@backstage/core-components';
+import '@backstage/core-plugin-api';
+import '@backstage/plugin-catalog';
+import '@backstage/plugin-catalog-react';
+import '@material-ui/lab';
 import '@backstage/catalog-model';
 import '@material-ui/core';
-//# sourceMappingURL=index-a8bf5768.esm.js.map
+//# sourceMappingURL=index-30e4d7f8.esm.js.map

package/dist/esm/index-30e4d7f8.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-30e4d7f8.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/esm/{index-674cfd0b.esm.js → index-32c80387.esm.js}

@@ -1,9 +1,11 @@
-export { b as ConsumingComponentsCard, e as ProvidingComponentsCard } from './index-83f082c6.esm.js';
-import '@backstage/plugin-catalog-react';
-import '@material-ui/lab';
+export { ConsumedApisCard, HasApisCard, ProvidedApisCard } from '../index.esm.js';
 import 'react';
-import '@backstage/core-plugin-api';
+import 'react-router';
 import '@backstage/core-components';
+import '@backstage/core-plugin-api';
+import '@backstage/plugin-catalog';
+import '@backstage/plugin-catalog-react';
+import '@material-ui/lab';
 import '@backstage/catalog-model';
 import '@material-ui/core';
-//# sourceMappingURL=index-674cfd0b.esm.js.map
+//# sourceMappingURL=index-32c80387.esm.js.map

package/dist/esm/index-32c80387.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-32c80387.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/esm/index-89d097b6.esm.js

@@ -0,0 +1,11 @@
+export { ApiDefinitionCard, ApiTypeTitle, defaultDefinitionWidgets } from '../index.esm.js';
+import 'react';
+import 'react-router';
+import '@backstage/core-components';
+import '@backstage/core-plugin-api';
+import '@backstage/plugin-catalog';
+import '@backstage/plugin-catalog-react';
+import '@material-ui/lab';
+import '@backstage/catalog-model';
+import '@material-ui/core';
+//# sourceMappingURL=index-89d097b6.esm.js.map

package/dist/esm/index-89d097b6.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-89d097b6.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/index.d.ts

@@ -1,12 +1,32 @@
 /// <reference types="react" />
+import { TableColumn, TableProps } from '@backstage/core-components';
+import { CatalogTableRow } from '@backstage/plugin-catalog';
+import { UserListFilterKind } from '@backstage/plugin-catalog-react';
 import * as _backstage_catalog_model from '@backstage/catalog-model';
 import { ApiEntity, Entity } from '@backstage/catalog-model';
 import React from 'react';
 import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
-import * as _material_table_core from '@material-table/core';
-import * as _backstage_core_components from '@backstage/core-components';
-import * as _backstage_plugin_catalog from '@backstage/plugin-catalog';
-import * as _backstage_plugin_catalog_react from '@backstage/plugin-catalog-react';
+
+/**
+ * DefaultApiExplorerPageProps
+ * @public
+ */
+declare type DefaultApiExplorerPageProps = {
+    initiallySelectedFilter?: UserListFilterKind;
+    columns?: TableColumn<CatalogTableRow>[];
+    actions?: TableProps<CatalogTableRow>['actions'];
+};
+/**
+ * DefaultApiExplorerPage
+ * @public
+ */
+declare const DefaultApiExplorerPage: ({ initiallySelectedFilter, columns, actions, }: DefaultApiExplorerPageProps) => JSX.Element;
+
+/**
+ * ApiExplorerPage
+ * @public
+ */
+declare const ApiExplorerPage$1: (props: DefaultApiExplorerPageProps) => JSX.Element;
 
 declare type Props$5 = {
     /** @deprecated The entity is now grabbed from context instead */
@@ -85,14 +105,7 @@ declare const apiDocsPlugin: _backstage_core_plugin_api.BackstagePlugin<{
 }, {
     createComponent: _backstage_core_plugin_api.ExternalRouteRef<undefined, true>;
 }>;
-declare const ApiExplorerPage: ({ initiallySelectedFilter, columns, actions, }: {
-    initiallySelectedFilter?: _backstage_plugin_catalog_react.UserListFilterKind | undefined;
-    columns?: _backstage_core_components.TableColumn<_backstage_plugin_catalog.CatalogTableRow>[] | undefined;
-    actions?: (_material_table_core.Action<_backstage_plugin_catalog.CatalogTableRow> | {
-        action: (rowData: _backstage_plugin_catalog.CatalogTableRow) => _material_table_core.Action<_backstage_plugin_catalog.CatalogTableRow>;
-        position: string;
-    } | ((rowData: _backstage_plugin_catalog.CatalogTableRow) => _material_table_core.Action<_backstage_plugin_catalog.CatalogTableRow>))[] | undefined;
-}) => JSX.Element;
+declare const ApiExplorerPage: (props: DefaultApiExplorerPageProps) => JSX.Element;
 declare const EntityApiDefinitionCard: (_: {
     apiEntity?: ApiEntity | undefined;
 }) => JSX.Element;
@@ -116,4 +129,4 @@ declare const EntityHasApisCard: ({ variant }: {
     variant?: "gridItem" | undefined;
 }) => JSX.Element;
 
-export { ApiDefinitionCard, ApiDefinitionWidget, ApiExplorerPage, ApiTypeTitle, AsyncApiDefinitionWidget, AsyncApiDefinitionWidgetProps, ConsumedApisCard, ConsumingComponentsCard, EntityApiDefinitionCard, EntityConsumedApisCard, EntityConsumingComponentsCard, EntityHasApisCard, EntityProvidedApisCard, EntityProvidingComponentsCard, HasApisCard, OpenApiDefinitionWidget, OpenApiDefinitionWidgetProps, PlainApiDefinitionWidget, PlainApiDefinitionWidgetProps, ProvidedApisCard, ProvidingComponentsCard, apiDocsConfigRef, apiDocsPlugin, defaultDefinitionWidgets, apiDocsPlugin as plugin };
+export { ApiDefinitionCard, ApiDefinitionWidget, ApiExplorerPage$1 as ApiExplorerIndexPage, ApiExplorerPage, ApiTypeTitle, AsyncApiDefinitionWidget, AsyncApiDefinitionWidgetProps, ConsumedApisCard, ConsumingComponentsCard, DefaultApiExplorerPage, DefaultApiExplorerPageProps, EntityApiDefinitionCard, EntityConsumedApisCard, EntityConsumingComponentsCard, EntityHasApisCard, EntityProvidedApisCard, EntityProvidingComponentsCard, HasApisCard, OpenApiDefinitionWidget, OpenApiDefinitionWidgetProps, PlainApiDefinitionWidget, PlainApiDefinitionWidgetProps, ProvidedApisCard, ProvidingComponentsCard, apiDocsConfigRef, apiDocsPlugin, defaultDefinitionWidgets, apiDocsPlugin as plugin };

package/dist/index.esm.js

@@ -1,9 +1,483 @@
-export { A as ApiDefinitionCard, h as ApiExplorerPage, a as ApiTypeTitle, n as AsyncApiDefinitionWidget, C as ConsumedApisCard, b as ConsumingComponentsCard, E as EntityApiDefinitionCard, i as EntityConsumedApisCard, j as EntityConsumingComponentsCard, k as EntityHasApisCard, l as EntityProvidedApisCard, m as EntityProvidingComponentsCard, H as HasApisCard, O as OpenApiDefinitionWidget, o as PlainApiDefinitionWidget, P as ProvidedApisCard, e as ProvidingComponentsCard, f as apiDocsConfigRef, g as apiDocsPlugin, d as defaultDefinitionWidgets, g as plugin } from './esm/index-83f082c6.esm.js';
-import '@backstage/plugin-catalog-react';
-import '@material-ui/lab';
-import 'react';
-import '@backstage/core-plugin-api';
-import '@backstage/core-components';
-import '@backstage/catalog-model';
-import '@material-ui/core';
+import React, { Suspense } from 'react';
+import { useOutlet } from 'react-router';
+import { PageWithHeader, Content, ContentHeader, CreateButton, SupportButton, CodeSnippet, TabbedCard, CardTab, Progress, InfoCard, WarningPanel, Link } from '@backstage/core-components';
+import { createRouteRef, createExternalRouteRef, useApi, configApiRef, useRouteRef, createApiRef, createPlugin, createApiFactory, createRoutableExtension, createComponentExtension } from '@backstage/core-plugin-api';
+import { CatalogTable, FilteredEntityLayout, FilterContainer, EntityListContainer } from '@backstage/plugin-catalog';
+import { EntityListProvider, EntityKindPicker, EntityTypePicker, UserListPicker, EntityOwnerPicker, EntityLifecyclePicker, EntityTagPicker, useEntity, EntityTable, useRelatedEntities } from '@backstage/plugin-catalog-react';
+import { Alert } from '@material-ui/lab';
+import { RELATION_CONSUMES_API, RELATION_HAS_PART, RELATION_PROVIDES_API, RELATION_API_CONSUMED_BY, RELATION_API_PROVIDED_BY } from '@backstage/catalog-model';
+import { Typography } from '@material-ui/core';
+
+const rootRoute = createRouteRef({
+  id: "api-docs"
+});
+const createComponentRouteRef = createExternalRouteRef({
+  id: "create-component",
+  optional: true
+});
+
+const defaultColumns = [
+  CatalogTable.columns.createNameColumn({ defaultKind: "API" }),
+  CatalogTable.columns.createSystemColumn(),
+  CatalogTable.columns.createOwnerColumn(),
+  CatalogTable.columns.createSpecTypeColumn(),
+  CatalogTable.columns.createSpecLifecycleColumn(),
+  CatalogTable.columns.createMetadataDescriptionColumn(),
+  CatalogTable.columns.createTagsColumn()
+];
+const DefaultApiExplorerPage = ({
+  initiallySelectedFilter = "all",
+  columns,
+  actions
+}) => {
+  var _a;
+  const configApi = useApi(configApiRef);
+  const generatedSubtitle = `${(_a = configApi.getOptionalString("organization.name")) != null ? _a : "Backstage"} API Explorer`;
+  const createComponentLink = useRouteRef(createComponentRouteRef);
+  return /* @__PURE__ */ React.createElement(PageWithHeader, {
+    themeId: "apis",
+    title: "APIs",
+    subtitle: generatedSubtitle,
+    pageTitleOverride: "APIs"
+  }, /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement(ContentHeader, {
+    title: ""
+  }, /* @__PURE__ */ React.createElement(CreateButton, {
+    title: "Register Existing API",
+    to: createComponentLink == null ? void 0 : createComponentLink()
+  }), /* @__PURE__ */ React.createElement(SupportButton, null, "All your APIs")), /* @__PURE__ */ React.createElement(EntityListProvider, null, /* @__PURE__ */ React.createElement(FilteredEntityLayout, null, /* @__PURE__ */ React.createElement(FilterContainer, null, /* @__PURE__ */ React.createElement(EntityKindPicker, {
+    initialFilter: "api",
+    hidden: true
+  }), /* @__PURE__ */ React.createElement(EntityTypePicker, null), /* @__PURE__ */ React.createElement(UserListPicker, {
+    initialFilter: initiallySelectedFilter
+  }), /* @__PURE__ */ React.createElement(EntityOwnerPicker, null), /* @__PURE__ */ React.createElement(EntityLifecyclePicker, null), /* @__PURE__ */ React.createElement(EntityTagPicker, null)), /* @__PURE__ */ React.createElement(EntityListContainer, null, /* @__PURE__ */ React.createElement(CatalogTable, {
+    columns: columns || defaultColumns,
+    actions
+  }))))));
+};
+
+const ApiExplorerPage$1 = (props) => {
+  const outlet = useOutlet();
+  return outlet || /* @__PURE__ */ React.createElement(DefaultApiExplorerPage, {
+    ...props
+  });
+};
+
+const apiDocsConfigRef = createApiRef({
+  id: "plugin.api-docs.config"
+});
+
+const PlainApiDefinitionWidget = (props) => {
+  return /* @__PURE__ */ React.createElement(CodeSnippet, {
+    text: props.definition,
+    language: props.language,
+    showCopyCodeButton: true
+  });
+};
+
+const ApiDefinitionCard = (_) => {
+  var _a;
+  const { entity } = useEntity();
+  const config = useApi(apiDocsConfigRef);
+  const { getApiDefinitionWidget } = config;
+  if (!entity) {
+    return /* @__PURE__ */ React.createElement(Alert, {
+      severity: "error"
+    }, "Could not fetch the API");
+  }
+  const definitionWidget = getApiDefinitionWidget(entity);
+  const entityTitle = (_a = entity.metadata.title) != null ? _a : entity.metadata.name;
+  if (definitionWidget) {
+    return /* @__PURE__ */ React.createElement(TabbedCard, {
+      title: entityTitle
+    }, /* @__PURE__ */ React.createElement(CardTab, {
+      label: definitionWidget.title,
+      key: "widget"
+    }, definitionWidget.component(entity.spec.definition)), /* @__PURE__ */ React.createElement(CardTab, {
+      label: "Raw",
+      key: "raw"
+    }, /* @__PURE__ */ React.createElement(PlainApiDefinitionWidget, {
+      definition: entity.spec.definition,
+      language: definitionWidget.rawLanguage || entity.spec.type
+    })));
+  }
+  return /* @__PURE__ */ React.createElement(TabbedCard, {
+    title: entityTitle,
+    children: [
+      /* @__PURE__ */ React.createElement(CardTab, {
+        label: entity.spec.type,
+        key: "raw"
+      }, /* @__PURE__ */ React.createElement(PlainApiDefinitionWidget, {
+        definition: entity.spec.definition,
+        language: entity.spec.type
+      }))
+    ]
+  });
+};
+
+const LazyAsyncApiDefinition = React.lazy(() => import('./esm/AsyncApiDefinition-c39ae15d.esm.js').then((m) => ({
+  default: m.AsyncApiDefinition
+})));
+const AsyncApiDefinitionWidget = (props) => {
+  return /* @__PURE__ */ React.createElement(Suspense, {
+    fallback: /* @__PURE__ */ React.createElement(Progress, null)
+  }, /* @__PURE__ */ React.createElement(LazyAsyncApiDefinition, {
+    ...props
+  }));
+};
+
+const LazyGraphQlDefinition = React.lazy(() => import('./esm/GraphQlDefinition-fa85d425.esm.js').then((m) => ({
+  default: m.GraphQlDefinition
+})));
+const GraphQlDefinitionWidget = (props) => {
+  return /* @__PURE__ */ React.createElement(Suspense, {
+    fallback: /* @__PURE__ */ React.createElement(Progress, null)
+  }, /* @__PURE__ */ React.createElement(LazyGraphQlDefinition, {
+    ...props
+  }));
+};
+
+const LazyOpenApiDefinition = React.lazy(() => import('./esm/OpenApiDefinition-48ae3040.esm.js').then((m) => ({
+  default: m.OpenApiDefinition
+})));
+const OpenApiDefinitionWidget = (props) => {
+  return /* @__PURE__ */ React.createElement(Suspense, {
+    fallback: /* @__PURE__ */ React.createElement(Progress, null)
+  }, /* @__PURE__ */ React.createElement(LazyOpenApiDefinition, {
+    ...props
+  }));
+};
+
+function defaultDefinitionWidgets() {
+  return [
+    {
+      type: "openapi",
+      title: "OpenAPI",
+      rawLanguage: "yaml",
+      component: (definition) => /* @__PURE__ */ React.createElement(OpenApiDefinitionWidget, {
+        definition
+      })
+    },
+    {
+      type: "asyncapi",
+      title: "AsyncAPI",
+      rawLanguage: "yaml",
+      component: (definition) => /* @__PURE__ */ React.createElement(AsyncApiDefinitionWidget, {
+        definition
+      })
+    },
+    {
+      type: "graphql",
+      title: "GraphQL",
+      rawLanguage: "graphql",
+      component: (definition) => /* @__PURE__ */ React.createElement(GraphQlDefinitionWidget, {
+        definition
+      })
+    }
+  ];
+}
+
+const ApiTypeTitle = ({ apiEntity }) => {
+  const config = useApi(apiDocsConfigRef);
+  const definition = config.getApiDefinitionWidget(apiEntity);
+  const type = definition ? definition.title : apiEntity.spec.type;
+  return /* @__PURE__ */ React.createElement("span", null, type);
+};
+
+function createSpecApiTypeColumn() {
+  return {
+    title: "Type",
+    field: "spec.type",
+    render: (entity) => /* @__PURE__ */ React.createElement(ApiTypeTitle, {
+      apiEntity: entity
+    })
+  };
+}
+const apiEntityColumns = [
+  EntityTable.columns.createEntityRefColumn({ defaultKind: "API" }),
+  EntityTable.columns.createSystemColumn(),
+  EntityTable.columns.createOwnerColumn(),
+  createSpecApiTypeColumn(),
+  EntityTable.columns.createSpecLifecycleColumn(),
+  EntityTable.columns.createMetadataDescriptionColumn()
+];
+
+const ConsumedApisCard = ({ variant = "gridItem" }) => {
+  const { entity } = useEntity();
+  const { entities, loading, error } = useRelatedEntities(entity, {
+    type: RELATION_CONSUMES_API
+  });
+  if (loading) {
+    return /* @__PURE__ */ React.createElement(InfoCard, {
+      variant,
+      title: "Consumed APIs"
+    }, /* @__PURE__ */ React.createElement(Progress, null));
+  }
+  if (error || !entities) {
+    return /* @__PURE__ */ React.createElement(InfoCard, {
+      variant,
+      title: "Consumed APIs"
+    }, /* @__PURE__ */ React.createElement(WarningPanel, {
+      severity: "error",
+      title: "Could not load APIs",
+      message: /* @__PURE__ */ React.createElement(CodeSnippet, {
+        text: `${error}`,
+        language: "text"
+      })
+    }));
+  }
+  return /* @__PURE__ */ React.createElement(EntityTable, {
+    title: "Consumed APIs",
+    variant,
+    emptyContent: /* @__PURE__ */ React.createElement("div", {
+      style: { textAlign: "center" }
+    }, /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body1"
+    }, "This ", entity.kind.toLocaleLowerCase("en-US"), " does not consume any APIs."), /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body2"
+    }, /* @__PURE__ */ React.createElement(Link, {
+      to: "https://backstage.io/docs/features/software-catalog/descriptor-format#specconsumesapis-optional"
+    }, "Learn how to change this."))),
+    columns: apiEntityColumns,
+    entities
+  });
+};
+
+const columns = [
+  EntityTable.columns.createEntityRefColumn({ defaultKind: "API" }),
+  EntityTable.columns.createOwnerColumn(),
+  createSpecApiTypeColumn(),
+  EntityTable.columns.createSpecLifecycleColumn(),
+  EntityTable.columns.createMetadataDescriptionColumn()
+];
+const HasApisCard = ({ variant = "gridItem" }) => {
+  const { entity } = useEntity();
+  const { entities, loading, error } = useRelatedEntities(entity, {
+    type: RELATION_HAS_PART,
+    kind: "API"
+  });
+  if (loading) {
+    return /* @__PURE__ */ React.createElement(InfoCard, {
+      variant,
+      title: "APIs"
+    }, /* @__PURE__ */ React.createElement(Progress, null));
+  }
+  if (error || !entities) {
+    return /* @__PURE__ */ React.createElement(InfoCard, {
+      variant,
+      title: "APIs"
+    }, /* @__PURE__ */ React.createElement(WarningPanel, {
+      severity: "error",
+      title: "Could not load APIs",
+      message: /* @__PURE__ */ React.createElement(CodeSnippet, {
+        text: `${error}`,
+        language: "text"
+      })
+    }));
+  }
+  return /* @__PURE__ */ React.createElement(EntityTable, {
+    title: "APIs",
+    variant,
+    emptyContent: /* @__PURE__ */ React.createElement("div", {
+      style: { textAlign: "center" }
+    }, /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body1"
+    }, "This ", entity.kind.toLocaleLowerCase("en-US"), " does not contain any APIs."), /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body2"
+    }, /* @__PURE__ */ React.createElement(Link, {
+      to: "https://backstage.io/docs/features/software-catalog/descriptor-format#kind-api"
+    }, "Learn how to change this."))),
+    columns,
+    entities
+  });
+};
+
+const ProvidedApisCard = ({ variant = "gridItem" }) => {
+  const { entity } = useEntity();
+  const { entities, loading, error } = useRelatedEntities(entity, {
+    type: RELATION_PROVIDES_API
+  });
+  if (loading) {
+    return /* @__PURE__ */ React.createElement(InfoCard, {
+      variant,
+      title: "Provided APIs"
+    }, /* @__PURE__ */ React.createElement(Progress, null));
+  }
+  if (error || !entities) {
+    return /* @__PURE__ */ React.createElement(InfoCard, {
+      variant,
+      title: "Provided APIs"
+    }, /* @__PURE__ */ React.createElement(WarningPanel, {
+      severity: "error",
+      title: "Could not load APIs",
+      message: /* @__PURE__ */ React.createElement(CodeSnippet, {
+        text: `${error}`,
+        language: "text"
+      })
+    }));
+  }
+  return /* @__PURE__ */ React.createElement(EntityTable, {
+    title: "Provided APIs",
+    variant,
+    emptyContent: /* @__PURE__ */ React.createElement("div", {
+      style: { textAlign: "center" }
+    }, /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body1"
+    }, "This ", entity.kind.toLocaleLowerCase("en-US"), " does not provide any APIs."), /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body2"
+    }, /* @__PURE__ */ React.createElement(Link, {
+      to: "https://backstage.io/docs/features/software-catalog/descriptor-format#specprovidesapis-optional"
+    }, "Learn how to change this."))),
+    columns: apiEntityColumns,
+    entities
+  });
+};
+
+const ConsumingComponentsCard = ({ variant = "gridItem" }) => {
+  const { entity } = useEntity();
+  const { entities, loading, error } = useRelatedEntities(entity, {
+    type: RELATION_API_CONSUMED_BY
+  });
+  if (loading) {
+    return /* @__PURE__ */ React.createElement(InfoCard, {
+      variant,
+      title: "Consumers"
+    }, /* @__PURE__ */ React.createElement(Progress, null));
+  }
+  if (error || !entities) {
+    return /* @__PURE__ */ React.createElement(InfoCard, {
+      variant,
+      title: "Consumers"
+    }, /* @__PURE__ */ React.createElement(WarningPanel, {
+      severity: "error",
+      title: "Could not load components",
+      message: /* @__PURE__ */ React.createElement(CodeSnippet, {
+        text: `${error}`,
+        language: "text"
+      })
+    }));
+  }
+  return /* @__PURE__ */ React.createElement(EntityTable, {
+    title: "Consumers",
+    variant,
+    emptyContent: /* @__PURE__ */ React.createElement("div", {
+      style: { textAlign: "center" }
+    }, /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body1"
+    }, "No component consumes this API."), /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body2"
+    }, /* @__PURE__ */ React.createElement(Link, {
+      to: "https://backstage.io/docs/features/software-catalog/descriptor-format#specconsumesapis-optional"
+    }, "Learn how to change this."))),
+    columns: EntityTable.componentEntityColumns,
+    entities
+  });
+};
+
+const ProvidingComponentsCard = ({ variant = "gridItem" }) => {
+  const { entity } = useEntity();
+  const { entities, loading, error } = useRelatedEntities(entity, {
+    type: RELATION_API_PROVIDED_BY
+  });
+  if (loading) {
+    return /* @__PURE__ */ React.createElement(InfoCard, {
+      variant,
+      title: "Providers"
+    }, /* @__PURE__ */ React.createElement(Progress, null));
+  }
+  if (error || !entities) {
+    return /* @__PURE__ */ React.createElement(InfoCard, {
+      variant,
+      title: "Providers"
+    }, /* @__PURE__ */ React.createElement(WarningPanel, {
+      severity: "error",
+      title: "Could not load components",
+      message: /* @__PURE__ */ React.createElement(CodeSnippet, {
+        text: `${error}`,
+        language: "text"
+      })
+    }));
+  }
+  return /* @__PURE__ */ React.createElement(EntityTable, {
+    title: "Providers",
+    variant,
+    emptyContent: /* @__PURE__ */ React.createElement("div", {
+      style: { textAlign: "center" }
+    }, /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body1"
+    }, "No component provides this API."), /* @__PURE__ */ React.createElement(Typography, {
+      variant: "body2"
+    }, /* @__PURE__ */ React.createElement(Link, {
+      to: "https://backstage.io/docs/features/software-catalog/descriptor-format#specprovidesapis-optional"
+    }, "Learn how to change this."))),
+    columns: EntityTable.componentEntityColumns,
+    entities
+  });
+};
+
+const apiDocsPlugin = createPlugin({
+  id: "api-docs",
+  routes: {
+    root: rootRoute
+  },
+  apis: [
+    createApiFactory({
+      api: apiDocsConfigRef,
+      deps: {},
+      factory: () => {
+        const definitionWidgets = defaultDefinitionWidgets();
+        return {
+          getApiDefinitionWidget: (apiEntity) => {
+            return definitionWidgets.find((d) => d.type === apiEntity.spec.type);
+          }
+        };
+      }
+    })
+  ],
+  externalRoutes: {
+    createComponent: createComponentRouteRef
+  }
+});
+const ApiExplorerPage = apiDocsPlugin.provide(createRoutableExtension({
+  name: "ApiExplorerPage",
+  component: () => import('./esm/index-02cb4cdc.esm.js').then((m) => m.ApiExplorerIndexPage),
+  mountPoint: rootRoute
+}));
+const EntityApiDefinitionCard = apiDocsPlugin.provide(createComponentExtension({
+  name: "EntityApiDefinitionCard",
+  component: {
+    lazy: () => import('./esm/index-89d097b6.esm.js').then((m) => m.ApiDefinitionCard)
+  }
+}));
+const EntityConsumedApisCard = apiDocsPlugin.provide(createComponentExtension({
+  name: "EntityConsumedApisCard",
+  component: {
+    lazy: () => import('./esm/index-32c80387.esm.js').then((m) => m.ConsumedApisCard)
+  }
+}));
+const EntityConsumingComponentsCard = apiDocsPlugin.provide(createComponentExtension({
+  name: "EntityConsumingComponentsCard",
+  component: {
+    lazy: () => import('./esm/index-30e4d7f8.esm.js').then((m) => m.ConsumingComponentsCard)
+  }
+}));
+const EntityProvidedApisCard = apiDocsPlugin.provide(createComponentExtension({
+  name: "EntityProvidedApisCard",
+  component: {
+    lazy: () => import('./esm/index-32c80387.esm.js').then((m) => m.ProvidedApisCard)
+  }
+}));
+const EntityProvidingComponentsCard = apiDocsPlugin.provide(createComponentExtension({
+  name: "EntityProvidingComponentsCard",
+  component: {
+    lazy: () => import('./esm/index-30e4d7f8.esm.js').then((m) => m.ProvidingComponentsCard)
+  }
+}));
+const EntityHasApisCard = apiDocsPlugin.provide(createComponentExtension({
+  name: "EntityHasApisCard",
+  component: {
+    lazy: () => import('./esm/index-32c80387.esm.js').then((m) => m.HasApisCard)
+  }
+}));
+
+export { ApiDefinitionCard, ApiExplorerPage$1 as ApiExplorerIndexPage, ApiExplorerPage, ApiTypeTitle, AsyncApiDefinitionWidget, ConsumedApisCard, ConsumingComponentsCard, DefaultApiExplorerPage, EntityApiDefinitionCard, EntityConsumedApisCard, EntityConsumingComponentsCard, EntityHasApisCard, EntityProvidedApisCard, EntityProvidingComponentsCard, HasApisCard, OpenApiDefinitionWidget, PlainApiDefinitionWidget, ProvidedApisCard, ProvidingComponentsCard, apiDocsConfigRef, apiDocsPlugin, defaultDefinitionWidgets, apiDocsPlugin as plugin };
 //# sourceMappingURL=index.esm.js.map