frontend-plugin-api: migration to IconElement + API reports

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

plugins/app-react/report.api.md

@@ -10,6 +10,7 @@ import { ExtensionBlueprint } from '@backstage/frontend-plugin-api';
 import { ExtensionBlueprintParams } from '@backstage/frontend-plugin-api';
 import { ExtensionDataRef } from '@backstage/frontend-plugin-api';
 import { IconComponent } from '@backstage/frontend-plugin-api';
+import { IconElement } from '@backstage/frontend-plugin-api';
 import { IdentityApi } from '@backstage/frontend-plugin-api';
 import { ReactNode } from 'react';
 import { RouteRef } from '@backstage/frontend-plugin-api';
@@ -45,11 +46,11 @@ export const AppRootWrapperBlueprint: ExtensionBlueprint<{
 export const IconBundleBlueprint: ExtensionBlueprint<{
   kind: 'icon-bundle';
   params: {
-    icons: { [key in string]: IconComponent };
+    icons: { [key in string]: IconComponent | IconElement };
   };
   output: ExtensionDataRef<
     {
-      [x: string]: IconComponent;
+      [x: string]: IconComponent | IconElement;
     },
     'core.icons',
     {}
@@ -60,7 +61,7 @@ export const IconBundleBlueprint: ExtensionBlueprint<{
   dataRefs: {
     icons: ConfigurableExtensionDataRef<
       {
-        [x: string]: IconComponent;
+        [x: string]: IconComponent | IconElement;
       },
       'core.icons',
       {}

plugins/app-react/src/blueprints/IconBundleBlueprint.ts

@@ -14,14 +14,14 @@
  * limitations under the License.
  */
 
-import { IconComponent } from '@backstage/frontend-plugin-api';
+import { IconComponent, IconElement } from '@backstage/frontend-plugin-api';
 import {
   createExtensionBlueprint,
   createExtensionDataRef,
 } from '@backstage/frontend-plugin-api';
 
 const iconsDataRef = createExtensionDataRef<{
-  [key in string]: IconComponent;
+  [key in string]: IconComponent | IconElement;
 }>().with({ id: 'core.icons' });
 
 /**
@@ -33,9 +33,9 @@ export const IconBundleBlueprint = createExtensionBlueprint({
   kind: 'icon-bundle',
   attachTo: { id: 'api:app/icons', input: 'icons' },
   output: [iconsDataRef],
-  factory: (params: { icons: { [key in string]: IconComponent } }) => [
-    iconsDataRef(params.icons),
-  ],
+  factory: (params: {
+    icons: { [key in string]: IconComponent | IconElement };
+  }) => [iconsDataRef(params.icons)],
   dataRefs: {
     icons: iconsDataRef,
   },