diff --git a/plugins/user-settings/alpha-api-report.md b/plugins/user-settings/alpha-api-report.md
index 8a12861f86..843a6cf7af 100644
--- a/plugins/user-settings/alpha-api-report.md
+++ b/plugins/user-settings/alpha-api-report.md
@@ -3,10 +3,7 @@
 > Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
 
 ```ts
-/// <reference types="react" />
-
 import { BackstagePlugin } from '@backstage/frontend-plugin-api';
-import { ConfigurableExtensionDataRef } from '@backstage/frontend-plugin-api';
 import { Extension } from '@backstage/frontend-plugin-api';
 import { RouteRef } from '@backstage/core-plugin-api';
 import { TranslationRef } from '@backstage/core-plugin-api/alpha';
@@ -17,18 +14,9 @@ export default _default;
 
 // @alpha (undocumented)
 export const UserSettingsPage: Extension<{
-  path: string
-  /**
-   * @alpha
-   */;
+  path: string;
 }>;
 
-// @alpha (undocumented)
-export const userSettingsProviderSettingsExtensionData: ConfigurableExtensionDataRef<
-  JSX.Element,
-  {}
->;
-
 // @alpha (undocumented)
 export const userSettingsRouteRef: RouteRef<undefined>;
 
diff --git a/plugins/user-settings/src/alpha.tsx b/plugins/user-settings/src/alpha.tsx
index 3e4c862fa5..9804fb40ea 100644
--- a/plugins/user-settings/src/alpha.tsx
+++ b/plugins/user-settings/src/alpha.tsx
@@ -1,6 +1,6 @@
 import { createRouteRef } from '@backstage/core-plugin-api';
 import {
-  createExtensionDataRef,
+  coreExtensionData,
   createExtensionInput,
   createPageExtension,
   createPlugin,
@@ -32,14 +32,6 @@ export const userSettingsRouteRef = createRouteRef({
   id: 'plugin.user-settings.page',
 });
 
-/**
- * @alpha
- */
-export const userSettingsProviderSettingsExtensionData =
-  createExtensionDataRef<JSX.Element>(
-    'plugin.user-settings.page.providerSettings',
-  );
-
 /**
  * @alpha
  */
@@ -50,14 +42,14 @@ export const UserSettingsPage = createPageExtension({
   inputs: {
     providerSettings: createExtensionInput(
       {
-        component: userSettingsProviderSettingsExtensionData,
+        element: coreExtensionData.reactElement,
       },
-      { singleton: true },
+      { singleton: true, optional: true },
     ),
   },
   loader: ({ inputs }) =>
     import('./components/SettingsPage').then(m => (
-      <m.SettingsPage providerSettings={inputs.providerSettings.component} />
+      <m.SettingsPage providerSettings={inputs.providerSettings?.element} />
     )),
 });