Give the option in template to pull the default assets or not

src/lib/components/Error.tsx

@@ -17,6 +17,7 @@ export const Error = memo(({ kcContext, ...props }: { kcContext: KcContextBase.E
     return (
         <Template
             {...{ kcContext, ...props }}
+            doFetchDefaultThemeResources={true}
             displayMessage={false}
             headerNode={msg("errorTitle")}
             formNode={

src/lib/components/Info.tsx

@@ -25,6 +25,7 @@ export const Info = memo(({ kcContext, ...props }: { kcContext: KcContextBase.In
     return (
         <Template
             {...{ kcContext, ...props }}
+            doFetchDefaultThemeResources={true}
             displayMessage={false}
             headerNode={
                 messageHeader !== undefined ?

src/lib/components/Login.tsx

@@ -26,6 +26,7 @@ export const Login = memo(({ kcContext, ...props }: { kcContext: KcContextBase.L
     return (
         <Template
             {...{ kcContext, ...props }}
+            doFetchDefaultThemeResources={true}
             displayInfo={social.displayInfo}
             displayWide={realm.password && social.providers !== undefined}
             headerNode={msg("doLogIn")}

src/lib/components/LoginIdpLinkConfirm.tsx

@@ -15,6 +15,7 @@ export const LoginIdpLinkConfirm = memo(({ kcContext, ...props }: { kcContext: K
 	return (
 		<Template
 			{...{ kcContext, ...props }}
+			doFetchDefaultThemeResources={true}
 			headerNode={msg("confirmLinkIdpTitle")}
 			formNode={
 				<form id="kc-register-form" action={url.loginAction} method="post">

src/lib/components/LoginOtp.tsx

@@ -43,6 +43,7 @@ export const LoginOtp = memo(({ kcContext, ...props }: { kcContext: KcContextBas
     return (
         <Template
             {...{ kcContext, ...props }}
+            doFetchDefaultThemeResources={true}
             headerNode={msg("doLogIn")}
             formNode={
 

src/lib/components/LoginResetPassword.tsx

@@ -19,6 +19,7 @@ export const LoginResetPassword = memo(({ kcContext, ...props }: { kcContext: Kc
     return (
         <Template
             {...{ kcContext, ...props }}
+            doFetchDefaultThemeResources={true}
             displayMessage={false}
             headerNode={msg("emailForgotTitle")}
             formNode={

src/lib/components/LoginUpdateProfile.tsx

@@ -14,6 +14,7 @@ export const LoginUpdateProfile = memo(({ kcContext, ...props }: { kcContext: Kc
 	return (
 		<Template
 			{...{ kcContext, ...props }}
+			doFetchDefaultThemeResources={true}
 			headerNode={msg("loginProfileTitle")}
 			formNode={
 				<form id="kc-update-profile-form" className={cx(props.kcFormClass)} action={url.loginAction} method="post">

src/lib/components/LoginVerifyEmail.tsx

@@ -16,6 +16,7 @@ export const LoginVerifyEmail = memo(({ kcContext, ...props }: { kcContext: KcCo
     return (
         <Template
             {...{ kcContext, ...props }}
+            doFetchDefaultThemeResources={true}
             displayMessage={false}
             headerNode={msg("emailVerifyTitle")}
             formNode={

src/lib/components/Register.tsx

@@ -22,6 +22,7 @@ export const Register = memo(({ kcContext, ...props }: { kcContext: KcContextBas
     return (
         <Template
             {...{ kcContext, ...props }}
+            doFetchDefaultThemeResources={true}
             headerNode={msg("registerTitle")}
             formNode={
                 <form id="kc-register-form" className={cx(props.kcFormClass)} action={url.registrationAction} method="post">

src/lib/components/Template.tsx

@@ -25,6 +25,10 @@ export type TemplateProps = {
     showUsernameNode?: ReactNode;
     formNode: ReactNode;
     infoNode?: ReactNode;
+    /** If you write your own page you probably want
+     * to avoid pulling the default theme assets.
+     */
+    doFetchDefaultThemeResources: boolean;
 } & { kcContext: KcContextBase; } & KcTemplateProps;
 
 export const Template = memo((props: TemplateProps) => {
@@ -39,7 +43,8 @@ export const Template = memo((props: TemplateProps) => {
         showUsernameNode = null,
         formNode,
         infoNode = null,
-        kcContext
+        kcContext,
+        doFetchDefaultThemeResources
     } = props;
 
     useEffect(() => { console.log("Rendering this page with react using keycloakify") }, []);
@@ -84,6 +89,11 @@ export const Template = memo((props: TemplateProps) => {
 
     useEffect(() => {
 
+        if (!doFetchDefaultThemeResources) {
+            setExtraCssLoaded();
+            return;
+        }
+
         let isUnmounted = false;
         const cleanups: (() => void)[] = [];
 

src/lib/components/Terms.tsx

@@ -14,6 +14,7 @@ export const Terms = memo(({ kcContext, ...props }: { kcContext: KcContextBase.T
     return (
         <Template
             {...{ kcContext, ...props }}
+            doFetchDefaultThemeResources={true}
             displayMessage={false}
             headerNode={msg("termsTitle")}
             formNode={