diff --git a/plugins/app/api-report.md b/plugins/app/api-report.md
new file mode 100644
index 0000000000..9618474641
--- /dev/null
+++ b/plugins/app/api-report.md
@@ -0,0 +1,665 @@
+## API Report File for "@backstage/plugin-app"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+/// <reference types="react" />
+
+import { AnyApiFactory } from '@backstage/frontend-plugin-api';
+import { AnyExtensionDataRef } from '@backstage/frontend-plugin-api';
+import { AnyRouteRefParams } from '@backstage/frontend-plugin-api';
+import { AppTheme } from '@backstage/frontend-plugin-api';
+import { BackstagePlugin } from '@backstage/frontend-plugin-api';
+import { ComponentRef } from '@backstage/frontend-plugin-api';
+import { ComponentType } from 'react';
+import { ConfigurableExtensionDataRef } from '@backstage/frontend-plugin-api';
+import { ExtensionDefinition } from '@backstage/frontend-plugin-api';
+import { ExtensionInput } from '@backstage/frontend-plugin-api';
+import { IconComponent } from '@backstage/core-plugin-api';
+import { IconComponent as IconComponent_2 } from '@backstage/frontend-plugin-api';
+import { JSX as JSX_2 } from 'react';
+import { ReactNode } from 'react';
+import { RouteRef } from '@backstage/frontend-plugin-api';
+import { SignInPageProps } from '@backstage/core-plugin-api';
+import { TranslationMessages } from '@backstage/frontend-plugin-api';
+import { TranslationResource } from '@backstage/frontend-plugin-api';
+
+// @public (undocumented)
+const appPlugin: BackstagePlugin<
+  {},
+  {},
+  {
+    [x: `component:app/${string}`]: ExtensionDefinition<
+      {
+        [x: string]: any;
+      },
+      {
+        [x: string]: any;
+      },
+      ConfigurableExtensionDataRef<
+        {
+          ref: ComponentRef;
+          impl: ComponentType;
+        },
+        'core.component.component',
+        {}
+      >,
+      {
+        [x: string]: ExtensionInput<
+          AnyExtensionDataRef,
+          {
+            optional: boolean;
+            singleton: boolean;
+          }
+        >;
+      },
+      {
+        kind: 'component';
+        namespace: string;
+        name: string;
+      }
+    >;
+    'api:app/discovery': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'discovery';
+      }
+    >;
+    'api:app/alert': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'alert';
+      }
+    >;
+    'api:app/analytics': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'analytics';
+      }
+    >;
+    'api:app/error': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'error';
+      }
+    >;
+    'api:app/storage': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'storage';
+      }
+    >;
+    'api:app/fetch': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'fetch';
+      }
+    >;
+    'api:app/oauth-request': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'oauth-request';
+      }
+    >;
+    'api:app/google-auth': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'google-auth';
+      }
+    >;
+    'api:app/microsoft-auth': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'microsoft-auth';
+      }
+    >;
+    'api:app/github-auth': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'github-auth';
+      }
+    >;
+    'api:app/okta-auth': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'okta-auth';
+      }
+    >;
+    'api:app/gitlab-auth': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'gitlab-auth';
+      }
+    >;
+    'api:app/onelogin-auth': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'onelogin-auth';
+      }
+    >;
+    'api:app/bitbucket-auth': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'bitbucket-auth';
+      }
+    >;
+    'api:app/bitbucket-server-auth': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'bitbucket-server-auth';
+      }
+    >;
+    'api:app/atlassian-auth': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'atlassian-auth';
+      }
+    >;
+    'api:app/vmware-cloud-auth': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'vmware-cloud-auth';
+      }
+    >;
+    'api:app/permission': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'permission';
+      }
+    >;
+    app: ExtensionDefinition<
+      {
+        [x: string]: any;
+      },
+      {
+        [x: string]: any;
+      },
+      ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+      {
+        root: ExtensionInput<
+          ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+          {
+            singleton: true;
+            optional: false;
+          }
+        >;
+      },
+      {
+        kind: undefined;
+        namespace: 'app';
+        name: undefined;
+      }
+    >;
+    'api:app/app-language': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'app-language';
+      }
+    >;
+    'app/layout': ExtensionDefinition<
+      {
+        [x: string]: any;
+      },
+      {
+        [x: string]: any;
+      },
+      ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+      {
+        nav: ExtensionInput<
+          ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+          {
+            singleton: true;
+            optional: false;
+          }
+        >;
+        content: ExtensionInput<
+          ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+          {
+            singleton: true;
+            optional: false;
+          }
+        >;
+      },
+      {
+        kind: undefined;
+        namespace: 'app';
+        name: 'layout';
+      }
+    >;
+    'app/nav': ExtensionDefinition<
+      {
+        [x: string]: any;
+      },
+      {
+        [x: string]: any;
+      },
+      ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+      {
+        items: ExtensionInput<
+          ConfigurableExtensionDataRef<
+            {
+              title: string;
+              icon: IconComponent;
+              routeRef: RouteRef<undefined>;
+            },
+            'core.nav-item.target',
+            {}
+          >,
+          {
+            singleton: false;
+            optional: false;
+          }
+        >;
+        logos: ExtensionInput<
+          ConfigurableExtensionDataRef<
+            {
+              logoIcon?: JSX.Element | undefined;
+              logoFull?: JSX.Element | undefined;
+            },
+            'core.nav-logo.logo-elements',
+            {}
+          >,
+          {
+            singleton: true;
+            optional: true;
+          }
+        >;
+      },
+      {
+        kind: undefined;
+        namespace: 'app';
+        name: 'nav';
+      }
+    >;
+    'app/root': ExtensionDefinition<
+      {
+        [x: string]: any;
+      },
+      {
+        [x: string]: any;
+      },
+      ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+      {
+        router: ExtensionInput<
+          ConfigurableExtensionDataRef<
+            ComponentType<{
+              children?: ReactNode;
+            }>,
+            'app.router.wrapper',
+            {}
+          >,
+          {
+            singleton: true;
+            optional: true;
+          }
+        >;
+        signInPage: ExtensionInput<
+          ConfigurableExtensionDataRef<
+            ComponentType<SignInPageProps>,
+            'core.sign-in-page.component',
+            {}
+          >,
+          {
+            singleton: true;
+            optional: true;
+          }
+        >;
+        children: ExtensionInput<
+          ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+          {
+            singleton: true;
+            optional: false;
+          }
+        >;
+        elements: ExtensionInput<
+          ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+          {
+            singleton: false;
+            optional: false;
+          }
+        >;
+        wrappers: ExtensionInput<
+          ConfigurableExtensionDataRef<
+            ComponentType<{
+              children?: ReactNode;
+            }>,
+            'app.root.wrapper',
+            {}
+          >,
+          {
+            singleton: false;
+            optional: false;
+          }
+        >;
+      },
+      {
+        kind: undefined;
+        namespace: 'app';
+        name: 'root';
+      }
+    >;
+    'app/routes': ExtensionDefinition<
+      {
+        [x: string]: any;
+      },
+      {
+        [x: string]: any;
+      },
+      ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+      {
+        routes: ExtensionInput<
+          | ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>
+          | ConfigurableExtensionDataRef<string, 'core.routing.path', {}>
+          | ConfigurableExtensionDataRef<
+              RouteRef<AnyRouteRefParams>,
+              'core.routing.ref',
+              {
+                optional: true;
+              }
+            >,
+          {
+            singleton: false;
+            optional: false;
+          }
+        >;
+      },
+      {
+        kind: undefined;
+        namespace: 'app';
+        name: 'routes';
+      }
+    >;
+    'api:app/app-theme': ExtensionDefinition<
+      {
+        [x: string]: any;
+      },
+      {
+        [x: string]: any;
+      },
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {
+        themes: ExtensionInput<
+          ConfigurableExtensionDataRef<AppTheme, 'core.theme.theme', {}>,
+          {
+            singleton: false;
+            optional: false;
+          }
+        >;
+      },
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'app-theme';
+      }
+    >;
+    'theme:app/light': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AppTheme, 'core.theme.theme', {}>,
+      {},
+      {
+        kind: 'theme';
+        namespace: 'app';
+        name: 'light';
+      }
+    >;
+    'theme:app/dark': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AppTheme, 'core.theme.theme', {}>,
+      {},
+      {
+        kind: 'theme';
+        namespace: 'app';
+        name: 'dark';
+      }
+    >;
+    'api:app/components': ExtensionDefinition<
+      {
+        [x: string]: any;
+      },
+      {
+        [x: string]: any;
+      },
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {
+        components: ExtensionInput<
+          ConfigurableExtensionDataRef<
+            {
+              ref: ComponentRef;
+              impl: ComponentType;
+            },
+            'core.component.component',
+            {}
+          >,
+          {
+            singleton: false;
+            optional: false;
+          }
+        >;
+      },
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'components';
+      }
+    >;
+    'api:app/icons': ExtensionDefinition<
+      {
+        [x: string]: any;
+      },
+      {
+        [x: string]: any;
+      },
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {
+        icons: ExtensionInput<
+          ConfigurableExtensionDataRef<
+            {
+              [x: string]: IconComponent_2;
+            },
+            'core.icons',
+            {}
+          >,
+          {
+            singleton: false;
+            optional: false;
+          }
+        >;
+      },
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'icons';
+      }
+    >;
+    'api:app/feature-flags': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {},
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'feature-flags';
+      }
+    >;
+    'api:app/translations': ExtensionDefinition<
+      {
+        [x: string]: any;
+      },
+      {
+        [x: string]: any;
+      },
+      ConfigurableExtensionDataRef<AnyApiFactory, 'core.api.factory', {}>,
+      {
+        translations: ExtensionInput<
+          ConfigurableExtensionDataRef<
+            | TranslationResource<string>
+            | TranslationMessages<
+                string,
+                {
+                  [x: string]: string;
+                },
+                boolean
+              >,
+            'core.translation.translation',
+            {}
+          >,
+          {
+            singleton: false;
+            optional: false;
+          }
+        >;
+      },
+      {
+        kind: 'api';
+        namespace: undefined;
+        name: 'translations';
+      }
+    >;
+    'app-root-element:app/oauth-request-dialog': ExtensionDefinition<
+      {},
+      {},
+      ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+      {},
+      {
+        kind: 'app-root-element';
+        namespace: 'app';
+        name: 'oauth-request-dialog';
+      }
+    >;
+    'app-root-element:app/alert-display': ExtensionDefinition<
+      {
+        transientTimeoutMs: number;
+        anchorOrigin: {
+          horizontal: 'center' | 'left' | 'right';
+          vertical: 'top' | 'bottom';
+        };
+      },
+      {
+        anchorOrigin?:
+          | {
+              horizontal?: 'center' | 'left' | 'right' | undefined;
+              vertical?: 'top' | 'bottom' | undefined;
+            }
+          | undefined;
+        transientTimeoutMs?: number | undefined;
+      },
+      ConfigurableExtensionDataRef<JSX_2.Element, 'core.reactElement', {}>,
+      {
+        [x: string]: ExtensionInput<
+          AnyExtensionDataRef,
+          {
+            optional: boolean;
+            singleton: boolean;
+          }
+        >;
+      },
+      {
+        kind: 'app-root-element';
+        namespace: 'app';
+        name: 'alert-display';
+      }
+    >;
+  }
+>;
+export default appPlugin;
+
+// (No @packageDocumentation comment for this package)
+```
diff --git a/plugins/app/src/extensions/AppThemeApi.tsx b/plugins/app/src/extensions/AppThemeApi.tsx
index fbbb9957ff..a31e29e58b 100644
--- a/plugins/app/src/extensions/AppThemeApi.tsx
+++ b/plugins/app/src/extensions/AppThemeApi.tsx
@@ -28,7 +28,8 @@ import {
   createApiFactory,
   appThemeApiRef,
 } from '@backstage/frontend-plugin-api';
-import { AppThemeSelector } from '@backstage/core-app-api';
+// eslint-disable-next-line @backstage/no-relative-monorepo-imports
+import { AppThemeSelector } from '../../../../packages/core-app-api/src/apis/implementations';
 
 /**
  * Contains the themes installed into the app.
diff --git a/plugins/app/src/extensions/index.ts b/plugins/app/src/extensions/index.ts
index 85efe58515..157f7ddb62 100644
--- a/plugins/app/src/extensions/index.ts
+++ b/plugins/app/src/extensions/index.ts
@@ -19,7 +19,7 @@ export { AppLayout } from './AppLayout';
 export { AppNav } from './AppNav';
 export { AppRoot } from './AppRoot';
 export { AppRoutes } from './AppRoutes';
-export { AppThemeApi } from './AppThemeApi';
+export { AppThemeApi, DarkTheme, LightTheme } from './AppThemeApi';
 export { ComponentsApi } from './ComponentsApi';
 export { IconsApi } from './IconsApi';
 export { FeatureFlagsApi } from './FeatureFlagsApi';