diff --git a/src/login/KcPageStory.ts b/src/login/KcPageStory.ts
index 0e85385..8d67c4d 100644
--- a/src/login/KcPageStory.ts
+++ b/src/login/KcPageStory.ts
@@ -48,7 +48,10 @@ export const decorators = (_: unknown, context: StoryContextLike) => ({
 @Component({
   selector: 'kc-page-story',
   template: `@if (pageComponent) {
-    <kc-root [page]="pageComponent"></kc-root>
+    <kc-root
+      [page]="pageComponent"
+      [userProfileFormFields]="userProfileFormFieldsComponent"
+    ></kc-root>
   }`,
   standalone: true,
   imports: [TemplateComponent],
@@ -56,9 +59,11 @@ export const decorators = (_: unknown, context: StoryContextLike) => ({
 export class KcPageStory implements OnInit {
   pageComponent: Type<unknown> | undefined;
   kcContext = inject(KC_LOGIN_CONTEXT);
+  userProfileFormFieldsComponent: Type<unknown> | undefined;
   ngOnInit() {
     getKcPage(this.kcContext.pageId).then((kcPage) => {
       this.pageComponent = kcPage.PageComponent;
+      this.userProfileFormFieldsComponent = kcPage.UserProfileFormFieldsComponent;
     });
   }
 }