@backstage/frontend-app-api 0.5.0 → 0.6.0-next.0

package/CHANGELOG.md

@@ -1,5 +1,46 @@
 # @backstage/frontend-app-api
 
+## 0.6.0-next.0
+
+### Minor Changes
+
+- 86346c2: **BREAKING**: The `app.routes.bindings` app-config mapping has been simplified. You now only need to specify the plugin ID and route ID on both sides of the mapping.
+
+  Old form:
+
+  ```yaml
+  app:
+    routes:
+      bindings:
+        plugin.catalog.externalRoutes.viewTechDoc: plugin.techdocs.routes.docRoot
+        plugin.catalog.externalRoutes.createComponent: plugin.catalog-import.routes.importPage
+  ```
+
+  New form:
+
+  ```yaml
+  app:
+    routes:
+      bindings:
+        catalog.viewTechDoc: techdocs.docRoot
+        catalog.createComponent: catalog-import.importPage
+  ```
+
+### Patch Changes
+
+- 42ebf27: Added `IconsApi` implementation and the ability to configure icons through the `icons` option for `createApp` and `createSpecializedApp`. This is not a long-term solution as icons should be installable via extensions instead. This is just a stop-gap to make sure there is feature parity with the existing frontend system.
+- e0a4dd1: Improved the error message when data input/output shapes do not match
+- Updated dependencies
+  - @backstage/frontend-plugin-api@0.5.1-next.0
+  - @backstage/core-components@0.13.10
+  - @backstage/config@1.1.1
+  - @backstage/core-app-api@1.11.3
+  - @backstage/core-plugin-api@1.8.2
+  - @backstage/errors@1.2.3
+  - @backstage/theme@0.5.0
+  - @backstage/types@1.1.1
+  - @backstage/version-bridge@1.0.7
+
 ## 0.5.0
 
 ### Minor Changes

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import { ExternalRouteRef, RouteRef, SubRouteRef, ExtensionDataRef, FrontendFeature } from '@backstage/frontend-plugin-api';
 import { JSX } from 'react';
 import { Config } from '@backstage/config';
-import { ConfigApi } from '@backstage/core-plugin-api';
+import { ConfigApi, IconComponent } from '@backstage/core-plugin-api';
 
 /**
  * Extracts a union of the keys in a map whose value extends the given type
@@ -78,6 +78,9 @@ interface CreateAppFeatureLoader {
 }
 /** @public */
 declare function createApp(options?: {
+    icons?: {
+        [key in string]: IconComponent;
+    };
     features?: (FrontendFeature | CreateAppFeatureLoader)[];
     configLoader?: () => Promise<{
         config: ConfigApi;
@@ -95,6 +98,9 @@ declare function createApp(options?: {
  * @public
  */
 declare function createSpecializedApp(options?: {
+    icons?: {
+        [key in string]: IconComponent;
+    };
     features?: FrontendFeature[];
     config?: ConfigApi;
     bindRoutes?(context: {

package/dist/index.esm.js

@@ -1,6 +1,6 @@
 import React, { useMemo, useState, useEffect, createContext, Fragment, useContext } from 'react';
 import { ConfigReader } from '@backstage/config';
-import { createExtension, createExtensionInput, createApiExtension, createThemeExtension, createComponentExtension, createTranslationExtension, coreExtensionData, useComponentRef, coreComponentRefs, createNavItemExtension, createNavLogoExtension, useRouteRef, createAppRootElementExtension, createSchemaFromZod, AnalyticsContext, useAnalytics, createRouterExtension, createSignInPageExtension, createAppRootWrapperExtension, appTreeApiRef, componentsApiRef } from '@backstage/frontend-plugin-api';
+import { createExtension, createExtensionInput, createApiExtension, createThemeExtension, createComponentExtension, createTranslationExtension, coreExtensionData, useComponentRef, coreComponentRefs, createNavItemExtension, createNavLogoExtension, useRouteRef, createAppRootElementExtension, createSchemaFromZod, AnalyticsContext, useAnalytics, createRouterExtension, createSignInPageExtension, createAppRootWrapperExtension, appTreeApiRef, componentsApiRef, iconsApiRef } from '@backstage/frontend-plugin-api';
 import { useRoutes, BrowserRouter, useInRouterContext, MemoryRouter, matchRoutes, generatePath, useLocation, Route } from 'react-router-dom';
 import { SidebarPage, sidebarConfig, Sidebar, SidebarDivider, useSidebarOpenState, Link, SidebarItem, Progress, ErrorPage, ErrorPanel, OAuthRequestDialog, AlertDisplay } from '@backstage/core-components';
 import { makeStyles, Button as Button$1 } from '@material-ui/core';
@@ -11,27 +11,27 @@ import ObservableImpl from 'zen-observable';
 import { createInstance } from 'i18next';
 import { permissionApiRef, IdentityPermissionApi } from '@backstage/plugin-permission-react';
 import Button from '@material-ui/core/Button';
-import '@material-ui/icons/Apartment';
-import '@material-ui/icons/BrokenImage';
-import '@material-ui/icons/Category';
-import '@material-ui/icons/CreateNewFolder';
-import '@material-ui/icons/Subject';
-import '@material-ui/icons/Search';
-import '@material-ui/icons/Chat';
-import '@material-ui/icons/Dashboard';
-import '@material-ui/icons/Description';
-import '@material-ui/icons/Email';
-import '@material-ui/icons/Extension';
-import '@material-ui/icons/GitHub';
-import '@material-ui/icons/Help';
-import '@material-ui/icons/LocationOn';
-import '@material-ui/icons/Memory';
-import '@material-ui/icons/MenuBook';
-import '@material-ui/icons/People';
-import '@material-ui/icons/Person';
-import '@material-ui/icons/Warning';
-import '@material-ui/icons/Work';
-import '@material-ui/icons/FeaturedPlayList';
+import MuiApartmentIcon from '@material-ui/icons/Apartment';
+import MuiBrokenImageIcon from '@material-ui/icons/BrokenImage';
+import MuiCategoryIcon from '@material-ui/icons/Category';
+import MuiCreateNewFolderIcon from '@material-ui/icons/CreateNewFolder';
+import MuiSubjectIcon from '@material-ui/icons/Subject';
+import MuiSearchIcon from '@material-ui/icons/Search';
+import MuiChatIcon from '@material-ui/icons/Chat';
+import MuiDashboardIcon from '@material-ui/icons/Dashboard';
+import MuiDocsIcon from '@material-ui/icons/Description';
+import MuiEmailIcon from '@material-ui/icons/Email';
+import MuiExtensionIcon from '@material-ui/icons/Extension';
+import MuiGitHubIcon from '@material-ui/icons/GitHub';
+import MuiHelpIcon from '@material-ui/icons/Help';
+import MuiLocationOnIcon from '@material-ui/icons/LocationOn';
+import MuiMemoryIcon from '@material-ui/icons/Memory';
+import MuiMenuBookIcon from '@material-ui/icons/MenuBook';
+import MuiPeopleIcon from '@material-ui/icons/People';
+import MuiPersonIcon from '@material-ui/icons/Person';
+import MuiWarningIcon from '@material-ui/icons/Warning';
+import MuiStorageIcon from '@material-ui/icons/Storage';
+import MuiFeaturedPlayListIcon from '@material-ui/icons/FeaturedPlayList';
 import { UnifiedThemeProvider, themes } from '@backstage/theme';
 import DarkIcon from '@material-ui/icons/Brightness2';
 import LightIcon from '@material-ui/icons/WbSunny';
@@ -668,21 +668,21 @@ class BehaviorSubject {
   }
 }
 
-var __accessCheck$2 = (obj, member, msg) => {
+var __accessCheck$3 = (obj, member, msg) => {
   if (!member.has(obj))
     throw TypeError("Cannot " + msg);
 };
-var __privateGet$2 = (obj, member, getter) => {
-  __accessCheck$2(obj, member, "read from private field");
+var __privateGet$3 = (obj, member, getter) => {
+  __accessCheck$3(obj, member, "read from private field");
   return getter ? getter.call(obj) : member.get(obj);
 };
-var __privateAdd$2 = (obj, member, value) => {
+var __privateAdd$3 = (obj, member, value) => {
   if (member.has(obj))
     throw TypeError("Cannot add the same private member more than once");
   member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 };
-var __privateSet$2 = (obj, member, value, setter) => {
-  __accessCheck$2(obj, member, "write to private field");
+var __privateSet$3 = (obj, member, value, setter) => {
+  __accessCheck$3(obj, member, "write to private field");
   setter ? setter.call(obj, value) : member.set(obj, value);
   return value;
 };
@@ -691,13 +691,13 @@ const STORAGE_KEY = "language";
 const DEFAULT_LANGUAGE = "en";
 const _AppLanguageSelector = class _AppLanguageSelector {
   constructor(languages, initialLanguage) {
-    __privateAdd$2(this, _languages, void 0);
-    __privateAdd$2(this, _language$1, void 0);
-    __privateAdd$2(this, _subject, void 0);
-    __privateSet$2(this, _languages, languages);
-    __privateSet$2(this, _language$1, initialLanguage);
-    __privateSet$2(this, _subject, new BehaviorSubject({
-      language: __privateGet$2(this, _language$1)
+    __privateAdd$3(this, _languages, void 0);
+    __privateAdd$3(this, _language$1, void 0);
+    __privateAdd$3(this, _subject, void 0);
+    __privateSet$3(this, _languages, languages);
+    __privateSet$3(this, _language$1, initialLanguage);
+    __privateSet$3(this, _subject, new BehaviorSubject({
+      language: __privateGet$3(this, _language$1)
     }));
   }
   static create(options) {
@@ -748,28 +748,28 @@ const _AppLanguageSelector = class _AppLanguageSelector {
     return selector;
   }
   getAvailableLanguages() {
-    return { languages: __privateGet$2(this, _languages).slice() };
+    return { languages: __privateGet$3(this, _languages).slice() };
   }
   setLanguage(language) {
     const lng = language != null ? language : DEFAULT_LANGUAGE;
-    if (lng === __privateGet$2(this, _language$1)) {
+    if (lng === __privateGet$3(this, _language$1)) {
       return;
     }
-    if (lng && !__privateGet$2(this, _languages).includes(lng)) {
+    if (lng && !__privateGet$3(this, _languages).includes(lng)) {
       throw new Error(
-        `Failed to change language to '${lng}', available languages are '${__privateGet$2(this, _languages).join(
+        `Failed to change language to '${lng}', available languages are '${__privateGet$3(this, _languages).join(
           "', '"
         )}'`
       );
     }
-    __privateSet$2(this, _language$1, lng);
-    __privateGet$2(this, _subject).next({ language: lng });
+    __privateSet$3(this, _language$1, lng);
+    __privateGet$3(this, _subject).next({ language: lng });
   }
   getLanguage() {
-    return { language: __privateGet$2(this, _language$1) };
+    return { language: __privateGet$3(this, _language$1) };
   }
   language$() {
-    return __privateGet$2(this, _subject);
+    return __privateGet$3(this, _subject);
   }
 };
 _languages = new WeakMap();
@@ -799,26 +799,26 @@ function toInternalTranslationRef(ref) {
   return r;
 }
 
-var __accessCheck$1 = (obj, member, msg) => {
+var __accessCheck$2 = (obj, member, msg) => {
   if (!member.has(obj))
     throw TypeError("Cannot " + msg);
 };
-var __privateGet$1 = (obj, member, getter) => {
-  __accessCheck$1(obj, member, "read from private field");
+var __privateGet$2 = (obj, member, getter) => {
+  __accessCheck$2(obj, member, "read from private field");
   return getter ? getter.call(obj) : member.get(obj);
 };
-var __privateAdd$1 = (obj, member, value) => {
+var __privateAdd$2 = (obj, member, value) => {
   if (member.has(obj))
     throw TypeError("Cannot add the same private member more than once");
   member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 };
-var __privateSet$1 = (obj, member, value, setter) => {
-  __accessCheck$1(obj, member, "write to private field");
+var __privateSet$2 = (obj, member, value, setter) => {
+  __accessCheck$2(obj, member, "write to private field");
   setter ? setter.call(obj, value) : member.set(obj, value);
   return value;
 };
 var __privateMethod = (obj, member, method) => {
-  __accessCheck$1(obj, member, "access private method");
+  __accessCheck$2(obj, member, "access private method");
   return method;
 };
 var _loaded, _loading, _loaders, _getLoaderKey, getLoaderKey_fn, _i18n, _loader, _language, _registeredRefs, _languageChangeListeners, _changeLanguage, changeLanguage_fn, _createSnapshot, createSnapshot_fn, _registerDefaults, registerDefaults_fn;
@@ -832,41 +832,41 @@ function removeNulls(messages) {
 class ResourceLoader {
   constructor(onLoad) {
     this.onLoad = onLoad;
-    __privateAdd$1(this, _getLoaderKey);
+    __privateAdd$2(this, _getLoaderKey);
     /** Loaded resources by loader key */
-    __privateAdd$1(this, _loaded, /* @__PURE__ */ new Set());
+    __privateAdd$2(this, _loaded, /* @__PURE__ */ new Set());
     /** Resource loading promises by loader key */
-    __privateAdd$1(this, _loading, /* @__PURE__ */ new Map());
+    __privateAdd$2(this, _loading, /* @__PURE__ */ new Map());
     /** Loaders for each resource language */
-    __privateAdd$1(this, _loaders, /* @__PURE__ */ new Map());
+    __privateAdd$2(this, _loaders, /* @__PURE__ */ new Map());
   }
   addTranslationResource(resource) {
     const internalResource = toInternalTranslationResource(resource);
     for (const entry of internalResource.resources) {
       const key = __privateMethod(this, _getLoaderKey, getLoaderKey_fn).call(this, entry.language, internalResource.id);
-      if (!__privateGet$1(this, _loaders).has(key)) {
-        __privateGet$1(this, _loaders).set(key, entry.loader);
+      if (!__privateGet$2(this, _loaders).has(key)) {
+        __privateGet$2(this, _loaders).set(key, entry.loader);
       }
     }
   }
   needsLoading(language, namespace) {
     const key = __privateMethod(this, _getLoaderKey, getLoaderKey_fn).call(this, language, namespace);
-    const loader = __privateGet$1(this, _loaders).get(key);
+    const loader = __privateGet$2(this, _loaders).get(key);
     if (!loader) {
       return false;
     }
-    return !__privateGet$1(this, _loaded).has(key);
+    return !__privateGet$2(this, _loaded).has(key);
   }
   async load(language, namespace) {
     const key = __privateMethod(this, _getLoaderKey, getLoaderKey_fn).call(this, language, namespace);
-    const loader = __privateGet$1(this, _loaders).get(key);
+    const loader = __privateGet$2(this, _loaders).get(key);
     if (!loader) {
       return;
     }
-    if (__privateGet$1(this, _loaded).has(key)) {
+    if (__privateGet$2(this, _loaded).has(key)) {
       return;
     }
-    const loading = __privateGet$1(this, _loading).get(key);
+    const loading = __privateGet$2(this, _loading).get(key);
     if (loading) {
       await loading;
       return;
@@ -874,14 +874,14 @@ class ResourceLoader {
     const load = loader().then(
       (result) => {
         this.onLoad({ language, namespace, messages: result.messages });
-        __privateGet$1(this, _loaded).add(key);
+        __privateGet$2(this, _loaded).add(key);
       },
       (error) => {
-        __privateGet$1(this, _loaded).add(key);
+        __privateGet$2(this, _loaded).add(key);
         throw error;
       }
     );
-    __privateGet$1(this, _loading).set(key, load);
+    __privateGet$2(this, _loading).set(key, load);
     await load;
   }
 }
@@ -894,19 +894,19 @@ getLoaderKey_fn = function(language, namespace) {
 };
 const _I18nextTranslationApi = class _I18nextTranslationApi {
   constructor(i18n, loader, language) {
-    __privateAdd$1(this, _changeLanguage);
-    __privateAdd$1(this, _createSnapshot);
-    __privateAdd$1(this, _registerDefaults);
-    __privateAdd$1(this, _i18n, void 0);
-    __privateAdd$1(this, _loader, void 0);
-    __privateAdd$1(this, _language, void 0);
+    __privateAdd$2(this, _changeLanguage);
+    __privateAdd$2(this, _createSnapshot);
+    __privateAdd$2(this, _registerDefaults);
+    __privateAdd$2(this, _i18n, void 0);
+    __privateAdd$2(this, _loader, void 0);
+    __privateAdd$2(this, _language, void 0);
     /** Keep track of which refs we have registered default resources for */
-    __privateAdd$1(this, _registeredRefs, /* @__PURE__ */ new Set());
+    __privateAdd$2(this, _registeredRefs, /* @__PURE__ */ new Set());
     /** Notify observers when language changes */
-    __privateAdd$1(this, _languageChangeListeners, /* @__PURE__ */ new Set());
-    __privateSet$1(this, _i18n, i18n);
-    __privateSet$1(this, _loader, loader);
-    __privateSet$1(this, _language, language);
+    __privateAdd$2(this, _languageChangeListeners, /* @__PURE__ */ new Set());
+    __privateSet$2(this, _i18n, i18n);
+    __privateSet$2(this, _loader, loader);
+    __privateSet$2(this, _language, language);
   }
   static create(options) {
     const { languages } = options.languageApi.getAvailableLanguages();
@@ -982,7 +982,7 @@ const _I18nextTranslationApi = class _I18nextTranslationApi {
       const loadResource = () => {
         loadTicket = {};
         const ticket = loadTicket;
-        __privateGet$1(this, _loader).load(__privateGet$1(this, _language), internalRef.id).then(
+        __privateGet$2(this, _loader).load(__privateGet$2(this, _language), internalRef.id).then(
           () => {
             if (ticket === loadTicket) {
               const snapshot = __privateMethod(this, _createSnapshot, createSnapshot_fn).call(this, internalRef);
@@ -1006,12 +1006,12 @@ const _I18nextTranslationApi = class _I18nextTranslationApi {
           loadResource();
         }
       };
-      if (__privateGet$1(this, _loader).needsLoading(__privateGet$1(this, _language), internalRef.id)) {
+      if (__privateGet$2(this, _loader).needsLoading(__privateGet$2(this, _language), internalRef.id)) {
         loadResource();
       }
-      __privateGet$1(this, _languageChangeListeners).add(onChange);
+      __privateGet$2(this, _languageChangeListeners).add(onChange);
       return () => {
-        __privateGet$1(this, _languageChangeListeners).delete(onChange);
+        __privateGet$2(this, _languageChangeListeners).delete(onChange);
       };
     });
   }
@@ -1023,18 +1023,18 @@ _registeredRefs = new WeakMap();
 _languageChangeListeners = new WeakMap();
 _changeLanguage = new WeakSet();
 changeLanguage_fn = function(language) {
-  if (__privateGet$1(this, _language) !== language) {
-    __privateSet$1(this, _language, language);
-    __privateGet$1(this, _i18n).changeLanguage(language);
-    __privateGet$1(this, _languageChangeListeners).forEach((listener) => listener());
+  if (__privateGet$2(this, _language) !== language) {
+    __privateSet$2(this, _language, language);
+    __privateGet$2(this, _i18n).changeLanguage(language);
+    __privateGet$2(this, _languageChangeListeners).forEach((listener) => listener());
   }
 };
 _createSnapshot = new WeakSet();
 createSnapshot_fn = function(internalRef) {
-  if (__privateGet$1(this, _loader).needsLoading(__privateGet$1(this, _language), internalRef.id)) {
+  if (__privateGet$2(this, _loader).needsLoading(__privateGet$2(this, _language), internalRef.id)) {
     return { ready: false };
   }
-  const t = __privateGet$1(this, _i18n).getFixedT(
+  const t = __privateGet$2(this, _i18n).getFixedT(
     null,
     internalRef.id
   );
@@ -1045,12 +1045,12 @@ createSnapshot_fn = function(internalRef) {
 };
 _registerDefaults = new WeakSet();
 registerDefaults_fn = function(internalRef) {
-  if (__privateGet$1(this, _registeredRefs).has(internalRef.id)) {
+  if (__privateGet$2(this, _registeredRefs).has(internalRef.id)) {
     return;
   }
-  __privateGet$1(this, _registeredRefs).add(internalRef.id);
+  __privateGet$2(this, _registeredRefs).add(internalRef.id);
   const defaultMessages = internalRef.getDefaultMessages();
-  __privateGet$1(this, _i18n).addResourceBundle(
+  __privateGet$2(this, _i18n).addResourceBundle(
     DEFAULT_LANGUAGE,
     internalRef.id,
     defaultMessages,
@@ -1061,7 +1061,7 @@ registerDefaults_fn = function(internalRef) {
   );
   const defaultResource = internalRef.getDefaultResource();
   if (defaultResource) {
-    __privateGet$1(this, _loader).addTranslationResource(defaultResource);
+    __privateGet$2(this, _loader).addTranslationResource(defaultResource);
   }
 };
 let I18nextTranslationApi = _I18nextTranslationApi;
@@ -1356,6 +1356,33 @@ const components = {
   ErrorBoundaryFallback: DefaultErrorBoundaryFallback
 };
 
+const icons = {
+  brokenImage: MuiBrokenImageIcon,
+  // To be confirmed: see https://github.com/backstage/backstage/issues/4970
+  catalog: MuiMenuBookIcon,
+  scaffolder: MuiCreateNewFolderIcon,
+  techdocs: MuiSubjectIcon,
+  search: MuiSearchIcon,
+  chat: MuiChatIcon,
+  dashboard: MuiDashboardIcon,
+  docs: MuiDocsIcon,
+  email: MuiEmailIcon,
+  github: MuiGitHubIcon,
+  group: MuiPeopleIcon,
+  help: MuiHelpIcon,
+  "kind:api": MuiExtensionIcon,
+  "kind:component": MuiMemoryIcon,
+  "kind:domain": MuiApartmentIcon,
+  "kind:group": MuiPeopleIcon,
+  "kind:location": MuiLocationOnIcon,
+  "kind:system": MuiCategoryIcon,
+  "kind:user": MuiPersonIcon,
+  "kind:resource": MuiStorageIcon,
+  "kind:template": MuiFeaturedPlayListIcon,
+  user: MuiPersonIcon,
+  warning: MuiWarningIcon
+};
+
 const LightTheme = createThemeExtension({
   id: "light",
   title: "Light Theme",
@@ -1751,7 +1778,7 @@ function collectRouteIds(features) {
       continue;
     }
     for (const [name, ref] of Object.entries(feature.routes)) {
-      const refId = `plugin.${feature.id}.routes.${name}`;
+      const refId = `${feature.id}.${name}`;
       if (routesById.has(refId)) {
         throw new Error(`Unexpected duplicate route '${refId}'`);
       }
@@ -1765,7 +1792,7 @@ function collectRouteIds(features) {
       }
     }
     for (const [name, ref] of Object.entries(feature.externalRoutes)) {
-      const refId = `plugin.${feature.id}.externalRoutes.${name}`;
+      const refId = `${feature.id}.${name}`;
       if (externalRoutesById.has(refId)) {
         throw new Error(`Unexpected duplicate external route '${refId}'`);
       }
@@ -2163,11 +2190,13 @@ function resolveAppNodeSpecs(options) {
 
 function resolveInputData(dataMap, attachment, inputName) {
   return mapValues(dataMap, (ref) => {
-    var _a;
+    var _a, _b, _c;
     const value = (_a = attachment.instance) == null ? void 0 : _a.getData(ref);
     if (value === void 0 && !ref.config.optional) {
+      const expected = Object.values(dataMap).filter((r) => !r.config.optional).map((r) => `'${r.id}'`).join(", ");
+      const provided = [...(_c = (_b = attachment.instance) == null ? void 0 : _b.getDataRefs()) != null ? _c : []].map((r) => `'${r.id}'`).join(", ");
       throw new Error(
-        `input '${inputName}' did not receive required extension data '${ref.id}' from extension '${attachment.spec.id}'`
+        `extension '${attachment.spec.id}' could not be attached because its output data (${provided}) does not match what the input '${inputName}' requires (${expected})`
       );
     }
     return value;
@@ -2527,32 +2556,32 @@ function AppRouter(props) {
   ));
 }
 
-var __accessCheck = (obj, member, msg) => {
+var __accessCheck$1 = (obj, member, msg) => {
   if (!member.has(obj))
     throw TypeError("Cannot " + msg);
 };
-var __privateGet = (obj, member, getter) => {
-  __accessCheck(obj, member, "read from private field");
+var __privateGet$1 = (obj, member, getter) => {
+  __accessCheck$1(obj, member, "read from private field");
   return getter ? getter.call(obj) : member.get(obj);
 };
-var __privateAdd = (obj, member, value) => {
+var __privateAdd$1 = (obj, member, value) => {
   if (member.has(obj))
     throw TypeError("Cannot add the same private member more than once");
   member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 };
-var __privateSet = (obj, member, value, setter) => {
-  __accessCheck(obj, member, "write to private field");
+var __privateSet$1 = (obj, member, value, setter) => {
+  __accessCheck$1(obj, member, "write to private field");
   setter ? setter.call(obj, value) : member.set(obj, value);
   return value;
 };
 var _components;
 class DefaultComponentsApi {
   constructor(components) {
-    __privateAdd(this, _components, void 0);
-    __privateSet(this, _components, components);
+    __privateAdd$1(this, _components, void 0);
+    __privateSet$1(this, _components, components);
   }
   getComponent(ref) {
-    const impl = __privateGet(this, _components).get(ref);
+    const impl = __privateGet$1(this, _components).get(ref);
     if (!impl) {
       throw new Error(`No implementation found for component ref ${ref}`);
     }
@@ -2561,6 +2590,39 @@ class DefaultComponentsApi {
 }
 _components = new WeakMap();
 
+var __accessCheck = (obj, member, msg) => {
+  if (!member.has(obj))
+    throw TypeError("Cannot " + msg);
+};
+var __privateGet = (obj, member, getter) => {
+  __accessCheck(obj, member, "read from private field");
+  return getter ? getter.call(obj) : member.get(obj);
+};
+var __privateAdd = (obj, member, value) => {
+  if (member.has(obj))
+    throw TypeError("Cannot add the same private member more than once");
+  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+};
+var __privateSet = (obj, member, value, setter) => {
+  __accessCheck(obj, member, "write to private field");
+  setter ? setter.call(obj, value) : member.set(obj, value);
+  return value;
+};
+var _icons;
+class DefaultIconsApi {
+  constructor(icons) {
+    __privateAdd(this, _icons, void 0);
+    __privateSet(this, _icons, new Map(Object.entries(icons)));
+  }
+  getIcon(key) {
+    return __privateGet(this, _icons).get(key);
+  }
+  listIconKeys() {
+    return Array.from(__privateGet(this, _icons).keys());
+  }
+}
+_icons = new WeakMap();
+
 const DefaultApis = apis.map((factory) => createApiExtension({ factory }));
 const builtinExtensions = [
   App,
@@ -2678,6 +2740,7 @@ function createApp(options) {
       }
     }
     const app = createSpecializedApp({
+      icons: options == null ? void 0 : options.icons,
       config,
       features: [...discoveredFeatures, ...providedFeatures],
       bindRoutes: options == null ? void 0 : options.bindRoutes
@@ -2703,7 +2766,12 @@ function createSpecializedApp(options) {
     config
   });
   const appIdentityProxy = new AppIdentityProxy();
-  const apiHolder = createApiHolder(tree, config, appIdentityProxy);
+  const apiHolder = createApiHolder(
+    tree,
+    config,
+    appIdentityProxy,
+    options == null ? void 0 : options.icons
+  );
   const featureFlagApi = apiHolder.get(featureFlagsApiRef);
   if (featureFlagApi) {
     for (const feature of features) {
@@ -2742,7 +2810,7 @@ function createSpecializedApp(options) {
     }
   };
 }
-function createApiHolder(tree, configApi, appIdentityProxy) {
+function createApiHolder(tree, configApi, appIdentityProxy, icons$1) {
   var _a, _b, _c, _d, _e, _f, _g, _h;
   const factoryRegistry = new ApiFactoryRegistry();
   const pluginApis = (_b = (_a = tree.root.edges.attachments.get("apis")) == null ? void 0 : _a.map((e) => {
@@ -2794,6 +2862,11 @@ function createApiHolder(tree, configApi, appIdentityProxy) {
     deps: {},
     factory: () => new DefaultComponentsApi(componentsMap)
   });
+  factoryRegistry.register("static", {
+    api: iconsApiRef,
+    deps: {},
+    factory: () => new DefaultIconsApi({ ...icons, ...icons$1 })
+  });
   factoryRegistry.register("static", {
     api: appThemeApiRef,
     deps: {},