Fix badge

docs: add wnmzzzz as a contributor for test

.all-contributorsrc

@@ -249,6 +249,120 @@
       "contributions": [
         "code"
       ]
+    },
+    {
+      "login": "liamlows",
+      "name": "Liam Lowsley-Williams",
+      "avatar_url": "https://avatars.githubusercontent.com/u/1365914?v=4",
+      "profile": "https://github.com/liamlows",
+      "contributions": [
+        "code",
+        "doc"
+      ]
+    },
+    {
+      "login": "uchar",
+      "name": "Omid",
+      "avatar_url": "https://avatars.githubusercontent.com/u/5172296?v=4",
+      "profile": "https://www.linkedin.com/in/oes-rioniz/",
+      "contributions": [
+        "test",
+        "code"
+      ]
+    },
+    {
+      "login": "kathari00",
+      "name": "Katharina Eiserfey",
+      "avatar_url": "https://avatars.githubusercontent.com/u/42547712?v=4",
+      "profile": "https://github.com/kathari00",
+      "contributions": [
+        "code",
+        "test",
+        "doc"
+      ]
+    },
+    {
+      "login": "luca-peruzzo",
+      "name": "Luca Peruzzo",
+      "avatar_url": "https://avatars.githubusercontent.com/u/69015314?v=4",
+      "profile": "https://github.com/luca-peruzzo",
+      "contributions": [
+        "code",
+        "test"
+      ]
+    },
+    {
+      "login": "nima70",
+      "name": "Nima Shokouhfar",
+      "avatar_url": "https://avatars.githubusercontent.com/u/5094767?v=4",
+      "profile": "https://github.com/nima70",
+      "contributions": [
+        "code",
+        "test"
+      ]
+    },
+    {
+      "login": "marvinruder",
+      "name": "Marvin A. Ruder",
+      "avatar_url": "https://avatars.githubusercontent.com/u/18495294?v=4",
+      "profile": "https://mruder.dev",
+      "contributions": [
+        "bug"
+      ]
+    },
+    {
+      "login": "zvn2060",
+      "name": "HI_OuO",
+      "avatar_url": "https://avatars.githubusercontent.com/u/45450852?v=4",
+      "profile": "https://github.com/zvn2060",
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "tripheo0412",
+      "name": "Tri Hoang",
+      "avatar_url": "https://avatars.githubusercontent.com/u/25382052?v=4",
+      "profile": "https://github.com/tripheo0412",
+      "contributions": [
+        "doc"
+      ]
+    },
+    {
+      "login": "EternalSide",
+      "name": "Lesha",
+      "avatar_url": "https://avatars.githubusercontent.com/u/118743608?v=4",
+      "profile": "http://t.me/AAT_L",
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "bacongobbler",
+      "name": "Matthew Fisher",
+      "avatar_url": "https://avatars.githubusercontent.com/u/1360539?v=4",
+      "profile": "https://blog.bacongobbler.com",
+      "contributions": [
+        "doc"
+      ]
+    },
+    {
+      "login": "kodebach",
+      "name": "Klemens Böswirth",
+      "avatar_url": "https://avatars.githubusercontent.com/u/23529132?v=4",
+      "profile": "https://github.com/kodebach",
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "wnmzzzz",
+      "name": "wnmzzzz",
+      "avatar_url": "https://avatars.githubusercontent.com/u/117174301?v=4",
+      "profile": "https://github.com/wnmzzzz",
+      "contributions": [
+        "test"
+      ]
     }
   ],
   "contributorsPerLine": 7,

.github/FUNDING.yaml

@@ -1,4 +1,3 @@
 # These are supported funding model platforms
 
 github: [garronej]
-custom: ['https://www.ringerhq.com/experts/garronej']

.github/workflows/ci.yaml

@@ -37,7 +37,7 @@ jobs:
 
   storybook:
     runs-on: ubuntu-latest
-    if: github.event_name == 'push'
+    if: github.event_name == 'push' && github.ref == 'refs/heads/main'
     needs: test
     steps:
     - uses: actions/checkout@v4
@@ -49,7 +49,7 @@ jobs:
     - run: git remote set-url origin https://git:${GITHUB_TOKEN}@github.com/${{github.repository}}.git
       env:
         GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-    - run: npx -y -p gh-pages@3.1.0 gh-pages -d ./storybook-static -u "github-actions-bot <actions@github.com>" 
+    - run: npx -y -p gh-pages@3.1.0 gh-pages -d ./storybook-static -u "github-actions-bot <actions@github.com>"
 
   check_if_version_upgraded:
     name: Check if version upgrade
@@ -112,7 +112,7 @@ jobs:
         registry-url: https://registry.npmjs.org/
     - uses: bahmutov/npm-install@v1
     - run: npm run build
-    - run: npx -y -p denoify@1.6.12 enable_short_npm_import_path
+    - run: npx -y -p denoify@1.6.13 enable_short_npm_import_path
       env:
         DRY_RUN: "0"
     - uses: garronej/ts-ci@v2.1.2

.gitignore

@@ -49,7 +49,7 @@ jspm_packages
 .idea
 
 /src/login/i18n/messages_defaultSet/
-/src/account/i18n/messages_defaultSet/
+/src/account/i18n/
 
 # VS Code devcontainers
 .devcontainer

.prettierignore

@@ -12,4 +12,5 @@ node_modules/
 /sample_react_project/
 /sample_custom_react_project/
 /keycloakify_starter_test/
-/.storybook/static/keycloak-resources/
+/.storybook/static/keycloak-resources/
+/src/bin/start-keycloak/*.json

.storybook/main.js

@@ -9,5 +9,5 @@ module.exports = {
     core: {
         builder: "webpack5"
     },
-    staticDirs: ["./static"]
+    staticDirs: ["./static", "../dist/res/public"]
 };

.storybook/static/terms/en.md

@@ -1,49 +0,0 @@
-## Overview
-
-This Terms of Service document outlines the rules and regulations for the use of **Example Company's** Services.
-
-## Acceptance of Terms
-
-By accessing and using our services, you acknowledge that you have read, understood, and agree to be bound by these terms. If you do not accept these terms, you are not authorized to use our services.
-
-## Description of Service
-
-**Example Service** (hereinafter referred to as "the Service") is a web-based solution offered by **Example Company** (hereinafter referred to as "the Company"). Our service provides users with access to [documentation](https://example.com/docs) and support for managing their projects effectively.
-
-## Modifications to the Terms of Service
-
-The Company reserves the right to modify these terms at any time. Such modifications will be effective immediately upon posting the updated terms on our website. Your continued use of the Service after any such changes shall constitute your consent to such changes.
-
-## Account Registration
-
-You may be required to register with the Service to access certain features. When registering, you agree to provide accurate, current, and complete information about yourself as requested.
-
-## User Responsibilities
-
--   **Data Security**: Users are responsible for safeguarding their login credentials and should not disclose their passwords to any third party.
--   **Acceptable Use**: Users are expected to use the Service in a responsible manner that does not infringe upon the rights of others.
--   **Content Ownership**: Users retain all rights to the content they upload to the Service but grant the Company a license to use and distribute this content as part of the Service.
-
-## Intellectual Property
-
-All intellectual property rights related to the Service and its original content, features, and functionality are owned by the Company.
-
-## Termination
-
-The Company may terminate or suspend access to our Service immediately, without prior notice or liability, for any reason whatsoever, including, without limitation, breach of these Terms.
-
-## Governing Law
-
-These Terms shall be governed and construed in accordance with the laws of [Your Country], without regard to its conflict of law provisions.
-
-## Contact Information
-
-For any questions about these Terms, please contact us at [support@example.com](mailto:support@example.com) or visit our [FAQ page](https://example.com/faq).
-
-## Changes to Terms of Service
-
-We reserve the right, at our sole discretion, to modify or replace these Terms at any time. If a revision is material, we will provide at least 30 days' notice prior to any new terms taking effect.
-
-## Effective Date
-
-These terms are effective as of **[Insert Date]**.

.storybook/static/terms/es.md

@@ -1,49 +0,0 @@
-## Resumen
-
-Este documento de Términos de Servicio detalla las reglas y regulaciones para el uso de los servicios de **Empresa Ejemplo**.
-
-## Aceptación de Términos
-
-Al acceder y utilizar nuestros servicios, usted reconoce que ha leído, entendido y acepta estar vinculado por estos términos. Si no acepta estos términos, no está autorizado para usar nuestros servicios.
-
-## Descripción del Servicio
-
-**Servicio Ejemplo** (en adelante denominado "el Servicio") es una solución basada en la web ofrecida por **Empresa Ejemplo** (en adelante denominada "la Empresa"). Nuestro servicio proporciona a los usuarios acceso a [documentación](https://ejemplo.com/docs) y soporte para gestionar sus proyectos de manera efectiva.
-
-## Modificaciones a los Términos de Servicio
-
-La Empresa se reserva el derecho de modificar estos términos en cualquier momento. Dichas modificaciones entrarán en vigor inmediatamente después de la publicación de los términos actualizados en nuestro sitio web. Su uso continuado del Servicio después de tales cambios constituirá su consentimiento a dichos cambios.
-
-## Registro de Cuenta
-
-Puede ser necesario que se registre en el Servicio para acceder a ciertas características. Al registrarse, usted acepta proporcionar información precisa, actual y completa sobre sí mismo como se solicita.
-
-## Responsabilidades del Usuario
-
--   **Seguridad de Datos**: Los usuarios son responsables de salvaguardar sus credenciales de inicio de sesión y no deben divulgar sus contraseñas a terceros.
--   **Uso Aceptable**: Se espera que los usuarios utilicen el Servicio de manera responsable que no infrinja los derechos de otros.
--   **Propiedad del Contenido**: Los usuarios retienen todos los derechos sobre el contenido que cargan en el Servicio, pero otorgan a la Empresa una licencia para usar y distribuir este contenido como parte del Servicio.
-
-## Propiedad Intelectual
-
-Todos los derechos de propiedad intelectual relacionados con el Servicio y su contenido original, características y funcionalidad son propiedad de la Empresa.
-
-## Terminación
-
-La Empresa puede terminar o suspender su acceso a nuestro Servicio de inmediato, sin previo aviso ni responsabilidad, por cualquier motivo, incluido, entre otros, una violación de estos Términos.
-
-## Ley Aplicable
-
-Estos Términos se regirán e interpretarán de acuerdo con las leyes de [Su País], sin tener en cuenta sus disposiciones de conflicto de leyes.
-
-## Información de Contacto
-
-Para cualquier pregunta sobre estos Términos, contáctenos en [support@ejemplo.com](mailto:support@ejemplo.com) o visite nuestra [página de FAQ](https://ejemplo.com/faq).
-
-## Cambios a los Términos de Servicio
-
-Nos reservamos el derecho, a nuestra única discreción, de modificar o reemplazar estos Términos en cualquier momento. Si una revisión es material, proporcionaremos al menos 30 días de aviso antes de que los nuevos términos entren en vigor.
-
-## Fecha de Efectividad
-
-Estos términos son efectivos a partir del **[Insertar Fecha]**.

.storybook/static/terms/fr.md

@@ -1,49 +0,0 @@
-## Vue d'ensemble
-
-Ce document des Conditions Générales d'Utilisation détaille les règles et réglementations pour l'utilisation des services de **l'Entreprise Exemple**.
-
-## Acceptation des Conditions
-
-En accédant et en utilisant nos services, vous reconnaissez avoir lu, compris et accepté d'être lié par ces conditions. Si vous n'acceptez pas ces termes, vous n'êtes pas autorisé à utiliser nos services.
-
-## Description du Service
-
-**Service Exemple** (ci-après dénommé "le Service") est une solution basée sur le web offerte par **l'Entreprise Exemple** (ci-après dénommée "l'Entreprise"). Notre service offre aux utilisateurs un accès à la [documentation](https://exemple.com/docs) et un support pour gérer efficacement leurs projets.
-
-## Modifications des Conditions de Service
-
-L'Entreprise se réserve le droit de modifier ces conditions à tout moment. De telles modifications entreront en vigueur immédiatement après la publication des termes mis à jour sur notre site web. Votre utilisation continue du Service après de tels changements constitue votre consentement à ces modifications.
-
-## Inscription au Compte
-
-Vous devrez peut-être vous inscrire au Service pour accéder à certaines fonctionnalités. Lors de l'inscription, vous acceptez de fournir des informations précises, actuelles et complètes vous concernant, comme demandé.
-
-## Responsabilités des Utilisateurs
-
--   **Sécurité des Données** : Les utilisateurs sont responsables de la sauvegarde de leurs identifiants de connexion et ne doivent divulguer leurs mots de passe à aucun tiers.
--   **Utilisation Acceptable** : Les utilisateurs sont censés utiliser le Service de manière responsable qui ne porte pas atteinte aux droits d'autrui.
--   **Propriété du Contenu** : Les utilisateurs conservent tous les droits sur le contenu qu'ils téléchargent sur le Service mais accordent à l'Entreprise une licence pour utiliser et distribuer ce contenu dans le cadre du Service.
-
-## Propriété Intellectuelle
-
-Tous les droits de propriété intellectuelle relatifs au Service et à son contenu original, fonctionnalités et fonctionnement sont détenus par l'Entreprise.
-
-## Résiliation
-
-L'Entreprise peut résilier ou suspendre votre accès à notre Service immédiatement, sans préavis ni responsabilité, pour quelque raison que ce soit, y compris, sans limitation, en cas de violation de ces Conditions.
-
-## Loi Applicable
-
-Ces Conditions seront régies et interprétées conformément aux lois de [Votre Pays], sans égard à ses dispositions de conflit de lois.
-
-## Informations de Contact
-
-Pour toute question concernant ces Conditions, veuillez nous contacter à [support@exemple.com](mailto:support@exemple.com) ou visitez notre [page FAQ](https://exemple.com/faq).
-
-## Modifications des Conditions de Service
-
-Nous nous réservons le droit, à notre seule discrétion, de modifier ou de remplacer ces Conditions à tout moment. Si une révision est importante, nous vous fournirons un préavis d'au moins 30 jours avant que les nouveaux termes prennent effet.
-
-## Date d'Effet
-
-Ces conditions sont effectives à partir du **[Insérer la Date]**.

CONTRIBUTING.md

@@ -1,3 +1,3 @@
 Looking to contribute? Thank you! PR are more than welcome.
 
-Please refers to [this documentation page](https://docs.keycloakify.dev/contributing) that will help you get started.
+Please refers to [this documentation page](https://docs.keycloakify.dev/faq-and-help/contributing) that will help you get started.

README.md

@@ -6,7 +6,7 @@
     <br>
     <br>
     <a href="https://github.com/garronej/keycloakify/actions">
-      <img src="https://github.com/garronej/keycloakify/workflows/ci/badge.svg?branch=main">
+      <img src="https://github.com/keycloakify/keycloakify/actions/workflows/ci.yaml/badge.svg">
     </a>
     <a href="https://www.npmjs.com/package/keycloakify">
       <img src="https://img.shields.io/npm/dm/keycloakify">
@@ -41,26 +41,50 @@
     <img width="400" src="https://github.com/user-attachments/assets/6bf3bef9-00b0-4460-97b9-0d2da8500798">
 </p>
 
-Keycloakify is fully compatible with Keycloak 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, [~~22~~](https://github.com/keycloakify/keycloakify/issues/389#issuecomment-1822509763), 23, 24, 25...[and beyond](https://github.com/keycloakify/keycloakify/discussions/346#discussioncomment-5889791)
+Keycloakify is fully compatible with Keycloak from version 11 to 26...[and beyond](https://github.com/keycloakify/keycloakify/discussions/346#discussioncomment-5889791)
 
-> NOTE: Keycloakify 10, while still being tagged as release candidate is the version you should use if you are starting today.  
-> Use `yarn add keycloakify@next` or pin [the latest version candidate](https://www.npmjs.com/package/keycloakify?activeTab=versions).
+> 📣 **Keycloakify 26 Released**  
+> Themes built with Keycloakify versions **prior** to Keycloak 26 are **incompatible** with Keycloak 26.  
+> To ensure compatibility, simply upgrade to the latest Keycloakify version for your major release (v10 or v11) and rebuild your theme.  
+> No breaking changes have been introduced, but the target version ranges have been updated. For more details, see [this guide](https://docs.keycloakify.dev/features/compiler-options/keycloakversiontargets).
 
 ## Sponsors
 
-Friends for the project, we trust and recommend their services.
+Project backers, we trust and recommend their services.
 
 <br/>
 
 <div align="center">
 
-![Logo Dark](https://github.com/user-attachments/assets/088f6631-b7ef-42ad-812b-df4870dc16ae#gh-dark-mode-only)
+![Logo Dark](https://github.com/user-attachments/assets/d8f6b6f5-3de4-4adc-ba15-cb4074e8309b#gh-dark-mode-only)
 
 </div>
 
 <div align="center">
 
-![Logo Light](https://github.com/user-attachments/assets/53fb16f8-02ef-4523-9c36-b42d6e59837e#gh-light-mode-only)
+![Logo Light](https://github.com/user-attachments/assets/20736d6f-f22d-4a9d-9dfe-93be209a8191#gh-light-mode-only)
+
+</div>
+
+<br/>
+
+<p align="center">
+    <i><a href="https://phasetwo.io/?utm_source=keycloakify"><strong>Keycloak as a Service</strong></a> - Keycloak community contributors of popular <a href="https://github.com/p2-inc#our-extensions-?utm_source=keycloakify">extensions</a> providing free and dedicated <a href="https://phasetwo.io/hosting/?utm_source=keycloakify">Keycloak hosting</a> and enterprise <a href="https://phasetwo.io/support/?utm_source=keycloakify">Keycloak support</a> to businesses of all sizes.</i>
+</p>
+
+<br/>
+<br/>
+<br/>
+
+<div align="center">
+
+![Logo Dark](https://github.com/user-attachments/assets/dd3925fb-a58a-4e91-b360-69c2fa1f1087#gh-dark-mode-only)
+
+</div>
+
+<div align="center">
+
+![Logo Light](https://github.com/user-attachments/assets/6c00c201-eed7-485a-a887-70891559d69b#gh-light-mode-only)
 
 </div>
 
@@ -85,7 +109,7 @@ Friends for the project, we trust and recommend their services.
 </div>
 
 <p align="center">
-<a href="https://cloud-iam.com/?mtm_campaign=keycloakify-deal&mtm_source=keycloakify-github"><strong>Managed Keycloak Provider</strong> - With Cloud-IAM powering your Keycloak clusters, you can sleep easy knowing you've got the software and the experts you need for operational excellence.  </a>
+<a href="https://cloud-iam.com/?mtm_campaign=keycloakify-deal&mtm_source=keycloakify-github"><strong>Managed Keycloak Provider</strong> - With Cloud-IAM powering your Keycloak clusters, you can sleep easy knowing you've got the software and the experts you need for operational excellence. Cloud IAM is a french company. </a>
 <br/>
 Use code <code>keycloakify5</code> at checkout for a 5% discount.
 </p>
@@ -133,6 +157,22 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/Moulyy"><img src="https://avatars.githubusercontent.com/u/115405804?v=4?s=100" width="100px;" alt="Moulyy"/><br /><sub><b>Moulyy</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=Moulyy" title="Code">💻</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/madmadson"><img src="https://avatars.githubusercontent.com/u/798831?v=4?s=100" width="100px;" alt="Tobias Matt"/><br /><sub><b>Tobias Matt</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=madmadson" title="Code">💻</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/oliviergoulet5"><img src="https://avatars.githubusercontent.com/u/17685861?v=4?s=100" width="100px;" alt="Olivier Goulet"/><br /><sub><b>Olivier Goulet</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=oliviergoulet5" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/liamlows"><img src="https://avatars.githubusercontent.com/u/1365914?v=4?s=100" width="100px;" alt="Liam Lowsley-Williams"/><br /><sub><b>Liam Lowsley-Williams</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=liamlows" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=liamlows" title="Documentation">📖</a></td>
+    </tr>
+    <tr>
+      <td align="center" valign="top" width="14.28%"><a href="https://www.linkedin.com/in/oes-rioniz/"><img src="https://avatars.githubusercontent.com/u/5172296?v=4?s=100" width="100px;" alt="Omid"/><br /><sub><b>Omid</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=uchar" title="Tests">⚠️</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=uchar" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/kathari00"><img src="https://avatars.githubusercontent.com/u/42547712?v=4?s=100" width="100px;" alt="Katharina Eiserfey"/><br /><sub><b>Katharina Eiserfey</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=kathari00" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=kathari00" title="Tests">⚠️</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=kathari00" title="Documentation">📖</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/luca-peruzzo"><img src="https://avatars.githubusercontent.com/u/69015314?v=4?s=100" width="100px;" alt="Luca Peruzzo"/><br /><sub><b>Luca Peruzzo</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=luca-peruzzo" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=luca-peruzzo" title="Tests">⚠️</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/nima70"><img src="https://avatars.githubusercontent.com/u/5094767?v=4?s=100" width="100px;" alt="Nima Shokouhfar"/><br /><sub><b>Nima Shokouhfar</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=nima70" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=nima70" title="Tests">⚠️</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://mruder.dev"><img src="https://avatars.githubusercontent.com/u/18495294?v=4?s=100" width="100px;" alt="Marvin A. Ruder"/><br /><sub><b>Marvin A. Ruder</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/issues?q=author%3Amarvinruder" title="Bug reports">🐛</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/zvn2060"><img src="https://avatars.githubusercontent.com/u/45450852?v=4?s=100" width="100px;" alt="HI_OuO"/><br /><sub><b>HI_OuO</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=zvn2060" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/tripheo0412"><img src="https://avatars.githubusercontent.com/u/25382052?v=4?s=100" width="100px;" alt="Tri Hoang"/><br /><sub><b>Tri Hoang</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=tripheo0412" title="Documentation">📖</a></td>
+    </tr>
+    <tr>
+      <td align="center" valign="top" width="14.28%"><a href="http://t.me/AAT_L"><img src="https://avatars.githubusercontent.com/u/118743608?v=4?s=100" width="100px;" alt="Lesha"/><br /><sub><b>Lesha</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=EternalSide" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://blog.bacongobbler.com"><img src="https://avatars.githubusercontent.com/u/1360539?v=4?s=100" width="100px;" alt="Matthew Fisher"/><br /><sub><b>Matthew Fisher</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=bacongobbler" title="Documentation">📖</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/kodebach"><img src="https://avatars.githubusercontent.com/u/23529132?v=4?s=100" width="100px;" alt="Klemens Böswirth"/><br /><sub><b>Klemens Böswirth</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=kodebach" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/wnmzzzz"><img src="https://avatars.githubusercontent.com/u/117174301?v=4?s=100" width="100px;" alt="wnmzzzz"/><br /><sub><b>wnmzzzz</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=wnmzzzz" title="Tests">⚠️</a></td>
     </tr>
   </tbody>
 </table>

package.json

@@ -1,14 +1,14 @@
 {
     "name": "keycloakify",
-    "version": "10.0.0-rc.147",
-    "description": "Create Keycloak themes using React",
+    "version": "11.8.23",
+    "description": "Framework to create custom Keycloak UIs",
     "repository": {
         "type": "git",
         "url": "git://github.com/keycloakify/keycloakify.git"
     },
     "scripts": {
         "prepare": "tsx scripts/generate-i18n-messages.ts",
-        "build": "tsx scripts/build.ts",
+        "build": "tsx scripts/build/main.ts",
         "storybook": "tsx scripts/start-storybook.ts",
         "link-in-starter": "tsx scripts/link-in-starter.ts",
         "test": "yarn test:types && vitest run",
@@ -38,12 +38,14 @@
         "dist/",
         "!dist/tsconfig.tsbuildinfo",
         "!dist/bin/",
+        "dist/bin/**/*.d.ts",
         "dist/bin/main.js",
         "dist/bin/*.index.js",
         "dist/bin/*.node",
         "dist/bin/shared/constants.js",
-        "dist/bin/shared/*.d.ts",
-        "dist/bin/shared/*.js.map",
+        "dist/bin/shared/constants.js.map",
+        "dist/bin/shared/customHandler.js",
+        "dist/bin/shared/customHandler.js.map",
         "!dist/vite-plugin/",
         "dist/vite-plugin/index.js",
         "dist/vite-plugin/index.d.ts",
@@ -62,12 +64,13 @@
     ],
     "homepage": "https://www.keycloakify.dev",
     "dependencies": {
-        "tsafe": "^1.6.6"
+        "tsafe": "^1.8.5"
     },
     "devDependencies": {
         "@babel/core": "^7.24.5",
         "@babel/generator": "^7.24.5",
         "@babel/parser": "^7.24.5",
+        "@babel/preset-env": "7.24.8",
         "@babel/types": "^7.24.5",
         "@emotion/react": "^11.11.4",
         "@octokit/rest": "^20.1.1",
@@ -75,24 +78,31 @@
         "@storybook/builder-webpack5": "^6.5.13",
         "@storybook/manager-webpack5": "^6.5.13",
         "@storybook/react": "^6.5.13",
-        "eslint-plugin-storybook": "^0.6.7",
         "@types/babel__generator": "^7.6.4",
+        "@types/dompurify": "^2.0.0",
         "@types/make-fetch-happen": "^10.0.1",
         "@types/minimist": "^1.2.2",
         "@types/node": "^18.15.3",
+        "@types/properties-parser": "^0.3.3",
         "@types/react": "^18.0.35",
         "@types/react-dom": "^18.0.11",
         "@types/yauzl": "^2.10.3",
         "@vercel/ncc": "^0.38.1",
+        "babel-loader": "9.1.3",
         "chalk": "^4.1.2",
         "cheerio": "1.0.0-rc.12",
         "chokidar-cli": "^3.0.0",
         "cli-select": "^1.1.2",
+        "dompurify": "^3.1.6",
+        "eslint-plugin-storybook": "^0.6.7",
+        "evt": "^2.5.8",
+        "html-entities": "^2.5.2",
         "husky": "^4.3.8",
+        "isomorphic-dompurify": "^2.15.0",
         "lint-staged": "^11.0.0",
         "magic-string": "^0.30.7",
         "make-fetch-happen": "^11.0.3",
-        "powerhooks": "^1.0.10",
+        "powerhooks": "^1.0.19",
         "prettier": "^3.2.5",
         "properties-parser": "^0.3.1",
         "react": "^18.2.0",
@@ -103,12 +113,13 @@
         "termost": "^v0.12.1",
         "tsc-alias": "^1.8.10",
         "tss-react": "^4.9.10",
+        "tsx": "^4.15.5",
         "typescript": "^4.9.4",
         "vite": "^5.2.11",
         "vitest": "^1.6.0",
+        "webpack": "5.93.0",
+        "webpack-cli": "5.1.4",
         "yauzl": "^2.10.0",
-        "zod": "^3.17.10",
-        "evt": "^2.5.7",
-        "tsx": "^4.15.5"
+        "zod": "^3.17.10"
     }
 }

scripts/build-storybook.ts

@@ -1,16 +1,4 @@
-import * as child_process from "child_process";
-import { copyKeycloakResourcesToStorybookStaticDir } from "./copyKeycloakResourcesToStorybookStaticDir";
+import { run } from "./shared/run";
 
-(async () => {
-    run("yarn build");
-
-    await copyKeycloakResourcesToStorybookStaticDir();
-
-    run("npx build-storybook");
-})();
-
-function run(command: string, options?: { env?: NodeJS.ProcessEnv }) {
-    console.log(`$ ${command}`);
-
-    child_process.execSync(command, { stdio: "inherit", ...options });
-}
+run("yarn build");
+run("npx build-storybook");

scripts/build.ts

@@ -1,176 +0,0 @@
-import * as child_process from "child_process";
-import * as fs from "fs";
-import { join } from "path";
-import { assert } from "tsafe/assert";
-import { transformCodebase } from "../src/bin/tools/transformCodebase";
-import chalk from "chalk";
-
-console.log(chalk.cyan("Building Keycloakify..."));
-
-const startTime = Date.now();
-
-if (fs.existsSync(join("dist", "bin", "main.original.js"))) {
-    fs.renameSync(
-        join("dist", "bin", "main.original.js"),
-        join("dist", "bin", "main.js")
-    );
-
-    fs.readdirSync(join("dist", "bin")).forEach(fileBasename => {
-        if (/[0-9]\.index.js/.test(fileBasename) || fileBasename.endsWith(".node")) {
-            fs.rmSync(join("dist", "bin", fileBasename));
-        }
-    });
-}
-
-run(`npx tsc -p ${join("src", "bin", "tsconfig.json")}`);
-
-if (
-    !fs
-        .readFileSync(join("dist", "bin", "main.js"))
-        .toString("utf8")
-        .includes("__nccwpck_require__")
-) {
-    fs.cpSync(join("dist", "bin", "main.js"), join("dist", "bin", "main.original.js"));
-}
-
-run(`npx ncc build ${join("dist", "bin", "main.js")} -o ${join("dist", "ncc_out")}`);
-
-transformCodebase({
-    srcDirPath: join("dist", "ncc_out"),
-    destDirPath: join("dist", "bin"),
-    transformSourceCode: ({ fileRelativePath, sourceCode }) => {
-        if (fileRelativePath === "index.js") {
-            return {
-                newFileName: "main.js",
-                modifiedSourceCode: sourceCode
-            };
-        }
-
-        return { modifiedSourceCode: sourceCode };
-    }
-});
-
-fs.rmSync(join("dist", "ncc_out"), { recursive: true });
-
-{
-    let hasBeenPatched = false;
-
-    fs.readdirSync(join("dist", "bin")).forEach(fileBasename => {
-        if (fileBasename !== "main.js" && !fileBasename.endsWith(".index.js")) {
-            return;
-        }
-
-        const { hasBeenPatched: hasBeenPatched_i } = patchDeprecatedBufferApiUsage(
-            join("dist", "bin", fileBasename)
-        );
-
-        if (hasBeenPatched_i) {
-            hasBeenPatched = true;
-        }
-    });
-
-    assert(hasBeenPatched);
-}
-
-fs.chmodSync(
-    join("dist", "bin", "main.js"),
-    fs.statSync(join("dist", "bin", "main.js")).mode |
-        fs.constants.S_IXUSR |
-        fs.constants.S_IXGRP |
-        fs.constants.S_IXOTH
-);
-
-run(`npx tsc -p ${join("src", "tsconfig.json")}`);
-run(`npx tsc-alias -p ${join("src", "tsconfig.json")}`);
-
-if (fs.existsSync(join("dist", "vite-plugin", "index.original.js"))) {
-    fs.renameSync(
-        join("dist", "vite-plugin", "index.original.js"),
-        join("dist", "vite-plugin", "index.js")
-    );
-}
-
-run(`npx tsc -p ${join("src", "vite-plugin", "tsconfig.json")}`);
-
-if (
-    !fs
-        .readFileSync(join("dist", "vite-plugin", "index.js"))
-        .toString("utf8")
-        .includes("__nccwpck_require__")
-) {
-    fs.cpSync(
-        join("dist", "vite-plugin", "index.js"),
-        join("dist", "vite-plugin", "index.original.js")
-    );
-}
-
-run(
-    `npx ncc build ${join("dist", "vite-plugin", "index.js")} -o ${join(
-        "dist",
-        "ncc_out"
-    )}`
-);
-
-fs.readdirSync(join("dist", "ncc_out")).forEach(fileBasename => {
-    assert(!fileBasename.endsWith(".index.js"));
-    assert(!fileBasename.endsWith(".node"));
-});
-
-transformCodebase({
-    srcDirPath: join("dist", "ncc_out"),
-    destDirPath: join("dist", "vite-plugin"),
-    transformSourceCode: ({ fileRelativePath, sourceCode }) => {
-        assert(fileRelativePath === "index.js");
-
-        return { modifiedSourceCode: sourceCode };
-    }
-});
-
-fs.rmSync(join("dist", "ncc_out"), { recursive: true });
-
-{
-    const { hasBeenPatched } = patchDeprecatedBufferApiUsage(
-        join("dist", "vite-plugin", "index.js")
-    );
-
-    assert(hasBeenPatched);
-}
-
-fs.rmSync(join("dist", "src"), { recursive: true, force: true });
-
-fs.cpSync("src", join("dist", "src"), { recursive: true });
-
-transformCodebase({
-    srcDirPath: join("stories"),
-    destDirPath: join("dist", "stories"),
-    transformSourceCode: ({ fileRelativePath, sourceCode }) => {
-        if (!fileRelativePath.endsWith(".stories.tsx")) {
-            return undefined;
-        }
-
-        return { modifiedSourceCode: sourceCode };
-    }
-});
-
-console.log(chalk.green(`✓ built in ${((Date.now() - startTime) / 1000).toFixed(2)}s`));
-
-function run(command: string) {
-    console.log(chalk.grey(`$ ${command}`));
-
-    child_process.execSync(command, { stdio: "inherit" });
-}
-
-function patchDeprecatedBufferApiUsage(filePath: string) {
-    const before = fs.readFileSync(filePath).toString("utf8");
-
-    const after = before.replace(
-        `var buffer = new Buffer(toRead);`,
-        `var buffer = Buffer.allocUnsafe ? Buffer.allocUnsafe(toRead) : new Buffer(toRead);`
-    );
-
-    fs.writeFileSync(filePath, Buffer.from(after, "utf8"));
-
-    const hasBeenPatched = after !== before;
-
-    return { hasBeenPatched };
-}

scripts/build/createAccountV1Dir.ts

@@ -0,0 +1,79 @@
+import * as fs from "fs";
+import { join as pathJoin } from "path";
+import { transformCodebase } from "../../src/bin/tools/transformCodebase";
+import { downloadKeycloakDefaultTheme } from "../shared/downloadKeycloakDefaultTheme";
+import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "../../src/bin/shared/constants";
+import { getThisCodebaseRootDirPath } from "../../src/bin/tools/getThisCodebaseRootDirPath";
+import { accountMultiPageSupportedLanguages } from "../generate-i18n-messages";
+import * as fsPr from "fs/promises";
+
+export async function createAccountV1Dir() {
+    const { extractedDirPath } = await downloadKeycloakDefaultTheme({
+        keycloakVersionId: "FOR_ACCOUNT_MULTI_PAGE"
+    });
+
+    const destDirPath = pathJoin(
+        getThisCodebaseRootDirPath(),
+        "dist",
+        "res",
+        "account-v1"
+    );
+
+    await fsPr.rm(destDirPath, { recursive: true, force: true });
+
+    transformCodebase({
+        srcDirPath: pathJoin(extractedDirPath, "base", "account"),
+        destDirPath
+    });
+
+    transformCodebase({
+        srcDirPath: pathJoin(extractedDirPath, "keycloak", "account", "resources"),
+        destDirPath: pathJoin(destDirPath, "resources")
+    });
+
+    transformCodebase({
+        srcDirPath: pathJoin(extractedDirPath, "keycloak", "common", "resources"),
+        destDirPath: pathJoin(
+            destDirPath,
+            "resources",
+            WELL_KNOWN_DIRECTORY_BASE_NAME.RESOURCES_COMMON
+        )
+    });
+
+    fs.writeFileSync(
+        pathJoin(destDirPath, "theme.properties"),
+        Buffer.from(
+            [
+                "accountResourceProvider=account-v1",
+                "",
+                `locales=${accountMultiPageSupportedLanguages.join(",")}`,
+                "",
+                "styles=" +
+                    [
+                        "css/account.css",
+                        "img/icon-sidebar-active.png",
+                        "img/logo.png",
+                        ...[
+                            "patternfly.min.css",
+                            "patternfly-additions.min.css",
+                            "patternfly-additions.min.css"
+                        ].map(
+                            fileBasename =>
+                                `${WELL_KNOWN_DIRECTORY_BASE_NAME.RESOURCES_COMMON}/node_modules/patternfly/dist/css/${fileBasename}`
+                        )
+                    ].join(" "),
+                "",
+                "##### css classes for form buttons",
+                "# main class used for all buttons",
+                "kcButtonClass=btn",
+                "# classes defining priority of the button - primary or default (there is typically only one priority button for the form)",
+                "kcButtonPrimaryClass=btn-primary",
+                "kcButtonDefaultClass=btn-default",
+                "# classes defining size of the button",
+                "kcButtonLargeClass=btn-lg",
+                ""
+            ].join("\n"),
+            "utf8"
+        )
+    );
+}

scripts/build/createPublicKeycloakifyDevResourcesDir.ts

@@ -0,0 +1,73 @@
+import { join as pathJoin } from "path";
+import { downloadKeycloakDefaultTheme } from "../shared/downloadKeycloakDefaultTheme";
+import { transformCodebase } from "../../src/bin/tools/transformCodebase";
+import { existsAsync } from "../../src/bin/tools/fs.existsAsync";
+import { getThisCodebaseRootDirPath } from "../../src/bin/tools/getThisCodebaseRootDirPath";
+import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "../../src/bin/shared/constants";
+import { assert, type Equals } from "tsafe/assert";
+import * as fsPr from "fs/promises";
+
+export async function createPublicKeycloakifyDevResourcesDir() {
+    await Promise.all(
+        (["login", "account"] as const).map(async themeType => {
+            const { extractedDirPath } = await downloadKeycloakDefaultTheme({
+                keycloakVersionId: (() => {
+                    switch (themeType) {
+                        case "login":
+                            return "FOR_LOGIN_THEME";
+                        case "account":
+                            return "FOR_ACCOUNT_MULTI_PAGE";
+                    }
+                    assert<Equals<typeof themeType, never>>();
+                })()
+            });
+
+            const destDirPath = pathJoin(
+                getThisCodebaseRootDirPath(),
+                "dist",
+                "res",
+                "public",
+                WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES,
+                themeType
+            );
+
+            await fsPr.rm(destDirPath, { recursive: true, force: true });
+
+            base_resources: {
+                const srcDirPath = pathJoin(
+                    extractedDirPath,
+                    "base",
+                    themeType,
+                    "resources"
+                );
+
+                if (!(await existsAsync(srcDirPath))) {
+                    break base_resources;
+                }
+
+                transformCodebase({
+                    srcDirPath,
+                    destDirPath
+                });
+            }
+
+            transformCodebase({
+                srcDirPath: pathJoin(
+                    extractedDirPath,
+                    "keycloak",
+                    themeType,
+                    "resources"
+                ),
+                destDirPath
+            });
+
+            transformCodebase({
+                srcDirPath: pathJoin(extractedDirPath, "keycloak", "common", "resources"),
+                destDirPath: pathJoin(
+                    destDirPath,
+                    WELL_KNOWN_DIRECTORY_BASE_NAME.RESOURCES_COMMON
+                )
+            });
+        })
+    );
+}

scripts/build/downloadKeycloakifyLogging.ts

@@ -0,0 +1,39 @@
+import { downloadAndExtractArchive } from "../../src/bin/tools/downloadAndExtractArchive";
+import { cacheDirPath } from "../shared/cacheDirPath";
+import { getProxyFetchOptions } from "../../src/bin/tools/fetchProxyOptions";
+import { getThisCodebaseRootDirPath } from "../../src/bin/tools/getThisCodebaseRootDirPath";
+import { existsAsync } from "../../src/bin/tools/fs.existsAsync";
+import * as fs from "fs/promises";
+import {
+    KEYCLOAKIFY_LOGGING_VERSION,
+    KEYCLOAKIFY_LOGIN_JAR_BASENAME
+} from "../../src/bin/shared/constants";
+import { join as pathJoin } from "path";
+
+export async function downloadKeycloakifyLogging(params: { distDirPath: string }) {
+    const { distDirPath } = params;
+
+    const jarFilePath = pathJoin(
+        distDirPath,
+        "src",
+        "bin",
+        "start-keycloak",
+        KEYCLOAKIFY_LOGIN_JAR_BASENAME
+    );
+
+    if (await existsAsync(jarFilePath)) {
+        return;
+    }
+
+    const { archiveFilePath } = await downloadAndExtractArchive({
+        cacheDirPath,
+        fetchOptions: getProxyFetchOptions({
+            npmConfigGetCwd: getThisCodebaseRootDirPath()
+        }),
+        url: `https://github.com/keycloakify/keycloakify-logging/releases/download/${KEYCLOAKIFY_LOGGING_VERSION}/keycloakify-logging-${KEYCLOAKIFY_LOGGING_VERSION}.jar`,
+        uniqueIdOfOnArchiveFile: "no extraction",
+        onArchiveFile: async () => {}
+    });
+
+    await fs.cp(archiveFilePath, jarFilePath);
+}

scripts/build/main.ts

@@ -0,0 +1,188 @@
+import * as fs from "fs";
+import { join } from "path";
+import { assert } from "tsafe/assert";
+import { transformCodebase } from "../../src/bin/tools/transformCodebase";
+import { createPublicKeycloakifyDevResourcesDir } from "./createPublicKeycloakifyDevResourcesDir";
+import { createAccountV1Dir } from "./createAccountV1Dir";
+import chalk from "chalk";
+import { run } from "../shared/run";
+import { vendorFrontendDependencies } from "./vendorFrontendDependencies";
+import { downloadKeycloakifyLogging } from "./downloadKeycloakifyLogging";
+
+(async () => {
+    console.log(chalk.cyan("Building Keycloakify..."));
+
+    const startTime = Date.now();
+
+    if (fs.existsSync(join("dist", "bin", "main.original.js"))) {
+        fs.renameSync(
+            join("dist", "bin", "main.original.js"),
+            join("dist", "bin", "main.js")
+        );
+
+        fs.readdirSync(join("dist", "bin")).forEach(fileBasename => {
+            if (/[0-9]\.index.js/.test(fileBasename) || fileBasename.endsWith(".node")) {
+                fs.rmSync(join("dist", "bin", fileBasename));
+            }
+        });
+    }
+
+    run(`npx tsc -p ${join("src", "bin", "tsconfig.json")}`);
+
+    if (
+        !fs
+            .readFileSync(join("dist", "bin", "main.js"))
+            .toString("utf8")
+            .includes("__nccwpck_require__")
+    ) {
+        fs.cpSync(
+            join("dist", "bin", "main.js"),
+            join("dist", "bin", "main.original.js")
+        );
+    }
+
+    run(
+        `npx ncc build ${join("dist", "bin", "main.js")} --external prettier -o ${join("dist", "ncc_out")}`
+    );
+
+    transformCodebase({
+        srcDirPath: join("dist", "ncc_out"),
+        destDirPath: join("dist", "bin"),
+        transformSourceCode: ({ fileRelativePath, sourceCode }) => {
+            if (fileRelativePath === "index.js") {
+                return {
+                    newFileName: "main.js",
+                    modifiedSourceCode: sourceCode
+                };
+            }
+
+            return { modifiedSourceCode: sourceCode };
+        }
+    });
+
+    fs.rmSync(join("dist", "ncc_out"), { recursive: true });
+
+    {
+        let hasBeenPatched = false;
+
+        fs.readdirSync(join("dist", "bin")).forEach(fileBasename => {
+            if (fileBasename !== "main.js" && !fileBasename.endsWith(".index.js")) {
+                return;
+            }
+
+            const { hasBeenPatched: hasBeenPatched_i } = patchDeprecatedBufferApiUsage(
+                join("dist", "bin", fileBasename)
+            );
+
+            if (hasBeenPatched_i) {
+                hasBeenPatched = true;
+            }
+        });
+
+        assert(hasBeenPatched);
+    }
+
+    fs.chmodSync(
+        join("dist", "bin", "main.js"),
+        fs.statSync(join("dist", "bin", "main.js")).mode |
+            fs.constants.S_IXUSR |
+            fs.constants.S_IXGRP |
+            fs.constants.S_IXOTH
+    );
+
+    run(`npx tsc -p ${join("src", "tsconfig.json")}`);
+    run(`npx tsc-alias -p ${join("src", "tsconfig.json")}`);
+    vendorFrontendDependencies({ distDirPath: join(process.cwd(), "dist") });
+
+    if (fs.existsSync(join("dist", "vite-plugin", "index.original.js"))) {
+        fs.renameSync(
+            join("dist", "vite-plugin", "index.original.js"),
+            join("dist", "vite-plugin", "index.js")
+        );
+    }
+
+    run(`npx tsc -p ${join("src", "vite-plugin", "tsconfig.json")}`);
+
+    if (
+        !fs
+            .readFileSync(join("dist", "vite-plugin", "index.js"))
+            .toString("utf8")
+            .includes("__nccwpck_require__")
+    ) {
+        fs.cpSync(
+            join("dist", "vite-plugin", "index.js"),
+            join("dist", "vite-plugin", "index.original.js")
+        );
+    }
+
+    run(
+        `npx ncc build ${join("dist", "vite-plugin", "index.js")} --external prettier -o ${join(
+            "dist",
+            "ncc_out"
+        )}`
+    );
+
+    fs.readdirSync(join("dist", "ncc_out")).forEach(fileBasename => {
+        assert(!fileBasename.endsWith(".index.js"));
+        assert(!fileBasename.endsWith(".node"));
+    });
+
+    transformCodebase({
+        srcDirPath: join("dist", "ncc_out"),
+        destDirPath: join("dist", "vite-plugin"),
+        transformSourceCode: ({ fileRelativePath, sourceCode }) => {
+            assert(fileRelativePath === "index.js");
+
+            return { modifiedSourceCode: sourceCode };
+        }
+    });
+
+    fs.rmSync(join("dist", "ncc_out"), { recursive: true });
+
+    {
+        const dirBasename = "src";
+
+        const destDirPath = join("dist", dirBasename);
+
+        fs.rmSync(destDirPath, { recursive: true, force: true });
+
+        fs.cpSync(dirBasename, destDirPath, { recursive: true });
+    }
+
+    transformCodebase({
+        srcDirPath: join("stories"),
+        destDirPath: join("dist", "stories"),
+        transformSourceCode: ({ fileRelativePath, sourceCode }) => {
+            if (!fileRelativePath.endsWith(".stories.tsx")) {
+                return undefined;
+            }
+
+            return { modifiedSourceCode: sourceCode };
+        }
+    });
+
+    await createPublicKeycloakifyDevResourcesDir();
+    await createAccountV1Dir();
+    await downloadKeycloakifyLogging({
+        distDirPath: join(process.cwd(), "dist")
+    });
+
+    console.log(
+        chalk.green(`✓ built in ${((Date.now() - startTime) / 1000).toFixed(2)}s`)
+    );
+})();
+
+function patchDeprecatedBufferApiUsage(filePath: string) {
+    const before = fs.readFileSync(filePath).toString("utf8");
+
+    const after = before.replace(
+        `var buffer = new Buffer(toRead);`,
+        `var buffer = Buffer.allocUnsafe ? Buffer.allocUnsafe(toRead) : new Buffer(toRead);`
+    );
+
+    fs.writeFileSync(filePath, Buffer.from(after, "utf8"));
+
+    const hasBeenPatched = after !== before;
+
+    return { hasBeenPatched };
+}

scripts/build/vendorFrontendDependencies.ts

@@ -0,0 +1,97 @@
+import * as fs from "fs";
+import { join as pathJoin, basename as pathBasename, dirname as pathDirname } from "path";
+import { assert } from "tsafe/assert";
+import { run } from "../shared/run";
+import { cacheDirPath as cacheDirPath_base } from "../shared/cacheDirPath";
+
+export function vendorFrontendDependencies(params: { distDirPath: string }) {
+    const { distDirPath } = params;
+
+    const vendorDirPath = pathJoin(distDirPath, "tools", "vendor");
+    const cacheDirPath = pathJoin(cacheDirPath_base, "vendorFrontendDependencies");
+
+    const extraBundleFileBasenames = new Set<string>();
+
+    fs.readdirSync(vendorDirPath)
+        .filter(fileBasename => fileBasename.endsWith(".js"))
+        .map(fileBasename => pathJoin(vendorDirPath, fileBasename))
+        .forEach(filePath => {
+            {
+                const mapFilePath = `${filePath}.map`;
+
+                if (fs.existsSync(mapFilePath)) {
+                    fs.unlinkSync(mapFilePath);
+                }
+            }
+
+            if (!fs.existsSync(cacheDirPath)) {
+                fs.mkdirSync(cacheDirPath, { recursive: true });
+            }
+
+            const webpackConfigJsFilePath = pathJoin(cacheDirPath, "webpack.config.js");
+            const webpackOutputDirPath = pathJoin(cacheDirPath, "webpack_output");
+            const webpackOutputFilePath = pathJoin(webpackOutputDirPath, "index.js");
+
+            fs.writeFileSync(
+                webpackConfigJsFilePath,
+                Buffer.from(
+                    [
+                        ``,
+                        `module.exports = {`,
+                        `   mode: 'production',`,
+                        `  entry: Buffer.from("${Buffer.from(filePath, "utf8").toString("base64")}", "base64").toString("utf8"),`,
+                        `  output: {`,
+                        `    path: Buffer.from("${Buffer.from(webpackOutputDirPath, "utf8").toString("base64")}", "base64").toString("utf8"),`,
+                        `    filename: '${pathBasename(webpackOutputFilePath)}',`,
+                        `    libraryTarget: 'module',`,
+                        `  },`,
+                        `  target: "web",`,
+                        `  module: {`,
+                        `    rules: [`,
+                        `      {`,
+                        `        test: /\.js$/,`,
+                        `        use: {`,
+                        `          loader: 'babel-loader',`,
+                        `          options: {`,
+                        `            presets: ['@babel/preset-env'],`,
+                        `          }`,
+                        `        }`,
+                        `      }`,
+                        `    ]`,
+                        `  },`,
+                        `  experiments: {`,
+                        `    outputModule: true`,
+                        `  }`,
+                        `};`
+                    ].join("\n")
+                )
+            );
+
+            run(`npx webpack --config ${pathBasename(webpackConfigJsFilePath)}`, {
+                cwd: pathDirname(webpackConfigJsFilePath)
+            });
+
+            fs.readdirSync(webpackOutputDirPath)
+                .filter(fileBasename => !fileBasename.endsWith(".txt"))
+                .map(fileBasename => pathJoin(webpackOutputDirPath, fileBasename))
+                .forEach(bundleFilePath => {
+                    assert(bundleFilePath.endsWith(".js"));
+
+                    if (pathBasename(bundleFilePath) === "index.js") {
+                        fs.renameSync(webpackOutputFilePath, filePath);
+                    } else {
+                        const bundleFileBasename = pathBasename(bundleFilePath);
+
+                        assert(!extraBundleFileBasenames.has(bundleFileBasename));
+                        extraBundleFileBasenames.add(bundleFileBasename);
+
+                        fs.renameSync(
+                            bundleFilePath,
+                            pathJoin(pathDirname(filePath), bundleFileBasename)
+                        );
+                    }
+                });
+
+            fs.rmSync(webpackOutputDirPath, { recursive: true });
+        });
+}

scripts/copyKeycloakResourcesToStorybookStaticDir.ts

@@ -1,18 +0,0 @@
-import { join as pathJoin } from "path";
-import { copyKeycloakResourcesToPublic } from "../src/bin/shared/copyKeycloakResourcesToPublic";
-import { getProxyFetchOptions } from "../src/bin/tools/fetchProxyOptions";
-import { LOGIN_THEME_RESOURCES_FROMkEYCLOAK_VERSION_DEFAULT } from "../src/bin/shared/constants";
-
-export async function copyKeycloakResourcesToStorybookStaticDir() {
-    await copyKeycloakResourcesToPublic({
-        buildContext: {
-            cacheDirPath: pathJoin(__dirname, "..", "node_modules", ".cache", "scripts"),
-            fetchOptions: getProxyFetchOptions({
-                npmConfigGetCwd: pathJoin(__dirname, "..")
-            }),
-            loginThemeResourcesFromKeycloakVersion:
-                LOGIN_THEME_RESOURCES_FROMkEYCLOAK_VERSION_DEFAULT,
-            publicDirPath: pathJoin(__dirname, "..", ".storybook", "static")
-        }
-    });
-}

scripts/dump-keycloak-realm.ts

@@ -1,65 +1,14 @@
 import { CONTAINER_NAME } from "../src/bin/shared/constants";
 import child_process from "child_process";
 import { SemVer } from "../src/bin/tools/SemVer";
-import { join as pathJoin, relative as pathRelative } from "path";
+import { dumpContainerConfig } from "../src/bin/start-keycloak/realmConfig/dumpContainerConfig";
+import { cacheDirPath } from "./shared/cacheDirPath";
+import { getThisCodebaseRootDirPath } from "../src/bin/tools/getThisCodebaseRootDirPath";
+import { writeRealmJsonFile } from "../src/bin/start-keycloak/realmConfig/ParsedRealmJson";
+import { join as pathJoin } from "path";
 import chalk from "chalk";
-import { Deferred } from "evt/tools/Deferred";
-import { assert } from "tsafe/assert";
-import { is } from "tsafe/is";
 
 (async () => {
-    {
-        const dCompleted = new Deferred<void>();
-
-        const child = child_process.spawn(
-            "docker",
-            [
-                ...["exec", CONTAINER_NAME],
-                ...["/opt/keycloak/bin/kc.sh", "export"],
-                ...["--dir", "/tmp"],
-                ...["--realm", "myrealm"],
-                ...["--users", "realm_file"]
-            ],
-            { shell: true }
-        );
-
-        let output = "";
-
-        const onExit = (code: number | null) => {
-            dCompleted.reject(new Error(`Exited with code ${code}`));
-        };
-
-        child.on("exit", onExit);
-
-        child.stdout.on("data", data => {
-            const outputStr = data.toString("utf8");
-
-            if (outputStr.includes("Export finished successfully")) {
-                child.removeListener("exit", onExit);
-
-                child.kill();
-
-                dCompleted.resolve();
-            }
-
-            output += outputStr;
-        });
-
-        child.stderr.on("data", data => (output += chalk.red(data.toString("utf8"))));
-
-        try {
-            await dCompleted.pr;
-        } catch (error) {
-            assert(is<Error>(error));
-
-            console.log(chalk.red(error.message));
-
-            console.log(output);
-
-            process.exit(1);
-        }
-    }
-
     const keycloakMajorVersionNumber = SemVer.parse(
         child_process
             .execSync(`docker inspect --format '{{.Config.Image}}' ${CONTAINER_NAME}`)
@@ -68,25 +17,29 @@ import { is } from "tsafe/is";
             .split(":")[1]
     ).major;
 
-    const targetFilePath = pathRelative(
-        process.cwd(),
-        pathJoin(
-            __dirname,
-            "..",
-            "src",
-            "bin",
-            "start-keycloak",
-            `myrealm-realm-${keycloakMajorVersionNumber}.json`
-        )
+    const parsedRealmJson = await dumpContainerConfig({
+        buildContext: {
+            cacheDirPath
+        },
+        keycloakMajorVersionNumber,
+        realmName: "myrealm"
+    });
+
+    const realmJsonFilePath = pathJoin(
+        getThisCodebaseRootDirPath(),
+        "src",
+        "bin",
+        "start-keycloak",
+        "realmConfig",
+        "defaultConfig",
+        `realm-kc-${keycloakMajorVersionNumber}.json`
     );
 
-    run(`docker cp ${CONTAINER_NAME}:/tmp/myrealm-realm.json ${targetFilePath}`);
+    await writeRealmJsonFile({
+        parsedRealmJson,
+        realmJsonFilePath,
+        keycloakMajorVersionNumber
+    });
 
-    console.log(`${chalk.green(`✓ Exported realm to`)} ${chalk.bold(targetFilePath)}`);
+    console.log(chalk.green(`Realm config dumped to ${realmJsonFilePath}`));
 })();
-
-function run(command: string) {
-    console.log(chalk.grey(`$ ${command}`));
-
-    return child_process.execSync(command, { stdio: "inherit" });
-}

scripts/generate-i18n-messages.ts

@@ -1,4 +1,3 @@
-import "minimal-polyfills/Object.fromEntries";
 import * as fs from "fs";
 import {
     join as pathJoin,
@@ -6,83 +5,93 @@ import {
     dirname as pathDirname,
     sep as pathSep
 } from "path";
-import { assert } from "tsafe/assert";
+import { assert, type Equals } from "tsafe/assert";
 import { same } from "evt/tools/inDepth";
 import { crawl } from "../src/bin/tools/crawl";
-import { downloadKeycloakDefaultTheme } from "../src/bin/shared/downloadKeycloakDefaultTheme";
+import { downloadKeycloakDefaultTheme } from "./shared/downloadKeycloakDefaultTheme";
 import { getThisCodebaseRootDirPath } from "../src/bin/tools/getThisCodebaseRootDirPath";
 import { deepAssign } from "../src/tools/deepAssign";
-import { getProxyFetchOptions } from "../src/bin/tools/fetchProxyOptions";
+import { THEME_TYPES } from "../src/bin/shared/constants";
+import { transformCodebase } from "../src/bin/tools/transformCodebase";
+import propertiesParser from "properties-parser";
 
-// NOTE: To run without argument when we want to generate src/i18n/generated_kcMessages files,
-// update the version array for generating for newer version.
-
-//@ts-ignore
-const propertiesParser = require("properties-parser");
-
-async function main() {
-    const keycloakVersion = "24.0.4";
+if (require.main === module) {
+    generateI18nMessages();
+}
 
+async function generateI18nMessages() {
     const thisCodebaseRootDirPath = getThisCodebaseRootDirPath();
 
-    const { defaultThemeDirPath } = await downloadKeycloakDefaultTheme({
-        keycloakVersion,
-        buildContext: {
-            cacheDirPath: pathJoin(
-                thisCodebaseRootDirPath,
-                "node_modules",
-                ".cache",
-                "keycloakify"
-            ),
-            fetchOptions: getProxyFetchOptions({
-                npmConfigGetCwd: thisCodebaseRootDirPath
-            })
-        }
-    });
+    const accountI18nDirPath = pathJoin(
+        thisCodebaseRootDirPath,
+        "src",
+        "account",
+        "i18n"
+    );
+
+    if (fs.existsSync(accountI18nDirPath)) {
+        fs.rmSync(accountI18nDirPath, { recursive: true });
+    }
 
     type Dictionary = { [idiomId: string]: string };
 
-    const record: { [typeOfPage: string]: { [language: string]: Dictionary } } = {};
+    const record: { [themeType: string]: { [language: string]: Dictionary } } = {};
 
-    {
-        const baseThemeDirPath = pathJoin(defaultThemeDirPath, "base");
-        const re = new RegExp(
-            `^([^\\${pathSep}]+)\\${pathSep}messages\\${pathSep}messages_([^.]+).properties$`
-        );
-
-        crawl({
-            dirPath: baseThemeDirPath,
-            returnedPathsType: "relative to dirPath"
-        }).forEach(filePath => {
-            const match = filePath.match(re);
-
-            if (match === null) {
-                return;
-            }
-
-            const [, typeOfPage, language] = match;
-
-            (record[typeOfPage] ??= {})[language.replace(/_/g, "-")] = Object.fromEntries(
-                Object.entries(
-                    propertiesParser.parse(
-                        fs
-                            .readFileSync(pathJoin(baseThemeDirPath, filePath))
-                            .toString("utf8")
-                    ) as Record<string, string>
-                )
-                    .map(([key, value]) => [key, value.replace(/''/g, "'")])
-                    .map(([key, value]) => [
-                        key === "locale_pt_BR" ? "locale_pt-BR" : key,
-                        value
-                    ])
-                    .map(([key, value]) => [key, key === "termsText" ? "" : value])
-            );
+    for (const themeType of THEME_TYPES.filter(themeType => themeType !== "admin")) {
+        const { extractedDirPath } = await downloadKeycloakDefaultTheme({
+            keycloakVersionId: (() => {
+                switch (themeType) {
+                    case "login":
+                        return "FOR_LOGIN_THEME";
+                    case "account":
+                        return "FOR_ACCOUNT_MULTI_PAGE";
+                }
+                assert<Equals<typeof themeType, never>>();
+            })()
         });
-    }
 
-    Object.keys(record).forEach(themeType => {
-        if (themeType !== "login" && themeType !== "account") {
-            return;
+        {
+            const baseThemeDirPath = pathJoin(extractedDirPath, "base");
+            const re = new RegExp(
+                `^([^\\${pathSep}]+)\\${pathSep}messages\\${pathSep}messages_([^.]+).properties$`
+            );
+
+            crawl({
+                dirPath: baseThemeDirPath,
+                returnedPathsType: "relative to dirPath"
+            }).forEach(filePath => {
+                const match = filePath.match(re);
+
+                if (match === null) {
+                    return;
+                }
+
+                const [, themeType_here, language] = match;
+
+                if (themeType_here !== themeType) {
+                    return;
+                }
+
+                (record[themeType] ??= {})[language.replace(/_/g, "-")] =
+                    Object.fromEntries(
+                        Object.entries(
+                            propertiesParser.parse(
+                                fs
+                                    .readFileSync(pathJoin(baseThemeDirPath, filePath))
+                                    .toString("utf8")
+                            ) as Record<string, string>
+                        )
+                            .map(([key, value]) => [key, value.replace(/''/g, "'")])
+                            .map(([key, value]) => [
+                                key === "locale_pt_BR" ? "locale_pt-BR" : key,
+                                value
+                            ])
+                            .map(([key, value]) => [
+                                key,
+                                key === "termsText" ? "" : value
+                            ])
+                    );
+            });
         }
 
         const recordForThemeType = record[themeType];
@@ -99,6 +108,29 @@ async function main() {
             assert(false);
         })();
 
+        /* Migration helper
+
+        console.log({ themeType });
+
+        {
+
+            const all = new Set<string>();
+
+            languages.forEach(languages => all.add(languages));
+            const currentlySupportedLanguages = Object.keys(keycloakifyExtraMessages);
+            currentlySupportedLanguages.forEach(languages => all.add(languages));
+
+            all.forEach(language => {
+                console.log([
+                    `"${language}": `,
+                    `isInLanguages: ${languages.includes(language)}`,
+                    `isInKeycloakifyExtraMessages: ${currentlySupportedLanguages.includes(language)}`
+                ].join(" "))
+            });
+
+        }
+        */
+
         assert(
             same(languages, Object.keys(keycloakifyExtraMessages), {
                 takeIntoAccountArraysOrdering: false
@@ -118,6 +150,26 @@ async function main() {
             "messages_defaultSet"
         );
 
+        if (!fs.existsSync(messagesDirPath)) {
+            fs.mkdirSync(messagesDirPath, { recursive: true });
+        }
+
+        fs.writeFileSync(
+            pathJoin(messagesDirPath, "types.ts"),
+            Buffer.from(
+                [
+                    ``,
+                    `export const languageTags = ${JSON.stringify(languages, null, 2)} as const;`,
+                    ``,
+                    `export type LanguageTag = typeof languageTags[number];`,
+                    ``,
+                    `export type MessageKey = keyof typeof import("./en")["default"];`,
+                    ``
+                ].join("\n"),
+                "utf8"
+            )
+        );
+
         const generatedFileHeader = [
             `//This code was automatically generated by running ${pathRelative(
                 thisCodebaseRootDirPath,
@@ -180,6 +232,18 @@ async function main() {
                 "utf8"
             )
         );
+    }
+
+    transformCodebase({
+        srcDirPath: pathJoin(thisCodebaseRootDirPath, "src", "login", "i18n"),
+        destDirPath: accountI18nDirPath,
+        transformSourceCode: ({ fileRelativePath, sourceCode }) => {
+            if (fileRelativePath.startsWith("messages_defaultSet")) {
+                return undefined;
+            }
+
+            return { modifiedSourceCode: sourceCode };
+        }
     });
 }
 
@@ -203,6 +267,7 @@ const keycloakifyExtraMessages_login: Record<
     | "nl"
     | "no"
     | "pl"
+    | "pt"
     | "pt-BR"
     | "ru"
     | "sk"
@@ -210,7 +275,9 @@ const keycloakifyExtraMessages_login: Record<
     | "th"
     | "tr"
     | "uk"
-    | "zh-CN",
+    | "ka"
+    | "zh-CN"
+    | "zh-TW",
     Record<
         | "shouldBeEqual"
         | "shouldBeDifferent"
@@ -434,6 +501,17 @@ const keycloakifyExtraMessages_login: Record<
         addValue: "Dodaj wartość",
         languages: "Języki"
     },
+    pt: {
+        shouldBeEqual: "{0} deve ser igual a {1}",
+        shouldBeDifferent: "{0} deve ser diferente de {1}",
+        shouldMatchPattern: "O padrão deve corresponder: `/{0}/`",
+        mustBeAnInteger: "Deve ser um número inteiro",
+        notAValidOption: "Não é uma opção válida",
+        selectAnOption: "Selecione uma opção",
+        remove: "Remover",
+        addValue: "Adicionar valor",
+        languages: "Idiomas"
+    },
     "pt-BR": {
         shouldBeEqual: "{0} deve ser igual a {1}",
         shouldBeDifferent: "{0} deve ser diferente de {1}",
@@ -511,6 +589,17 @@ const keycloakifyExtraMessages_login: Record<
         addValue: "Додати значення",
         languages: "Мови"
     },
+    ka: {
+        shouldBeEqual: "{0} უნდა იყოს ტოლი {1}-სთვის",
+        shouldBeDifferent: "{0} უნდა იყოს სხვა {1}-სთვის",
+        shouldMatchPattern: "შაბლონს უნდა ემთხვევა: `/{0}/`",
+        mustBeAnInteger: "უნდა იყოს მთელი რიცხვი",
+        notAValidOption: "არასწორი ვარიანტი",
+        selectAnOption: "აირჩიეთ ვარიანტი",
+        remove: "წაშალეთ",
+        addValue: "დაამატეთ მნიშვნელობა",
+        languages: "ენები"
+    },
     "zh-CN": {
         shouldBeEqual: "{0} 应该等于 {1}",
         shouldBeDifferent: "{0} 应该不同于 {1}",
@@ -521,38 +610,49 @@ const keycloakifyExtraMessages_login: Record<
         remove: "移除",
         addValue: "添加值",
         languages: "语言"
+    },
+    "zh-TW": {
+        shouldBeEqual: "{0} 應該等於 {1}",
+        shouldBeDifferent: "{0} 應該不同於 {1}",
+        shouldMatchPattern: "模式應匹配: `/{0}/`",
+        mustBeAnInteger: "必須是整數",
+        notAValidOption: "不是有效選項",
+        selectAnOption: "選擇一個選項",
+        remove: "移除",
+        addValue: "添加值",
+        languages: "語言"
     }
     /* spell-checker: enable */
 };
 
+export const accountMultiPageSupportedLanguages = [
+    "en",
+    "ar",
+    "ca",
+    "cs",
+    "da",
+    "de",
+    "es",
+    "fi",
+    "fr",
+    "hu",
+    "it",
+    "ja",
+    "lt",
+    "lv",
+    "nl",
+    "no",
+    "pl",
+    "pt-BR",
+    "ru",
+    "sk",
+    "sv",
+    "tr",
+    "zh-CN"
+] as const;
+
 const keycloakifyExtraMessages_account: Record<
-    | "en"
-    | "ar"
-    | "ca"
-    | "cs"
-    | "da"
-    | "de"
-    | "el"
-    | "es"
-    | "fa"
-    | "fi"
-    | "fr"
-    | "hu"
-    | "it"
-    | "ja"
-    | "lt"
-    | "lv"
-    | "nl"
-    | "no"
-    | "pl"
-    | "pt-BR"
-    | "ru"
-    | "sk"
-    | "sv"
-    | "th"
-    | "tr"
-    | "uk"
-    | "zh-CN",
+    (typeof accountMultiPageSupportedLanguages)[number],
     Record<"newPasswordSameAsOld" | "passwordConfirmNotMatch", string>
 > = {
     en: {
@@ -580,18 +680,10 @@ const keycloakifyExtraMessages_account: Record<
         newPasswordSameAsOld: "Das neue Passwort muss sich vom alten unterscheiden",
         passwordConfirmNotMatch: "Passwortbestätigung stimmt nicht überein"
     },
-    el: {
-        newPasswordSameAsOld: "Ο νέος κωδικός πρόσβασης πρέπει να διαφέρει από τον παλιό",
-        passwordConfirmNotMatch: "Η επιβεβαίωση του κωδικού πρόσβασης δεν ταιριάζει"
-    },
     es: {
         newPasswordSameAsOld: "La nueva contraseña debe ser diferente de la anterior",
         passwordConfirmNotMatch: "La confirmación de la contraseña no coincide"
     },
-    fa: {
-        newPasswordSameAsOld: "رمز عبور جدید باید با رمز عبور قبلی متفاوت باشد",
-        passwordConfirmNotMatch: "تأیید رمز عبور مطابقت ندارد"
-    },
     fi: {
         newPasswordSameAsOld: "Uusi salasana on oltava erilainen kuin vanha",
         passwordConfirmNotMatch: "Salasanan vahvistus ei täsmää"
@@ -649,25 +741,13 @@ const keycloakifyExtraMessages_account: Record<
         newPasswordSameAsOld: "Det nya lösenordet måste skilja sig från det gamla",
         passwordConfirmNotMatch: "Lösenordsbekräftelsen matchar inte"
     },
-    th: {
-        newPasswordSameAsOld: "รหัสผ่านใหม่ต้องต่างจากรหัสผ่านเดิม",
-        passwordConfirmNotMatch: "การยืนยันรหัสผ่านไม่ตรงกัน"
-    },
     tr: {
         newPasswordSameAsOld: "Yeni şifre eskisinden farklı olmalıdır",
         passwordConfirmNotMatch: "Şifre doğrulama eşleşmiyor"
     },
-    uk: {
-        newPasswordSameAsOld: "Новий пароль повинен відрізнятися від старого",
-        passwordConfirmNotMatch: "Підтвердження пароля не співпадає"
-    },
     "zh-CN": {
         newPasswordSameAsOld: "新密码必须与旧密码不同",
         passwordConfirmNotMatch: "密码确认不匹配"
     }
     /* spell-checker: enable */
 };
-
-if (require.main === module) {
-    main();
-}

scripts/grant-exec-perms.ts

@@ -1,19 +0,0 @@
-import { join as pathJoin } from "path";
-import { constants } from "fs";
-import { chmod, stat } from "fs/promises";
-
-(async () => {
-    const thisCodebaseRootDirPath = pathJoin(__dirname, "..");
-
-    const { bin } = await import(pathJoin(thisCodebaseRootDirPath, "package.json"));
-
-    const promises = Object.values<string>(bin).map(async scriptPath => {
-        const fullPath = pathJoin(thisCodebaseRootDirPath, scriptPath);
-        const oldMode = (await stat(fullPath)).mode;
-        const newMode =
-            oldMode | constants.S_IXUSR | constants.S_IXGRP | constants.S_IXOTH;
-        await chmod(fullPath, newMode);
-    });
-
-    await Promise.all(promises);
-})();

scripts/link-in-app.ts

@@ -45,7 +45,10 @@ const commonThirdPartyDeps = [
         .replace(/"!\.\/dist\//g, '"!./');
 
     modifiedPackageJsonContent = JSON.stringify(
-        { ...JSON.parse(modifiedPackageJsonContent), version: "0.0.0" },
+        {
+            ...JSON.parse(modifiedPackageJsonContent),
+            version: `0.0.0-rc.${~~(Math.random() * 1000000)}`
+        },
         null,
         4
     );
@@ -55,7 +58,6 @@ const commonThirdPartyDeps = [
         Buffer.from(modifiedPackageJsonContent, "utf8")
     );
 }
-
 const yarnGlobalDirPath = pathJoin(rootDirPath, ".yarn_home");
 
 fs.rmSync(yarnGlobalDirPath, { recursive: true, force: true });
@@ -64,6 +66,21 @@ fs.mkdirSync(yarnGlobalDirPath);
 const execYarnLink = (params: { targetModuleName?: string; cwd: string }) => {
     const { targetModuleName, cwd } = params;
 
+    if (targetModuleName === undefined) {
+        const packageJsonFilePath = pathJoin(cwd, "package.json");
+
+        const packageJson = JSON.parse(
+            fs.readFileSync(packageJsonFilePath).toString("utf8")
+        );
+
+        delete packageJson["packageManager"];
+
+        fs.writeFileSync(
+            packageJsonFilePath,
+            Buffer.from(JSON.stringify(packageJson, null, 2))
+        );
+    }
+
     const cmd = [
         "yarn",
         "link",
@@ -77,7 +94,10 @@ const execYarnLink = (params: { targetModuleName?: string; cwd: string }) => {
         env: {
             ...process.env,
             ...(os.platform() === "win32"
-                ? { USERPROFILE: yarnGlobalDirPath }
+                ? {
+                      USERPROFILE: yarnGlobalDirPath,
+                      LOCALAPPDATA: yarnGlobalDirPath
+                  }
                 : { HOME: yarnGlobalDirPath })
         }
     });
@@ -108,7 +128,54 @@ if (testAppPaths.length === 0) {
     process.exit(-1);
 }
 
-testAppPaths.forEach(testAppPath => execSync("yarn install", { cwd: testAppPath }));
+testAppPaths.forEach(testAppPath => {
+    const packageJsonFilePath = pathJoin(testAppPath, "package.json");
+
+    const packageJsonContent = fs.readFileSync(packageJsonFilePath);
+
+    const parsedPackageJson = JSON.parse(packageJsonContent.toString("utf8")) as {
+        scripts?: Record<string, string>;
+    };
+
+    let hasPostInstallOrPrepareScript = false;
+
+    if (parsedPackageJson.scripts !== undefined) {
+        for (const scriptName of ["postinstall", "prepare"]) {
+            if (parsedPackageJson.scripts[scriptName] === undefined) {
+                continue;
+            }
+
+            hasPostInstallOrPrepareScript = true;
+
+            delete parsedPackageJson.scripts[scriptName];
+        }
+    }
+
+    if (hasPostInstallOrPrepareScript) {
+        fs.writeFileSync(
+            packageJsonFilePath,
+            Buffer.from(JSON.stringify(parsedPackageJson, null, 2), "utf8")
+        );
+    }
+
+    const restorePackageJson = () => {
+        if (!hasPostInstallOrPrepareScript) {
+            return;
+        }
+
+        fs.writeFileSync(packageJsonFilePath, packageJsonContent);
+    };
+
+    try {
+        execSync("yarn install", { cwd: testAppPath });
+    } catch (error) {
+        restorePackageJson();
+
+        throw error;
+    }
+
+    restorePackageJson();
+});
 
 console.log("=== Linking common dependencies ===");
 
@@ -155,4 +222,20 @@ testAppPaths.forEach(testAppPath =>
     })
 );
 
+testAppPaths.forEach(testAppPath => {
+    const { scripts = {} } = JSON.parse(
+        fs.readFileSync(pathJoin(testAppPath, "package.json")).toString("utf8")
+    ) as {
+        scripts?: Record<string, string>;
+    };
+
+    for (const scriptName of ["postinstall", "prepare"]) {
+        if (scripts[scriptName] === undefined) {
+            continue;
+        }
+
+        execSync(`yarn run ${scriptName}`, { cwd: testAppPath });
+    }
+});
+
 export {};

scripts/link-in-starter.ts

@@ -1,55 +1,88 @@
-import * as child_process from "child_process";
 import * as fs from "fs";
-import { join } from "path";
-import { startRebuildOnSrcChange } from "./startRebuildOnSrcChange";
-import { crawl } from "../src/bin/tools/crawl";
+import { join as pathJoin, sep as pathSep } from "path";
+import { run } from "./shared/run";
+import cliSelect from "cli-select";
+import { getThisCodebaseRootDirPath } from "../src/bin/tools/getThisCodebaseRootDirPath";
+import chalk from "chalk";
+import { removeNodeModules } from "./tools/removeNodeModules";
+import { startRebuildOnSrcChange } from "./shared/startRebuildOnSrcChange";
 
-{
-    const dirPath = "node_modules";
+(async () => {
+    const parentDirPath = pathJoin(getThisCodebaseRootDirPath(), "..");
 
-    try {
-        fs.rmSync(dirPath, { recursive: true, force: true });
-    } catch {
-        // NOTE: This is a workaround for windows
-        // we can't remove locked executables.
+    const { starterName } = await (async () => {
+        const starterNames = fs
+            .readdirSync(parentDirPath)
+            .filter(
+                basename =>
+                    basename.includes("starter") &&
+                    basename.includes("keycloakify") &&
+                    fs.statSync(pathJoin(parentDirPath, basename)).isDirectory()
+            );
 
-        crawl({
-            dirPath,
-            returnedPathsType: "absolute"
-        }).forEach(filePath => {
-            try {
-                fs.rmSync(filePath, { force: true });
-            } catch (error) {
-                if (filePath.endsWith(".exe")) {
-                    return;
-                }
-                throw error;
+        if (starterNames.length === 0) {
+            console.log(
+                chalk.red(
+                    `No starter found. Keycloakify Angular starter found in ${parentDirPath}`
+                )
+            );
+            process.exit(-1);
+        }
+
+        const starterName = await (async () => {
+            if (starterNames.length === 1) {
+                return starterNames[0];
             }
-        });
-    }
-}
 
-fs.rmSync("dist", { recursive: true, force: true });
-fs.rmSync(".yarn_home", { recursive: true, force: true });
+            console.log(chalk.cyan(`\nSelect a starter to link in:`));
 
-run("yarn install");
-run("yarn build");
+            const { value } = await cliSelect<string>({
+                values: starterNames.map(starterName => `..${pathSep}${starterName}`)
+            }).catch(() => {
+                process.exit(-1);
+            });
 
-const starterName = "keycloakify-starter";
+            return value.split(pathSep)[1];
+        })();
 
-fs.rmSync(join("..", starterName, "node_modules"), {
-    recursive: true,
-    force: true
-});
+        return { starterName };
+    })();
 
-run("yarn install", { cwd: join("..", starterName) });
+    const startTime = Date.now();
 
-run(`npx tsx ${join("scripts", "link-in-app.ts")} ${starterName}`);
+    console.log(chalk.cyan(`\n\nLinking in ..${pathSep}${starterName}...`));
 
-startRebuildOnSrcChange();
+    removeNodeModules({
+        nodeModulesDirPath: pathJoin(getThisCodebaseRootDirPath(), "node_modules")
+    });
 
-function run(command: string, options?: { cwd: string }) {
-    console.log(`$ ${command}`);
+    fs.rmSync(pathJoin(getThisCodebaseRootDirPath(), "dist"), {
+        recursive: true,
+        force: true
+    });
+    fs.rmSync(pathJoin(getThisCodebaseRootDirPath(), ".yarn_home"), {
+        recursive: true,
+        force: true
+    });
 
-    child_process.execSync(command, { stdio: "inherit", ...options });
-}
+    run("yarn install");
+    run("yarn build");
+
+    const starterDirPath = pathJoin(parentDirPath, starterName);
+
+    removeNodeModules({
+        nodeModulesDirPath: pathJoin(starterDirPath, "node_modules")
+    });
+
+    run("yarn install", { cwd: starterDirPath });
+
+    run(`npx tsx ${pathJoin("scripts", "link-in-app.ts")} ${starterName}`);
+
+    const durationSeconds = Math.round((Date.now() - startTime) / 1000);
+
+    await new Promise(resolve => setTimeout(resolve, 1000));
+
+    startRebuildOnSrcChange();
+
+    console.log(chalk.green(`\n\nLinked in ${starterName} in ${durationSeconds}s`));
+})();

scripts/shared/cacheDirPath.ts

@@ -0,0 +1,9 @@
+import { join as pathJoin } from "path";
+import { getThisCodebaseRootDirPath } from "../../src/bin/tools/getThisCodebaseRootDirPath";
+
+export const cacheDirPath = pathJoin(
+    getThisCodebaseRootDirPath(),
+    "node_modules",
+    ".cache",
+    "scripts"
+);

scripts/shared/downloadKeycloakDefaultTheme.ts

@@ -1,30 +1,33 @@
-import { join as pathJoin, relative as pathRelative } from "path";
-import { type BuildContext } from "./buildContext";
-import { assert } from "tsafe/assert";
-import { LAST_KEYCLOAK_VERSION_WITH_ACCOUNT_V1 } from "./constants";
-import { downloadAndExtractArchive } from "../tools/downloadAndExtractArchive";
+import { relative as pathRelative } from "path";
+import { downloadAndExtractArchive } from "../../src/bin/tools/downloadAndExtractArchive";
+import { getProxyFetchOptions } from "../../src/bin/tools/fetchProxyOptions";
+import { join as pathJoin } from "path";
+import { assert, type Equals } from "tsafe/assert";
+import { cacheDirPath } from "./cacheDirPath";
+import { getThisCodebaseRootDirPath } from "../../src/bin/tools/getThisCodebaseRootDirPath";
 
-export type BuildContextLike = {
-    cacheDirPath: string;
-    fetchOptions: BuildContext["fetchOptions"];
-};
-
-assert<BuildContext extends BuildContextLike ? true : false>();
+const KEYCLOAK_VERSION = {
+    FOR_LOGIN_THEME: "25.0.4",
+    FOR_ACCOUNT_MULTI_PAGE: "21.1.2"
+} as const;
 
 export async function downloadKeycloakDefaultTheme(params: {
-    keycloakVersion: string;
-    buildContext: BuildContextLike;
-}): Promise<{ defaultThemeDirPath: string }> {
-    const { keycloakVersion, buildContext } = params;
+    keycloakVersionId: keyof typeof KEYCLOAK_VERSION;
+}) {
+    const { keycloakVersionId } = params;
+
+    const keycloakVersion = KEYCLOAK_VERSION[keycloakVersionId];
 
     let kcNodeModulesKeepFilePaths: Set<string> | undefined = undefined;
     let kcNodeModulesKeepFilePaths_lastAccountV1: Set<string> | undefined = undefined;
 
     const { extractedDirPath } = await downloadAndExtractArchive({
-        urlOrPath: `https://repo1.maven.org/maven2/org/keycloak/keycloak-themes/${keycloakVersion}/keycloak-themes-${keycloakVersion}.jar`,
-        cacheDirPath: buildContext.cacheDirPath,
-        fetchOptions: buildContext.fetchOptions,
-        uniqueIdOfOnArchiveFile: "downloadKeycloakDefaultTheme",
+        url: `https://repo1.maven.org/maven2/org/keycloak/keycloak-themes/${keycloakVersion}/keycloak-themes-${keycloakVersion}.jar`,
+        cacheDirPath,
+        fetchOptions: getProxyFetchOptions({
+            npmConfigGetCwd: getThisCodebaseRootDirPath()
+        }),
+        uniqueIdOfOnArchiveFile: "extractOnlyRequiredFiles",
         onArchiveFile: async params => {
             const fileRelativePath = pathRelative("theme", params.fileRelativePath);
 
@@ -34,16 +37,44 @@ export async function downloadKeycloakDefaultTheme(params: {
 
             const { readFile, writeFile } = params;
 
-            skip_keycloak_v2: {
-                if (!fileRelativePath.startsWith(pathJoin("keycloak.v2"))) {
-                    break skip_keycloak_v2;
-                }
-
+            if (
+                !fileRelativePath.startsWith("base") &&
+                !fileRelativePath.startsWith("keycloak")
+            ) {
                 return;
             }
 
+            switch (keycloakVersion) {
+                case KEYCLOAK_VERSION.FOR_LOGIN_THEME:
+                    if (
+                        !fileRelativePath.startsWith(pathJoin("base", "login")) &&
+                        !fileRelativePath.startsWith(pathJoin("keycloak", "login")) &&
+                        !fileRelativePath.startsWith(pathJoin("keycloak", "common"))
+                    ) {
+                        return;
+                    }
+
+                    if (fileRelativePath.endsWith(".ftl")) {
+                        return;
+                    }
+
+                    break;
+                case KEYCLOAK_VERSION.FOR_ACCOUNT_MULTI_PAGE:
+                    if (
+                        !fileRelativePath.startsWith(pathJoin("base", "account")) &&
+                        !fileRelativePath.startsWith(pathJoin("keycloak", "account")) &&
+                        !fileRelativePath.startsWith(pathJoin("keycloak", "common"))
+                    ) {
+                        return;
+                    }
+
+                    break;
+                default:
+                    assert<Equals<typeof keycloakVersion, never>>(false);
+            }
+
             last_account_v1_transformations: {
-                if (LAST_KEYCLOAK_VERSION_WITH_ACCOUNT_V1 !== keycloakVersion) {
+                if (keycloakVersion !== KEYCLOAK_VERSION.FOR_ACCOUNT_MULTI_PAGE) {
                     break last_account_v1_transformations;
                 }
 
@@ -169,7 +200,7 @@ export async function downloadKeycloakDefaultTheme(params: {
             }
 
             skip_unused_resources: {
-                if (keycloakVersion !== "24.0.4") {
+                if (keycloakVersion !== KEYCLOAK_VERSION.FOR_LOGIN_THEME) {
                     break skip_unused_resources;
                 }
 
@@ -249,8 +280,27 @@ export async function downloadKeycloakDefaultTheme(params: {
                                 "fonts",
                                 "OpenSans-Semibold-webfont.woff2"
                             ),
+                            pathJoin(
+                                "patternfly",
+                                "dist",
+                                "fonts",
+                                "OpenSans-SemiboldItalic-webfont.woff2"
+                            ),
+                            pathJoin(
+                                "patternfly",
+                                "dist",
+                                "fonts",
+                                "OpenSans-SemiboldItalic-webfont.woff"
+                            ),
+                            pathJoin(
+                                "patternfly",
+                                "dist",
+                                "fonts",
+                                "OpenSans-SemiboldItalic-webfont.ttf"
+                            ),
                             pathJoin("patternfly", "dist", "img", "bg-login.jpg"),
-                            pathJoin("jquery", "dist", "jquery.min.js")
+                            pathJoin("jquery", "dist", "jquery.min.js"),
+                            pathJoin("rfc4648", "lib", "rfc4648.js")
                         ]);
                     }
 
@@ -287,11 +337,21 @@ export async function downloadKeycloakDefaultTheme(params: {
 
                     return;
                 }
+
+                skip_package_json: {
+                    if (
+                        fileRelativePath !==
+                        pathJoin("keycloak", "common", "resources", "package.json")
+                    ) {
+                        break skip_package_json;
+                    }
+                    return;
+                }
             }
 
             await writeFile({ fileRelativePath });
         }
     });
 
-    return { defaultThemeDirPath: extractedDirPath };
+    return { extractedDirPath };
 }

scripts/shared/run.ts

@@ -0,0 +1,8 @@
+import * as child_process from "child_process";
+import chalk from "chalk";
+
+export function run(command: string, options?: { cwd: string }) {
+    console.log(chalk.grey(`$ ${command}`));
+
+    child_process.execSync(command, { stdio: "inherit", ...options });
+}

scripts/start-storybook.ts

@@ -1,12 +1,10 @@
 import * as child_process from "child_process";
-import { startRebuildOnSrcChange } from "./startRebuildOnSrcChange";
-import { copyKeycloakResourcesToStorybookStaticDir } from "./copyKeycloakResourcesToStorybookStaticDir";
+import { startRebuildOnSrcChange } from "./shared/startRebuildOnSrcChange";
+import { run } from "./shared/run";
 
 (async () => {
     run("yarn build");
 
-    await copyKeycloakResourcesToStorybookStaticDir();
-
     {
         const child = child_process.spawn("npx", ["start-storybook", "-p", "6006"], {
             shell: true
@@ -21,9 +19,3 @@ import { copyKeycloakResourcesToStorybookStaticDir } from "./copyKeycloakResourc
 
     startRebuildOnSrcChange();
 })();
-
-function run(command: string, options?: { env?: NodeJS.ProcessEnv }) {
-    console.log(`$ ${command}`);
-
-    child_process.execSync(command, { stdio: "inherit", ...options });
-}

scripts/tools/removeNodeModules.ts

@@ -0,0 +1,27 @@
+import * as fs from "fs";
+import { crawl } from "../../src/bin/tools/crawl";
+
+export function removeNodeModules(params: { nodeModulesDirPath: string }) {
+    const { nodeModulesDirPath } = params;
+
+    try {
+        fs.rmSync(nodeModulesDirPath, { recursive: true, force: true });
+    } catch {
+        // NOTE: This is a workaround for windows
+        // we can't remove locked executables.
+
+        crawl({
+            dirPath: nodeModulesDirPath,
+            returnedPathsType: "absolute"
+        }).forEach(filePath => {
+            try {
+                fs.rmSync(filePath, { force: true });
+            } catch (error) {
+                if (filePath.endsWith(".exe")) {
+                    return;
+                }
+                throw error;
+            }
+        });
+    }
+}

src/PUBLIC_URL.ts

@@ -1,4 +1,4 @@
-import { BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR } from "keycloakify/bin/shared/constants";
+import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "keycloakify/bin/shared/constants";
 import { assert } from "tsafe/assert";
 
 /**
@@ -6,7 +6,9 @@ import { assert } from "tsafe/assert";
  * This works both in your main app and in your Keycloak theme.
  */
 export const PUBLIC_URL = (() => {
-    const kcContext = (window as any).kcContext;
+    const kcContext: { "x-keycloakify": { resourcesPath: string } } | undefined = (
+        window as any
+    ).kcContext;
 
     if (kcContext === undefined || process.env.NODE_ENV === "development") {
         assert(
@@ -17,5 +19,5 @@ export const PUBLIC_URL = (() => {
         return process.env.PUBLIC_URL;
     }
 
-    return `${kcContext.url.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}`;
+    return `${kcContext["x-keycloakify"].resourcesPath}/${WELL_KNOWN_DIRECTORY_BASE_NAME.DIST}`;
 })();

src/account/KcContext/kcContextMocks.ts

@@ -1,10 +1,12 @@
 import "keycloakify/tools/Object.fromEntries";
-import { RESOURCES_COMMON, KEYCLOAK_RESOURCES } from "keycloakify/bin/shared/constants";
+import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "keycloakify/bin/shared/constants";
 import { id } from "tsafe/id";
 import type { KcContext } from "./KcContext";
 import { BASE_URL } from "keycloakify/lib/BASE_URL";
+import { assert, type Equals } from "tsafe/assert";
+import type { LanguageTag } from "keycloakify/account/i18n/messages_defaultSet/types";
 
-const resourcesPath = `${BASE_URL}${KEYCLOAK_RESOURCES}/account/resources`;
+const resourcesPath = `${BASE_URL}${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES}/account`;
 
 export const kcContextCommonMock: KcContext.Common = {
     themeVersion: "0.0.0",
@@ -13,7 +15,7 @@ export const kcContextCommonMock: KcContext.Common = {
     themeName: "my-theme-name",
     url: {
         resourcesPath,
-        resourcesCommonPath: `${resourcesPath}/${RESOURCES_COMMON}`,
+        resourcesCommonPath: `${resourcesPath}/${WELL_KNOWN_DIRECTORY_BASE_NAME.RESOURCES_COMMON}`,
         resourceUrl: "#",
         accountUrl: "#",
         applicationsUrl: "#",
@@ -38,35 +40,53 @@ export const kcContextCommonMock: KcContext.Common = {
         exists: () => false
     },
     locale: {
-        supported: [
-            /* spell-checker: disable */
-            ["de", "Deutsch"],
-            ["no", "Norsk"],
-            ["ru", "Русский"],
-            ["sv", "Svenska"],
-            ["pt-BR", "Português (Brasil)"],
-            ["lt", "Lietuvių"],
-            ["en", "English"],
-            ["it", "Italiano"],
-            ["fr", "Français"],
-            ["zh-CN", "中文简体"],
-            ["es", "Español"],
-            ["cs", "Čeština"],
-            ["ja", "日本語"],
-            ["sk", "Slovenčina"],
-            ["pl", "Polski"],
-            ["ca", "Català"],
-            ["nl", "Nederlands"],
-            ["tr", "Türkçe"]
-            /* spell-checker: enable */
-        ].map(
-            ([languageTag, label]) =>
-                ({
-                    languageTag,
-                    label,
-                    url: "https://gist.github.com/garronej/52baaca1bb925f2296ab32741e062b8e"
-                }) as const
-        ),
+        supported: (
+            [
+                /* spell-checker: disable */
+                ["de", "Deutsch"],
+                ["no", "Norsk"],
+                ["ru", "Русский"],
+                ["sv", "Svenska"],
+                ["pt-BR", "Português (Brasil)"],
+                ["lt", "Lietuvių"],
+                ["en", "English"],
+                ["it", "Italiano"],
+                ["fr", "Français"],
+                ["zh-CN", "中文简体"],
+                ["es", "Español"],
+                ["cs", "Čeština"],
+                ["ja", "日本語"],
+                ["sk", "Slovenčina"],
+                ["pl", "Polski"],
+                ["ca", "Català"],
+                ["nl", "Nederlands"],
+                ["tr", "Türkçe"],
+                ["ar", "العربية"],
+                ["da", "Dansk"],
+                ["fi", "Suomi"],
+                ["hu", "Magyar"],
+                ["lv", "Latviešu"]
+                /* spell-checker: enable */
+            ] as const
+        ).map(([languageTag, label]) => {
+            {
+                type Got = typeof languageTag;
+                type Expected = LanguageTag;
+
+                type Missing = Exclude<Expected, Got>;
+                type Unexpected = Exclude<Got, Expected>;
+
+                assert<Equals<Missing, never>>;
+                assert<Equals<Unexpected, never>>;
+            }
+
+            return {
+                languageTag,
+                label,
+                url: "https://gist.github.com/garronej/52baaca1bb925f2296ab32741e062b8e"
+            } as const;
+        }),
+
         currentLanguageTag: "en"
     },
     features: {

src/account/Template.tsx

@@ -1,9 +1,9 @@
 import { useEffect } from "react";
-import { assert } from "keycloakify/tools/assert";
 import { clsx } from "keycloakify/tools/clsx";
+import { kcSanitize } from "keycloakify/lib/kcSanitize";
 import { getKcClsx } from "keycloakify/account/lib/kcClsx";
-import { useInsertLinkTags } from "keycloakify/tools/useInsertLinkTags";
 import { useSetClassName } from "keycloakify/tools/useSetClassName";
+import { useInitialize } from "keycloakify/account/Template.useInitialize";
 import type { TemplateProps } from "keycloakify/account/TemplateProps";
 import type { I18n } from "./i18n";
 import type { KcContext } from "./KcContext";
@@ -13,9 +13,9 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
 
     const { kcClsx } = getKcClsx({ doUseDefaultCss, classes });
 
-    const { msg, msgStr, getChangeLocaleUrl, labelBySupportedLanguageTag, currentLanguageTag } = i18n;
+    const { msg, msgStr, currentLanguage, enabledLanguages } = i18n;
 
-    const { locale, url, features, realm, message, referrer } = kcContext;
+    const { url, features, realm, message, referrer } = kcContext;
 
     useEffect(() => {
         document.title = msgStr("accountManagementTitle");
@@ -31,30 +31,9 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
         className: clsx("admin-console", "user", kcClsx("kcBodyClass"))
     });
 
-    useEffect(() => {
-        const { currentLanguageTag } = locale ?? {};
+    const { isReadyToRender } = useInitialize({ kcContext, doUseDefaultCss });
 
-        if (currentLanguageTag === undefined) {
-            return;
-        }
-
-        const html = document.querySelector("html");
-        assert(html !== null);
-        html.lang = currentLanguageTag;
-    }, []);
-
-    const { areAllStyleSheetsLoaded } = useInsertLinkTags({
-        componentOrHookName: "Template",
-        hrefs: !doUseDefaultCss
-            ? []
-            : [
-                  `${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly.min.css`,
-                  `${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly-additions.min.css`,
-                  `${url.resourcesPath}/css/account.css`
-              ]
-    });
-
-    if (!areAllStyleSheetsLoaded) {
+    if (!isReadyToRender) {
         return null;
     }
 
@@ -70,16 +49,16 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
                     <div className="navbar-collapse navbar-collapse-1">
                         <div className="container">
                             <ul className="nav navbar-nav navbar-utility">
-                                {realm.internationalizationEnabled && (assert(locale !== undefined), true) && locale.supported.length > 1 && (
+                                {enabledLanguages.length > 1 && (
                                     <li>
                                         <div className="kc-dropdown" id="kc-locale-dropdown">
                                             <a href="#" id="kc-current-locale-link">
-                                                {labelBySupportedLanguageTag[currentLanguageTag]}
+                                                {currentLanguage.label}
                                             </a>
                                             <ul>
-                                                {locale.supported.map(({ languageTag }) => (
+                                                {enabledLanguages.map(({ languageTag, label, href }) => (
                                                     <li key={languageTag} className="kc-dropdown-item">
-                                                        <a href={getChangeLocaleUrl(languageTag)}>{labelBySupportedLanguageTag[languageTag]}</a>
+                                                        <a href={href}>{label}</a>
                                                     </li>
                                                 ))}
                                             </ul>
@@ -148,7 +127,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
                             <span
                                 className="kc-feedback-text"
                                 dangerouslySetInnerHTML={{
-                                    __html: message.summary
+                                    __html: kcSanitize(message.summary)
                                 }}
                             />
                         </div>

src/account/Template.useInitialize.ts

@@ -0,0 +1,35 @@
+import { assert } from "keycloakify/tools/assert";
+import { useInsertLinkTags } from "keycloakify/tools/useInsertLinkTags";
+import type { KcContext } from "keycloakify/account/KcContext";
+
+export type KcContextLike = {
+    url: {
+        resourcesCommonPath: string;
+        resourcesPath: string;
+    };
+};
+
+assert<keyof KcContextLike extends keyof KcContext ? true : false>();
+assert<KcContext extends KcContextLike ? true : false>();
+
+export function useInitialize(params: {
+    kcContext: KcContextLike;
+    doUseDefaultCss: boolean;
+}) {
+    const { kcContext, doUseDefaultCss } = params;
+
+    const { url } = kcContext;
+
+    const { areAllStyleSheetsLoaded } = useInsertLinkTags({
+        componentOrHookName: "Template",
+        hrefs: !doUseDefaultCss
+            ? []
+            : [
+                  `${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly.min.css`,
+                  `${url.resourcesCommonPath}/node_modules/patternfly/dist/css/patternfly-additions.min.css`,
+                  `${url.resourcesPath}/css/account.css`
+              ]
+    });
+
+    return { isReadyToRender: areAllStyleSheetsLoaded };
+}

src/account/TemplateProps.ts

@@ -1,4 +1,5 @@
 import type { ReactNode } from "react";
+import type { ClassKey } from "keycloakify/account/lib/kcClsx";
 
 export type TemplateProps<KcContext, I18n> = {
     kcContext: KcContext;
@@ -10,17 +11,4 @@ export type TemplateProps<KcContext, I18n> = {
     active: string;
 };
 
-export type ClassKey =
-    | "kcHtmlClass"
-    | "kcBodyClass"
-    | "kcButtonClass"
-    | "kcButtonPrimaryClass"
-    | "kcButtonLargeClass"
-    | "kcButtonDefaultClass"
-    | "kcContentWrapperClass"
-    | "kcFormClass"
-    | "kcFormGroupClass"
-    | "kcInputWrapperClass"
-    | "kcLabelClass"
-    | "kcInputClass"
-    | "kcInputErrorMessageClass";
+export type { ClassKey };

src/account/i18n/GenericI18n.tsx

@@ -1,6 +0,0 @@
-import type { GenericI18n_noJsx } from "./i18n";
-
-export type GenericI18n<MessageKey extends string> = GenericI18n_noJsx<MessageKey> & {
-    msg: (key: MessageKey, ...args: (string | undefined)[]) => JSX.Element;
-    advancedMsg: (key: string, ...args: (string | undefined)[]) => JSX.Element;
-};

src/account/i18n/i18n.tsx

@@ -1,250 +0,0 @@
-import "keycloakify/tools/Object.fromEntries";
-import { assert } from "tsafe/assert";
-import messages_defaultSet_fallbackLanguage from "./messages_defaultSet/en";
-import { fetchMessages_defaultSet } from "./messages_defaultSet";
-import type { KcContext } from "../KcContext";
-import { FALLBACK_LANGUAGE_TAG } from "keycloakify/bin/shared/constants";
-import { id } from "tsafe/id";
-
-export type KcContextLike = {
-    locale?: {
-        currentLanguageTag: string;
-        supported: { languageTag: string; url: string; label: string }[];
-    };
-    "x-keycloakify": {
-        messages: Record<string, string>;
-    };
-};
-
-assert<KcContext extends KcContextLike ? true : false>();
-
-export type GenericI18n_noJsx<MessageKey extends string> = {
-    /**
-     * e.g: "en", "fr", "zh-CN"
-     *
-     * The current language
-     */
-    currentLanguageTag: string;
-    /**
-     * Redirect to this url to change the language.
-     * After reload currentLanguageTag === newLanguageTag
-     */
-    getChangeLocaleUrl: (newLanguageTag: string) => string;
-    /**
-     * e.g. "en" => "English", "fr" => "Français", ...
-     *
-     * Used to render a select that enable user to switch language.
-     * ex: https://user-images.githubusercontent.com/6702424/186044799-38801eec-4e89-483b-81dd-8e9233e8c0eb.png
-     * */
-    labelBySupportedLanguageTag: Record<string, string>;
-    /**
-     *
-     * Examples assuming currentLanguageTag === "en"
-     * {
-     *   en: {
-     *     "access-denied": "Access denied",
-     *     "impersonateTitleHtml": "<strong>{0}</strong> Impersonate User",
-     *     "bar": "Bar {0}"
-     *   }
-     * }
-     *
-     * msgStr("access-denied") === "Access denied"
-     * msgStr("not-a-message-key") Throws an error
-     * msgStr("impersonateTitleHtml", "Foo") === "<strong>Foo</strong> Impersonate User"
-     * msgStr("${bar}", "<strong>c</strong>") === "Bar &lt;strong&gt;XXX&lt;/strong&gt;"
-     *  The html in the arg is partially escaped for security reasons, it might come from an untrusted source, it's not safe to render it as html.
-     */
-    msgStr: (key: MessageKey, ...args: (string | undefined)[]) => string;
-    /**
-     * This is meant to be used when the key argument is variable, something that might have been configured by the user
-     * in the Keycloak admin for example.
-     *
-     * Examples assuming currentLanguageTag === "en"
-     * {
-     *   en: {
-     *     "access-denied": "Access denied",
-     *   }
-     * }
-     *
-     * advancedMsgStr("${access-denied}") === advancedMsgStr("access-denied") === msgStr("access-denied") === "Access denied"
-     * advancedMsgStr("${not-a-message-key}") === advancedMsgStr("not-a-message-key") === "not-a-message-key"
-     */
-    advancedMsgStr: (key: string, ...args: (string | undefined)[]) => string;
-
-    /**
-     * Initially the messages are in english (fallback language).
-     * The translations in the current language are being fetched dynamically.
-     * This property is true while the translations are being fetched.
-     */
-    isFetchingTranslations: boolean;
-};
-
-export type MessageKey_defaultSet = keyof typeof messages_defaultSet_fallbackLanguage;
-
-export function createGetI18n<MessageKey_themeDefined extends string = never>(messagesByLanguageTag_themeDefined: {
-    [languageTag: string]: { [key in MessageKey_themeDefined]: string };
-}) {
-    type I18n = GenericI18n_noJsx<MessageKey_defaultSet | MessageKey_themeDefined>;
-
-    type Result = { i18n: I18n; prI18n_currentLanguage: Promise<I18n> | undefined };
-
-    const cachedResultByKcContext = new WeakMap<KcContextLike, Result>();
-
-    function getI18n(params: { kcContext: KcContextLike }): Result {
-        const { kcContext } = params;
-
-        use_cache: {
-            const cachedResult = cachedResultByKcContext.get(kcContext);
-
-            if (cachedResult === undefined) {
-                break use_cache;
-            }
-
-            return cachedResult;
-        }
-
-        const partialI18n: Pick<I18n, "currentLanguageTag" | "getChangeLocaleUrl" | "labelBySupportedLanguageTag"> = {
-            currentLanguageTag: kcContext.locale?.currentLanguageTag ?? FALLBACK_LANGUAGE_TAG,
-            getChangeLocaleUrl: newLanguageTag => {
-                const { locale } = kcContext;
-
-                assert(locale !== undefined, "Internationalization not enabled");
-
-                const targetSupportedLocale = locale.supported.find(({ languageTag }) => languageTag === newLanguageTag);
-
-                assert(targetSupportedLocale !== undefined, `${newLanguageTag} need to be enabled in Keycloak admin`);
-
-                return targetSupportedLocale.url;
-            },
-            labelBySupportedLanguageTag: Object.fromEntries((kcContext.locale?.supported ?? []).map(({ languageTag, label }) => [languageTag, label]))
-        };
-
-        const { createI18nTranslationFunctions } = createI18nTranslationFunctionsFactory<MessageKey_themeDefined>({
-            messages_themeDefined:
-                messagesByLanguageTag_themeDefined[partialI18n.currentLanguageTag] ??
-                messagesByLanguageTag_themeDefined[FALLBACK_LANGUAGE_TAG] ??
-                (() => {
-                    const firstLanguageTag = Object.keys(messagesByLanguageTag_themeDefined)[0];
-                    if (firstLanguageTag === undefined) {
-                        return undefined;
-                    }
-                    return messagesByLanguageTag_themeDefined[firstLanguageTag];
-                })(),
-            messages_fromKcServer: kcContext["x-keycloakify"].messages
-        });
-
-        const isCurrentLanguageFallbackLanguage = partialI18n.currentLanguageTag === FALLBACK_LANGUAGE_TAG;
-
-        const result: Result = {
-            i18n: {
-                ...partialI18n,
-                ...createI18nTranslationFunctions({
-                    messages_defaultSet_currentLanguage: isCurrentLanguageFallbackLanguage ? messages_defaultSet_fallbackLanguage : undefined
-                }),
-                isFetchingTranslations: !isCurrentLanguageFallbackLanguage
-            },
-            prI18n_currentLanguage: isCurrentLanguageFallbackLanguage
-                ? undefined
-                : (async () => {
-                      const messages_defaultSet_currentLanguage = await fetchMessages_defaultSet(partialI18n.currentLanguageTag);
-
-                      const i18n_currentLanguage: I18n = {
-                          ...partialI18n,
-                          ...createI18nTranslationFunctions({ messages_defaultSet_currentLanguage }),
-                          isFetchingTranslations: false
-                      };
-
-                      // NOTE: This promise.resolve is just because without it we TypeScript
-                      // gives a Variable 'result' is used before being assigned. error
-                      await Promise.resolve().then(() => {
-                          result.i18n = i18n_currentLanguage;
-                          result.prI18n_currentLanguage = undefined;
-                      });
-
-                      return i18n_currentLanguage;
-                  })()
-        };
-
-        cachedResultByKcContext.set(kcContext, result);
-
-        return result;
-    }
-
-    return { getI18n };
-}
-
-function createI18nTranslationFunctionsFactory<MessageKey_themeDefined extends string>(params: {
-    messages_themeDefined: Record<MessageKey_themeDefined, string> | undefined;
-    messages_fromKcServer: Record<string, string>;
-}) {
-    const { messages_themeDefined, messages_fromKcServer } = params;
-
-    function createI18nTranslationFunctions(params: {
-        messages_defaultSet_currentLanguage: Partial<Record<MessageKey_defaultSet, string>> | undefined;
-    }): Pick<GenericI18n_noJsx<MessageKey_defaultSet | MessageKey_themeDefined>, "msgStr" | "advancedMsgStr"> {
-        const { messages_defaultSet_currentLanguage } = params;
-
-        function resolveMsg(props: { key: string; args: (string | undefined)[] }): string | undefined {
-            const { key, args } = props;
-
-            const message =
-                id<Record<string, string | undefined>>(messages_fromKcServer)[key] ??
-                id<Record<string, string | undefined> | undefined>(messages_themeDefined)?.[key] ??
-                id<Record<string, string | undefined> | undefined>(messages_defaultSet_currentLanguage)?.[key] ??
-                id<Record<string, string | undefined>>(messages_defaultSet_fallbackLanguage)[key];
-
-            if (message === undefined) {
-                return undefined;
-            }
-
-            const startIndex = message
-                .match(/{[0-9]+}/g)
-                ?.map(g => g.match(/{([0-9]+)}/)![1])
-                .map(indexStr => parseInt(indexStr))
-                .sort((a, b) => a - b)[0];
-
-            if (startIndex === undefined) {
-                // No {0} in message (no arguments expected)
-                return message;
-            }
-
-            let messageWithArgsInjected = message;
-
-            args.forEach((arg, i) => {
-                if (arg === undefined) {
-                    return;
-                }
-
-                messageWithArgsInjected = messageWithArgsInjected.replace(
-                    new RegExp(`\\{${i + startIndex}\\}`, "g"),
-                    arg.replace(/</g, "&lt;").replace(/>/g, "&gt;")
-                );
-            });
-
-            return messageWithArgsInjected;
-        }
-
-        function resolveMsgAdvanced(props: { key: string; args: (string | undefined)[] }): string {
-            const { key, args } = props;
-
-            const match = key.match(/^\$\{(.+)\}$/);
-
-            if (match === null) {
-                return key;
-            }
-
-            return resolveMsg({ key: match[1], args }) ?? key;
-        }
-
-        return {
-            msgStr: (key, ...args) => {
-                const resolvedMessage = resolveMsg({ key, args });
-                assert(resolvedMessage !== undefined, `Message with key "${key}" not found`);
-                return resolvedMessage;
-            },
-            advancedMsgStr: (key, ...args) => resolveMsgAdvanced({ key, args })
-        };
-    }
-
-    return { createI18nTranslationFunctions };
-}

src/account/i18n/index.ts

@@ -1,5 +0,0 @@
-import type { GenericI18n } from "./GenericI18n";
-import type { MessageKey_defaultSet, KcContextLike } from "./i18n";
-export type { MessageKey_defaultSet, KcContextLike };
-export type I18n = GenericI18n<MessageKey_defaultSet>;
-export { createUseI18n } from "./useI18n";

src/account/i18n/useI18n.tsx

@@ -1,95 +0,0 @@
-import { useEffect, useState } from "react";
-import { createGetI18n, type GenericI18n_noJsx, type KcContextLike, type MessageKey_defaultSet } from "./i18n";
-import { GenericI18n } from "./GenericI18n";
-import { Reflect } from "tsafe/Reflect";
-
-export function createUseI18n<MessageKey_themeDefined extends string = never>(messagesByLanguageTag: {
-    [languageTag: string]: { [key in MessageKey_themeDefined]: string };
-}) {
-    type MessageKey = MessageKey_defaultSet | MessageKey_themeDefined;
-
-    type I18n = GenericI18n<MessageKey>;
-
-    const { withJsx } = (() => {
-        const cache = new WeakMap<GenericI18n_noJsx<MessageKey>, GenericI18n<MessageKey>>();
-
-        function renderHtmlString(params: { htmlString: string; msgKey: string }): JSX.Element {
-            const { htmlString, msgKey } = params;
-            return (
-                <div
-                    data-kc-msg={msgKey}
-                    dangerouslySetInnerHTML={{
-                        __html: htmlString
-                    }}
-                />
-            );
-        }
-
-        function withJsx(i18n_noJsx: GenericI18n_noJsx<MessageKey>): I18n {
-            use_cache: {
-                const i18n = cache.get(i18n_noJsx);
-
-                if (i18n === undefined) {
-                    break use_cache;
-                }
-
-                return i18n;
-            }
-
-            const i18n: I18n = {
-                ...i18n_noJsx,
-                msg: (msgKey, ...args) => renderHtmlString({ htmlString: i18n_noJsx.msgStr(msgKey, ...args), msgKey }),
-                advancedMsg: (msgKey, ...args) => renderHtmlString({ htmlString: i18n_noJsx.advancedMsgStr(msgKey, ...args), msgKey })
-            };
-
-            cache.set(i18n_noJsx, i18n);
-
-            return i18n;
-        }
-
-        return { withJsx };
-    })();
-
-    add_style: {
-        const attributeName = "data-kc-i18n";
-
-        // Check if already exists in head
-        if (document.querySelector(`style[${attributeName}]`) !== null) {
-            break add_style;
-        }
-
-        const styleElement = document.createElement("style");
-        styleElement.attributes.setNamedItem(document.createAttribute(attributeName));
-        (styleElement.textContent = `[data-kc-msg] { display: inline-block; }`), document.head.prepend(styleElement);
-    }
-
-    const { getI18n } = createGetI18n(messagesByLanguageTag);
-
-    function useI18n(params: { kcContext: KcContextLike }): { i18n: I18n } {
-        const { kcContext } = params;
-
-        const { i18n, prI18n_currentLanguage } = getI18n({ kcContext });
-
-        const [i18n_toReturn, setI18n_toReturn] = useState<I18n>(withJsx(i18n));
-
-        useEffect(() => {
-            let isActive = true;
-
-            prI18n_currentLanguage?.then(i18n => {
-                if (!isActive) {
-                    return;
-                }
-
-                setI18n_toReturn(withJsx(i18n));
-            });
-
-            return () => {
-                isActive = false;
-            };
-        }, []);
-
-        return { i18n: i18n_toReturn };
-    }
-
-    return { useI18n, ofTypeI18n: Reflect<I18n>() };
-}

src/account/index.ts

@@ -1,3 +1,3 @@
 export type { ExtendKcContext } from "keycloakify/account/KcContext";
 export type { ClassKey } from "keycloakify/account/TemplateProps";
-export { createUseI18n } from "keycloakify/account/i18n";
+export { i18nBuilder, type MessageKey_defaultSet } from "keycloakify/account/i18n";

src/account/lib/kcClsx.ts

@@ -1,5 +1,19 @@
 import { createGetKcClsx } from "keycloakify/lib/getKcClsx";
-import type { ClassKey } from "keycloakify/account/TemplateProps";
+
+export type ClassKey =
+    | "kcHtmlClass"
+    | "kcBodyClass"
+    | "kcButtonClass"
+    | "kcButtonPrimaryClass"
+    | "kcButtonLargeClass"
+    | "kcButtonDefaultClass"
+    | "kcContentWrapperClass"
+    | "kcFormClass"
+    | "kcFormGroupClass"
+    | "kcInputWrapperClass"
+    | "kcLabelClass"
+    | "kcInputClass"
+    | "kcInputErrorMessageClass";
 
 export const { getKcClsx } = createGetKcClsx<ClassKey>({
     defaultClasses: {
@@ -20,6 +34,4 @@ export const { getKcClsx } = createGetKcClsx<ClassKey>({
     }
 });
 
-export type { ClassKey };
-
 export type KcClsx = ReturnType<typeof getKcClsx>["kcClsx"];

src/account/pages/PageProps.ts

@@ -1,3 +1,4 @@
+import type { JSX } from "keycloakify/tools/JSX";
 import { type TemplateProps, type ClassKey } from "keycloakify/account/TemplateProps";
 import type { LazyOrNot } from "keycloakify/tools/LazyOrNot";
 

src/account/pages/Totp.tsx

@@ -1,5 +1,6 @@
 import { clsx } from "keycloakify/tools/clsx";
 import { getKcClsx } from "keycloakify/account/lib/kcClsx";
+import { kcSanitize } from "keycloakify/lib/kcSanitize";
 import type { PageProps } from "keycloakify/account/pages/PageProps";
 import type { KcContext } from "../KcContext";
 import type { I18n } from "../i18n";
@@ -159,7 +160,7 @@ export default function Totp(props: PageProps<Extract<KcContext, { pageId: "totp
                                             className={kcClsx("kcInputErrorMessageClass")}
                                             aria-live="polite"
                                             dangerouslySetInnerHTML={{
-                                                __html: messagesPerField.get("totp")
+                                                __html: kcSanitize(messagesPerField.get("totp"))
                                             }}
                                         />
                                     )}
@@ -190,7 +191,7 @@ export default function Totp(props: PageProps<Extract<KcContext, { pageId: "totp
                                             className={kcClsx("kcInputErrorMessageClass")}
                                             aria-live="polite"
                                             dangerouslySetInnerHTML={{
-                                                __html: messagesPerField.get("userLabel")
+                                                __html: kcSanitize(messagesPerField.get("userLabel"))
                                             }}
                                         />
                                     )}

src/bin/add-story.ts

@@ -5,25 +5,30 @@ import {
     ACCOUNT_THEME_PAGE_IDS,
     type LoginThemePageId,
     type AccountThemePageId,
-    THEME_TYPES,
-    type ThemeType
+    THEME_TYPES
 } from "./shared/constants";
 import { capitalize } from "tsafe/capitalize";
 import * as fs from "fs";
 import { join as pathJoin, relative as pathRelative, dirname as pathDirname } from "path";
 import { kebabCaseToCamelCase } from "./tools/kebabCaseToSnakeCase";
 import { assert, Equals } from "tsafe/assert";
-import type { CliCommandOptions } from "./main";
-import { getBuildContext } from "./shared/buildContext";
+import type { BuildContext } from "./shared/buildContext";
 import chalk from "chalk";
+import { runPrettier, getIsPrettierAvailable } from "./tools/runPrettier";
+import { maybeDelegateCommandToCustomHandler } from "./shared/customHandler_delegate";
 
-export async function command(params: { cliCommandOptions: CliCommandOptions }) {
-    const { cliCommandOptions } = params;
+export async function command(params: { buildContext: BuildContext }) {
+    const { buildContext } = params;
 
-    const buildContext = getBuildContext({
-        cliCommandOptions
+    const { hasBeenHandled } = await maybeDelegateCommandToCustomHandler({
+        commandName: "add-story",
+        buildContext
     });
 
+    if (hasBeenHandled) {
+        return;
+    }
+
     console.log(chalk.cyan("Theme type:"));
 
     const themeType = await (async () => {
@@ -33,6 +38,8 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
                     return buildContext.implementedThemeTypes.account.isImplemented;
                 case "login":
                     return buildContext.implementedThemeTypes.login.isImplemented;
+                case "admin":
+                    return buildContext.implementedThemeTypes.admin.isImplemented;
             }
             assert<Equals<typeof themeType, never>>(false);
         });
@@ -43,7 +50,7 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
             return values[0];
         }
 
-        const { value } = await cliSelect<ThemeType>({
+        const { value } = await cliSelect({
             values
         }).catch(() => {
             process.exit(-1);
@@ -62,6 +69,16 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
         );
 
         process.exit(0);
+        return;
+    }
+
+    if (themeType === "admin") {
+        console.log(
+            `${chalk.red("✗")} Sorry, there is no Storybook support for the Admin UI.`
+        );
+
+        process.exit(0);
+        return;
     }
 
     console.log(`→ ${themeType}`);
@@ -102,7 +119,7 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
         process.exit(-1);
     }
 
-    const componentCode = fs
+    let sourceCode = fs
         .readFileSync(
             pathJoin(
                 getThisCodebaseRootDirPath(),
@@ -116,6 +133,17 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
         .replace('import React from "react";\n', "")
         .replace(/from "[./]+dist\//, 'from "keycloakify/');
 
+    run_prettier: {
+        if (!(await getIsPrettierAvailable())) {
+            break run_prettier;
+        }
+
+        sourceCode = await runPrettier({
+            filePath: targetFilePath,
+            sourceCode: sourceCode
+        });
+    }
+
     {
         const targetDirPath = pathDirname(targetFilePath);
 
@@ -124,7 +152,7 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
         }
     }
 
-    fs.writeFileSync(targetFilePath, Buffer.from(componentCode, "utf8"));
+    fs.writeFileSync(targetFilePath, Buffer.from(sourceCode, "utf8"));
 
     console.log(
         [

src/bin/copy-keycloak-resources-to-public.ts

@@ -1,13 +1,96 @@
-import { copyKeycloakResourcesToPublic } from "./shared/copyKeycloakResourcesToPublic";
-import { getBuildContext } from "./shared/buildContext";
-import type { CliCommandOptions } from "./main";
+import { maybeDelegateCommandToCustomHandler } from "./shared/customHandler_delegate";
+import { join as pathJoin, dirname as pathDirname } from "path";
+import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "./shared/constants";
+import { readThisNpmPackageVersion } from "./tools/readThisNpmPackageVersion";
+import * as fs from "fs";
+import { rmSync } from "./tools/fs.rmSync";
+import type { BuildContext } from "./shared/buildContext";
+import { transformCodebase } from "./tools/transformCodebase";
+import { getThisCodebaseRootDirPath } from "./tools/getThisCodebaseRootDirPath";
 
-export async function command(params: { cliCommandOptions: CliCommandOptions }) {
-    const { cliCommandOptions } = params;
+export async function command(params: { buildContext: BuildContext }) {
+    const { buildContext } = params;
 
-    const buildContext = getBuildContext({ cliCommandOptions });
-
-    await copyKeycloakResourcesToPublic({
+    const { hasBeenHandled } = await maybeDelegateCommandToCustomHandler({
+        commandName: "copy-keycloak-resources-to-public",
         buildContext
     });
+
+    if (hasBeenHandled) {
+        return;
+    }
+
+    const destDirPath = pathJoin(
+        buildContext.publicDirPath,
+        WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
+    );
+
+    const keycloakifyBuildinfoFilePath = pathJoin(destDirPath, "keycloakify.buildinfo");
+
+    const keycloakifyBuildinfoRaw = JSON.stringify(
+        {
+            keycloakifyVersion: readThisNpmPackageVersion()
+        },
+        null,
+        2
+    );
+
+    skip_if_already_done: {
+        if (!fs.existsSync(keycloakifyBuildinfoFilePath)) {
+            break skip_if_already_done;
+        }
+
+        const keycloakifyBuildinfoRaw_previousRun = fs
+            .readFileSync(keycloakifyBuildinfoFilePath)
+            .toString("utf8");
+
+        if (keycloakifyBuildinfoRaw_previousRun !== keycloakifyBuildinfoRaw) {
+            break skip_if_already_done;
+        }
+
+        return;
+    }
+
+    rmSync(destDirPath, { force: true, recursive: true });
+
+    // NOTE: To remove in a while, remove the legacy keycloak-resources directory
+    rmSync(pathJoin(pathDirname(destDirPath), "keycloak-resources"), {
+        force: true,
+        recursive: true
+    });
+    rmSync(pathJoin(pathDirname(destDirPath), ".keycloakify"), {
+        force: true,
+        recursive: true
+    });
+
+    fs.mkdirSync(destDirPath, { recursive: true });
+
+    fs.writeFileSync(pathJoin(destDirPath, ".gitignore"), Buffer.from("*", "utf8"));
+
+    transformCodebase({
+        srcDirPath: pathJoin(
+            getThisCodebaseRootDirPath(),
+            "res",
+            "public",
+            WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
+        ),
+        destDirPath
+    });
+
+    fs.writeFileSync(
+        pathJoin(destDirPath, "README.txt"),
+        Buffer.from(
+            // prettier-ignore
+            [
+                "This directory is only used in dev mode by Keycloakify",
+                "It won't be included in your final build.",
+                "Do not modify anything in this directory.",
+            ].join("\n")
+        )
+    );
+
+    fs.writeFileSync(
+        keycloakifyBuildinfoFilePath,
+        Buffer.from(keycloakifyBuildinfoRaw, "utf8")
+    );
 }

src/bin/eject-page.ts

@@ -7,30 +7,30 @@ import {
     ACCOUNT_THEME_PAGE_IDS,
     type LoginThemePageId,
     type AccountThemePageId,
-    THEME_TYPES,
-    type ThemeType
+    THEME_TYPES
 } from "./shared/constants";
 import { capitalize } from "tsafe/capitalize";
 import * as fs from "fs";
-import {
-    join as pathJoin,
-    relative as pathRelative,
-    dirname as pathDirname,
-    basename as pathBasename
-} from "path";
+import { join as pathJoin, relative as pathRelative, dirname as pathDirname } from "path";
 import { kebabCaseToCamelCase } from "./tools/kebabCaseToSnakeCase";
 import { assert, Equals } from "tsafe/assert";
-import type { CliCommandOptions } from "./main";
-import { getBuildContext } from "./shared/buildContext";
+import type { BuildContext } from "./shared/buildContext";
 import chalk from "chalk";
+import { maybeDelegateCommandToCustomHandler } from "./shared/customHandler_delegate";
+import { runPrettier, getIsPrettierAvailable } from "./tools/runPrettier";
 
-export async function command(params: { cliCommandOptions: CliCommandOptions }) {
-    const { cliCommandOptions } = params;
+export async function command(params: { buildContext: BuildContext }) {
+    const { buildContext } = params;
 
-    const buildContext = getBuildContext({
-        cliCommandOptions
+    const { hasBeenHandled } = await maybeDelegateCommandToCustomHandler({
+        commandName: "eject-page",
+        buildContext
     });
 
+    if (hasBeenHandled) {
+        return;
+    }
+
     console.log(chalk.cyan("Theme type:"));
 
     const themeType = await (async () => {
@@ -40,6 +40,8 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
                     return buildContext.implementedThemeTypes.account.isImplemented;
                 case "login":
                     return buildContext.implementedThemeTypes.login.isImplemented;
+                case "admin":
+                    return buildContext.implementedThemeTypes.admin.isImplemented;
             }
             assert<Equals<typeof themeType, never>>(false);
         });
@@ -50,7 +52,7 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
             return values[0];
         }
 
-        const { value } = await cliSelect<ThemeType>({
+        const { value } = await cliSelect({
             values
         }).catch(() => {
             process.exit(-1);
@@ -59,87 +61,28 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
         return value;
     })();
 
+    if (themeType === "admin") {
+        console.log("Use `npx keycloakify own` command instead, see documentation");
+
+        process.exit(-1);
+    }
+
     if (
         themeType === "account" &&
         (assert(buildContext.implementedThemeTypes.account.isImplemented),
         buildContext.implementedThemeTypes.account.type === "Single-Page")
     ) {
-        const srcDirPath = pathJoin(
-            pathDirname(buildContext.packageJsonFilePath),
-            "node_modules",
-            "@keycloakify",
-            "keycloak-account-ui",
-            "src"
-        );
-
         console.log(
-            [
-                `There isn't an interactive CLI to eject components of the Single-Page Account theme.`,
-                `You can however copy paste into your codebase the any file or directory from the following source directory:`,
-                ``,
-                `${chalk.bold(pathJoin(pathRelative(process.cwd(), srcDirPath)))}`,
-                ``
-            ].join("\n")
+            chalk.yellow(
+                [
+                    "You are implementing a Single-Page Account theme.",
+                    "The eject-page command isn't applicable in this context"
+                ].join("\n")
+            )
         );
 
-        eject_entrypoint: {
-            const kcAccountUiTsxFileRelativePath = "KcAccountUi.tsx";
-
-            const accountThemeSrcDirPath = pathJoin(
-                buildContext.themeSrcDirPath,
-                "account"
-            );
-
-            const targetFilePath = pathJoin(
-                accountThemeSrcDirPath,
-                kcAccountUiTsxFileRelativePath
-            );
-
-            if (fs.existsSync(targetFilePath)) {
-                break eject_entrypoint;
-            }
-
-            fs.cpSync(
-                pathJoin(srcDirPath, kcAccountUiTsxFileRelativePath),
-                targetFilePath
-            );
-
-            {
-                const kcPageTsxFilePath = pathJoin(accountThemeSrcDirPath, "KcPage.tsx");
-
-                const kcPageTsxCode = fs.readFileSync(kcPageTsxFilePath).toString("utf8");
-
-                const componentName = pathBasename(
-                    kcAccountUiTsxFileRelativePath
-                ).replace(/.tsx$/, "");
-
-                const modifiedKcPageTsxCode = kcPageTsxCode.replace(
-                    `@keycloakify/keycloak-account-ui/${componentName}`,
-                    `./${componentName}`
-                );
-
-                fs.writeFileSync(
-                    kcPageTsxFilePath,
-                    Buffer.from(modifiedKcPageTsxCode, "utf8")
-                );
-            }
-
-            const routesTsxFilePath = pathRelative(
-                process.cwd(),
-                pathJoin(srcDirPath, "routes.tsx")
-            );
-
-            console.log(
-                [
-                    `To help you get started ${chalk.bold(pathRelative(process.cwd(), targetFilePath))} has been copied into your project.`,
-                    `The next step is usually to eject ${chalk.bold(routesTsxFilePath)}`,
-                    `with \`cp ${routesTsxFilePath} ${pathRelative(process.cwd(), accountThemeSrcDirPath)}\``,
-                    `then update the import of routes in ${kcAccountUiTsxFileRelativePath}.`
-                ].join("\n")
-            );
-        }
-
-        process.exit(0);
+        process.exit(1);
+        return;
     }
 
     console.log(`→ ${themeType}`);
@@ -149,12 +92,14 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
     const templateValue = "Template.tsx (Layout common to every page)";
     const userProfileFormFieldsValue =
         "UserProfileFormFields.tsx (Renders the form of the register.ftl, login-update-profile.ftl, update-email.ftl and idp-review-user-profile.ftl)";
+    const otherPageValue = "The page you're looking for isn't listed here";
 
     const { value: pageIdOrComponent } = await cliSelect<
         | LoginThemePageId
         | AccountThemePageId
         | typeof templateValue
         | typeof userProfileFormFieldsValue
+        | typeof otherPageValue
     >({
         values: (() => {
             switch (themeType) {
@@ -162,10 +107,11 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
                     return [
                         templateValue,
                         userProfileFormFieldsValue,
-                        ...LOGIN_THEME_PAGE_IDS
+                        ...LOGIN_THEME_PAGE_IDS,
+                        otherPageValue
                     ];
                 case "account":
-                    return [templateValue, ...ACCOUNT_THEME_PAGE_IDS];
+                    return [templateValue, ...ACCOUNT_THEME_PAGE_IDS, otherPageValue];
             }
             assert<Equals<typeof themeType, never>>(false);
         })()
@@ -173,6 +119,17 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
         process.exit(-1);
     });
 
+    if (pageIdOrComponent === otherPageValue) {
+        console.log(
+            [
+                "To style a page not included in the base Keycloak, such as one added by a third-party Keycloak extension,",
+                "refer to the documentation: https://docs.keycloakify.dev/features/styling-a-custom-page-not-included-in-base-keycloak"
+            ].join(" ")
+        );
+
+        process.exit(0);
+    }
+
     console.log(`→ ${pageIdOrComponent}`);
 
     const componentBasename = (() => {
@@ -216,7 +173,7 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
         process.exit(-1);
     }
 
-    const componentCode = fs
+    let componentCode = fs
         .readFileSync(
             pathJoin(
                 getThisCodebaseRootDirPath(),
@@ -228,6 +185,17 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
         )
         .toString("utf8");
 
+    run_prettier: {
+        if (!(await getIsPrettierAvailable())) {
+            break run_prettier;
+        }
+
+        componentCode = await runPrettier({
+            filePath: targetFilePath,
+            sourceCode: componentCode
+        });
+    }
+
     {
         const targetDirPath = pathDirname(targetFilePath);
 
@@ -244,12 +212,12 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
         )} copy pasted from the Keycloakify source code into your project`
     );
 
-    edit_KcApp: {
+    edit_KcPage: {
         if (
             pageIdOrComponent !== templateValue &&
             pageIdOrComponent !== userProfileFormFieldsValue
         ) {
-            break edit_KcApp;
+            break edit_KcPage;
         }
 
         const kcAppTsxPath = pathJoin(

src/bin/initialize-account-theme/copyBoilerplate.ts

@@ -1,32 +0,0 @@
-import * as fs from "fs";
-import { join as pathJoin } from "path";
-import { getThisCodebaseRootDirPath } from "../tools/getThisCodebaseRootDirPath";
-import { assert, type Equals } from "tsafe/assert";
-
-export function copyBoilerplate(params: {
-    accountThemeType: "Single-Page" | "Multi-Page";
-    accountThemeSrcDirPath: string;
-}) {
-    const { accountThemeType, accountThemeSrcDirPath } = params;
-
-    fs.cpSync(
-        pathJoin(
-            getThisCodebaseRootDirPath(),
-            "src",
-            "bin",
-            "initialize-account-theme",
-            "src",
-            (() => {
-                switch (accountThemeType) {
-                    case "Single-Page":
-                        return "single-page";
-                    case "Multi-Page":
-                        return "multi-page";
-                }
-                assert<Equals<typeof accountThemeType, never>>(false);
-            })()
-        ),
-        accountThemeSrcDirPath,
-        { recursive: true }
-    );
-}

src/bin/initialize-account-theme/initialize-account-theme.ts

@@ -1,67 +1,31 @@
-import { getBuildContext } from "../shared/buildContext";
-import type { CliCommandOptions } from "../main";
+import type { BuildContext } from "../shared/buildContext";
 import cliSelect from "cli-select";
-import child_process from "child_process";
 import chalk from "chalk";
 import { join as pathJoin, relative as pathRelative } from "path";
 import * as fs from "fs";
 import { updateAccountThemeImplementationInConfig } from "./updateAccountThemeImplementationInConfig";
-import { generateKcGenTs } from "../shared/generateKcGenTs";
+import { command as updateKcGenCommand } from "../update-kc-gen";
+import { maybeDelegateCommandToCustomHandler } from "../shared/customHandler_delegate";
+import { exitIfUncommittedChanges } from "../shared/exitIfUncommittedChanges";
+import { getThisCodebaseRootDirPath } from "../tools/getThisCodebaseRootDirPath";
 
-export async function command(params: { cliCommandOptions: CliCommandOptions }) {
-    const { cliCommandOptions } = params;
+export async function command(params: { buildContext: BuildContext }) {
+    const { buildContext } = params;
 
-    const buildContext = getBuildContext({ cliCommandOptions });
+    const { hasBeenHandled } = await maybeDelegateCommandToCustomHandler({
+        commandName: "initialize-account-theme",
+        buildContext
+    });
+
+    if (hasBeenHandled) {
+        return;
+    }
 
     const accountThemeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, "account");
 
-    if (
-        fs.existsSync(accountThemeSrcDirPath) &&
-        fs.readdirSync(accountThemeSrcDirPath).length > 0
-    ) {
-        console.warn(
-            chalk.red(
-                `There is already a ${pathRelative(
-                    process.cwd(),
-                    accountThemeSrcDirPath
-                )} directory in your project. Aborting.`
-            )
-        );
-
-        process.exit(-1);
-    }
-
-    exit_if_uncommitted_changes: {
-        let hasUncommittedChanges: boolean | undefined = undefined;
-
-        try {
-            hasUncommittedChanges =
-                child_process
-                    .execSync(`git status --porcelain`, {
-                        cwd: buildContext.projectDirPath
-                    })
-                    .toString()
-                    .trim() !== "";
-        } catch {
-            // Probably not a git repository
-            break exit_if_uncommitted_changes;
-        }
-
-        if (!hasUncommittedChanges) {
-            break exit_if_uncommitted_changes;
-        }
-        console.warn(
-            [
-                chalk.red(
-                    "Please commit or stash your changes before running this command.\n"
-                ),
-                "This command will modify your project's files so it's better to have a clean working directory",
-                "so that you can easily see what has been changed and revert if needed."
-            ].join(" ")
-        );
-
-        process.exit(-1);
-    }
+    exitIfUncommittedChanges({
+        projectDirPath: buildContext.projectDirPath
+    });
 
     const { value: accountThemeType } = await cliSelect({
         values: ["Single-Page" as const, "Multi-Page" as const]
@@ -72,23 +36,41 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
     switch (accountThemeType) {
         case "Multi-Page":
             {
-                const { initializeAccountTheme_multiPage } = await import(
-                    "./initializeAccountTheme_multiPage"
-                );
+                if (
+                    fs.existsSync(accountThemeSrcDirPath) &&
+                    fs.readdirSync(accountThemeSrcDirPath).length > 0
+                ) {
+                    console.warn(
+                        chalk.red(
+                            `There is already a ${pathRelative(
+                                process.cwd(),
+                                accountThemeSrcDirPath
+                            )} directory in your project. Aborting.`
+                        )
+                    );
 
-                await initializeAccountTheme_multiPage({
-                    accountThemeSrcDirPath
-                });
+                    process.exit(-1);
+                }
+
+                fs.cpSync(
+                    pathJoin(
+                        getThisCodebaseRootDirPath(),
+                        "src",
+                        "bin",
+                        "initialize-account-theme",
+                        "multi-page-boilerplate"
+                    ),
+                    accountThemeSrcDirPath,
+                    { recursive: true }
+                );
             }
             break;
         case "Single-Page":
             {
-                const { initializeAccountTheme_singlePage } = await import(
-                    "./initializeAccountTheme_singlePage"
-                );
+                const { initializeSpa } = await import("../shared/initializeSpa");
 
-                await initializeAccountTheme_singlePage({
-                    accountThemeSrcDirPath,
+                await initializeSpa({
+                    themeType: "account",
                     buildContext
                 });
             }
@@ -97,7 +79,7 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
 
     updateAccountThemeImplementationInConfig({ buildContext, accountThemeType });
 
-    await generateKcGenTs({
+    await updateKcGenCommand({
         buildContext: {
             ...buildContext,
             implementedThemeTypes: {

src/bin/initialize-account-theme/initializeAccountTheme_multiPage.ts

@@ -1,21 +0,0 @@
-import { relative as pathRelative } from "path";
-import chalk from "chalk";
-import { copyBoilerplate } from "./copyBoilerplate";
-
-export async function initializeAccountTheme_multiPage(params: {
-    accountThemeSrcDirPath: string;
-}) {
-    const { accountThemeSrcDirPath } = params;
-
-    copyBoilerplate({
-        accountThemeType: "Multi-Page",
-        accountThemeSrcDirPath
-    });
-
-    console.log(
-        [
-            chalk.green("The Multi-Page account theme has been initialized."),
-            `Directory created: ${chalk.bold(pathRelative(process.cwd(), accountThemeSrcDirPath))}`
-        ].join("\n")
-    );
-}

src/bin/initialize-account-theme/initializeAccountTheme_singlePage.ts

@@ -1,152 +0,0 @@
-import { join as pathJoin, relative as pathRelative, dirname as pathDirname } from "path";
-import type { BuildContext } from "../shared/buildContext";
-import * as fs from "fs";
-import chalk from "chalk";
-import {
-    getLatestsSemVersionedTag,
-    type BuildContextLike as BuildContextLike_getLatestsSemVersionedTag
-} from "../shared/getLatestsSemVersionedTag";
-import fetch from "make-fetch-happen";
-import { z } from "zod";
-import { assert, type Equals } from "tsafe/assert";
-import { is } from "tsafe/is";
-import { id } from "tsafe/id";
-import { npmInstall } from "../tools/npmInstall";
-import { copyBoilerplate } from "./copyBoilerplate";
-import { getThisCodebaseRootDirPath } from "../tools/getThisCodebaseRootDirPath";
-
-type BuildContextLike = BuildContextLike_getLatestsSemVersionedTag & {
-    fetchOptions: BuildContext["fetchOptions"];
-    packageJsonFilePath: string;
-};
-
-assert<BuildContext extends BuildContextLike ? true : false>();
-
-export async function initializeAccountTheme_singlePage(params: {
-    accountThemeSrcDirPath: string;
-    buildContext: BuildContextLike;
-}) {
-    const { accountThemeSrcDirPath, buildContext } = params;
-
-    const OWNER = "keycloakify";
-    const REPO = "keycloak-account-ui";
-
-    const [semVersionedTag] = await getLatestsSemVersionedTag({
-        owner: OWNER,
-        repo: REPO,
-        count: 1,
-        doIgnoreReleaseCandidates: false,
-        buildContext
-    });
-
-    const dependencies = await fetch(
-        `https://raw.githubusercontent.com/${OWNER}/${REPO}/${semVersionedTag.tag}/dependencies.gen.json`,
-        buildContext.fetchOptions
-    )
-        .then(r => r.json())
-        .then(
-            (() => {
-                type Dependencies = {
-                    dependencies: Record<string, string>;
-                    devDependencies?: Record<string, string>;
-                };
-
-                const zDependencies = (() => {
-                    type TargetType = Dependencies;
-
-                    const zTargetType = z.object({
-                        dependencies: z.record(z.string()),
-                        devDependencies: z.record(z.string()).optional()
-                    });
-
-                    assert<Equals<z.infer<typeof zTargetType>, TargetType>>();
-
-                    return id<z.ZodType<TargetType>>(zTargetType);
-                })();
-
-                return o => zDependencies.parse(o);
-            })()
-        );
-
-    dependencies.dependencies["@keycloakify/keycloak-account-ui"] = semVersionedTag.tag;
-
-    const parsedPackageJson = (() => {
-        type ParsedPackageJson = {
-            dependencies?: Record<string, string>;
-            devDependencies?: Record<string, string>;
-        };
-
-        const zParsedPackageJson = (() => {
-            type TargetType = ParsedPackageJson;
-
-            const zTargetType = z.object({
-                dependencies: z.record(z.string()).optional(),
-                devDependencies: z.record(z.string()).optional()
-            });
-
-            assert<Equals<z.infer<typeof zTargetType>, TargetType>>();
-
-            return id<z.ZodType<TargetType>>(zTargetType);
-        })();
-        const parsedPackageJson = JSON.parse(
-            fs.readFileSync(buildContext.packageJsonFilePath).toString("utf8")
-        );
-
-        zParsedPackageJson.parse(parsedPackageJson);
-
-        assert(is<ParsedPackageJson>(parsedPackageJson));
-
-        return parsedPackageJson;
-    })();
-
-    parsedPackageJson.dependencies = {
-        ...parsedPackageJson.dependencies,
-        ...dependencies.dependencies
-    };
-
-    parsedPackageJson.devDependencies = {
-        ...parsedPackageJson.devDependencies,
-        ...dependencies.devDependencies
-    };
-
-    if (Object.keys(parsedPackageJson.devDependencies).length === 0) {
-        delete parsedPackageJson.devDependencies;
-    }
-
-    fs.writeFileSync(
-        buildContext.packageJsonFilePath,
-        JSON.stringify(parsedPackageJson, undefined, 4)
-    );
-
-    run_npm_install: {
-        if (
-            JSON.parse(
-                fs
-                    .readFileSync(pathJoin(getThisCodebaseRootDirPath(), "package.json"))
-                    .toString("utf8")
-            )["version"] === "0.0.0"
-        ) {
-            //NOTE: Linked version
-            break run_npm_install;
-        }
-
-        npmInstall({ packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath) });
-    }
-
-    copyBoilerplate({
-        accountThemeType: "Single-Page",
-        accountThemeSrcDirPath
-    });
-
-    console.log(
-        [
-            chalk.green(
-                "The Single-Page account theme has been successfully initialized."
-            ),
-            `Using Account UI of Keycloak version: ${chalk.bold(semVersionedTag.tag.split("-")[0])}`,
-            `Directory created: ${chalk.bold(pathRelative(process.cwd(), accountThemeSrcDirPath))}`,
-            `Dependencies added to your project's package.json: `,
-            chalk.bold(JSON.stringify(dependencies, null, 2))
-        ].join("\n")
-    );
-}

src/bin/initialize-account-theme/multi-page-boilerplate/i18n.ts

@@ -0,0 +1,10 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import { i18nBuilder } from "keycloakify/account";
+import type { ThemeName } from "../kc.gen";
+
+/** @see: https://docs.keycloakify.dev/features/i18n */
+const { useI18n, ofTypeI18n } = i18nBuilder.withThemeName<ThemeName>().build();
+
+type I18n = typeof ofTypeI18n;
+
+export { useI18n, type I18n };

src/bin/initialize-account-theme/src/multi-page/i18n.ts

@@ -1,5 +0,0 @@
-import { createUseI18n } from "keycloakify/account";
-
-export const { useI18n, ofTypeI18n } = createUseI18n({});
-
-export type I18n = typeof ofTypeI18n;

src/bin/initialize-account-theme/src/single-page/KcContext.ts

@@ -1,7 +0,0 @@
-import type { KcContextLike } from "@keycloakify/keycloak-account-ui";
-import type { KcEnvName } from "../kc.gen";
-
-export type KcContext = KcContextLike & {
-    themeType: "account";
-    properties: Record<KcEnvName, string>;
-};

src/bin/initialize-account-theme/src/single-page/KcPage.tsx

@@ -1,11 +0,0 @@
-import { lazy } from "react";
-import { KcAccountUiLoader } from "@keycloakify/keycloak-account-ui";
-import type { KcContext } from "./KcContext";
-
-const KcAccountUi = lazy(() => import("@keycloakify/keycloak-account-ui/KcAccountUi"));
-
-export default function KcPage(props: { kcContext: KcContext }) {
-    const { kcContext } = props;
-
-    return <KcAccountUiLoader kcContext={kcContext} KcAccountUi={KcAccountUi} />;
-}

src/bin/initialize-account-theme/updateAccountThemeImplementationInConfig.ts

@@ -1,5 +1,5 @@
 import { join as pathJoin } from "path";
-import { assert, type Equals } from "tsafe/assert";
+import { assert, type Equals, is } from "tsafe/assert";
 import type { BuildContext } from "../shared/buildContext";
 import * as fs from "fs";
 import chalk from "chalk";
@@ -8,12 +8,14 @@ import { id } from "tsafe/id";
 
 export type BuildContextLike = {
     bundler: BuildContext["bundler"];
+    projectDirPath: string;
+    packageJsonFilePath: string;
 };
 
 assert<BuildContext extends BuildContextLike ? true : false>();
 
 export function updateAccountThemeImplementationInConfig(params: {
-    buildContext: BuildContext;
+    buildContext: BuildContextLike;
     accountThemeType: "Single-Page" | "Multi-Page";
 }) {
     const { buildContext, accountThemeType } = params;
@@ -60,14 +62,14 @@ export function updateAccountThemeImplementationInConfig(params: {
             {
                 const parsedPackageJson = (() => {
                     type ParsedPackageJson = {
-                        keycloakify: Record<string, string>;
+                        keycloakify: Record<string, unknown>;
                     };
 
                     const zParsedPackageJson = (() => {
                         type TargetType = ParsedPackageJson;
 
                         const zTargetType = z.object({
-                            keycloakify: z.record(z.string())
+                            keycloakify: z.record(z.unknown())
                         });
 
                         assert<Equals<z.infer<typeof zTargetType>, TargetType>>();
@@ -75,17 +77,24 @@ export function updateAccountThemeImplementationInConfig(params: {
                         return id<z.ZodType<TargetType>>(zTargetType);
                     })();
 
-                    return zParsedPackageJson.parse(
-                        JSON.parse(
-                            fs
-                                .readFileSync(buildContext.packageJsonFilePath)
-                                .toString("utf8")
-                        )
+                    const parsedPackageJson = JSON.parse(
+                        fs.readFileSync(buildContext.packageJsonFilePath).toString("utf8")
                     );
+
+                    zParsedPackageJson.parse(parsedPackageJson);
+
+                    assert(is<ParsedPackageJson>(parsedPackageJson));
+
+                    return parsedPackageJson;
                 })();
 
                 parsedPackageJson.keycloakify.accountThemeImplementation =
                     accountThemeType;
+
+                fs.writeFileSync(
+                    buildContext.packageJsonFilePath,
+                    Buffer.from(JSON.stringify(parsedPackageJson, undefined, 4), "utf8")
+                );
             }
             break;
     }

src/bin/initialize-admin-theme.ts

@@ -0,0 +1,39 @@
+import type { BuildContext } from "./shared/buildContext";
+import { maybeDelegateCommandToCustomHandler } from "./shared/customHandler_delegate";
+import { initializeSpa } from "./shared/initializeSpa";
+import { exitIfUncommittedChanges } from "./shared/exitIfUncommittedChanges";
+import { command as updateKcGenCommand } from "./update-kc-gen";
+
+export async function command(params: { buildContext: BuildContext }) {
+    const { buildContext } = params;
+
+    const { hasBeenHandled } = await maybeDelegateCommandToCustomHandler({
+        commandName: "initialize-admin-theme",
+        buildContext
+    });
+
+    if (hasBeenHandled) {
+        return;
+    }
+
+    exitIfUncommittedChanges({
+        projectDirPath: buildContext.projectDirPath
+    });
+
+    await initializeSpa({
+        themeType: "admin",
+        buildContext
+    });
+
+    await updateKcGenCommand({
+        buildContext: {
+            ...buildContext,
+            implementedThemeTypes: {
+                ...buildContext.implementedThemeTypes,
+                admin: {
+                    isImplemented: true
+                }
+            }
+        }
+    });
+}

src/bin/initialize-email-theme.ts

@@ -1,65 +1,156 @@
-import { downloadKeycloakDefaultTheme } from "./shared/downloadKeycloakDefaultTheme";
-import { join as pathJoin, relative as pathRelative } from "path";
-import { transformCodebase } from "./tools/transformCodebase";
-import { promptKeycloakVersion } from "./shared/promptKeycloakVersion";
-import { getBuildContext } from "./shared/buildContext";
+import type { BuildContext } from "./shared/buildContext";
+import cliSelect from "cli-select";
+import { maybeDelegateCommandToCustomHandler } from "./shared/customHandler_delegate";
+import { exitIfUncommittedChanges } from "./shared/exitIfUncommittedChanges";
+
+import { dirname as pathDirname, join as pathJoin, relative as pathRelative } from "path";
 import * as fs from "fs";
-import type { CliCommandOptions } from "./main";
+import { assert, is, type Equals } from "tsafe/assert";
+import { id } from "tsafe/id";
+import { addSyncExtensionsToPostinstallScript } from "./shared/addSyncExtensionsToPostinstallScript";
+import { getIsPrettierAvailable, runPrettier } from "./tools/runPrettier";
+import { npmInstall } from "./tools/npmInstall";
+import * as child_process from "child_process";
+import { z } from "zod";
+import chalk from "chalk";
 
-export async function command(params: { cliCommandOptions: CliCommandOptions }) {
-    const { cliCommandOptions } = params;
+export async function command(params: { buildContext: BuildContext }) {
+    const { buildContext } = params;
 
-    const buildContext = getBuildContext({ cliCommandOptions });
+    const { hasBeenHandled } = await maybeDelegateCommandToCustomHandler({
+        commandName: "initialize-email-theme",
+        buildContext
+    });
+
+    if (hasBeenHandled) {
+        return;
+    }
+
+    exitIfUncommittedChanges({
+        projectDirPath: buildContext.projectDirPath
+    });
 
     const emailThemeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, "email");
 
-    if (fs.existsSync(emailThemeSrcDirPath)) {
+    if (
+        fs.existsSync(emailThemeSrcDirPath) &&
+        fs.readdirSync(emailThemeSrcDirPath).length > 0
+    ) {
         console.warn(
-            `There is already a ${pathRelative(
-                process.cwd(),
-                emailThemeSrcDirPath
-            )} directory in your project. Aborting.`
+            chalk.red(
+                `There is already a ${pathRelative(
+                    process.cwd(),
+                    emailThemeSrcDirPath
+                )} directory in your project. Aborting.`
+            )
         );
 
         process.exit(-1);
     }
 
-    console.log("Initialize with the base email theme from which version of Keycloak?");
+    const { value: emailThemeType } = await cliSelect({
+        values: [
+            "native (FreeMarker)" as const,
+            "Another email templating solution" as const
+        ]
+    }).catch(() => {
+        process.exit(-1);
+    });
 
-    const { keycloakVersion } = await promptKeycloakVersion({
-        // NOTE: This is arbitrary
-        startingFromMajor: 17,
-        excludeMajorVersions: [],
+    if (emailThemeType === "Another email templating solution") {
+        console.log(
+            [
+                "There is currently no automated support for keycloakify-email, it has to be done manually, see documentation:",
+                "https://docs.keycloakify.dev/theme-types/email-theme"
+            ].join("\n")
+        );
+
+        process.exit(0);
+    }
+
+    const parsedPackageJson = (() => {
+        type ParsedPackageJson = {
+            scripts?: Record<string, string | undefined>;
+            dependencies?: Record<string, string | undefined>;
+            devDependencies?: Record<string, string | undefined>;
+        };
+
+        const zParsedPackageJson = (() => {
+            type TargetType = ParsedPackageJson;
+
+            const zTargetType = z.object({
+                scripts: z.record(z.union([z.string(), z.undefined()])).optional(),
+                dependencies: z.record(z.union([z.string(), z.undefined()])).optional(),
+                devDependencies: z.record(z.union([z.string(), z.undefined()])).optional()
+            });
+
+            assert<Equals<z.infer<typeof zTargetType>, TargetType>>;
+
+            return id<z.ZodType<TargetType>>(zTargetType);
+        })();
+        const parsedPackageJson = JSON.parse(
+            fs.readFileSync(buildContext.packageJsonFilePath).toString("utf8")
+        );
+
+        zParsedPackageJson.parse(parsedPackageJson);
+
+        assert(is<ParsedPackageJson>(parsedPackageJson));
+
+        return parsedPackageJson;
+    })();
+
+    addSyncExtensionsToPostinstallScript({
+        parsedPackageJson,
         buildContext
     });
 
-    const { defaultThemeDirPath } = await downloadKeycloakDefaultTheme({
-        keycloakVersion,
-        buildContext
-    });
+    const moduleName = `@keycloakify/email-native`;
 
-    transformCodebase({
-        srcDirPath: pathJoin(defaultThemeDirPath, "base", "email"),
-        destDirPath: emailThemeSrcDirPath
-    });
+    const [version] = ((): string[] => {
+        const cmdOutput = child_process
+            .execSync(`npm show ${moduleName} versions --json`)
+            .toString("utf8")
+            .trim();
+
+        const versions = JSON.parse(cmdOutput) as string | string[];
+
+        // NOTE: Bug in some older npm versions
+        if (typeof versions === "string") {
+            return [versions];
+        }
+
+        return versions;
+    })()
+        .reverse()
+        .filter(version => !version.includes("-"));
+
+    assert(version !== undefined);
+
+    (parsedPackageJson.dependencies ??= {})[moduleName] = `~${version}`;
+
+    if (parsedPackageJson.devDependencies !== undefined) {
+        delete parsedPackageJson.devDependencies[moduleName];
+    }
 
     {
-        const themePropertyFilePath = pathJoin(emailThemeSrcDirPath, "theme.properties");
+        let sourceCode = JSON.stringify(parsedPackageJson, undefined, 2);
+
+        if (await getIsPrettierAvailable()) {
+            sourceCode = await runPrettier({
+                sourceCode,
+                filePath: buildContext.packageJsonFilePath
+            });
+        }
 
         fs.writeFileSync(
-            themePropertyFilePath,
-            Buffer.from(
-                `parent=base\n${fs.readFileSync(themePropertyFilePath).toString("utf8")}`,
-                "utf8"
-            )
+            buildContext.packageJsonFilePath,
+            Buffer.from(sourceCode, "utf8")
         );
     }
 
-    console.log(
-        `The \`${pathJoin(
-            ".",
-            pathRelative(process.cwd(), emailThemeSrcDirPath)
-        )}\` directory have been created.`
-    );
-    console.log("You can delete any file you don't modify.");
+    await npmInstall({
+        packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath)
+    });
+
+    console.log(chalk.green("Email theme initialized."));
 }

src/bin/keycloakify/buildJars/buildJar.ts

@@ -7,7 +7,6 @@ import { join as pathJoin, dirname as pathDirname } from "path";
 import { transformCodebase } from "../../tools/transformCodebase";
 import type { BuildContext } from "../../shared/buildContext";
 import * as fs from "fs/promises";
-import { ACCOUNT_V1_THEME_NAME } from "../../shared/constants";
 import {
     generatePom,
     BuildContextLike as BuildContextLike_generatePom
@@ -16,7 +15,7 @@ import { readFileSync } from "fs";
 import { isInside } from "../../tools/isInside";
 import child_process from "child_process";
 import { rmSync } from "../../tools/fs.rmSync";
-import { writeMetaInfKeycloakThemes } from "../../shared/metaInfKeycloakThemes";
+import { existsAsync } from "../../tools/fs.existsAsync";
 
 export type BuildContextLike = BuildContextLike_generatePom & {
     keycloakifyBuildDirPath: string;
@@ -75,7 +74,7 @@ export async function buildJar(params: {
 
                       if (
                           isInside({
-                              dirPath: pathJoin("theme", ACCOUNT_V1_THEME_NAME),
+                              dirPath: pathJoin("theme", "account-v1"),
                               filePath: fileRelativePath
                           })
                       ) {
@@ -90,10 +89,7 @@ export async function buildJar(params: {
                               const modifiedSourceCode = Buffer.from(
                                   sourceCode
                                       .toString("utf8")
-                                      .replace(
-                                          `parent=${ACCOUNT_V1_THEME_NAME}`,
-                                          "parent=keycloak"
-                                      ),
+                                      .replace(`parent=account-v1`, "parent=keycloak"),
                                   "utf8"
                               );
 
@@ -109,29 +105,55 @@ export async function buildJar(params: {
                   }
     });
 
-    remove_account_v1_in_meta_inf: {
-        if (!doesImplementAccountV1Theme) {
-            // NOTE: We do not have account v1 anyway
-            break remove_account_v1_in_meta_inf;
-        }
+    {
+        const filePath = pathJoin(
+            tmpResourcesDirPath,
+            "META-INF",
+            "keycloak-themes.json"
+        );
 
-        if (keycloakAccountV1Version !== null) {
-            // NOTE: No, we need to keep account-v1 in meta-inf
-            break remove_account_v1_in_meta_inf;
-        }
+        await fs.mkdir(pathDirname(filePath));
 
-        writeMetaInfKeycloakThemes({
-            resourcesDirPath: tmpResourcesDirPath,
-            getNewMetaInfKeycloakTheme: ({ metaInfKeycloakTheme }) => {
-                assert(metaInfKeycloakTheme !== undefined);
+        await fs.writeFile(
+            filePath,
+            Buffer.from(
+                JSON.stringify(
+                    {
+                        themes: await (async () => {
+                            const dirPath = pathJoin(tmpResourcesDirPath, "theme");
 
-                metaInfKeycloakTheme.themes = metaInfKeycloakTheme.themes.filter(
-                    ({ name }) => name !== ACCOUNT_V1_THEME_NAME
-                );
+                            const themeNames = (await fs.readdir(dirPath)).sort(
+                                (a, b) => {
+                                    const indexA = buildContext.themeNames.indexOf(a);
+                                    const indexB = buildContext.themeNames.indexOf(b);
 
-                return metaInfKeycloakTheme;
-            }
-        });
+                                    const orderA = indexA === -1 ? Infinity : indexA;
+                                    const orderB = indexB === -1 ? Infinity : indexB;
+
+                                    return orderA - orderB;
+                                }
+                            );
+
+                            return Promise.all(
+                                themeNames.map(async themeName => {
+                                    const types = await fs.readdir(
+                                        pathJoin(dirPath, themeName)
+                                    );
+
+                                    return {
+                                        name: themeName,
+                                        types
+                                    };
+                                })
+                            );
+                        })()
+                    },
+                    null,
+                    2
+                ),
+                "utf8"
+            )
+        );
     }
 
     route_legacy_pages: {
@@ -139,59 +161,49 @@ export async function buildJar(params: {
             break route_legacy_pages;
         }
 
-        // NOTE: If there's no account theme there is no special target for keycloak 24 and up so we create
-        // the pages anyway. If there is an account pages, since we know that account-v1 is only support keycloak
-        // 24 in version 0.4 and up, we can safely break the route for legacy pages.
-        const doBreak: boolean = (() => {
-            switch (keycloakAccountV1Version) {
-                case null:
-                    return false;
-                case "0.3":
-                    return false;
-                default:
-                    return true;
-            }
-        })();
+        await Promise.all(
+            (["register.ftl", "login-update-profile.ftl"] as const)
+                .map(pageId =>
+                    buildContext.themeNames.map(async themeName => {
+                        const ftlFilePath = pathJoin(
+                            tmpResourcesDirPath,
+                            "theme",
+                            themeName,
+                            "login",
+                            pageId
+                        );
 
-        // TODO: Remove this optimization, it's a bit hacky.
-        if (doBreak) {
-            break route_legacy_pages;
-        }
+                        // NOTE: https://github.com/keycloakify/keycloakify/issues/665
+                        if (!(await existsAsync(ftlFilePath))) {
+                            return;
+                        }
 
-        (["register.ftl", "login-update-profile.ftl"] as const).forEach(pageId =>
-            buildContext.themeNames.map(themeName => {
-                const ftlFilePath = pathJoin(
-                    tmpResourcesDirPath,
-                    "theme",
-                    themeName,
-                    "login",
-                    pageId
-                );
+                        const ftlFileContent = readFileSync(ftlFilePath).toString("utf8");
 
-                const ftlFileContent = readFileSync(ftlFilePath).toString("utf8");
+                        const ftlFileBasename = (() => {
+                            switch (pageId) {
+                                case "register.ftl":
+                                    return "register-user-profile.ftl";
+                                case "login-update-profile.ftl":
+                                    return "update-user-profile.ftl";
+                            }
+                            assert<Equals<typeof pageId, never>>(false);
+                        })();
 
-                const ftlFileBasename = (() => {
-                    switch (pageId) {
-                        case "register.ftl":
-                            return "register-user-profile.ftl";
-                        case "login-update-profile.ftl":
-                            return "update-user-profile.ftl";
-                    }
-                    assert<Equals<typeof pageId, never>>(false);
-                })();
+                        const modifiedFtlFileContent = ftlFileContent.replace(
+                            `"ftlTemplateFileName": "${pageId}"`,
+                            `"ftlTemplateFileName": "${ftlFileBasename}"`
+                        );
 
-                const modifiedFtlFileContent = ftlFileContent.replace(
-                    `"ftlTemplateFileName": "${pageId}"`,
-                    `"ftlTemplateFileName": "${ftlFileBasename}"`
-                );
+                        assert(modifiedFtlFileContent !== ftlFileContent);
 
-                assert(modifiedFtlFileContent !== ftlFileContent);
-
-                fs.writeFile(
-                    pathJoin(pathDirname(ftlFilePath), ftlFileBasename),
-                    Buffer.from(modifiedFtlFileContent, "utf8")
-                );
-            })
+                        await fs.writeFile(
+                            pathJoin(pathDirname(ftlFilePath), ftlFileBasename),
+                            Buffer.from(modifiedFtlFileContent, "utf8")
+                        );
+                    })
+                )
+                .flat()
         );
     }
 
@@ -208,31 +220,39 @@ export async function buildJar(params: {
         );
     }
 
-    await new Promise<void>((resolve, reject) =>
-        child_process.exec(
-            `mvn install -Dmaven.repo.local="${pathJoin(keycloakifyBuildCacheDirPath, ".m2")}"`,
-            { cwd: keycloakifyBuildCacheDirPath },
-            error => {
-                if (error !== null) {
-                    console.error(
-                        `Build jar failed: ${JSON.stringify(
-                            {
-                                jarFileBasename,
-                                keycloakAccountV1Version,
-                                keycloakThemeAdditionalInfoExtensionVersion
-                            },
-                            null,
-                            2
-                        )}`
-                    );
+    {
+        const mvnBuildCmd = `mvn clean install -Dmaven.repo.local="${pathJoin(keycloakifyBuildCacheDirPath, ".m2")}"`;
 
-                    reject(error);
-                    return;
+        await new Promise<void>((resolve, reject) =>
+            child_process.exec(
+                mvnBuildCmd,
+                { cwd: keycloakifyBuildCacheDirPath },
+                error => {
+                    if (error !== null) {
+                        console.error(
+                            [
+                                `Build jar failed: ${JSON.stringify(
+                                    {
+                                        jarFileBasename,
+                                        keycloakAccountV1Version,
+                                        keycloakThemeAdditionalInfoExtensionVersion
+                                    },
+                                    null,
+                                    2
+                                )}`,
+                                "Try running the following command to debug the issue (you are probably under a restricted network and you need to configure your proxy):",
+                                `cd ${keycloakifyBuildCacheDirPath} && ${mvnBuildCmd}`
+                            ].join("\n")
+                        );
+
+                        reject(error);
+                        return;
+                    }
+                    resolve();
                 }
-                resolve();
-            }
-        )
-    );
+            )
+        );
+    }
 
     await fs.rename(
         pathJoin(

src/bin/keycloakify/buildJars/getKeycloakVersionRangeForJar.ts

@@ -52,9 +52,9 @@ export function getKeycloakVersionRangeForJar(params: {
                 case "0.6":
                     switch (keycloakThemeAdditionalInfoExtensionVersion) {
                         case null:
-                            return undefined;
+                            return "26-and-above" as const;
                         case "1.1.5":
-                            return "25-and-above" as const;
+                            return "25" as const;
                     }
             }
             assert<Equals<typeof keycloakAccountV1Version, never>>(false);
@@ -75,9 +75,9 @@ export function getKeycloakVersionRangeForJar(params: {
             }
             switch (keycloakThemeAdditionalInfoExtensionVersion) {
                 case null:
-                    return "21-and-below";
+                    return "all-other-versions";
                 case "1.1.5":
-                    return "22-and-above";
+                    return "22-to-25";
             }
             assert<Equals<typeof keycloakThemeAdditionalInfoExtensionVersion, never>>(
                 false

src/bin/keycloakify/generateFtl/generateFtl.ts

@@ -13,8 +13,8 @@ import type { BuildContext } from "../../shared/buildContext";
 import { assert } from "tsafe/assert";
 import {
     type ThemeType,
-    BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR,
-    RESOURCES_COMMON
+    WELL_KNOWN_DIRECTORY_BASE_NAME,
+    KEYCLOAKIFY_SPA_DEV_SERVER_PORT
 } from "../../shared/constants";
 import { getThisCodebaseRootDirPath } from "../../tools/getThisCodebaseRootDirPath";
 
@@ -94,7 +94,7 @@ export function generateFtlFilesCodeFactory(params: {
                         new RegExp(
                             `^${(buildContext.urlPathname ?? "/").replace(/\//g, "\\/")}`
                         ),
-                        `\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/`
+                        `\${xKeycloakify.resourcesPath}/${WELL_KNOWN_DIRECTORY_BASE_NAME.DIST}/`
                     )
                 );
             })
@@ -119,7 +119,8 @@ export function generateFtlFilesCodeFactory(params: {
         .replace("{{keycloakifyVersion}}", keycloakifyVersion)
         .replace("{{themeVersion}}", buildContext.themeVersion)
         .replace("{{fieldNames}}", fieldNames.map(name => `"${name}"`).join(", "))
-        .replace("{{RESOURCES_COMMON}}", RESOURCES_COMMON)
+        .replace("{{RESOURCES_COMMON}}", WELL_KNOWN_DIRECTORY_BASE_NAME.RESOURCES_COMMON)
+        .replace("{{KEYCLOAKIFY_SPA_DEV_SERVER_PORT}}", KEYCLOAKIFY_SPA_DEV_SERVER_PORT)
         .replace(
             "{{userDefinedExclusions}}",
             buildContext.kcContextExclusionsFtlCode ?? ""

src/bin/keycloakify/generateFtl/kcContextDeclarationTemplate.ftl

@@ -84,7 +84,61 @@ attributes_to_attributesByName: {
         kcContext.profile.attributesByName[attribute.name] = attribute;
     });
 }
+
+redirect_to_dev_server: {
+
+    switch(kcContext.themeType){
+        case "login":
+            break redirect_to_dev_server;
+        case "account":
+            if( kcContext.pageId !== "index.ftl" ){
+                break redirect_to_dev_server;
+            }
+            break;
+        case "admin":
+            break;
+        default: 
+            break redirect_to_dev_server;
+    }
+
+    const devSeverPort = kcContext.properties.{{KEYCLOAKIFY_SPA_DEV_SERVER_PORT}};
+
+    if( !devSeverPort ){
+        break redirect_to_dev_server;
+    }
+
+    const redirectUrl = new URL(window.location.href);
+
+    redirectUrl.port = devSeverPort;
+
+    delete kcContext.msgJSON;
+
+    console.log(kcContext);
+
+    redirectUrl.searchParams.set("kcContext", encodeURIComponent(JSON.stringify(kcContext)));
+
+    window.location.href = redirectUrl.toString();
+
+}
+
+
 window.kcContext = kcContext;
+
+
+<#if xKeycloakify.themeType == "login" >
+    {
+        const script = document.createElement("script");
+        script.type = "importmap";
+        script.textContent = JSON.stringify({
+          imports: {
+            "rfc4648": kcContext.url.resourcesCommonPath + "/node_modules/rfc4648/lib/rfc4648.js"
+          }
+        }, null, 2); 
+
+        document.head.appendChild(script);
+    }
+</#if>
+
 function decodeHtmlEntities(htmlStr){
     var element = decodeHtmlEntities.element;
     if (!element) {
@@ -136,7 +190,7 @@ function decodeHtmlEntities(htmlStr){
                     <#-- https://github.com/keycloakify/keycloakify/discussions/406#discussioncomment-7514787 -->
                     key == "loginAction" && 
                     areSamePath(path, ["url"]) && 
-                    ["saml-post-form.ftl", "error.ftl", "info.ftl", "login-oauth-grant.ftl", "logout-confirm.ftl", "login-oauth2-device-verify-user-code.ftl"]?seq_contains(xKeycloakify.pageId) &&
+                    ["saml-post-form.ftl", "error.ftl", "info.ftl", "login-oauth-grant.ftl", "logout-confirm.ftl", "login-oauth2-device-verify-user-code.ftl", "frontchannel-logout.ftl"]?seq_contains(xKeycloakify.pageId) &&
                     !(auth?has_content && auth.showTryAnotherWayLink())
                 ) || (
                     <#-- https://github.com/keycloakify/keycloakify/issues/362 -->
@@ -151,7 +205,7 @@ function decodeHtmlEntities(htmlStr){
                     areSamePath(path, []) &&
                     ["login-idp-link-confirm.ftl", "login-idp-link-email.ftl" ]?seq_contains(xKeycloakify.pageId)
                 ) ||  (
-                    ["masterAdminClient", "delegateForUpdate", "defaultRole"]?seq_contains(key) &&
+                    ["masterAdminClient", "delegateForUpdate", "defaultRole", "smtpConfig"]?seq_contains(key) &&
                     areSamePath(path, ["realm"])
                 ) || (
                     xKeycloakify.pageId == "error.ftl" &&
@@ -220,6 +274,9 @@ function decodeHtmlEntities(htmlStr){
                         "identityFederationEnabled",
                         "userManagedAccessAllowed"
                     ]?seq_contains(key)
+                ) || (
+                    ["flowContext", "session", "realm"]?seq_contains(key) &&
+                    areSamePath(path, ["social"])
                 )
             >
                 <#-- <#local outSeq += ["/*" + path?join(".") + "." + key + " excluded*/"]> -->

src/bin/keycloakify/generateResources/bringInAccountV1.ts

@@ -1,89 +0,0 @@
-import * as fs from "fs";
-import { join as pathJoin } from "path";
-import { assert } from "tsafe/assert";
-import type { BuildContext } from "../../shared/buildContext";
-import {
-    RESOURCES_COMMON,
-    LAST_KEYCLOAK_VERSION_WITH_ACCOUNT_V1,
-    ACCOUNT_V1_THEME_NAME
-} from "../../shared/constants";
-import {
-    downloadKeycloakDefaultTheme,
-    BuildContextLike as BuildContextLike_downloadKeycloakDefaultTheme
-} from "../../shared/downloadKeycloakDefaultTheme";
-import { transformCodebase } from "../../tools/transformCodebase";
-
-export type BuildContextLike = BuildContextLike_downloadKeycloakDefaultTheme;
-
-assert<BuildContext extends BuildContextLike ? true : false>();
-
-export async function bringInAccountV1(params: {
-    resourcesDirPath: string;
-    buildContext: BuildContextLike;
-}) {
-    const { resourcesDirPath, buildContext } = params;
-
-    const { defaultThemeDirPath } = await downloadKeycloakDefaultTheme({
-        keycloakVersion: LAST_KEYCLOAK_VERSION_WITH_ACCOUNT_V1,
-        buildContext
-    });
-
-    const accountV1DirPath = pathJoin(
-        resourcesDirPath,
-        "theme",
-        ACCOUNT_V1_THEME_NAME,
-        "account"
-    );
-
-    transformCodebase({
-        srcDirPath: pathJoin(defaultThemeDirPath, "base", "account"),
-        destDirPath: accountV1DirPath
-    });
-
-    transformCodebase({
-        srcDirPath: pathJoin(defaultThemeDirPath, "keycloak", "account", "resources"),
-        destDirPath: pathJoin(accountV1DirPath, "resources")
-    });
-
-    transformCodebase({
-        srcDirPath: pathJoin(defaultThemeDirPath, "keycloak", "common", "resources"),
-        destDirPath: pathJoin(accountV1DirPath, "resources", RESOURCES_COMMON)
-    });
-
-    fs.writeFileSync(
-        pathJoin(accountV1DirPath, "theme.properties"),
-        Buffer.from(
-            [
-                "accountResourceProvider=account-v1",
-                "",
-                "locales=ar,ca,cs,da,de,en,es,fr,fi,hu,it,ja,lt,nl,no,pl,pt-BR,ru,sk,sv,tr,zh-CN",
-                "",
-                "styles=" +
-                    [
-                        "css/account.css",
-                        "img/icon-sidebar-active.png",
-                        "img/logo.png",
-                        ...[
-                            "patternfly.min.css",
-                            "patternfly-additions.min.css",
-                            "patternfly-additions.min.css"
-                        ].map(
-                            fileBasename =>
-                                `${RESOURCES_COMMON}/node_modules/patternfly/dist/css/${fileBasename}`
-                        )
-                    ].join(" "),
-                "",
-                "##### css classes for form buttons",
-                "# main class used for all buttons",
-                "kcButtonClass=btn",
-                "# classes defining priority of the button - primary or default (there is typically only one priority button for the form)",
-                "kcButtonPrimaryClass=btn-primary",
-                "kcButtonDefaultClass=btn-default",
-                "# classes defining size of the button",
-                "kcButtonLargeClass=btn-lg",
-                ""
-            ].join("\n"),
-            "utf8"
-        )
-    );
-}

src/bin/keycloakify/generateResources/generateMessageProperties.ts

@@ -1,6 +1,6 @@
 import { type ThemeType, FALLBACK_LANGUAGE_TAG } from "../../shared/constants";
 import { crawl } from "../../tools/crawl";
-import { join as pathJoin } from "path";
+import { join as pathJoin, dirname as pathDirname } from "path";
 import { symToStr } from "tsafe/symToStr";
 import * as recast from "recast";
 import * as babelParser from "@babel/parser";
@@ -10,12 +10,27 @@ import { escapeStringForPropertiesFile } from "../../tools/escapeStringForProper
 import { getThisCodebaseRootDirPath } from "../../tools/getThisCodebaseRootDirPath";
 import * as fs from "fs";
 import { assert } from "tsafe/assert";
+import type { BuildContext } from "../../shared/buildContext";
+import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath";
+
+export type BuildContextLike = {
+    themeNames: string[];
+    themeSrcDirPath: string;
+};
+
+assert<BuildContext extends BuildContextLike ? true : false>();
 
 export function generateMessageProperties(params: {
-    themeSrcDirPath: string;
-    themeType: ThemeType;
-}): { languageTag: string; propertiesFileSource: string }[] {
-    const { themeSrcDirPath, themeType } = params;
+    buildContext: BuildContextLike;
+    themeType: Exclude<ThemeType, "admin">;
+}): {
+    languageTags: string[];
+    writeMessagePropertiesFiles: (params: {
+        messageDirPath: string;
+        themeName: string;
+    }) => void;
+} {
+    const { buildContext, themeType } = params;
 
     const baseMessagesDirPath = pathJoin(
         getThisCodebaseRootDirPath(),
@@ -25,51 +40,49 @@ export function generateMessageProperties(params: {
         "messages_defaultSet"
     );
 
-    const baseMessageBundle: { [languageTag: string]: Record<string, string> } =
-        Object.fromEntries(
-            fs
-                .readdirSync(baseMessagesDirPath)
-                .filter(baseName => baseName !== "index.ts")
-                .map(basename => ({
-                    languageTag: basename.replace(/\.ts$/, ""),
-                    filePath: pathJoin(baseMessagesDirPath, basename)
-                }))
-                .map(({ languageTag, filePath }) => {
-                    const lines = fs
-                        .readFileSync(filePath)
-                        .toString("utf8")
-                        .split(/\r?\n/);
+    const messages_defaultSet_by_languageTag_defaultSet: {
+        [languageTag_defaultSet: string]: Record<string, string>;
+    } = Object.fromEntries(
+        fs
+            .readdirSync(baseMessagesDirPath)
+            .filter(basename => basename !== "index.ts" && basename !== "types.ts")
+            .map(basename => ({
+                languageTag: basename.replace(/\.ts$/, ""),
+                filePath: pathJoin(baseMessagesDirPath, basename)
+            }))
+            .map(({ languageTag, filePath }) => {
+                const lines = fs.readFileSync(filePath).toString("utf8").split(/\r?\n/);
 
-                    let messagesJson = "{";
+                let messagesJson = "{";
 
-                    let isInDeclaration = false;
+                let isInDeclaration = false;
 
-                    for (const line of lines) {
-                        if (!isInDeclaration) {
-                            if (line.startsWith("const messages")) {
-                                isInDeclaration = true;
-                            }
-
-                            continue;
+                for (const line of lines) {
+                    if (!isInDeclaration) {
+                        if (line.startsWith("const messages")) {
+                            isInDeclaration = true;
                         }
 
-                        if (line.startsWith("}")) {
-                            messagesJson += "}";
-                            break;
-                        }
-
-                        messagesJson += line;
+                        continue;
                     }
 
-                    const messages = JSON.parse(messagesJson) as Record<string, string>;
+                    if (line.startsWith("}")) {
+                        messagesJson += "}";
+                        break;
+                    }
 
-                    return [languageTag, messages];
-                })
-        );
+                    messagesJson += line;
+                }
+
+                const messages = JSON.parse(messagesJson) as Record<string, string>;
+
+                return [languageTag, messages];
+            })
+    );
 
     const { i18nTsFilePath } = (() => {
         let files = crawl({
-            dirPath: pathJoin(themeSrcDirPath, themeType),
+            dirPath: pathJoin(buildContext.themeSrcDirPath, themeType),
             returnedPathsType: "absolute"
         });
 
@@ -88,7 +101,7 @@ export function generateMessageProperties(params: {
         files = files.sort((a, b) => a.length - b.length);
 
         files = files.filter(file =>
-            fs.readFileSync(file).toString("utf8").includes("createUseI18n(")
+            fs.readFileSync(file).toString("utf8").includes("i18nBuilder")
         );
 
         const i18nTsFilePath: string | undefined = files[0];
@@ -96,97 +109,334 @@ export function generateMessageProperties(params: {
         return { i18nTsFilePath };
     })();
 
-    const messageBundle: { [languageTag: string]: Record<string, string> } | undefined =
-        (() => {
-            if (i18nTsFilePath === undefined) {
-                return undefined;
-            }
+    const i18nTsRoot = (() => {
+        if (i18nTsFilePath === undefined) {
+            return undefined;
+        }
+        const root = recastParseTs(i18nTsFilePath);
+        return root;
+    })();
 
-            const root = recast.parse(fs.readFileSync(i18nTsFilePath).toString("utf8"), {
-                parser: {
-                    parse: (code: string) =>
-                        babelParser.parse(code, {
-                            sourceType: "module",
-                            plugins: ["typescript"]
-                        }),
-                    generator: babelGenerate,
-                    types: babelTypes
-                }
-            });
+    const messages_defaultSet_by_languageTag_notInDefaultSet:
+        | { [languageTag_notInDefaultSet: string]: Record<string, string> }
+        | undefined = (() => {
+        if (i18nTsRoot === undefined) {
+            return undefined;
+        }
 
-            let messageBundleDeclarationTsCode: string | undefined = undefined;
+        let extraLanguageEntryByLanguageTag: Record<
+            string,
+            { label: string; path: string }
+        > = {};
 
-            recast.visit(root, {
-                visitCallExpression: function (path) {
-                    if (
-                        path.node.callee.type === "Identifier" &&
-                        path.node.callee.name === "createUseI18n"
-                    ) {
-                        messageBundleDeclarationTsCode = babelGenerate(
-                            path.node.arguments[0] as any
-                        ).code;
-                        return false;
+        recast.visit(i18nTsRoot, {
+            visitCallExpression: function (path) {
+                const node = path.node;
+
+                // Check if the callee is a MemberExpression with property 'withExtraLanguages'
+                if (
+                    node.callee.type === "MemberExpression" &&
+                    node.callee.property.type === "Identifier" &&
+                    node.callee.property.name === "withExtraLanguages"
+                ) {
+                    const arg = node.arguments[0];
+                    if (arg && arg.type === "ObjectExpression") {
+                        // Iterate over the properties of the object
+                        arg.properties.forEach(prop => {
+                            if (
+                                prop.type === "ObjectProperty" &&
+                                prop.key.type === "Identifier"
+                            ) {
+                                const lang = prop.key.name;
+                                const value = prop.value;
+
+                                if (value.type === "ObjectExpression") {
+                                    let label: string | undefined = undefined;
+                                    let pathStr: string | undefined = undefined;
+
+                                    // Iterate over the properties of the language object
+                                    value.properties.forEach(p => {
+                                        if (
+                                            p.type === "ObjectProperty" &&
+                                            p.key.type === "Identifier"
+                                        ) {
+                                            if (
+                                                p.key.name === "label" &&
+                                                p.value.type === "StringLiteral"
+                                            ) {
+                                                label = p.value.value;
+                                            }
+                                            if (
+                                                p.key.name === "getMessages" &&
+                                                (p.value.type ===
+                                                    "ArrowFunctionExpression" ||
+                                                    p.value.type === "FunctionExpression")
+                                            ) {
+                                                // Extract the import path from the function body
+                                                const body = p.value.body;
+                                                if (
+                                                    body.type === "CallExpression" &&
+                                                    body.callee.type === "Import"
+                                                ) {
+                                                    const importArg = body.arguments[0];
+                                                    if (
+                                                        importArg.type === "StringLiteral"
+                                                    ) {
+                                                        pathStr = importArg.value;
+                                                    }
+                                                } else if (
+                                                    body.type === "BlockStatement"
+                                                ) {
+                                                    // If the function body is a block (e.g., function with braces {})
+                                                    // Look for return statement
+                                                    body.body.forEach(statement => {
+                                                        if (
+                                                            statement.type ===
+                                                                "ReturnStatement" &&
+                                                            statement.argument &&
+                                                            statement.argument.type ===
+                                                                "CallExpression" &&
+                                                            statement.argument.callee
+                                                                .type === "Import"
+                                                        ) {
+                                                            const importArg =
+                                                                statement.argument
+                                                                    .arguments[0];
+                                                            if (
+                                                                importArg.type ===
+                                                                "StringLiteral"
+                                                            ) {
+                                                                pathStr = importArg.value;
+                                                            }
+                                                        }
+                                                    });
+                                                }
+                                            }
+                                        }
+                                    });
+
+                                    if (label && pathStr) {
+                                        extraLanguageEntryByLanguageTag[lang] = {
+                                            label,
+                                            path: pathStr
+                                        };
+                                    }
+                                }
+                            }
+                        });
                     }
 
-                    this.traverse(path);
+                    return false; // Stop traversing this path
                 }
-            });
 
-            assert(messageBundleDeclarationTsCode !== undefined);
-
-            let messageBundle: {
-                [languageTag: string]: Record<string, string>;
-            } = {};
-
-            try {
-                eval(
-                    `${symToStr({ messageBundle })} = ${messageBundleDeclarationTsCode}`
-                );
-            } catch {
-                console.warn(
-                    [
-                        "WARNING: Make sure the messageBundle your provided as argument of createUseI18n can be statically evaluated.",
-                        "This is important because we need to put your i18n messages in messages_*.properties files",
-                        "or they won't be available server side.",
-                        "\n",
-                        "The following code could not be evaluated:",
-                        "\n",
-                        messageBundleDeclarationTsCode
-                    ].join(" ")
-                );
+                this.traverse(path); // Continue traversing other paths
             }
+        });
 
-            return messageBundle;
-        })();
+        const messages_defaultSet_by_languageTag_notInDefaultSet = Object.fromEntries(
+            Object.entries(extraLanguageEntryByLanguageTag).map(
+                ([languageTag, { path: relativePathWithoutExt }]) => [
+                    languageTag,
+                    (() => {
+                        const filePath = getAbsoluteAndInOsFormatPath({
+                            pathIsh: relativePathWithoutExt.endsWith(".ts")
+                                ? relativePathWithoutExt
+                                : `${relativePathWithoutExt}.ts`,
+                            cwd: pathDirname(i18nTsFilePath)
+                        });
 
-    const mergedMessageBundle: { [languageTag: string]: Record<string, string> } =
-        Object.fromEntries(
-            Object.entries(baseMessageBundle).map(([languageTag, messages]) => [
-                languageTag,
-                {
-                    ...messages,
-                    ...(messageBundle === undefined
-                        ? {}
-                        : messageBundle[languageTag] ??
-                          messageBundle[FALLBACK_LANGUAGE_TAG] ??
-                          messageBundle[Object.keys(messageBundle)[0]] ??
-                          {})
-                }
-            ])
+                        const root = recastParseTs(filePath);
+
+                        let declarationCode: string | undefined = "";
+
+                        recast.visit(root, {
+                            visitVariableDeclarator: function (path) {
+                                const node = path.node;
+
+                                // Check if the variable name is 'messages'
+                                if (
+                                    node.id.type === "Identifier" &&
+                                    node.id.name === "messages"
+                                ) {
+                                    // Ensure there is an initializer
+                                    if (node.init) {
+                                        // Generate code from the initializer, preserving comments
+                                        declarationCode = recast
+                                            .print(node.init)
+                                            .code.replace(/}.*$/, "}");
+                                    }
+                                    return false; // Stop traversing this path
+                                }
+
+                                this.traverse(path); // Continue traversing other paths
+                            }
+                        });
+
+                        assert(
+                            declarationCode !== undefined,
+                            `${filePath} does not contain a 'messages' variable declaration`
+                        );
+
+                        let messages: Record<string, string> = {};
+
+                        try {
+                            eval(`${symToStr({ messages })} = ${declarationCode};`);
+                        } catch {
+                            throw new Error(
+                                `The declaration of 'message' in ${filePath} cannot be statically evaluated: ${declarationCode}`
+                            );
+                        }
+
+                        return messages;
+                    })()
+                ]
+            )
         );
 
-    const messageProperties: { languageTag: string; propertiesFileSource: string }[] =
-        Object.entries(mergedMessageBundle).map(([languageTag, messages]) => ({
-            languageTag,
-            propertiesFileSource: [
-                "",
-                ...(themeType !== "account" ? ["parent=base"] : []),
-                ...Object.entries(messages).map(
-                    ([key, value]) => `${key}=${escapeStringForPropertiesFile(value)}`
-                ),
-                ""
-            ].join("\n")
-        }));
+        return messages_defaultSet_by_languageTag_notInDefaultSet;
+    })();
 
-    return messageProperties;
+    const messages_defaultSet_by_languageTag = {
+        ...messages_defaultSet_by_languageTag_defaultSet,
+        ...messages_defaultSet_by_languageTag_notInDefaultSet
+    };
+
+    const messages_themeDefined_by_languageTag:
+        | {
+              [languageTag: string]:
+                  | Record<string, string | Record<string, string>>
+                  | undefined;
+          }
+        | undefined = (() => {
+        if (i18nTsRoot === undefined) {
+            return undefined;
+        }
+
+        let firstArgumentCode: string | undefined = undefined;
+
+        recast.visit(i18nTsRoot, {
+            visitCallExpression: function (path) {
+                const node = path.node;
+
+                if (
+                    node.callee.type === "MemberExpression" &&
+                    node.callee.property.type === "Identifier" &&
+                    node.callee.property.name === "withCustomTranslations"
+                ) {
+                    firstArgumentCode = babelGenerate(node.arguments[0] as any).code;
+                    return false;
+                }
+
+                this.traverse(path);
+            }
+        });
+
+        if (firstArgumentCode === undefined) {
+            return undefined;
+        }
+
+        let messages_themeDefined_by_languageTag: {
+            [languageTag: string]: Record<string, string | Record<string, string>>;
+        } = {};
+
+        try {
+            eval(
+                `${symToStr({ messages_themeDefined_by_languageTag })} = ${firstArgumentCode}`
+            );
+        } catch {
+            console.warn(
+                [
+                    "WARNING: The argument of withCustomTranslations can't be statically evaluated!",
+                    "This needs to be fixed refer to the documentation: https://docs.keycloakify.dev/i18n",
+                    firstArgumentCode
+                ].join(" ")
+            );
+            return undefined;
+        }
+
+        return messages_themeDefined_by_languageTag;
+    })();
+
+    const languageTags = Object.keys(messages_defaultSet_by_languageTag);
+
+    return {
+        languageTags,
+        writeMessagePropertiesFiles: ({ messageDirPath, themeName }) => {
+            for (const languageTag of languageTags) {
+                const messages = {
+                    ...messages_defaultSet_by_languageTag[languageTag]
+                };
+
+                add_theme_defined_messages: {
+                    if (messages_themeDefined_by_languageTag === undefined) {
+                        break add_theme_defined_messages;
+                    }
+
+                    let messages_themeDefined =
+                        messages_themeDefined_by_languageTag[languageTag];
+
+                    if (messages_themeDefined === undefined) {
+                        messages_themeDefined =
+                            messages_themeDefined_by_languageTag[FALLBACK_LANGUAGE_TAG];
+                    }
+                    if (messages_themeDefined === undefined) {
+                        messages_themeDefined =
+                            messages_themeDefined_by_languageTag[
+                                Object.keys(messages_themeDefined_by_languageTag)[0]
+                            ];
+                    }
+                    if (messages_themeDefined === undefined) {
+                        break add_theme_defined_messages;
+                    }
+
+                    for (const [key, messageOrMessageByThemeName] of Object.entries(
+                        messages_themeDefined
+                    )) {
+                        const message = (() => {
+                            if (typeof messageOrMessageByThemeName === "string") {
+                                return messageOrMessageByThemeName;
+                            }
+
+                            const message = messageOrMessageByThemeName[themeName];
+
+                            assert(message !== undefined);
+
+                            return message;
+                        })();
+
+                        messages[key] = message;
+                    }
+                }
+
+                const propertiesFileSource = [
+                    "",
+                    ...Object.entries(messages).map(
+                        ([key, value]) => `${key}=${escapeStringForPropertiesFile(value)}`
+                    ),
+                    ""
+                ].join("\n");
+
+                fs.mkdirSync(messageDirPath, { recursive: true });
+
+                fs.writeFileSync(
+                    pathJoin(messageDirPath, `messages_${languageTag}.properties`),
+                    Buffer.from(propertiesFileSource, "utf8")
+                );
+            }
+        }
+    };
+}
+
+function recastParseTs(filePath: string): recast.types.ASTNode {
+    return recast.parse(fs.readFileSync(filePath).toString("utf8"), {
+        parser: {
+            parse: (code: string) =>
+                babelParser.parse(code, {
+                    sourceType: "module",
+                    plugins: ["typescript"]
+                }),
+            generator: babelGenerate,
+            types: babelTypes
+        }
+    });
 }

src/bin/keycloakify/generateResources/generateResources.ts

@@ -1,16 +1,55 @@
 import type { BuildContext } from "../../shared/buildContext";
-import { assert } from "tsafe/assert";
-import {
-    generateResourcesForMainTheme,
-    type BuildContextLike as BuildContextLike_generateResourcesForMainTheme
-} from "./generateResourcesForMainTheme";
-import { generateResourcesForThemeVariant } from "./generateResourcesForThemeVariant";
 import fs from "fs";
 import { rmSync } from "../../tools/fs.rmSync";
+import { transformCodebase } from "../../tools/transformCodebase";
+import {
+    join as pathJoin,
+    relative as pathRelative,
+    dirname as pathDirname,
+    basename as pathBasename
+} from "path";
+import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode";
+import { replaceImportsInCssCode } from "../replacers/replaceImportsInCssCode";
+import {
+    generateFtlFilesCodeFactory,
+    type BuildContextLike as BuildContextLike_kcContextExclusionsFtlCode
+} from "../generateFtl";
+import {
+    type ThemeType,
+    LOGIN_THEME_PAGE_IDS,
+    ACCOUNT_THEME_PAGE_IDS,
+    WELL_KNOWN_DIRECTORY_BASE_NAME,
+    THEME_TYPES,
+    KEYCLOAKIFY_SPA_DEV_SERVER_PORT
+} from "../../shared/constants";
+import { assert, type Equals } from "tsafe/assert";
+import { readFieldNameUsage } from "./readFieldNameUsage";
+import { readExtraPagesNames } from "./readExtraPageNames";
+import {
+    generateMessageProperties,
+    type BuildContextLike as BuildContextLike_generateMessageProperties
+} from "./generateMessageProperties";
+import { readThisNpmPackageVersion } from "../../tools/readThisNpmPackageVersion";
+import { escapeStringForPropertiesFile } from "../../tools/escapeStringForPropertiesFile";
+import { getThisCodebaseRootDirPath } from "../../tools/getThisCodebaseRootDirPath";
+import propertiesParser from "properties-parser";
+import { createObjectThatThrowsIfAccessed } from "../../tools/createObjectThatThrowsIfAccessed";
+import { listInstalledModules } from "../../tools/listInstalledModules";
+import { isInside } from "../../tools/isInside";
+import { id } from "tsafe/id";
 
-export type BuildContextLike = BuildContextLike_generateResourcesForMainTheme & {
-    themeNames: string[];
-};
+export type BuildContextLike = BuildContextLike_kcContextExclusionsFtlCode &
+    BuildContextLike_generateMessageProperties & {
+        themeNames: string[];
+        extraThemeProperties: string[] | undefined;
+        projectDirPath: string;
+        projectBuildDirPath: string;
+        environmentVariables: { name: string; default: string }[];
+        implementedThemeTypes: BuildContext["implementedThemeTypes"];
+        themeSrcDirPath: string;
+        bundler: "vite" | "webpack";
+        packageJsonFilePath: string;
+    };
 
 assert<BuildContext extends BuildContextLike ? true : false>();
 
@@ -18,25 +57,700 @@ export async function generateResources(params: {
     buildContext: BuildContextLike;
     resourcesDirPath: string;
 }): Promise<void> {
+    const start = Date.now();
+
     const { resourcesDirPath, buildContext } = params;
 
-    const [themeName, ...themeVariantNames] = buildContext.themeNames;
+    const [themeName] = buildContext.themeNames;
 
     if (fs.existsSync(resourcesDirPath)) {
         rmSync(resourcesDirPath, { recursive: true });
     }
 
-    await generateResourcesForMainTheme({
-        resourcesDirPath,
-        themeName,
-        buildContext
-    });
+    const getThemeTypeDirPath = (params: {
+        themeType: ThemeType | "email";
+        themeName: string;
+    }) => {
+        const { themeType, themeName } = params;
+        return pathJoin(resourcesDirPath, "theme", themeName, themeType);
+    };
 
-    for (const themeVariantName of themeVariantNames) {
-        generateResourcesForThemeVariant({
-            resourcesDirPath,
-            themeName,
-            themeVariantName
-        });
+    const writeMessagePropertiesFilesByThemeType: Partial<
+        Record<
+            ThemeType | "email",
+            (params: { messageDirPath: string; themeName: string }) => void
+        >
+    > = {};
+
+    for (const themeType of [...THEME_TYPES, "email"] as const) {
+        let isNative: boolean;
+
+        {
+            const v = buildContext.implementedThemeTypes[themeType];
+
+            if (!v.isImplemented && !v.isImplemented_native) {
+                continue;
+            }
+
+            isNative = !v.isImplemented && v.isImplemented_native;
+        }
+
+        const getAccountThemeType = () => {
+            assert(themeType === "account");
+
+            assert(buildContext.implementedThemeTypes.account.isImplemented);
+
+            return buildContext.implementedThemeTypes.account.type;
+        };
+
+        const isSpa = (() => {
+            switch (themeType) {
+                case "login":
+                    return false;
+                case "account":
+                    return getAccountThemeType() === "Single-Page";
+                case "admin":
+                    return true;
+                case "email":
+                    return false;
+            }
+        })();
+
+        const themeTypeDirPath = getThemeTypeDirPath({ themeName, themeType });
+
+        apply_replacers_and_move_to_theme_resources: {
+            if (isNative) {
+                break apply_replacers_and_move_to_theme_resources;
+            }
+
+            const destDirPath = pathJoin(
+                themeTypeDirPath,
+                "resources",
+                WELL_KNOWN_DIRECTORY_BASE_NAME.DIST
+            );
+
+            // NOTE: Prevent accumulation of files in the assets dir, as names are hashed they pile up.
+            rmSync(destDirPath, { recursive: true, force: true });
+
+            if (
+                themeType !== "login" &&
+                buildContext.implementedThemeTypes.login.isImplemented
+            ) {
+                // NOTE: We prevent doing it twice, it has been done for the login theme.
+
+                transformCodebase({
+                    srcDirPath: pathJoin(
+                        getThemeTypeDirPath({
+                            themeName,
+                            themeType: "login"
+                        }),
+                        "resources",
+                        WELL_KNOWN_DIRECTORY_BASE_NAME.DIST
+                    ),
+                    destDirPath
+                });
+
+                break apply_replacers_and_move_to_theme_resources;
+            }
+
+            {
+                const dirPath = pathJoin(
+                    buildContext.projectBuildDirPath,
+                    WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES
+                );
+
+                if (fs.existsSync(dirPath)) {
+                    assert(buildContext.bundler === "webpack");
+
+                    throw new Error(
+                        [
+                            `Keycloakify build error: The ${WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES} directory shouldn't exist in your build directory.`,
+                            `(${pathRelative(process.cwd(), dirPath)}).\n`,
+                            `Theses assets are only required for local development with Storybook.",
+                            "Please remove this directory as an additional step of your command.\n`,
+                            `For example: \`"build": "... && rimraf ${pathRelative(buildContext.projectDirPath, dirPath)}"\``
+                        ].join(" ")
+                    );
+                }
+            }
+
+            transformCodebase({
+                srcDirPath: buildContext.projectBuildDirPath,
+                destDirPath,
+                transformSourceCode: ({ filePath, fileRelativePath, sourceCode }) => {
+                    if (filePath.endsWith(".css")) {
+                        const { fixedCssCode } = replaceImportsInCssCode({
+                            cssCode: sourceCode.toString("utf8"),
+                            cssFileRelativeDirPath: pathDirname(fileRelativePath),
+                            buildContext
+                        });
+
+                        return {
+                            modifiedSourceCode: Buffer.from(fixedCssCode, "utf8")
+                        };
+                    }
+
+                    if (filePath.endsWith(".js")) {
+                        const { fixedJsCode } = replaceImportsInJsCode({
+                            jsCode: sourceCode.toString("utf8"),
+                            buildContext
+                        });
+
+                        return {
+                            modifiedSourceCode: Buffer.from(fixedJsCode, "utf8")
+                        };
+                    }
+
+                    return { modifiedSourceCode: sourceCode };
+                }
+            });
+        }
+
+        generate_ftl_files: {
+            if (isNative) {
+                break generate_ftl_files;
+            }
+
+            assert(themeType !== "email");
+
+            const { generateFtlFilesCode } = generateFtlFilesCodeFactory({
+                themeName,
+                indexHtmlCode: fs
+                    .readFileSync(
+                        pathJoin(buildContext.projectBuildDirPath, "index.html")
+                    )
+                    .toString("utf8"),
+                buildContext,
+                keycloakifyVersion: readThisNpmPackageVersion(),
+                themeType,
+                fieldNames: isSpa
+                    ? []
+                    : (assert(themeType !== "admin"),
+                      readFieldNameUsage({
+                          themeSrcDirPath: buildContext.themeSrcDirPath,
+                          themeType
+                      }))
+            });
+
+            [
+                ...(() => {
+                    switch (themeType) {
+                        case "login":
+                            return LOGIN_THEME_PAGE_IDS;
+                        case "account":
+                            return getAccountThemeType() === "Single-Page"
+                                ? ["index.ftl"]
+                                : ACCOUNT_THEME_PAGE_IDS;
+                        case "admin":
+                            return ["index.ftl"];
+                    }
+                })(),
+                ...(isSpa
+                    ? []
+                    : readExtraPagesNames({
+                          themeType,
+                          themeSrcDirPath: buildContext.themeSrcDirPath
+                      }))
+            ].forEach(pageId => {
+                const { ftlCode } = generateFtlFilesCode({ pageId });
+
+                fs.writeFileSync(
+                    pathJoin(themeTypeDirPath, pageId),
+                    Buffer.from(ftlCode, "utf8")
+                );
+            });
+        }
+
+        copy_native_theme: {
+            if (!isNative) {
+                break copy_native_theme;
+            }
+
+            const dirPath = pathJoin(buildContext.themeSrcDirPath, themeType);
+
+            transformCodebase({
+                srcDirPath: dirPath,
+                destDirPath: getThemeTypeDirPath({ themeName, themeType }),
+                transformSourceCode: ({ fileRelativePath, sourceCode }) => {
+                    if (isInside({ dirPath: "messages", filePath: fileRelativePath })) {
+                        return undefined;
+                    }
+
+                    return { modifiedSourceCode: sourceCode };
+                }
+            });
+        }
+
+        let languageTags: string[] | undefined = undefined;
+
+        i18n_multi_page: {
+            if (isNative) {
+                break i18n_multi_page;
+            }
+
+            if (isSpa) {
+                break i18n_multi_page;
+            }
+
+            assert(themeType !== "admin" && themeType !== "email");
+
+            const wrap = generateMessageProperties({
+                buildContext,
+                themeType
+            });
+
+            languageTags = wrap.languageTags;
+            const { writeMessagePropertiesFiles } = wrap;
+
+            writeMessagePropertiesFilesByThemeType[themeType] =
+                writeMessagePropertiesFiles;
+        }
+
+        let isLegacyAccountSpa = false;
+
+        // NOTE: Eventually remove this block.
+        i18n_single_page_account_legacy: {
+            if (!isSpa) {
+                break i18n_single_page_account_legacy;
+            }
+
+            if (themeType !== "account") {
+                break i18n_single_page_account_legacy;
+            }
+
+            const [moduleMeta] = await listInstalledModules({
+                packageJsonFilePath: buildContext.packageJsonFilePath,
+                filter: ({ moduleName }) =>
+                    moduleName === "@keycloakify/keycloak-account-ui"
+            });
+
+            assert(
+                moduleMeta !== undefined,
+                `@keycloakify/keycloak-account-ui is supposed to be installed`
+            );
+
+            {
+                const [majorStr] = moduleMeta.version.split(".");
+
+                if (majorStr.length === 6) {
+                    // NOTE: Now we use the format MMmmpp (Major, minor, patch) for example for
+                    // 26.0.7 it would be 260007.
+                    break i18n_single_page_account_legacy;
+                } else {
+                    // 25.0.4-rc.5 or later
+                    isLegacyAccountSpa = true;
+                }
+            }
+
+            const messageDirPath_defaults = pathJoin(moduleMeta.dirPath, "messages");
+
+            if (!fs.existsSync(messageDirPath_defaults)) {
+                throw new Error(
+                    `Please update @keycloakify/keycloak-account-ui to 25.0.4-rc.5 or later.`
+                );
+            }
+
+            isLegacyAccountSpa = true;
+
+            const messagesDirPath_dest = pathJoin(
+                getThemeTypeDirPath({ themeName, themeType: "account" }),
+                "messages"
+            );
+
+            transformCodebase({
+                srcDirPath: messageDirPath_defaults,
+                destDirPath: messagesDirPath_dest
+            });
+
+            apply_theme_changes: {
+                const messagesDirPath_theme = pathJoin(
+                    buildContext.themeSrcDirPath,
+                    "account",
+                    "messages"
+                );
+
+                if (!fs.existsSync(messagesDirPath_theme)) {
+                    break apply_theme_changes;
+                }
+
+                fs.readdirSync(messagesDirPath_theme).forEach(basename => {
+                    const filePath_src = pathJoin(messagesDirPath_theme, basename);
+                    const filePath_dest = pathJoin(messagesDirPath_dest, basename);
+
+                    if (!fs.existsSync(filePath_dest)) {
+                        fs.cpSync(filePath_src, filePath_dest);
+                    }
+
+                    const messages_src = propertiesParser.parse(
+                        fs.readFileSync(filePath_src).toString("utf8")
+                    );
+                    const messages_dest = propertiesParser.parse(
+                        fs.readFileSync(filePath_dest).toString("utf8")
+                    );
+
+                    const messages = {
+                        ...messages_dest,
+                        ...messages_src
+                    };
+
+                    const editor = propertiesParser.createEditor();
+
+                    Object.entries(messages).forEach(([key, value]) => {
+                        editor.set(key, value);
+                    });
+
+                    fs.writeFileSync(
+                        filePath_dest,
+                        Buffer.from(editor.toString(), "utf8")
+                    );
+                });
+            }
+
+            languageTags = fs
+                .readdirSync(messagesDirPath_dest)
+                .map(basename =>
+                    basename.replace(/^messages_/, "").replace(/\.properties$/, "")
+                );
+        }
+
+        i18n_for_spas_and_native: {
+            if (!isSpa && !isNative) {
+                break i18n_for_spas_and_native;
+            }
+
+            if (isLegacyAccountSpa) {
+                break i18n_for_spas_and_native;
+            }
+
+            const messagesDirPath_theme = pathJoin(
+                buildContext.themeSrcDirPath,
+                themeType,
+                isNative ? "messages" : "i18n"
+            );
+
+            if (!fs.existsSync(messagesDirPath_theme)) {
+                break i18n_for_spas_and_native;
+            }
+
+            const propertiesByLang: Record<
+                string,
+                {
+                    base: Buffer;
+                    override: Buffer | undefined;
+                    overrideByThemeName: Record<string, Buffer>;
+                }
+            > = {};
+
+            fs.readdirSync(messagesDirPath_theme).forEach(basename => {
+                type ParsedBasename = { lang: string } & (
+                    | {
+                          isOverride: false;
+                      }
+                    | {
+                          isOverride: true;
+                          themeName: string | undefined;
+                      }
+                );
+
+                const parsedBasename = ((): ParsedBasename | undefined => {
+                    const match = basename.match(/^messages_([^.]+)\.properties$/);
+
+                    if (match === null) {
+                        return undefined;
+                    }
+
+                    const discriminator = match[1];
+
+                    const split = discriminator.split("_override");
+
+                    if (split.length === 1) {
+                        return {
+                            lang: discriminator,
+                            isOverride: false
+                        };
+                    }
+
+                    assert(split.length === 2);
+
+                    if (split[1] === "") {
+                        return {
+                            lang: split[0],
+                            isOverride: true,
+                            themeName: undefined
+                        };
+                    }
+
+                    const match2 = split[1].match(/^_(.+)$/);
+
+                    assert(match2 !== null);
+
+                    return {
+                        lang: split[0],
+                        isOverride: true,
+                        themeName: match2[1]
+                    };
+                })();
+
+                if (parsedBasename === undefined) {
+                    return;
+                }
+
+                propertiesByLang[parsedBasename.lang] ??= {
+                    base: createObjectThatThrowsIfAccessed<Buffer>({
+                        debugMessage: `No base ${parsedBasename.lang} translation for ${themeType} theme`
+                    }),
+                    override: undefined,
+                    overrideByThemeName: {}
+                };
+
+                const buffer = fs.readFileSync(pathJoin(messagesDirPath_theme, basename));
+
+                if (parsedBasename.isOverride === false) {
+                    propertiesByLang[parsedBasename.lang].base = buffer;
+                    return;
+                }
+
+                if (parsedBasename.themeName === undefined) {
+                    propertiesByLang[parsedBasename.lang].override = buffer;
+                    return;
+                }
+
+                propertiesByLang[parsedBasename.lang].overrideByThemeName[
+                    parsedBasename.themeName
+                ] = buffer;
+            });
+
+            languageTags = Object.keys(propertiesByLang);
+
+            writeMessagePropertiesFilesByThemeType[themeType] = ({
+                messageDirPath,
+                themeName
+            }) => {
+                if (!fs.existsSync(messageDirPath)) {
+                    fs.mkdirSync(messageDirPath, { recursive: true });
+                }
+
+                Object.entries(propertiesByLang).forEach(
+                    ([lang, { base, override, overrideByThemeName }]) => {
+                        const messages = propertiesParser.parse(base.toString("utf8"));
+
+                        if (override !== undefined) {
+                            const overrideMessages = propertiesParser.parse(
+                                override.toString("utf8")
+                            );
+
+                            Object.entries(overrideMessages).forEach(
+                                ([key, value]) => (messages[key] = value)
+                            );
+                        }
+
+                        if (themeName in overrideByThemeName) {
+                            const overrideMessages = propertiesParser.parse(
+                                overrideByThemeName[themeName].toString("utf8")
+                            );
+
+                            Object.entries(overrideMessages).forEach(
+                                ([key, value]) => (messages[key] = value)
+                            );
+                        }
+
+                        const editor = propertiesParser.createEditor();
+
+                        Object.entries(messages).forEach(([key, value]) => {
+                            editor.set(key, value);
+                        });
+
+                        fs.writeFileSync(
+                            pathJoin(messageDirPath, `messages_${lang}.properties`),
+                            Buffer.from(editor.toString(), "utf8")
+                        );
+                    }
+                );
+            };
+        }
+
+        keycloak_static_resources: {
+            if (isNative) {
+                break keycloak_static_resources;
+            }
+
+            if (isSpa) {
+                break keycloak_static_resources;
+            }
+
+            transformCodebase({
+                srcDirPath: pathJoin(
+                    getThisCodebaseRootDirPath(),
+                    "res",
+                    "public",
+                    WELL_KNOWN_DIRECTORY_BASE_NAME.KEYCLOAKIFY_DEV_RESOURCES,
+                    themeType
+                ),
+                destDirPath: pathJoin(themeTypeDirPath, "resources")
+            });
+        }
+
+        bring_in_account_v1: {
+            if (isNative) {
+                break bring_in_account_v1;
+            }
+
+            if (themeType !== "account") {
+                break bring_in_account_v1;
+            }
+
+            assert(buildContext.implementedThemeTypes.account.isImplemented);
+
+            if (buildContext.implementedThemeTypes.account.type !== "Multi-Page") {
+                break bring_in_account_v1;
+            }
+
+            transformCodebase({
+                srcDirPath: pathJoin(getThisCodebaseRootDirPath(), "res", "account-v1"),
+                destDirPath: getThemeTypeDirPath({
+                    themeName: "account-v1",
+                    themeType: "account"
+                })
+            });
+        }
+
+        generate_theme_properties: {
+            if (isNative) {
+                break generate_theme_properties;
+            }
+
+            assert(themeType !== "email");
+
+            fs.writeFileSync(
+                pathJoin(themeTypeDirPath, "theme.properties"),
+                Buffer.from(
+                    [
+                        `parent=${(() => {
+                            switch (themeType) {
+                                case "account":
+                                    switch (getAccountThemeType()) {
+                                        case "Multi-Page":
+                                            return "account-v1";
+                                        case "Single-Page":
+                                            return "base";
+                                    }
+                                case "login":
+                                    return "keycloak";
+                                case "admin":
+                                    return "base";
+                            }
+                            assert<Equals<typeof themeType, never>>;
+                        })()}`,
+                        ...(themeType === "account" &&
+                        getAccountThemeType() === "Single-Page"
+                            ? ["deprecatedMode=false"]
+                            : []),
+                        ...(buildContext.extraThemeProperties ?? []),
+                        ...[
+                            ...buildContext.environmentVariables,
+                            { name: KEYCLOAKIFY_SPA_DEV_SERVER_PORT, default: "" }
+                        ].map(
+                            ({ name, default: defaultValue }) =>
+                                `${name}=\${env.${name}:${escapeStringForPropertiesFile(defaultValue)}}`
+                        ),
+                        ...(languageTags === undefined
+                            ? []
+                            : [`locales=${languageTags.join(",")}`])
+                    ].join("\n\n"),
+                    "utf8"
+                )
+            );
+        }
     }
+
+    for (const themeVariantName of [...buildContext.themeNames].reverse()) {
+        for (const themeType of [...THEME_TYPES, "email"] as const) {
+            copy_main_theme_to_theme_variant_theme: {
+                let isNative: boolean;
+
+                {
+                    const v = buildContext.implementedThemeTypes[themeType];
+
+                    if (!v.isImplemented && !v.isImplemented_native) {
+                        break copy_main_theme_to_theme_variant_theme;
+                    }
+
+                    isNative = !v.isImplemented && v.isImplemented_native;
+                }
+
+                if (!isNative && themeVariantName === themeName) {
+                    break copy_main_theme_to_theme_variant_theme;
+                }
+
+                transformCodebase({
+                    srcDirPath: getThemeTypeDirPath({ themeName, themeType }),
+                    destDirPath: getThemeTypeDirPath({
+                        themeName: themeVariantName,
+                        themeType
+                    }),
+                    transformSourceCode: ({ fileRelativePath, sourceCode }) => {
+                        patch_xKeycloakify_themeName: {
+                            if (!fileRelativePath.endsWith(".ftl")) {
+                                break patch_xKeycloakify_themeName;
+                            }
+
+                            if (
+                                !isNative &&
+                                pathBasename(fileRelativePath) !== fileRelativePath
+                            ) {
+                                break patch_xKeycloakify_themeName;
+                            }
+
+                            const modifiedSourceCode = Buffer.from(
+                                Buffer.from(sourceCode)
+                                    .toString("utf-8")
+                                    .replace(
+                                        ...id<[string | RegExp, string]>(
+                                            isNative
+                                                ? [
+                                                      /xKeycloakify\.themeName/g,
+                                                      `"${themeVariantName}"`
+                                                  ]
+                                                : [
+                                                      `"themeName": "${themeName}"`,
+                                                      `"themeName": "${themeVariantName}"`
+                                                  ]
+                                        )
+                                    ),
+                                "utf8"
+                            );
+
+                            if (!isNative) {
+                                assert(
+                                    Buffer.compare(modifiedSourceCode, sourceCode) !== 0
+                                );
+                            }
+
+                            return { modifiedSourceCode };
+                        }
+
+                        return { modifiedSourceCode: sourceCode };
+                    }
+                });
+            }
+            run_writeMessagePropertiesFiles: {
+                const writeMessagePropertiesFiles =
+                    writeMessagePropertiesFilesByThemeType[themeType];
+
+                if (writeMessagePropertiesFiles === undefined) {
+                    break run_writeMessagePropertiesFiles;
+                }
+
+                writeMessagePropertiesFiles({
+                    messageDirPath: pathJoin(
+                        getThemeTypeDirPath({ themeName: themeVariantName, themeType }),
+                        "messages"
+                    ),
+                    themeName: themeVariantName
+                });
+            }
+        }
+    }
+
+    console.log(`Generated resources in ${Date.now() - start}ms`);
 }

src/bin/keycloakify/generateResources/generateResourcesForMainTheme.ts

@@ -1,367 +0,0 @@
-import { transformCodebase } from "../../tools/transformCodebase";
-import * as fs from "fs";
-import {
-    join as pathJoin,
-    resolve as pathResolve,
-    relative as pathRelative,
-    dirname as pathDirname,
-    basename as pathBasename
-} from "path";
-import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode";
-import { replaceImportsInCssCode } from "../replacers/replaceImportsInCssCode";
-import {
-    generateFtlFilesCodeFactory,
-    type BuildContextLike as BuildContextLike_kcContextExclusionsFtlCode
-} from "../generateFtl";
-import {
-    type ThemeType,
-    LAST_KEYCLOAK_VERSION_WITH_ACCOUNT_V1,
-    KEYCLOAK_RESOURCES,
-    ACCOUNT_V1_THEME_NAME,
-    BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR,
-    LOGIN_THEME_PAGE_IDS,
-    ACCOUNT_THEME_PAGE_IDS
-} from "../../shared/constants";
-import type { BuildContext } from "../../shared/buildContext";
-import { assert, type Equals } from "tsafe/assert";
-import {
-    downloadKeycloakStaticResources,
-    type BuildContextLike as BuildContextLike_downloadKeycloakStaticResources
-} from "../../shared/downloadKeycloakStaticResources";
-import { readFieldNameUsage } from "./readFieldNameUsage";
-import { readExtraPagesNames } from "./readExtraPageNames";
-import { generateMessageProperties } from "./generateMessageProperties";
-import {
-    bringInAccountV1,
-    type BuildContextLike as BuildContextLike_bringInAccountV1
-} from "./bringInAccountV1";
-import { rmSync } from "../../tools/fs.rmSync";
-import { readThisNpmPackageVersion } from "../../tools/readThisNpmPackageVersion";
-import {
-    writeMetaInfKeycloakThemes,
-    type MetaInfKeycloakTheme
-} from "../../shared/metaInfKeycloakThemes";
-import { objectEntries } from "tsafe/objectEntries";
-import { escapeStringForPropertiesFile } from "../../tools/escapeStringForPropertiesFile";
-import { downloadAndExtractArchive } from "../../tools/downloadAndExtractArchive";
-
-export type BuildContextLike = BuildContextLike_kcContextExclusionsFtlCode &
-    BuildContextLike_downloadKeycloakStaticResources &
-    BuildContextLike_bringInAccountV1 & {
-        extraThemeProperties: string[] | undefined;
-        loginThemeResourcesFromKeycloakVersion: string;
-        projectDirPath: string;
-        projectBuildDirPath: string;
-        environmentVariables: { name: string; default: string }[];
-        implementedThemeTypes: BuildContext["implementedThemeTypes"];
-        themeSrcDirPath: string;
-        bundler: "vite" | "webpack";
-    };
-
-assert<BuildContext extends BuildContextLike ? true : false>();
-
-export async function generateResourcesForMainTheme(params: {
-    themeName: string;
-    resourcesDirPath: string;
-    buildContext: BuildContextLike;
-}): Promise<void> {
-    const { themeName, resourcesDirPath, buildContext } = params;
-
-    const getThemeTypeDirPath = (params: { themeType: ThemeType | "email" }) => {
-        const { themeType } = params;
-        return pathJoin(resourcesDirPath, "theme", themeName, themeType);
-    };
-
-    for (const themeType of ["login", "account"] as const) {
-        if (!buildContext.implementedThemeTypes[themeType].isImplemented) {
-            continue;
-        }
-
-        const isForAccountSpa =
-            themeType === "account" &&
-            (assert(buildContext.implementedThemeTypes.account.isImplemented),
-            buildContext.implementedThemeTypes.account.type === "Single-Page");
-
-        const themeTypeDirPath = getThemeTypeDirPath({ themeType });
-
-        apply_replacers_and_move_to_theme_resources: {
-            const destDirPath = pathJoin(
-                themeTypeDirPath,
-                "resources",
-                BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR
-            );
-
-            // NOTE: Prevent accumulation of files in the assets dir, as names are hashed they pile up.
-            rmSync(destDirPath, { recursive: true, force: true });
-
-            if (
-                themeType === "account" &&
-                buildContext.implementedThemeTypes.login.isImplemented
-            ) {
-                // NOTE: We prevent doing it twice, it has been done for the login theme.
-
-                transformCodebase({
-                    srcDirPath: pathJoin(
-                        getThemeTypeDirPath({
-                            themeType: "login"
-                        }),
-                        "resources",
-                        BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR
-                    ),
-                    destDirPath
-                });
-
-                break apply_replacers_and_move_to_theme_resources;
-            }
-
-            {
-                const dirPath = pathJoin(
-                    buildContext.projectBuildDirPath,
-                    KEYCLOAK_RESOURCES
-                );
-
-                if (fs.existsSync(dirPath)) {
-                    assert(buildContext.bundler === "webpack");
-
-                    throw new Error(
-                        [
-                            `Keycloakify build error: The ${KEYCLOAK_RESOURCES} directory shouldn't exist in your build directory.`,
-                            `(${pathRelative(process.cwd(), dirPath)}).\n`,
-                            `Theses assets are only required for local development with Storybook.",
-                            "Please remove this directory as an additional step of your command.\n`,
-                            `For example: \`"build": "... && rimraf ${pathRelative(buildContext.projectDirPath, dirPath)}"\``
-                        ].join(" ")
-                    );
-                }
-            }
-
-            transformCodebase({
-                srcDirPath: buildContext.projectBuildDirPath,
-                destDirPath,
-                transformSourceCode: ({ filePath, fileRelativePath, sourceCode }) => {
-                    if (filePath.endsWith(".css")) {
-                        const { fixedCssCode } = replaceImportsInCssCode({
-                            cssCode: sourceCode.toString("utf8"),
-                            cssFileRelativeDirPath: pathDirname(fileRelativePath),
-                            buildContext
-                        });
-
-                        return {
-                            modifiedSourceCode: Buffer.from(fixedCssCode, "utf8")
-                        };
-                    }
-
-                    if (filePath.endsWith(".js")) {
-                        const { fixedJsCode } = replaceImportsInJsCode({
-                            jsCode: sourceCode.toString("utf8"),
-                            buildContext
-                        });
-
-                        return {
-                            modifiedSourceCode: Buffer.from(fixedJsCode, "utf8")
-                        };
-                    }
-
-                    return { modifiedSourceCode: sourceCode };
-                }
-            });
-        }
-
-        const { generateFtlFilesCode } = generateFtlFilesCodeFactory({
-            themeName,
-            indexHtmlCode: fs
-                .readFileSync(pathJoin(buildContext.projectBuildDirPath, "index.html"))
-                .toString("utf8"),
-            buildContext,
-            keycloakifyVersion: readThisNpmPackageVersion(),
-            themeType,
-            fieldNames: readFieldNameUsage({
-                themeSrcDirPath: buildContext.themeSrcDirPath,
-                themeType
-            })
-        });
-
-        [
-            ...(() => {
-                switch (themeType) {
-                    case "login":
-                        return LOGIN_THEME_PAGE_IDS;
-                    case "account":
-                        return isForAccountSpa ? ["index.ftl"] : ACCOUNT_THEME_PAGE_IDS;
-                }
-            })(),
-            ...(isForAccountSpa
-                ? []
-                : readExtraPagesNames({
-                      themeType,
-                      themeSrcDirPath: buildContext.themeSrcDirPath
-                  }))
-        ].forEach(pageId => {
-            const { ftlCode } = generateFtlFilesCode({ pageId });
-
-            fs.writeFileSync(
-                pathJoin(themeTypeDirPath, pageId),
-                Buffer.from(ftlCode, "utf8")
-            );
-        });
-
-        i18n_messages_generation: {
-            if (isForAccountSpa) {
-                break i18n_messages_generation;
-            }
-
-            generateMessageProperties({
-                themeSrcDirPath: buildContext.themeSrcDirPath,
-                themeType
-            }).forEach(({ languageTag, propertiesFileSource }) => {
-                const messagesDirPath = pathJoin(themeTypeDirPath, "messages");
-
-                fs.mkdirSync(pathJoin(themeTypeDirPath, "messages"), {
-                    recursive: true
-                });
-
-                const propertiesFilePath = pathJoin(
-                    messagesDirPath,
-                    `messages_${languageTag}.properties`
-                );
-
-                fs.writeFileSync(
-                    propertiesFilePath,
-                    Buffer.from(propertiesFileSource, "utf8")
-                );
-            });
-        }
-
-        keycloak_static_resources: {
-            if (isForAccountSpa) {
-                break keycloak_static_resources;
-            }
-
-            await downloadKeycloakStaticResources({
-                keycloakVersion: (() => {
-                    switch (themeType) {
-                        case "account":
-                            return LAST_KEYCLOAK_VERSION_WITH_ACCOUNT_V1;
-                        case "login":
-                            return buildContext.loginThemeResourcesFromKeycloakVersion;
-                    }
-                })(),
-                themeDirPath: pathResolve(pathJoin(themeTypeDirPath, "..")),
-                themeType,
-                buildContext
-            });
-        }
-
-        fs.writeFileSync(
-            pathJoin(themeTypeDirPath, "theme.properties"),
-            Buffer.from(
-                [
-                    `parent=${(() => {
-                        switch (themeType) {
-                            case "account":
-                                return isForAccountSpa ? "base" : ACCOUNT_V1_THEME_NAME;
-                            case "login":
-                                return "keycloak";
-                        }
-                        assert<Equals<typeof themeType, never>>(false);
-                    })()}`,
-                    ...(isForAccountSpa ? ["deprecatedMode=false"] : []),
-                    ...(buildContext.extraThemeProperties ?? []),
-                    ...buildContext.environmentVariables.map(
-                        ({ name, default: defaultValue }) =>
-                            `${name}=\${env.${name}:${escapeStringForPropertiesFile(defaultValue)}}`
-                    )
-                ].join("\n\n"),
-                "utf8"
-            )
-        );
-    }
-
-    email: {
-        if (!buildContext.implementedThemeTypes.email.isImplemented) {
-            break email;
-        }
-
-        const emailThemeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, "email");
-
-        transformCodebase({
-            srcDirPath: emailThemeSrcDirPath,
-            destDirPath: getThemeTypeDirPath({ themeType: "email" })
-        });
-    }
-
-    bring_in_account_v1: {
-        if (!buildContext.implementedThemeTypes.account.isImplemented) {
-            break bring_in_account_v1;
-        }
-
-        if (buildContext.implementedThemeTypes.account.type !== "Multi-Page") {
-            break bring_in_account_v1;
-        }
-
-        await bringInAccountV1({
-            resourcesDirPath,
-            buildContext
-        });
-    }
-
-    bring_in_account_v3_i18n_messages: {
-        if (!buildContext.implementedThemeTypes.account.isImplemented) {
-            break bring_in_account_v3_i18n_messages;
-        }
-        if (buildContext.implementedThemeTypes.account.type !== "Single-Page") {
-            break bring_in_account_v3_i18n_messages;
-        }
-
-        const { extractedDirPath } = await downloadAndExtractArchive({
-            urlOrPath:
-                "https://repo1.maven.org/maven2/org/keycloak/keycloak-account-ui/25.0.1/keycloak-account-ui-25.0.1.jar",
-            cacheDirPath: buildContext.cacheDirPath,
-            fetchOptions: buildContext.fetchOptions,
-            uniqueIdOfOnArchiveFile: "bring_in_account_v3_i18n_messages",
-            onArchiveFile: async ({ fileRelativePath, writeFile }) => {
-                if (
-                    !fileRelativePath.startsWith(
-                        pathJoin("theme", "keycloak.v3", "account", "messages")
-                    )
-                ) {
-                    return;
-                }
-                await writeFile({
-                    fileRelativePath: pathBasename(fileRelativePath)
-                });
-            }
-        });
-
-        transformCodebase({
-            srcDirPath: extractedDirPath,
-            destDirPath: pathJoin(
-                getThemeTypeDirPath({ themeType: "account" }),
-                "messages"
-            )
-        });
-    }
-
-    {
-        const metaInfKeycloakThemes: MetaInfKeycloakTheme = { themes: [] };
-
-        metaInfKeycloakThemes.themes.push({
-            name: themeName,
-            types: objectEntries(buildContext.implementedThemeTypes)
-                .filter(([, { isImplemented }]) => isImplemented)
-                .map(([themeType]) => themeType)
-        });
-
-        if (buildContext.implementedThemeTypes.account.isImplemented) {
-            metaInfKeycloakThemes.themes.push({
-                name: ACCOUNT_V1_THEME_NAME,
-                types: ["account"]
-            });
-        }
-
-        writeMetaInfKeycloakThemes({
-            resourcesDirPath,
-            getNewMetaInfKeycloakTheme: () => metaInfKeycloakThemes
-        });
-    }
-}

src/bin/keycloakify/generateResources/generateResourcesForThemeVariant.ts

@@ -1,70 +0,0 @@
-import { join as pathJoin, extname as pathExtname, sep as pathSep } from "path";
-import { transformCodebase } from "../../tools/transformCodebase";
-import type { BuildContext } from "../../shared/buildContext";
-import { writeMetaInfKeycloakThemes } from "../../shared/metaInfKeycloakThemes";
-import { assert } from "tsafe/assert";
-
-export type BuildContextLike = {
-    keycloakifyBuildDirPath: string;
-};
-
-assert<BuildContext extends BuildContextLike ? true : false>();
-
-export function generateResourcesForThemeVariant(params: {
-    resourcesDirPath: string;
-    themeName: string;
-    themeVariantName: string;
-}) {
-    const { resourcesDirPath, themeName, themeVariantName } = params;
-
-    const mainThemeDirPath = pathJoin(resourcesDirPath, "theme", themeName);
-
-    transformCodebase({
-        srcDirPath: mainThemeDirPath,
-        destDirPath: pathJoin(mainThemeDirPath, "..", themeVariantName),
-        transformSourceCode: ({ fileRelativePath, sourceCode }) => {
-            if (
-                pathExtname(fileRelativePath) === ".ftl" &&
-                fileRelativePath.split(pathSep).length === 2
-            ) {
-                const modifiedSourceCode = Buffer.from(
-                    Buffer.from(sourceCode)
-                        .toString("utf-8")
-                        .replace(
-                            `"themeName": "${themeName}"`,
-                            `"themeName": "${themeVariantName}"`
-                        ),
-                    "utf8"
-                );
-
-                assert(Buffer.compare(modifiedSourceCode, sourceCode) !== 0);
-
-                return { modifiedSourceCode };
-            }
-
-            return { modifiedSourceCode: sourceCode };
-        }
-    });
-
-    writeMetaInfKeycloakThemes({
-        resourcesDirPath,
-        getNewMetaInfKeycloakTheme: ({ metaInfKeycloakTheme }) => {
-            assert(metaInfKeycloakTheme !== undefined);
-
-            const newMetaInfKeycloakTheme = metaInfKeycloakTheme;
-
-            newMetaInfKeycloakTheme.themes.push({
-                name: themeVariantName,
-                types: (() => {
-                    const theme = newMetaInfKeycloakTheme.themes.find(
-                        ({ name }) => name === themeName
-                    );
-                    assert(theme !== undefined);
-                    return theme.types;
-                })()
-            });
-
-            return newMetaInfKeycloakTheme;
-        }
-    });
-}

src/bin/keycloakify/generateResources/readFieldNameUsage.ts

@@ -7,7 +7,7 @@ import { getThisCodebaseRootDirPath } from "../../tools/getThisCodebaseRootDirPa
 /** Assumes the theme type exists */
 export function readFieldNameUsage(params: {
     themeSrcDirPath: string;
-    themeType: ThemeType;
+    themeType: Exclude<ThemeType, "admin">;
 }): string[] {
     const { themeSrcDirPath, themeType } = params;
 

src/bin/keycloakify/keycloakify.ts

@@ -2,16 +2,17 @@ import { generateResources } from "./generateResources";
 import { join as pathJoin, relative as pathRelative, sep as pathSep } from "path";
 import * as child_process from "child_process";
 import * as fs from "fs";
-import { getBuildContext } from "../shared/buildContext";
+import type { BuildContext } from "../shared/buildContext";
 import { VITE_PLUGIN_SUB_SCRIPTS_ENV_NAMES } from "../shared/constants";
 import { buildJars } from "./buildJars";
-import type { CliCommandOptions } from "../main";
 import chalk from "chalk";
 import { readThisNpmPackageVersion } from "../tools/readThisNpmPackageVersion";
 import * as os from "os";
 import { rmSync } from "../tools/fs.rmSync";
 
-export async function command(params: { cliCommandOptions: CliCommandOptions }) {
+export async function command(params: { buildContext: BuildContext }) {
+    const { buildContext } = params;
+
     exit_if_maven_not_installed: {
         let commandOutput: Buffer | undefined = undefined;
 
@@ -25,31 +26,44 @@ export async function command(params: { cliCommandOptions: CliCommandOptions })
             break exit_if_maven_not_installed;
         }
 
-        const installationCommand = (() => {
-            switch (os.platform()) {
-                case "darwin":
-                    return "brew install mvn";
-                case "win32":
-                    return "choco install mvn";
-                case "linux":
-                default:
-                    return "sudo apt-get install mvn";
-            }
-        })();
+        if (
+            fs
+                .readFileSync(buildContext.packageJsonFilePath)
+                .toString("utf8")
+                .includes(`"mvn"`)
+        ) {
+            console.log(
+                chalk.red(
+                    [
+                        "Please remove the 'mvn' package from your package.json'dependencies list,",
+                        "reinstall your dependencies and try again.",
+                        "We need the Apache Maven CLI, not this: https://www.npmjs.com/package/mvn"
+                    ].join(" ")
+                )
+            );
+        } else {
+            const installationCommand = (() => {
+                switch (os.platform()) {
+                    case "darwin":
+                        return "brew install mvn";
+                    case "win32":
+                        return "choco install mvn";
+                    case "linux":
+                    default:
+                        return "sudo apt-get install mvn";
+                }
+            })();
 
-        console.log(
-            `${chalk.red("Apache Maven required.")} Install it with \`${chalk.bold(
-                installationCommand
-            )}\` (for example)`
-        );
+            console.log(
+                `${chalk.red("Apache Maven required.")} Install it with \`${chalk.bold(
+                    installationCommand
+                )}\` (for example)`
+            );
+        }
 
         process.exit(1);
     }
 
-    const { cliCommandOptions } = params;
-
-    const buildContext = getBuildContext({ cliCommandOptions });
-
     console.log(
         [
             chalk.cyan(`keycloakify v${readThisNpmPackageVersion()}`),

src/bin/keycloakify/replacers/replaceImportsInCssCode.ts

@@ -1,5 +1,5 @@
 import type { BuildContext } from "../../shared/buildContext";
-import { BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR } from "../../shared/constants";
+import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "../../shared/constants";
 import { assert } from "tsafe/assert";
 import { posix } from "path";
 
@@ -50,7 +50,7 @@ export function replaceImportsInCssCode(params: {
                             break inline_style_in_html;
                         }
 
-                        return `url("\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}${assetFileAbsoluteUrlPathname}")`;
+                        return `url("\${xKeycloakify.resourcesPath}/${WELL_KNOWN_DIRECTORY_BASE_NAME.DIST}${assetFileAbsoluteUrlPathname}")`;
                     }
 
                     const assetFileRelativeUrlPathname = posix.relative(

src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts

@@ -1,4 +1,4 @@
-import { BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR } from "../../../shared/constants";
+import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "../../../shared/constants";
 import { assert } from "tsafe/assert";
 import type { BuildContext } from "../../../shared/buildContext";
 import * as nodePath from "path";
@@ -85,13 +85,13 @@ export function replaceImportsInJsCode_vite(params: {
                 fixedJsCode = replaceAll(
                     fixedJsCode,
                     `"${relativePathOfAssetFile}"`,
-                    `(window.kcContext["x-keycloakify"].resourcesPath.substring(1) + "/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/${relativePathOfAssetFile}")`
+                    `(window.kcContext["x-keycloakify"].resourcesPath.substring(1) + "/${WELL_KNOWN_DIRECTORY_BASE_NAME.DIST}/${relativePathOfAssetFile}")`
                 );
 
                 fixedJsCode = replaceAll(
                     fixedJsCode,
                     `"${buildContext.urlPathname ?? "/"}${relativePathOfAssetFile}"`,
-                    `(window.kcContext["x-keycloakify"].resourcesPath + "/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/${relativePathOfAssetFile}")`
+                    `(window.kcContext["x-keycloakify"].resourcesPath + "/${WELL_KNOWN_DIRECTORY_BASE_NAME.DIST}/${relativePathOfAssetFile}")`
                 );
             });
     }

src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts

@@ -1,4 +1,4 @@
-import { BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR } from "../../../shared/constants";
+import { WELL_KNOWN_DIRECTORY_BASE_NAME } from "../../../shared/constants";
 import { assert } from "tsafe/assert";
 import type { BuildContext } from "../../../shared/buildContext";
 import * as nodePath from "path";
@@ -90,7 +90,7 @@ export function replaceImportsInJsCode_webpack(params: {
                 return "${u}";
             })()] = ${
                 isArrowFunction ? `${e} =>` : `function(${e}) { return `
-            } "/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/${staticDir}${language}/"`
+            } "/${WELL_KNOWN_DIRECTORY_BASE_NAME.DIST}/${staticDir}${language}/"`
                 .replace(/\s+/g, " ")
                 .trim();
         }
@@ -104,7 +104,7 @@ export function replaceImportsInJsCode_webpack(params: {
                 `[a-zA-Z]+\\.[a-zA-Z]+\\+"${staticDir.replace(/\//g, "\\/")}`,
                 "g"
             ),
-            `window.kcContext["x-keycloakify"].resourcesPath + "/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/${staticDir}`
+            `window.kcContext["x-keycloakify"].resourcesPath + "/${WELL_KNOWN_DIRECTORY_BASE_NAME.DIST}/${staticDir}`
         );
 
     return { fixedJsCode };

src/bin/main.ts

@@ -4,8 +4,9 @@ import { termost } from "termost";
 import { readThisNpmPackageVersion } from "./tools/readThisNpmPackageVersion";
 import * as child_process from "child_process";
 import { assertNoPnpmDlx } from "./tools/assertNoPnpmDlx";
+import { getBuildContext } from "./shared/buildContext";
 
-export type CliCommandOptions = {
+type CliCommandOptions = {
     projectDirPath: string | undefined;
 };
 
@@ -69,17 +70,17 @@ program
     })
     .task({
         skip,
-        handler: async cliCommandOptions => {
+        handler: async ({ projectDirPath }) => {
             const { command } = await import("./keycloakify");
 
-            await command({ cliCommandOptions });
+            await command({ buildContext: getBuildContext({ projectDirPath }) });
         }
     });
 
 program
     .command<{
         port: number | undefined;
-        keycloakVersion: string | undefined;
+        keycloakVersion: string | number | undefined;
         realmJsonFilePath: string | undefined;
     }>({
         name: "start-keycloak",
@@ -130,10 +131,18 @@ program
     })
     .task({
         skip,
-        handler: async cliCommandOptions => {
+        handler: async ({ projectDirPath, keycloakVersion, port, realmJsonFilePath }) => {
             const { command } = await import("./start-keycloak");
 
-            await command({ cliCommandOptions });
+            await command({
+                buildContext: getBuildContext({ projectDirPath }),
+                cliCommandOptions: {
+                    keycloakVersion:
+                        keycloakVersion === undefined ? undefined : `${keycloakVersion}`,
+                    port,
+                    realmJsonFilePath
+                }
+            });
         }
     });
 
@@ -144,10 +153,10 @@ program
     })
     .task({
         skip,
-        handler: async cliCommandOptions => {
+        handler: async ({ projectDirPath }) => {
             const { command } = await import("./eject-page");
 
-            await command({ cliCommandOptions });
+            await command({ buildContext: getBuildContext({ projectDirPath }) });
         }
     });
 
@@ -158,10 +167,10 @@ program
     })
     .task({
         skip,
-        handler: async cliCommandOptions => {
+        handler: async ({ projectDirPath }) => {
             const { command } = await import("./add-story");
 
-            await command({ cliCommandOptions });
+            await command({ buildContext: getBuildContext({ projectDirPath }) });
         }
     });
 
@@ -172,24 +181,38 @@ program
     })
     .task({
         skip,
-        handler: async cliCommandOptions => {
+        handler: async ({ projectDirPath }) => {
             const { command } = await import("./initialize-email-theme");
 
-            await command({ cliCommandOptions });
+            await command({ buildContext: getBuildContext({ projectDirPath }) });
         }
     });
 
 program
     .command({
         name: "initialize-account-theme",
-        description: "Initialize the account theme."
+        description: "Initialize an Account Single-Page or Multi-Page custom Account UI."
     })
     .task({
         skip,
-        handler: async cliCommandOptions => {
+        handler: async ({ projectDirPath }) => {
             const { command } = await import("./initialize-account-theme");
 
-            await command({ cliCommandOptions });
+            await command({ buildContext: getBuildContext({ projectDirPath }) });
+        }
+    });
+
+program
+    .command({
+        name: "initialize-admin-theme",
+        description: "Initialize an Admin Console custom UI."
+    })
+    .task({
+        skip,
+        handler: async ({ projectDirPath }) => {
+            const { command } = await import("./initialize-admin-theme");
+
+            await command({ buildContext: getBuildContext({ projectDirPath }) });
         }
     });
 
@@ -197,14 +220,14 @@ program
     .command({
         name: "copy-keycloak-resources-to-public",
         description:
-            "(Webpack/Create-React-App only) Copy Keycloak default theme resources to the public directory."
+            "(Internal) Copy Keycloak default theme resources to the public directory."
     })
     .task({
         skip,
-        handler: async cliCommandOptions => {
+        handler: async ({ projectDirPath }) => {
             const { command } = await import("./copy-keycloak-resources-to-public");
 
-            await command({ cliCommandOptions });
+            await command({ buildContext: getBuildContext({ projectDirPath }) });
         }
     });
 
@@ -216,10 +239,107 @@ program
     })
     .task({
         skip,
-        handler: async cliCommandOptions => {
+        handler: async ({ projectDirPath }) => {
             const { command } = await import("./update-kc-gen");
 
-            await command({ cliCommandOptions });
+            await command({ buildContext: getBuildContext({ projectDirPath }) });
+        }
+    });
+
+program
+    .command({
+        name: "sync-extensions",
+        description: [
+            "Synchronizes all installed Keycloakify extension modules with your project.",
+            "",
+            "Example of extension modules: '@keycloakify/keycloak-account-ui', '@keycloakify/keycloak-admin-ui', '@keycloakify/keycloak-ui-shared'",
+            "",
+            "This command ensures that:",
+            "- All required files from installed extensions are copied into your project.",
+            "- The copied files are correctly ignored by Git to help you distinguish between your custom source files",
+            "  and those provided by the extensions.",
+            "- Peer dependencies declared by the extensions are automatically added to your package.json.",
+            "",
+            "You can safely run this command multiple times. It will only update the files and dependencies if needed,",
+            "ensuring your project stays in sync with the installed extensions.",
+            "",
+            "Typical usage:",
+            "- Should be run as a postinstall script of your project.",
+            ""
+        ].join("\n")
+    })
+    .task({
+        skip,
+        handler: async ({ projectDirPath }) => {
+            const { command } = await import("./sync-extensions");
+
+            await command({ buildContext: getBuildContext({ projectDirPath }) });
+        }
+    });
+
+program
+    .command<{
+        path: string;
+        revert: boolean;
+    }>({
+        name: "own",
+        description: [
+            "Manages ownership of auto-generated files provided by Keycloakify extensions.",
+            "",
+            "This command allows you to take ownership of a specific file or directory generated",
+            "by an extension. Once owned, you can freely modify and version-control the file.",
+            "",
+            "You can also use the --revert flag to relinquish ownership and restore the file",
+            "or directory to its original auto-generated state.",
+            "",
+            "For convenience, the exact command to take ownership of any file is included as a comment",
+            "in the header of each extension-generated file.",
+            "",
+            "Examples:",
+            "$ npx keycloakify own --path admin/KcPage.tsx"
+        ].join("\n")
+    })
+    .option({
+        key: "path",
+        name: (() => {
+            const long = "path";
+            const short = "t";
+
+            optionsKeys.push(long, short);
+
+            return { long, short };
+        })(),
+        description: [
+            "Specifies the relative path of the file or directory to take ownership of.",
+            "This path should be relative to your theme directory.",
+            "Example: `--path 'admin/KcPage.tsx'`"
+        ].join(" ")
+    })
+    .option({
+        key: "revert",
+        name: (() => {
+            const long = "revert";
+            const short = "r";
+
+            optionsKeys.push(long, short);
+
+            return { long, short };
+        })(),
+        description: [
+            "Restores a file or directory to its original auto-generated state,",
+            "removing your ownership claim and reverting any modifications."
+        ].join(" "),
+        defaultValue: false
+    })
+    .task({
+        skip,
+        handler: async ({ projectDirPath, path, revert }) => {
+            const { command } = await import("./own");
+
+            await command({
+                buildContext: getBuildContext({ projectDirPath }),
+                cliCommandOptions: { path, isRevert: revert }
+            });
         }
     });
 

src/bin/own.ts

@@ -0,0 +1,208 @@
+import type { BuildContext } from "./shared/buildContext";
+import { getExtensionModuleFileSourceCodeReadyToBeCopied } from "./sync-extensions/getExtensionModuleFileSourceCodeReadyToBeCopied";
+import type { ExtensionModuleMeta } from "./sync-extensions/extensionModuleMeta";
+import { command as command_syncExtensions } from "./sync-extensions/sync-extension";
+import {
+    readManagedGitignoreFile,
+    writeManagedGitignoreFile
+} from "./sync-extensions/managedGitignoreFile";
+import { getExtensionModuleMetas } from "./sync-extensions/extensionModuleMeta";
+import { getAbsoluteAndInOsFormatPath } from "./tools/getAbsoluteAndInOsFormatPath";
+import { relative as pathRelative, dirname as pathDirname, join as pathJoin } from "path";
+import { getInstalledModuleDirPath } from "./tools/getInstalledModuleDirPath";
+import * as fsPr from "fs/promises";
+import { isInside } from "./tools/isInside";
+import chalk from "chalk";
+
+export async function command(params: {
+    buildContext: BuildContext;
+    cliCommandOptions: {
+        path: string;
+        isRevert: boolean;
+    };
+}) {
+    const { buildContext, cliCommandOptions } = params;
+
+    const extensionModuleMetas = await getExtensionModuleMetas({ buildContext });
+
+    const { targetFileRelativePathsByExtensionModuleMeta } = await (async () => {
+        const fileOrDirectoryRelativePath = pathRelative(
+            buildContext.themeSrcDirPath,
+            getAbsoluteAndInOsFormatPath({
+                cwd: buildContext.themeSrcDirPath,
+                pathIsh: cliCommandOptions.path
+            })
+        );
+
+        const arr = extensionModuleMetas
+            .map(extensionModuleMeta => ({
+                extensionModuleMeta,
+                fileRelativePaths: extensionModuleMeta.files
+                    .map(({ fileRelativePath }) => fileRelativePath)
+                    .filter(
+                        fileRelativePath =>
+                            fileRelativePath === fileOrDirectoryRelativePath ||
+                            isInside({
+                                dirPath: fileOrDirectoryRelativePath,
+                                filePath: fileRelativePath
+                            })
+                    )
+            }))
+            .filter(({ fileRelativePaths }) => fileRelativePaths.length !== 0);
+
+        const targetFileRelativePathsByExtensionModuleMeta = new Map<
+            ExtensionModuleMeta,
+            string[]
+        >();
+
+        for (const { extensionModuleMeta, fileRelativePaths } of arr) {
+            targetFileRelativePathsByExtensionModuleMeta.set(
+                extensionModuleMeta,
+                fileRelativePaths
+            );
+        }
+
+        return { targetFileRelativePathsByExtensionModuleMeta };
+    })();
+
+    if (targetFileRelativePathsByExtensionModuleMeta.size === 0) {
+        console.log(
+            chalk.yellow(
+                "There is no Keycloakify extension modules files matching the provided path."
+            )
+        );
+        process.exit(1);
+    }
+
+    const { ownedFilesRelativePaths: ownedFilesRelativePaths_current } =
+        await readManagedGitignoreFile({
+            buildContext
+        });
+
+    await (cliCommandOptions.isRevert ? command_revert : command_own)({
+        extensionModuleMetas,
+        targetFileRelativePathsByExtensionModuleMeta,
+        ownedFilesRelativePaths_current,
+        buildContext
+    });
+}
+
+type Params_subcommands = {
+    extensionModuleMetas: ExtensionModuleMeta[];
+    targetFileRelativePathsByExtensionModuleMeta: Map<ExtensionModuleMeta, string[]>;
+    ownedFilesRelativePaths_current: string[];
+    buildContext: BuildContext;
+};
+
+async function command_own(params: Params_subcommands) {
+    const {
+        extensionModuleMetas,
+        targetFileRelativePathsByExtensionModuleMeta,
+        ownedFilesRelativePaths_current,
+        buildContext
+    } = params;
+
+    await writeManagedGitignoreFile({
+        buildContext,
+        extensionModuleMetas,
+        ownedFilesRelativePaths: [
+            ...ownedFilesRelativePaths_current,
+            ...Array.from(targetFileRelativePathsByExtensionModuleMeta.values())
+                .flat()
+                .filter(
+                    fileRelativePath =>
+                        !ownedFilesRelativePaths_current.includes(fileRelativePath)
+                )
+        ]
+    });
+
+    const writeActions: (() => Promise<void>)[] = [];
+
+    for (const [
+        extensionModuleMeta,
+        fileRelativePaths
+    ] of targetFileRelativePathsByExtensionModuleMeta.entries()) {
+        const extensionModuleDirPath = await getInstalledModuleDirPath({
+            moduleName: extensionModuleMeta.moduleName,
+            packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath)
+        });
+
+        for (const fileRelativePath of fileRelativePaths) {
+            if (ownedFilesRelativePaths_current.includes(fileRelativePath)) {
+                console.log(
+                    chalk.grey(`You already have ownership over '${fileRelativePath}'.`)
+                );
+                continue;
+            }
+
+            writeActions.push(async () => {
+                const sourceCode = await getExtensionModuleFileSourceCodeReadyToBeCopied({
+                    buildContext,
+                    fileRelativePath,
+                    isOwnershipAction: true,
+                    extensionModuleName: extensionModuleMeta.moduleName,
+                    extensionModuleDirPath,
+                    extensionModuleVersion: extensionModuleMeta.version
+                });
+
+                await fsPr.writeFile(
+                    pathJoin(buildContext.themeSrcDirPath, fileRelativePath),
+                    sourceCode
+                );
+
+                console.log(chalk.green(`Ownership over '${fileRelativePath}' claimed.`));
+            });
+        }
+    }
+
+    if (writeActions.length === 0) {
+        console.log(chalk.yellow("No new file claimed."));
+        return;
+    }
+
+    await Promise.all(writeActions.map(action => action()));
+}
+
+async function command_revert(params: Params_subcommands) {
+    const {
+        extensionModuleMetas,
+        targetFileRelativePathsByExtensionModuleMeta,
+        ownedFilesRelativePaths_current,
+        buildContext
+    } = params;
+
+    const ownedFilesRelativePaths_toRemove = Array.from(
+        targetFileRelativePathsByExtensionModuleMeta.values()
+    )
+        .flat()
+        .filter(fileRelativePath => {
+            if (!ownedFilesRelativePaths_current.includes(fileRelativePath)) {
+                console.log(
+                    chalk.grey(`Ownership over '${fileRelativePath}' wasn't claimed.`)
+                );
+                return false;
+            }
+
+            console.log(
+                chalk.green(`Ownership over '${fileRelativePath}' relinquished.`)
+            );
+
+            return true;
+        });
+
+    if (ownedFilesRelativePaths_toRemove.length === 0) {
+        console.log(chalk.yellow("No file relinquished."));
+        return;
+    }
+
+    await writeManagedGitignoreFile({
+        buildContext,
+        extensionModuleMetas,
+        ownedFilesRelativePaths: ownedFilesRelativePaths_current.filter(
+            fileRelativePath =>
+                !ownedFilesRelativePaths_toRemove.includes(fileRelativePath)
+        )
+    });
+
+    await command_syncExtensions({ buildContext });
+}

src/bin/shared/KeycloakVersionRange.ts

@@ -3,7 +3,7 @@ export type KeycloakVersionRange =
     | KeycloakVersionRange.WithoutAccountV1Theme;
 
 export namespace KeycloakVersionRange {
-    export type WithoutAccountV1Theme = "21-and-below" | "22-and-above";
+    export type WithoutAccountV1Theme = "22-to-25" | "all-other-versions";
 
-    export type WithAccountV1Theme = "21-and-below" | "23" | "24" | "25-and-above";
+    export type WithAccountV1Theme = "21-and-below" | "23" | "24" | "25" | "26-and-above";
 }

src/bin/shared/addSyncExtensionsToPostinstallScript.ts

@@ -0,0 +1,70 @@
+import { dirname as pathDirname, relative as pathRelative, sep as pathSep } from "path";
+import { assert } from "tsafe/assert";
+import type { BuildContext } from "./buildContext";
+
+export type BuildContextLike = {
+    projectDirPath: string;
+    packageJsonFilePath: string;
+};
+
+assert<BuildContext extends BuildContextLike ? true : false>();
+
+export function addSyncExtensionsToPostinstallScript(params: {
+    parsedPackageJson: { scripts?: Record<string, string | undefined> };
+    buildContext: BuildContextLike;
+}) {
+    const { parsedPackageJson, buildContext } = params;
+
+    const cmd_base = "keycloakify sync-extensions";
+
+    const projectCliOptionValue = (() => {
+        const packageJsonDirPath = pathDirname(buildContext.packageJsonFilePath);
+
+        const relativePath = pathRelative(
+            packageJsonDirPath,
+            buildContext.projectDirPath
+        );
+
+        if (relativePath === "") {
+            return undefined;
+        }
+
+        return relativePath.split(pathSep).join("/");
+    })();
+
+    const generateCmd = (params: { cmd_preexisting: string | undefined }) => {
+        const { cmd_preexisting } = params;
+
+        let cmd = cmd_preexisting === undefined ? "" : `${cmd_preexisting} && `;
+
+        cmd += cmd_base;
+
+        if (projectCliOptionValue !== undefined) {
+            cmd += ` -p ${projectCliOptionValue}`;
+        }
+
+        return cmd;
+    };
+
+    {
+        const scripts = (parsedPackageJson.scripts ??= {});
+
+        for (const scriptName of ["postinstall", "prepare"]) {
+            const cmd_preexisting = scripts[scriptName];
+
+            if (cmd_preexisting === undefined) {
+                continue;
+            }
+
+            if (!cmd_preexisting.includes(cmd_base)) {
+                scripts[scriptName] = generateCmd({ cmd_preexisting });
+                return;
+            }
+        }
+    }
+
+    parsedPackageJson.scripts = {
+        postinstall: generateCmd({ cmd_preexisting: undefined }),
+        ...parsedPackageJson.scripts
+    };
+}

src/bin/shared/buildContext.ts

@@ -7,25 +7,22 @@ import {
     dirname as pathDirname
 } from "path";
 import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath";
-import type { CliCommandOptions } from "../main";
 import { z } from "zod";
 import * as fs from "fs";
-import { assert, type Equals } from "tsafe/assert";
+import { assert, type Equals, is } from "tsafe/assert";
 import * as child_process from "child_process";
 import {
     VITE_PLUGIN_SUB_SCRIPTS_ENV_NAMES,
-    BUILD_FOR_KEYCLOAK_MAJOR_VERSION_ENV_NAME,
-    LOGIN_THEME_RESOURCES_FROMkEYCLOAK_VERSION_DEFAULT
+    BUILD_FOR_KEYCLOAK_MAJOR_VERSION_ENV_NAME
 } from "./constants";
 import type { KeycloakVersionRange } from "./KeycloakVersionRange";
 import { exclude } from "tsafe";
 import { crawl } from "../tools/crawl";
-import { THEME_TYPES } from "./constants";
+import { THEME_TYPES, KEYCLOAK_THEME, type ThemeType } from "./constants";
 import { objectEntries } from "tsafe/objectEntries";
-import { type ThemeType } from "./constants";
 import { id } from "tsafe/id";
 import chalk from "chalk";
-import { getProxyFetchOptions, type ProxyFetchOptions } from "../tools/fetchProxyOptions";
+import { getProxyFetchOptions, type FetchOptionsLike } from "../tools/fetchProxyOptions";
 
 export type BuildContext = {
     themeVersion: string;
@@ -33,7 +30,6 @@ export type BuildContext = {
     extraThemeProperties: string[] | undefined;
     groupId: string;
     artifactId: string;
-    loginThemeResourcesFromKeycloakVersion: string;
     projectDirPath: string;
     projectBuildDirPath: string;
     /** Directory that keycloakify outputs to. Defaults to {cwd}/build_keycloak */
@@ -44,16 +40,21 @@ export type BuildContext = {
      * In this case the urlPathname will be "/my-app/" */
     urlPathname: string | undefined;
     assetsDirPath: string;
-    fetchOptions: ProxyFetchOptions;
+    fetchOptions: FetchOptionsLike;
     kcContextExclusionsFtlCode: string | undefined;
     environmentVariables: { name: string; default: string }[];
     themeSrcDirPath: string;
     implementedThemeTypes: {
-        login: { isImplemented: boolean };
-        email: { isImplemented: boolean };
+        login:
+            | { isImplemented: true }
+            | { isImplemented: false; isImplemented_native: boolean };
+        email: { isImplemented: false; isImplemented_native: boolean };
         account:
-            | { isImplemented: false }
+            | { isImplemented: false; isImplemented_native: boolean }
             | { isImplemented: true; type: "Single-Page" | "Multi-Page" };
+        admin:
+            | { isImplemented: true }
+            | { isImplemented: false; isImplemented_native: boolean };
     };
     packageJsonFilePath: string;
     bundler: "vite" | "webpack";
@@ -85,7 +86,6 @@ export type BuildOptions = {
     extraThemeProperties?: string[];
     artifactId?: string;
     groupId?: string;
-    loginThemeResourcesFromKeycloakVersion?: string;
     keycloakifyBuildDirPath?: string;
     kcContextExclusionsFtl?: string;
     startKeycloakOptions?: {
@@ -131,14 +131,12 @@ export type ResolvedViteConfig = {
 };
 
 export function getBuildContext(params: {
-    cliCommandOptions: CliCommandOptions;
+    projectDirPath: string | undefined;
 }): BuildContext {
-    const { cliCommandOptions } = params;
-
     const projectDirPath =
-        cliCommandOptions.projectDirPath !== undefined
+        params.projectDirPath !== undefined
             ? getAbsoluteAndInOsFormatPath({
-                  pathIsh: cliCommandOptions.projectDirPath,
+                  pathIsh: params.projectDirPath,
                   cwd: process.cwd()
               })
             : process.cwd();
@@ -151,7 +149,10 @@ export function getBuildContext(params: {
             returnedPathsType: "relative to dirPath"
         })
             .map(fileRelativePath => {
-                for (const themeSrcDirBasename of ["keycloak-theme", "keycloak_theme"]) {
+                for (const themeSrcDirBasename of [
+                    KEYCLOAK_THEME,
+                    KEYCLOAK_THEME.replace(/-/g, "_")
+                ]) {
                     const split = fileRelativePath.split(themeSrcDirBasename);
                     if (split.length === 2) {
                         return pathJoin(srcDirPath, split[0] + themeSrcDirBasename);
@@ -177,7 +178,7 @@ export function getBuildContext(params: {
                 [
                     `Can't locate your Keycloak theme source directory in .${pathSep}${pathRelative(process.cwd(), srcDirPath)}`,
                     `Make sure to either use the Keycloakify CLI in the root of your Keycloakify project or use the --project CLI option`,
-                    `If you are collocating your Keycloak theme with your app you must have a directory named 'keycloak-theme' or 'keycloak_theme' in your 'src' directory`
+                    `If you are collocating your Keycloak theme with your app you must have a directory named '${KEYCLOAK_THEME}' or '${KEYCLOAK_THEME.replace(/-/g, "_")}' in your 'src' directory`
                 ].join("\n")
             )
         );
@@ -243,8 +244,7 @@ export function getBuildContext(params: {
 
             if (
                 parsedPackageJson.dependencies?.keycloakify === undefined &&
-                parsedPackageJson.devDependencies?.keycloakify === undefined &&
-                parsedPackageJson.name !== "keycloakify" // NOTE: For local storybook build
+                parsedPackageJson.devDependencies?.keycloakify === undefined
             ) {
                 break success;
             }
@@ -280,7 +280,8 @@ export function getBuildContext(params: {
                         "21-and-below": z.union([z.boolean(), z.string()]),
                         "23": z.union([z.boolean(), z.string()]),
                         "24": z.union([z.boolean(), z.string()]),
-                        "25-and-above": z.union([z.boolean(), z.string()])
+                        "25": z.union([z.boolean(), z.string()]),
+                        "26-and-above": z.union([z.boolean(), z.string()])
                     })
                     .optional()
             });
@@ -301,8 +302,8 @@ export function getBuildContext(params: {
                 ]),
                 keycloakVersionTargets: z
                     .object({
-                        "21-and-below": z.union([z.boolean(), z.string()]),
-                        "22-and-above": z.union([z.boolean(), z.string()])
+                        "22-to-25": z.union([z.boolean(), z.string()]),
+                        "all-other-versions": z.union([z.boolean(), z.string()])
                     })
                     .optional()
             });
@@ -357,7 +358,6 @@ export function getBuildContext(params: {
                     extraThemeProperties: z.array(z.string()).optional(),
                     artifactId: z.string().optional(),
                     groupId: z.string().optional(),
-                    loginThemeResourcesFromKeycloakVersion: z.string().optional(),
                     keycloakifyBuildDirPath: z.string().optional(),
                     kcContextExclusionsFtl: z.string().optional(),
                     startKeycloakOptions: zStartKeycloakOptions.optional()
@@ -438,24 +438,68 @@ export function getBuildContext(params: {
         assert<Equals<typeof bundler, never>>(false);
     })();
 
-    const implementedThemeTypes: BuildContext["implementedThemeTypes"] = {
-        login: {
-            isImplemented: fs.existsSync(pathJoin(themeSrcDirPath, "login"))
-        },
-        email: {
-            isImplemented: fs.existsSync(pathJoin(themeSrcDirPath, "email"))
-        },
-        account: (() => {
-            if (buildOptions.accountThemeImplementation === "none") {
-                return { isImplemented: false };
-            }
+    const implementedThemeTypes: BuildContext["implementedThemeTypes"] = (() => {
+        const getIsNative = (dirPath: string) =>
+            fs.existsSync(pathJoin(dirPath, "theme.properties"));
 
-            return {
-                isImplemented: true,
-                type: buildOptions.accountThemeImplementation
-            };
-        })()
-    };
+        return {
+            login: (() => {
+                const dirPath = pathJoin(themeSrcDirPath, "login");
+
+                if (!fs.existsSync(dirPath)) {
+                    return { isImplemented: false, isImplemented_native: false };
+                }
+
+                if (getIsNative(dirPath)) {
+                    return { isImplemented: false, isImplemented_native: true };
+                }
+
+                return { isImplemented: true };
+            })(),
+            email: (() => {
+                const dirPath = pathJoin(themeSrcDirPath, "email");
+
+                if (!fs.existsSync(dirPath) || !getIsNative(dirPath)) {
+                    return { isImplemented: false, isImplemented_native: false };
+                }
+
+                return { isImplemented: false, isImplemented_native: true };
+            })(),
+            account: (() => {
+                const dirPath = pathJoin(themeSrcDirPath, "account");
+
+                if (!fs.existsSync(dirPath)) {
+                    return { isImplemented: false, isImplemented_native: false };
+                }
+
+                if (getIsNative(dirPath)) {
+                    return { isImplemented: false, isImplemented_native: true };
+                }
+
+                if (buildOptions.accountThemeImplementation === "none") {
+                    return { isImplemented: false, isImplemented_native: false };
+                }
+
+                return {
+                    isImplemented: true,
+                    type: buildOptions.accountThemeImplementation
+                };
+            })(),
+            admin: (() => {
+                const dirPath = pathJoin(themeSrcDirPath, "admin");
+
+                if (!fs.existsSync(dirPath)) {
+                    return { isImplemented: false, isImplemented_native: false };
+                }
+
+                if (getIsNative(dirPath)) {
+                    return { isImplemented: false, isImplemented_native: true };
+                }
+
+                return { isImplemented: true };
+            })()
+        };
+    })();
 
     if (
         implementedThemeTypes.account.isImplemented &&
@@ -474,26 +518,53 @@ export function getBuildContext(params: {
     }
 
     const themeNames = ((): [string, ...string[]] => {
-        if (buildOptions.themeName === undefined) {
-            return parsedPackageJson.name === undefined
-                ? ["keycloakify"]
-                : [
-                      parsedPackageJson.name
-                          .replace(/^@(.*)/, "$1")
-                          .split("/")
-                          .join("-")
-                  ];
+        const themeNames = ((): [string, ...string[]] => {
+            if (buildOptions.themeName === undefined) {
+                return parsedPackageJson.name === undefined
+                    ? ["keycloakify"]
+                    : [
+                          parsedPackageJson.name
+                              .replace(/^@(.*)/, "$1")
+                              .split("/")
+                              .join("-")
+                      ];
+            }
+
+            if (typeof buildOptions.themeName === "string") {
+                return [buildOptions.themeName];
+            }
+
+            const [mainThemeName, ...themeVariantNames] = buildOptions.themeName;
+
+            assert(mainThemeName !== undefined);
+
+            return [mainThemeName, ...themeVariantNames];
+        })();
+
+        for (const themeName of themeNames) {
+            if (!/^[a-zA-Z0-9_-]+$/.test(themeName)) {
+                console.error(
+                    chalk.red(
+                        [
+                            `Invalid theme name: ${themeName}`,
+                            `Theme names should only contain letters, numbers, and "_" or "-"`
+                        ].join(" ")
+                    )
+                );
+                process.exit(-1);
+            }
         }
 
-        if (typeof buildOptions.themeName === "string") {
-            return [buildOptions.themeName];
+        return themeNames;
+    })();
+
+    const relativePathsCwd = (() => {
+        switch (bundler) {
+            case "vite":
+                return projectDirPath;
+            case "webpack":
+                return pathDirname(packageJsonFilePath);
         }
-
-        const [mainThemeName, ...themeVariantNames] = buildOptions.themeName;
-
-        assert(mainThemeName !== undefined);
-
-        return [mainThemeName, ...themeVariantNames];
     })();
 
     const projectBuildDirPath = (() => {
@@ -507,7 +578,7 @@ export function getBuildContext(params: {
             if (parsedPackageJson.keycloakify.projectBuildDirPath !== undefined) {
                 return getAbsoluteAndInOsFormatPath({
                     pathIsh: parsedPackageJson.keycloakify.projectBuildDirPath,
-                    cwd: projectDirPath
+                    cwd: relativePathsCwd
                 });
             }
 
@@ -545,16 +616,13 @@ export function getBuildContext(params: {
             process.env.KEYCLOAKIFY_ARTIFACT_ID ??
             buildOptions.artifactId ??
             `${themeNames[0]}-keycloak-theme`,
-        loginThemeResourcesFromKeycloakVersion:
-            buildOptions.loginThemeResourcesFromKeycloakVersion ??
-            LOGIN_THEME_RESOURCES_FROMkEYCLOAK_VERSION_DEFAULT,
         projectDirPath,
         projectBuildDirPath,
         keycloakifyBuildDirPath: (() => {
             if (buildOptions.keycloakifyBuildDirPath !== undefined) {
                 return getAbsoluteAndInOsFormatPath({
                     pathIsh: buildOptions.keycloakifyBuildDirPath,
-                    cwd: projectDirPath
+                    cwd: relativePathsCwd
                 });
             }
 
@@ -583,7 +651,7 @@ export function getBuildContext(params: {
                 if (parsedPackageJson.keycloakify.publicDirPath !== undefined) {
                     return getAbsoluteAndInOsFormatPath({
                         pathIsh: parsedPackageJson.keycloakify.publicDirPath,
-                        cwd: projectDirPath
+                        cwd: relativePathsCwd
                     });
                 }
 
@@ -655,7 +723,7 @@ export function getBuildContext(params: {
                         pathIsh:
                             parsedPackageJson.keycloakify
                                 .staticDirPathInProjectBuildDirPath,
-                        cwd: projectBuildDirPath
+                        cwd: relativePathsCwd
                     });
                 }
 
@@ -756,7 +824,11 @@ export function getBuildContext(params: {
                                 return "24" as const;
                             }
 
-                            return "25-and-above" as const;
+                            if (buildForKeycloakMajorVersionNumber === 25) {
+                                return "25" as const;
+                            }
+
+                            return "26-and-above" as const;
                         })();
 
                         assert<
@@ -769,11 +841,14 @@ export function getBuildContext(params: {
                         return keycloakVersionRange;
                     } else {
                         const keycloakVersionRange = (() => {
-                            if (buildForKeycloakMajorVersionNumber <= 21) {
-                                return "21-and-below" as const;
+                            if (
+                                buildForKeycloakMajorVersionNumber <= 21 ||
+                                buildForKeycloakMajorVersionNumber >= 26
+                            ) {
+                                return "all-other-versions" as const;
                             }
 
-                            return "22-and-above" as const;
+                            return "22-to-25" as const;
                         })();
 
                         assert<
@@ -791,6 +866,12 @@ export function getBuildContext(params: {
                     use_custom_jar_basename: {
                         const { keycloakVersionTargets } = buildOptions;
 
+                        assert(
+                            is<Record<KeycloakVersionRange, string | boolean>>(
+                                keycloakVersionTargets
+                            )
+                        );
+
                         if (keycloakVersionTargets === undefined) {
                             break use_custom_jar_basename;
                         }
@@ -835,7 +916,8 @@ export function getBuildContext(params: {
                         "21-and-below",
                         "23",
                         "24",
-                        "25-and-above"
+                        "25",
+                        "26-and-above"
                     ] as const) {
                         assert<
                             Equals<
@@ -851,8 +933,8 @@ export function getBuildContext(params: {
                     }
                 } else {
                     for (const keycloakVersionRange of [
-                        "21-and-below",
-                        "22-and-above"
+                        "22-to-25",
+                        "all-other-versions"
                     ] as const) {
                         assert<
                             Equals<
@@ -878,7 +960,17 @@ export function getBuildContext(params: {
             const jarTargets: BuildContext["jarTargets"] = [];
 
             for (const [keycloakVersionRange, jarNameOrBoolean] of objectEntries(
-                buildOptions.keycloakVersionTargets
+                (() => {
+                    const { keycloakVersionTargets } = buildOptions;
+
+                    assert(
+                        is<Record<KeycloakVersionRange, string | boolean>>(
+                            keycloakVersionTargets
+                        )
+                    );
+
+                    return keycloakVersionTargets;
+                })()
             )) {
                 if (jarNameOrBoolean === false) {
                     continue;
@@ -959,7 +1051,7 @@ export function getBuildContext(params: {
                         type: "path",
                         path: getAbsoluteAndInOsFormatPath({
                             pathIsh: urlOrPath,
-                            cwd: projectDirPath
+                            cwd: relativePathsCwd
                         })
                     };
                 }
@@ -969,7 +1061,7 @@ export function getBuildContext(params: {
                     ? undefined
                     : getAbsoluteAndInOsFormatPath({
                           pathIsh: buildOptions.startKeycloakOptions.realmJsonFilePath,
-                          cwd: projectDirPath
+                          cwd: relativePathsCwd
                       }),
             port: buildOptions.startKeycloakOptions?.port
         }

src/bin/shared/constants.ts

@@ -1,16 +1,17 @@
-export const KEYCLOAK_RESOURCES = "keycloak-resources";
-export const RESOURCES_COMMON = "resources-common";
-export const LAST_KEYCLOAK_VERSION_WITH_ACCOUNT_V1 = "21.1.2";
-export const BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR = "dist";
+export const WELL_KNOWN_DIRECTORY_BASE_NAME = {
+    KEYCLOAKIFY_DEV_RESOURCES: "keycloakify-dev-resources",
+    RESOURCES_COMMON: "resources-common",
+    DIST: "dist"
+} as const;
 
-export const THEME_TYPES = ["login", "account"] as const;
-export const ACCOUNT_V1_THEME_NAME = "account-v1";
+export const THEME_TYPES = ["login", "account", "admin"] as const;
 
 export type ThemeType = (typeof THEME_TYPES)[number];
 
 export const VITE_PLUGIN_SUB_SCRIPTS_ENV_NAMES = {
     RUN_POST_BUILD_SCRIPT: "KEYCLOAKIFY_RUN_POST_BUILD_SCRIPT",
-    RESOLVE_VITE_CONFIG: "KEYCLOAKIFY_RESOLVE_VITE_CONFIG"
+    RESOLVE_VITE_CONFIG: "KEYCLOAKIFY_RESOLVE_VITE_CONFIG",
+    READ_KC_CONTEXT_FROM_URL: "KEYCLOAKIFY_READ_KC_CONTEXT_FROM_URL"
 } as const;
 
 export const BUILD_FOR_KEYCLOAK_MAJOR_VERSION_ENV_NAME =
@@ -50,7 +51,9 @@ export const LOGIN_THEME_PAGE_IDS = [
     "login-recovery-authn-code-input.ftl",
     "login-reset-otp.ftl",
     "login-x509-info.ftl",
-    "webauthn-error.ftl"
+    "webauthn-error.ftl",
+    "login-passkeys-conditional-authenticate.ftl",
+    "login-idp-link-confirm-override.ftl"
 ] as const;
 
 export const ACCOUNT_THEME_PAGE_IDS = [
@@ -70,4 +73,17 @@ export const CONTAINER_NAME = "keycloak-keycloakify";
 
 export const FALLBACK_LANGUAGE_TAG = "en";
 
-export const LOGIN_THEME_RESOURCES_FROMkEYCLOAK_VERSION_DEFAULT = "24.0.4";
+export const CUSTOM_HANDLER_ENV_NAMES = {
+    COMMAND_NAME: "KEYCLOAKIFY_COMMAND_NAME",
+    BUILD_CONTEXT: "KEYCLOAKIFY_BUILD_CONTEXT"
+};
+
+export const KEYCLOAK_THEME = "keycloak-theme";
+
+export const KEYCLOAKIFY_SPA_DEV_SERVER_PORT = "KEYCLOAKIFY_SPA_DEV_SERVER_PORT";
+
+export const KEYCLOAKIFY_LOGGING_VERSION = "1.0.3";
+
+export const KEYCLOAKIFY_LOGIN_JAR_BASENAME = `keycloakify-logging-${KEYCLOAKIFY_LOGGING_VERSION}.jar`;
+
+export const TEST_APP_URL = "https://my-theme.keycloakify.dev";

src/bin/shared/copyKeycloakResourcesToPublic.ts

@@ -1,101 +0,0 @@
-import {
-    downloadKeycloakStaticResources,
-    type BuildContextLike as BuildContextLike_downloadKeycloakStaticResources
-} from "./downloadKeycloakStaticResources";
-import { join as pathJoin, relative as pathRelative } from "path";
-import {
-    THEME_TYPES,
-    KEYCLOAK_RESOURCES,
-    LAST_KEYCLOAK_VERSION_WITH_ACCOUNT_V1
-} from "../shared/constants";
-import { readThisNpmPackageVersion } from "../tools/readThisNpmPackageVersion";
-import { assert } from "tsafe/assert";
-import * as fs from "fs";
-import { rmSync } from "../tools/fs.rmSync";
-import type { BuildContext } from "./buildContext";
-
-export type BuildContextLike = BuildContextLike_downloadKeycloakStaticResources & {
-    loginThemeResourcesFromKeycloakVersion: string;
-    publicDirPath: string;
-};
-
-assert<BuildContext extends BuildContextLike ? true : false>();
-
-export async function copyKeycloakResourcesToPublic(params: {
-    buildContext: BuildContextLike;
-}) {
-    const { buildContext } = params;
-
-    const destDirPath = pathJoin(buildContext.publicDirPath, KEYCLOAK_RESOURCES);
-
-    const keycloakifyBuildinfoFilePath = pathJoin(destDirPath, "keycloakify.buildinfo");
-
-    const keycloakifyBuildinfoRaw = JSON.stringify(
-        {
-            destDirPath,
-            keycloakifyVersion: readThisNpmPackageVersion(),
-            buildContext: {
-                loginThemeResourcesFromKeycloakVersion: readThisNpmPackageVersion(),
-                cacheDirPath: pathRelative(destDirPath, buildContext.cacheDirPath),
-                fetchOptions: buildContext.fetchOptions
-            }
-        },
-        null,
-        2
-    );
-
-    skip_if_already_done: {
-        if (!fs.existsSync(keycloakifyBuildinfoFilePath)) {
-            break skip_if_already_done;
-        }
-
-        const keycloakifyBuildinfoRaw_previousRun = fs
-            .readFileSync(keycloakifyBuildinfoFilePath)
-            .toString("utf8");
-
-        if (keycloakifyBuildinfoRaw_previousRun !== keycloakifyBuildinfoRaw) {
-            break skip_if_already_done;
-        }
-
-        return;
-    }
-
-    rmSync(destDirPath, { force: true, recursive: true });
-
-    fs.mkdirSync(destDirPath, { recursive: true });
-
-    fs.writeFileSync(pathJoin(destDirPath, ".gitignore"), Buffer.from("*", "utf8"));
-
-    for (const themeType of THEME_TYPES) {
-        await downloadKeycloakStaticResources({
-            keycloakVersion: (() => {
-                switch (themeType) {
-                    case "login":
-                        return buildContext.loginThemeResourcesFromKeycloakVersion;
-                    case "account":
-                        return LAST_KEYCLOAK_VERSION_WITH_ACCOUNT_V1;
-                }
-            })(),
-            themeType,
-            themeDirPath: destDirPath,
-            buildContext
-        });
-    }
-
-    fs.writeFileSync(
-        pathJoin(destDirPath, "README.txt"),
-        Buffer.from(
-            // prettier-ignore
-            [
-                "This is just a test folder that helps develop",
-                "the login and register page without having to run a Keycloak container\n",
-                "This directory will be automatically excluded from the final build."
-            ].join(" ")
-        )
-    );
-
-    fs.writeFileSync(
-        keycloakifyBuildinfoFilePath,
-        Buffer.from(keycloakifyBuildinfoRaw, "utf8")
-    );
-}

src/bin/shared/customHandler.ts

@@ -0,0 +1,43 @@
+import { assert } from "tsafe/assert";
+import type { BuildContext } from "./buildContext";
+import { CUSTOM_HANDLER_ENV_NAMES } from "./constants";
+
+export const BIN_NAME = "_keycloakify-custom-handler";
+
+export const NOT_IMPLEMENTED_EXIT_CODE = 78;
+
+export type CommandName =
+    | "update-kc-gen"
+    | "eject-page"
+    | "add-story"
+    | "initialize-account-theme"
+    | "initialize-admin-theme"
+    | "initialize-admin-theme"
+    | "initialize-email-theme"
+    | "copy-keycloak-resources-to-public";
+
+export type ApiVersion = "v1";
+
+export function readParams(params: { apiVersion: ApiVersion }) {
+    const { apiVersion } = params;
+
+    assert(apiVersion === "v1");
+
+    const commandName = (() => {
+        const envValue = process.env[CUSTOM_HANDLER_ENV_NAMES.COMMAND_NAME];
+
+        assert(envValue !== undefined);
+
+        return envValue as CommandName;
+    })();
+
+    const buildContext = (() => {
+        const envValue = process.env[CUSTOM_HANDLER_ENV_NAMES.BUILD_CONTEXT];
+
+        assert(envValue !== undefined);
+
+        return JSON.parse(envValue) as BuildContext;
+    })();
+
+    return { commandName, buildContext };
+}

src/bin/shared/customHandler_delegate.ts

@@ -0,0 +1,50 @@
+import { assert, type Equals } from "tsafe/assert";
+import type { BuildContext } from "./buildContext";
+import { CUSTOM_HANDLER_ENV_NAMES } from "./constants";
+import {
+    NOT_IMPLEMENTED_EXIT_CODE,
+    type CommandName,
+    BIN_NAME,
+    ApiVersion
+} from "./customHandler";
+import * as child_process from "child_process";
+import { getNodeModulesBinDirPath } from "../tools/nodeModulesBinDirPath";
+import * as fs from "fs";
+
+assert<Equals<ApiVersion, "v1">>();
+
+export async function maybeDelegateCommandToCustomHandler(params: {
+    commandName: CommandName;
+    buildContext: BuildContext;
+}): Promise<{ hasBeenHandled: boolean }> {
+    const { commandName, buildContext } = params;
+
+    const nodeModulesBinDirPath = await getNodeModulesBinDirPath({
+        packageJsonFilePath: buildContext.packageJsonFilePath
+    });
+
+    if (!fs.readdirSync(nodeModulesBinDirPath).includes(BIN_NAME)) {
+        return { hasBeenHandled: false };
+    }
+
+    try {
+        child_process.execSync(`npx ${BIN_NAME}`, {
+            stdio: "inherit",
+            env: {
+                ...process.env,
+                [CUSTOM_HANDLER_ENV_NAMES.COMMAND_NAME]: commandName,
+                [CUSTOM_HANDLER_ENV_NAMES.BUILD_CONTEXT]: JSON.stringify(buildContext)
+            }
+        });
+    } catch (error: any) {
+        const status = error.status;
+
+        if (status === NOT_IMPLEMENTED_EXIT_CODE) {
+            return { hasBeenHandled: false };
+        }
+
+        process.exit(status);
+    }
+
+    return { hasBeenHandled: true };
+}

src/bin/shared/downloadKeycloakStaticResources.ts

@@ -1,53 +0,0 @@
-import { transformCodebase } from "../tools/transformCodebase";
-import { join as pathJoin } from "path";
-import {
-    downloadKeycloakDefaultTheme,
-    type BuildContextLike as BuildContextLike_downloadKeycloakDefaultTheme
-} from "./downloadKeycloakDefaultTheme";
-import { RESOURCES_COMMON, type ThemeType } from "./constants";
-import type { BuildContext } from "./buildContext";
-import { assert } from "tsafe/assert";
-import { existsAsync } from "../tools/fs.existsAsync";
-
-export type BuildContextLike = BuildContextLike_downloadKeycloakDefaultTheme & {};
-
-assert<BuildContext extends BuildContextLike ? true : false>();
-
-export async function downloadKeycloakStaticResources(params: {
-    themeType: ThemeType;
-    themeDirPath: string;
-    keycloakVersion: string;
-    buildContext: BuildContextLike;
-}) {
-    const { themeType, themeDirPath, keycloakVersion, buildContext } = params;
-
-    const { defaultThemeDirPath } = await downloadKeycloakDefaultTheme({
-        keycloakVersion,
-        buildContext
-    });
-
-    const resourcesDirPath = pathJoin(themeDirPath, themeType, "resources");
-
-    repatriate_base_resources: {
-        const srcDirPath = pathJoin(defaultThemeDirPath, "base", themeType, "resources");
-
-        if (!(await existsAsync(srcDirPath))) {
-            break repatriate_base_resources;
-        }
-
-        transformCodebase({
-            srcDirPath,
-            destDirPath: resourcesDirPath
-        });
-    }
-
-    transformCodebase({
-        srcDirPath: pathJoin(defaultThemeDirPath, "keycloak", themeType, "resources"),
-        destDirPath: resourcesDirPath
-    });
-
-    transformCodebase({
-        srcDirPath: pathJoin(defaultThemeDirPath, "keycloak", "common", "resources"),
-        destDirPath: pathJoin(resourcesDirPath, RESOURCES_COMMON)
-    });
-}

src/bin/shared/exitIfUncommittedChanges.ts

@@ -0,0 +1,36 @@
+import child_process from "child_process";
+import chalk from "chalk";
+
+export function exitIfUncommittedChanges(params: { projectDirPath: string }) {
+    const { projectDirPath } = params;
+
+    let hasUncommittedChanges: boolean | undefined = undefined;
+
+    try {
+        hasUncommittedChanges =
+            child_process
+                .execSync(`git status --porcelain`, {
+                    cwd: projectDirPath
+                })
+                .toString()
+                .trim() !== "";
+    } catch {
+        // Probably not a git repository
+        return;
+    }
+
+    if (!hasUncommittedChanges) {
+        return;
+    }
+    console.warn(
+        [
+            chalk.red(
+                "Please commit or stash your changes before running this command.\n"
+            ),
+            "This command will modify your project's files so it's better to have a clean working directory",
+            "so that you can easily see what has been changed and revert if needed."
+        ].join(" ")
+    );
+
+    process.exit(-1);
+}

src/bin/shared/generateKcGenTs.ts

@@ -1,175 +0,0 @@
-import { assert, type Equals } from "tsafe/assert";
-import { id } from "tsafe/id";
-import type { BuildContext } from "./buildContext";
-import * as fs from "fs/promises";
-import { join as pathJoin } from "path";
-import { existsAsync } from "../tools/fs.existsAsync";
-import { z } from "zod";
-
-export type BuildContextLike = {
-    projectDirPath: string;
-    themeNames: string[];
-    environmentVariables: { name: string; default: string }[];
-    themeSrcDirPath: string;
-    implementedThemeTypes: Pick<
-        BuildContext["implementedThemeTypes"],
-        "login" | "account"
-    >;
-    packageJsonFilePath: string;
-};
-
-assert<BuildContext extends BuildContextLike ? true : false>();
-
-export async function generateKcGenTs(params: {
-    buildContext: BuildContextLike;
-}): Promise<void> {
-    const { buildContext } = params;
-
-    const isReactProject: boolean = await (async () => {
-        const parsedPackageJson = await (async () => {
-            type ParsedPackageJson = {
-                dependencies?: Record<string, string>;
-                devDependencies?: Record<string, string>;
-            };
-
-            const zParsedPackageJson = (() => {
-                type TargetType = ParsedPackageJson;
-
-                const zTargetType = z.object({
-                    dependencies: z.record(z.string()).optional(),
-                    devDependencies: z.record(z.string()).optional()
-                });
-
-                assert<Equals<z.infer<typeof zTargetType>, TargetType>>();
-
-                return id<z.ZodType<TargetType>>(zTargetType);
-            })();
-
-            return zParsedPackageJson.parse(
-                JSON.parse(
-                    (await fs.readFile(buildContext.packageJsonFilePath)).toString("utf8")
-                )
-            );
-        })();
-
-        return (
-            {
-                ...parsedPackageJson.dependencies,
-                ...parsedPackageJson.devDependencies
-            }.react !== undefined
-        );
-    })();
-
-    const filePath = pathJoin(
-        buildContext.themeSrcDirPath,
-        `kc.gen.ts${isReactProject ? "x" : ""}`
-    );
-
-    const currentContent = (await existsAsync(filePath))
-        ? await fs.readFile(filePath)
-        : undefined;
-
-    const hasLoginTheme = buildContext.implementedThemeTypes.login.isImplemented;
-    const hasAccountTheme = buildContext.implementedThemeTypes.account.isImplemented;
-
-    const newContent = Buffer.from(
-        [
-            `/* prettier-ignore-start */`,
-            ``,
-            `/* eslint-disable */`,
-            ``,
-            `// @ts-nocheck`,
-            ``,
-            `// noinspection JSUnusedGlobalSymbols`,
-            ``,
-            `// This file is auto-generated by Keycloakify`,
-            ``,
-            isReactProject && `import { lazy, Suspense, type ReactNode } from "react";`,
-            ``,
-            `export type ThemeName = ${buildContext.themeNames.map(themeName => `"${themeName}"`).join(" | ")};`,
-            ``,
-            `export const themeNames: ThemeName[] = [${buildContext.themeNames.map(themeName => `"${themeName}"`).join(", ")}];`,
-            ``,
-            `export type KcEnvName = ${buildContext.environmentVariables.length === 0 ? "never" : buildContext.environmentVariables.map(({ name }) => `"${name}"`).join(" | ")};`,
-            ``,
-            `export const kcEnvNames: KcEnvName[] = [${buildContext.environmentVariables.map(({ name }) => `"${name}"`).join(", ")}];`,
-            ``,
-            `export const kcEnvDefaults: Record<KcEnvName, string> = ${JSON.stringify(
-                Object.fromEntries(
-                    buildContext.environmentVariables.map(
-                        ({ name, default: defaultValue }) => [name, defaultValue]
-                    )
-                ),
-                null,
-                2
-            )};`,
-            ``,
-            `export type KcContext =`,
-            hasLoginTheme && `    | import("./login/KcContext").KcContext`,
-            hasAccountTheme && `    | import("./account/KcContext").KcContext`,
-            `    ;`,
-            ``,
-            `declare global {`,
-            `    interface Window {`,
-            `        kcContext?: KcContext;`,
-            `    }`,
-            `}`,
-            ``,
-            ...(!isReactProject
-                ? []
-                : [
-                      hasLoginTheme &&
-                          `export const KcLoginPage = lazy(() => import("./login/KcPage"));`,
-                      hasAccountTheme &&
-                          `export const KcAccountPage = lazy(() => import("./account/KcPage"));`,
-                      ``,
-                      `export function KcPage(`,
-                      `    props: {`,
-                      `        kcContext: KcContext;`,
-                      `        fallback?: ReactNode;`,
-                      `    }`,
-                      `) {`,
-                      `    const { kcContext, fallback } = props;`,
-                      `    return (`,
-                      `        <Suspense fallback={fallback}>`,
-                      `            {(() => {`,
-                      `                switch (kcContext.themeType) {`,
-                      hasLoginTheme &&
-                          `                    case "login": return <KcLoginPage kcContext={kcContext} />;`,
-                      hasAccountTheme &&
-                          `                    case "account": return <KcAccountPage kcContext={kcContext} />;`,
-                      `                }`,
-                      `            })()}`,
-                      `        </Suspense>`,
-                      `    );`,
-                      `}`
-                  ]),
-            ``,
-            `/* prettier-ignore-end */`,
-            ``
-        ]
-            .filter(item => typeof item === "string")
-            .join("\n"),
-        "utf8"
-    );
-
-    if (currentContent !== undefined && currentContent.equals(newContent)) {
-        return;
-    }
-
-    await fs.writeFile(filePath, newContent);
-
-    delete_legacy_file: {
-        if (!isReactProject) {
-            break delete_legacy_file;
-        }
-
-        const legacyFilePath = filePath.replace(/tsx$/, "ts");
-
-        if (!(await existsAsync(legacyFilePath))) {
-            break delete_legacy_file;
-        }
-
-        await fs.unlink(legacyFilePath);
-    }
-}

src/bin/shared/getLatestsSemVersionedTag.ts

@@ -1,201 +0,0 @@
-import { getLatestsSemVersionedTagFactory } from "../tools/octokit-addons/getLatestsSemVersionedTag";
-import { Octokit } from "@octokit/rest";
-import type { ReturnType } from "tsafe";
-import type { Param0 } from "tsafe";
-import { join as pathJoin, dirname as pathDirname } from "path";
-import * as fs from "fs";
-import { z } from "zod";
-import { assert, type Equals } from "tsafe/assert";
-import { id } from "tsafe/id";
-import type { SemVer } from "../tools/SemVer";
-import { same } from "evt/tools/inDepth/same";
-import type { BuildContext } from "./buildContext";
-import fetch from "make-fetch-happen";
-
-type GetLatestsSemVersionedTag = ReturnType<
-    typeof getLatestsSemVersionedTagFactory
->["getLatestsSemVersionedTag"];
-
-type Params = Param0<GetLatestsSemVersionedTag>;
-type R = ReturnType<GetLatestsSemVersionedTag>;
-
-let getLatestsSemVersionedTag_stateless: GetLatestsSemVersionedTag | undefined =
-    undefined;
-
-const CACHE_VERSION = 1;
-
-type Cache = {
-    version: typeof CACHE_VERSION;
-    entries: {
-        time: number;
-        params: Params;
-        result: R;
-    }[];
-};
-
-export type BuildContextLike = {
-    cacheDirPath: string;
-    fetchOptions: BuildContext["fetchOptions"];
-};
-
-assert<BuildContext extends BuildContextLike ? true : false>();
-
-export async function getLatestsSemVersionedTag({
-    buildContext,
-    ...params
-}: Params & {
-    buildContext: BuildContextLike;
-}): Promise<R> {
-    const cacheFilePath = pathJoin(
-        buildContext.cacheDirPath,
-        "latest-sem-versioned-tags.json"
-    );
-
-    const cacheLookupResult = (() => {
-        const getResult_currentCache = (currentCacheEntries: Cache["entries"]) => ({
-            hasCachedResult: false as const,
-            currentCache: {
-                version: CACHE_VERSION,
-                entries: currentCacheEntries
-            }
-        });
-
-        if (!fs.existsSync(cacheFilePath)) {
-            return getResult_currentCache([]);
-        }
-
-        let cache_json;
-
-        try {
-            cache_json = fs.readFileSync(cacheFilePath).toString("utf8");
-        } catch {
-            return getResult_currentCache([]);
-        }
-
-        let cache_json_parsed: unknown;
-
-        try {
-            cache_json_parsed = JSON.parse(cache_json);
-        } catch {
-            return getResult_currentCache([]);
-        }
-
-        const zSemVer = (() => {
-            type TargetType = SemVer;
-
-            const zTargetType = z.object({
-                major: z.number(),
-                minor: z.number(),
-                patch: z.number(),
-                rc: z.number().optional(),
-                parsedFrom: z.string()
-            });
-
-            assert<Equals<z.infer<typeof zTargetType>, TargetType>>();
-
-            return id<z.ZodType<TargetType>>(zTargetType);
-        })();
-
-        const zCache = (() => {
-            type TargetType = Cache;
-
-            const zTargetType = z.object({
-                version: z.literal(CACHE_VERSION),
-                entries: z.array(
-                    z.object({
-                        time: z.number(),
-                        params: z.object({
-                            owner: z.string(),
-                            repo: z.string(),
-                            count: z.number(),
-                            doIgnoreReleaseCandidates: z.boolean()
-                        }),
-                        result: z.array(
-                            z.object({
-                                tag: z.string(),
-                                version: zSemVer
-                            })
-                        )
-                    })
-                )
-            });
-
-            assert<Equals<z.infer<typeof zTargetType>, TargetType>>();
-
-            return id<z.ZodType<TargetType>>(zTargetType);
-        })();
-
-        let cache: Cache;
-
-        try {
-            cache = zCache.parse(cache_json_parsed);
-        } catch {
-            return getResult_currentCache([]);
-        }
-
-        const cacheEntry = cache.entries.find(e => same(e.params, params));
-
-        if (cacheEntry === undefined) {
-            return getResult_currentCache(cache.entries);
-        }
-
-        if (Date.now() - cacheEntry.time > 3_600_000) {
-            return getResult_currentCache(cache.entries.filter(e => e !== cacheEntry));
-        }
-        return {
-            hasCachedResult: true as const,
-            cachedResult: cacheEntry.result
-        };
-    })();
-
-    if (cacheLookupResult.hasCachedResult) {
-        return cacheLookupResult.cachedResult;
-    }
-
-    const { currentCache } = cacheLookupResult;
-
-    getLatestsSemVersionedTag_stateless ??= (() => {
-        const octokit = (() => {
-            const githubToken = process.env.GITHUB_TOKEN;
-
-            const octokit = new Octokit({
-                ...(githubToken === undefined ? {} : { auth: githubToken }),
-                request: {
-                    fetch: (url: string, options?: any) =>
-                        fetch(url, {
-                            ...options,
-                            ...buildContext.fetchOptions
-                        })
-                }
-            });
-
-            return octokit;
-        })();
-
-        const { getLatestsSemVersionedTag } = getLatestsSemVersionedTagFactory({
-            octokit
-        });
-
-        return getLatestsSemVersionedTag;
-    })();
-
-    const result = await getLatestsSemVersionedTag_stateless(params);
-
-    currentCache.entries.push({
-        time: Date.now(),
-        params,
-        result
-    });
-
-    {
-        const dirPath = pathDirname(cacheFilePath);
-
-        if (!fs.existsSync(dirPath)) {
-            fs.mkdirSync(dirPath, { recursive: true });
-        }
-    }
-
-    fs.writeFileSync(cacheFilePath, JSON.stringify(currentCache, null, 2));
-
-    return result;
-}

src/bin/shared/initializeSpa.ts

@@ -0,0 +1,156 @@
+import { dirname as pathDirname, join as pathJoin, relative as pathRelative } from "path";
+import type { BuildContext } from "./buildContext";
+import * as fs from "fs";
+import { assert, is, type Equals } from "tsafe/assert";
+import { id } from "tsafe/id";
+import {
+    addSyncExtensionsToPostinstallScript,
+    type BuildContextLike as BuildContextLike_addSyncExtensionsToPostinstallScript
+} from "./addSyncExtensionsToPostinstallScript";
+import { getIsPrettierAvailable, runPrettier } from "../tools/runPrettier";
+import { npmInstall } from "../tools/npmInstall";
+import * as child_process from "child_process";
+import { z } from "zod";
+import chalk from "chalk";
+
+export type BuildContextLike = BuildContextLike_addSyncExtensionsToPostinstallScript & {
+    themeSrcDirPath: string;
+    packageJsonFilePath: string;
+};
+
+assert<BuildContext extends BuildContextLike ? true : false>();
+
+export async function initializeSpa(params: {
+    themeType: "account" | "admin";
+    buildContext: BuildContextLike;
+}) {
+    const { themeType, buildContext } = params;
+
+    {
+        const themeTypeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, themeType);
+
+        if (
+            fs.existsSync(themeTypeSrcDirPath) &&
+            fs.readdirSync(themeTypeSrcDirPath).length > 0
+        ) {
+            console.warn(
+                chalk.red(
+                    `There is already a ${pathRelative(
+                        process.cwd(),
+                        themeTypeSrcDirPath
+                    )} directory in your project. Aborting.`
+                )
+            );
+
+            process.exit(-1);
+        }
+    }
+
+    const parsedPackageJson = (() => {
+        type ParsedPackageJson = {
+            scripts?: Record<string, string | undefined>;
+            dependencies?: Record<string, string | undefined>;
+            devDependencies?: Record<string, string | undefined>;
+        };
+
+        const zParsedPackageJson = (() => {
+            type TargetType = ParsedPackageJson;
+
+            const zTargetType = z.object({
+                scripts: z.record(z.union([z.string(), z.undefined()])).optional(),
+                dependencies: z.record(z.union([z.string(), z.undefined()])).optional(),
+                devDependencies: z.record(z.union([z.string(), z.undefined()])).optional()
+            });
+
+            assert<Equals<z.infer<typeof zTargetType>, TargetType>>;
+
+            return id<z.ZodType<TargetType>>(zTargetType);
+        })();
+        const parsedPackageJson = JSON.parse(
+            fs.readFileSync(buildContext.packageJsonFilePath).toString("utf8")
+        );
+
+        zParsedPackageJson.parse(parsedPackageJson);
+
+        assert(is<ParsedPackageJson>(parsedPackageJson));
+
+        return parsedPackageJson;
+    })();
+
+    addSyncExtensionsToPostinstallScript({
+        parsedPackageJson,
+        buildContext
+    });
+
+    const uiSharedMajor = (() => {
+        const dependencies = {
+            ...parsedPackageJson.devDependencies,
+            ...parsedPackageJson.dependencies
+        };
+
+        const version = dependencies["@keycloakify/keycloak-ui-shared"];
+
+        if (version === undefined) {
+            return undefined;
+        }
+
+        const match = version.match(/^[^~]?(\d+)\./);
+
+        if (match === null) {
+            return undefined;
+        }
+
+        return match[1];
+    })();
+
+    const moduleName = `@keycloakify/keycloak-${themeType}-ui`;
+
+    const version = ((): string[] => {
+        const cmdOutput = child_process
+            .execSync(`npm show ${moduleName} versions --json`)
+            .toString("utf8")
+            .trim();
+
+        const versions = JSON.parse(cmdOutput) as string | string[];
+
+        // NOTE: Bug in some older npm versions
+        if (typeof versions === "string") {
+            return [versions];
+        }
+
+        return versions;
+    })()
+        .reverse()
+        .filter(version => !version.includes("-"))
+        .find(version =>
+            uiSharedMajor === undefined ? true : version.startsWith(`${uiSharedMajor}.`)
+        );
+
+    assert(version !== undefined);
+
+    (parsedPackageJson.dependencies ??= {})[moduleName] = `~${version}`;
+
+    if (parsedPackageJson.devDependencies !== undefined) {
+        delete parsedPackageJson.devDependencies[moduleName];
+    }
+
+    {
+        let sourceCode = JSON.stringify(parsedPackageJson, undefined, 2);
+
+        if (await getIsPrettierAvailable()) {
+            sourceCode = await runPrettier({
+                sourceCode,
+                filePath: buildContext.packageJsonFilePath
+            });
+        }
+
+        fs.writeFileSync(
+            buildContext.packageJsonFilePath,
+            Buffer.from(sourceCode, "utf8")
+        );
+    }
+
+    await npmInstall({
+        packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath)
+    });
+}

src/bin/shared/metaInfKeycloakThemes.ts

@@ -1,40 +0,0 @@
-import { join as pathJoin, dirname as pathDirname } from "path";
-import type { ThemeType } from "./constants";
-import * as fs from "fs";
-
-export type MetaInfKeycloakTheme = {
-    themes: { name: string; types: (ThemeType | "email")[] }[];
-};
-
-export function writeMetaInfKeycloakThemes(params: {
-    resourcesDirPath: string;
-    getNewMetaInfKeycloakTheme: (params: {
-        metaInfKeycloakTheme: MetaInfKeycloakTheme | undefined;
-    }) => MetaInfKeycloakTheme;
-}) {
-    const { resourcesDirPath, getNewMetaInfKeycloakTheme } = params;
-
-    const filePath = pathJoin(resourcesDirPath, "META-INF", "keycloak-themes.json");
-
-    const currentMetaInfKeycloakTheme = !fs.existsSync(filePath)
-        ? undefined
-        : (JSON.parse(
-              fs.readFileSync(filePath).toString("utf8")
-          ) as MetaInfKeycloakTheme);
-
-    const newMetaInfKeycloakThemes = getNewMetaInfKeycloakTheme({
-        metaInfKeycloakTheme: currentMetaInfKeycloakTheme
-    });
-
-    {
-        const dirPath = pathDirname(filePath);
-        if (!fs.existsSync(dirPath)) {
-            fs.mkdirSync(dirPath, { recursive: true });
-        }
-    }
-
-    fs.writeFileSync(
-        filePath,
-        Buffer.from(JSON.stringify(newMetaInfKeycloakThemes, null, 2), "utf8")
-    );
-}

src/bin/shared/promptKeycloakVersion.ts

@@ -1,70 +0,0 @@
-import {
-    getLatestsSemVersionedTag,
-    type BuildContextLike as BuildContextLike_getLatestsSemVersionedTag
-} from "./getLatestsSemVersionedTag";
-import cliSelect from "cli-select";
-import { assert } from "tsafe/assert";
-import { SemVer } from "../tools/SemVer";
-import type { BuildContext } from "./buildContext";
-
-export type BuildContextLike = BuildContextLike_getLatestsSemVersionedTag & {};
-
-assert<BuildContext extends BuildContextLike ? true : false>();
-
-export async function promptKeycloakVersion(params: {
-    startingFromMajor: number | undefined;
-    excludeMajorVersions: number[];
-    buildContext: BuildContextLike;
-}) {
-    const { startingFromMajor, excludeMajorVersions, buildContext } = params;
-
-    const semVersionedTagByMajor = new Map<number, { tag: string; version: SemVer }>();
-
-    const semVersionedTags = await getLatestsSemVersionedTag({
-        count: 50,
-        owner: "keycloak",
-        repo: "keycloak",
-        doIgnoreReleaseCandidates: true,
-        buildContext
-    });
-
-    semVersionedTags.forEach(semVersionedTag => {
-        if (
-            startingFromMajor !== undefined &&
-            semVersionedTag.version.major < startingFromMajor
-        ) {
-            return;
-        }
-
-        if (excludeMajorVersions.includes(semVersionedTag.version.major)) {
-            return;
-        }
-
-        const currentSemVersionedTag = semVersionedTagByMajor.get(
-            semVersionedTag.version.major
-        );
-
-        if (
-            currentSemVersionedTag !== undefined &&
-            SemVer.compare(semVersionedTag.version, currentSemVersionedTag.version) === -1
-        ) {
-            return;
-        }
-
-        semVersionedTagByMajor.set(semVersionedTag.version.major, semVersionedTag);
-    });
-
-    const lastMajorVersions = Array.from(semVersionedTagByMajor.values()).map(
-        ({ version }) => `${version.major}.${version.minor}`
-    );
-
-    const { value } = await cliSelect<string>({
-        values: lastMajorVersions
-    }).catch(() => {
-        process.exit(-1);
-    });
-
-    const keycloakVersion = value.split(" ")[0];
-
-    return { keycloakVersion };
-}

src/bin/start-keycloak/appBuild.ts

@@ -1,18 +1,17 @@
 import * as child_process from "child_process";
 import { Deferred } from "evt/tools/Deferred";
-import { assert } from "tsafe/assert";
+import { assert, is, type Equals } from "tsafe/assert";
+import { id } from "tsafe/id";
 import type { BuildContext } from "../shared/buildContext";
 import chalk from "chalk";
 import { sep as pathSep, join as pathJoin } from "path";
 import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath";
 import * as fs from "fs";
 import { dirname as pathDirname, relative as pathRelative } from "path";
+import { z } from "zod";
 
 export type BuildContextLike = {
     projectDirPath: string;
-    keycloakifyBuildDirPath: string;
-    bundler: BuildContext["bundler"];
-    projectBuildDirPath: string;
     packageJsonFilePath: string;
 };
 
@@ -23,58 +22,36 @@ export async function appBuild(params: {
 }): Promise<{ isAppBuildSuccess: boolean }> {
     const { buildContext } = params;
 
-    switch (buildContext.bundler) {
-        case "vite":
-            return appBuild_vite({ buildContext });
-        case "webpack":
-            return appBuild_webpack({ buildContext });
-    }
-}
+    const { parsedPackageJson } = (() => {
+        type ParsedPackageJson = {
+            scripts?: Record<string, string>;
+        };
 
-async function appBuild_vite(params: {
-    buildContext: BuildContextLike;
-}): Promise<{ isAppBuildSuccess: boolean }> {
-    const { buildContext } = params;
+        const zParsedPackageJson = (() => {
+            type TargetType = ParsedPackageJson;
 
-    assert(buildContext.bundler === "vite");
+            const zTargetType = z.object({
+                scripts: z.record(z.string()).optional()
+            });
 
-    const dIsSuccess = new Deferred<boolean>();
+            assert<Equals<z.infer<typeof zTargetType>, TargetType>>();
 
-    console.log(chalk.blue("$ npx vite build"));
+            return id<z.ZodType<TargetType>>(zTargetType);
+        })();
+        const parsedPackageJson = JSON.parse(
+            fs.readFileSync(buildContext.packageJsonFilePath).toString("utf8")
+        );
 
-    const child = child_process.spawn("npx", ["vite", "build"], {
-        cwd: buildContext.projectDirPath,
-        shell: true
-    });
+        zParsedPackageJson.parse(parsedPackageJson);
 
-    child.stdout.on("data", data => {
-        if (data.toString("utf8").includes("gzip:")) {
-            return;
-        }
+        assert(is<ParsedPackageJson>(parsedPackageJson));
 
-        process.stdout.write(data);
-    });
+        return { parsedPackageJson };
+    })();
 
-    child.stderr.on("data", data => process.stderr.write(data));
-
-    child.on("exit", code => dIsSuccess.resolve(code === 0));
-
-    const isSuccess = await dIsSuccess.pr;
-
-    return { isAppBuildSuccess: isSuccess };
-}
-
-async function appBuild_webpack(params: {
-    buildContext: BuildContextLike;
-}): Promise<{ isAppBuildSuccess: boolean }> {
-    const { buildContext } = params;
-
-    assert(buildContext.bundler === "webpack");
-
-    const entries = Object.entries(
-        (JSON.parse(fs.readFileSync(buildContext.packageJsonFilePath).toString("utf8"))
-            .scripts ?? {}) as Record<string, string>
-    ).filter(([, scriptCommand]) => scriptCommand.includes("keycloakify build"));
+    const entries = Object.entries(parsedPackageJson.scripts ?? {}).filter(
+        ([, scriptCommand]) => scriptCommand.includes("keycloakify build")
+    );
 
     if (entries.length === 0) {
         console.log(
@@ -127,6 +104,76 @@ async function appBuild_webpack(params: {
         process.exit(-1);
     }
 
+    common_case: {
+        if (appBuildSubCommands.length !== 1) {
+            break common_case;
+        }
+
+        const [appBuildSubCommand] = appBuildSubCommands;
+
+        const isNpmRunBuild = (() => {
+            for (const packageManager of ["npm", "yarn", "pnpm", "bun", "deno"]) {
+                for (const doUseRun of [true, false]) {
+                    if (
+                        `${packageManager}${doUseRun ? " run " : " "}build` ===
+                        appBuildSubCommand
+                    ) {
+                        return true;
+                    }
+                }
+            }
+
+            return false;
+        })();
+
+        if (!isNpmRunBuild) {
+            break common_case;
+        }
+
+        const { scripts } = parsedPackageJson;
+
+        assert(scripts !== undefined);
+
+        const buildCmd = scripts.build;
+
+        if (buildCmd !== "tsc && vite build") {
+            break common_case;
+        }
+
+        if (scripts.prebuild !== undefined) {
+            break common_case;
+        }
+
+        if (scripts.postbuild !== undefined) {
+            break common_case;
+        }
+
+        const dIsSuccess = new Deferred<boolean>();
+
+        console.log(chalk.blue("$ npx vite build"));
+
+        const child = child_process.spawn("npx", ["vite", "build"], {
+            cwd: buildContext.projectDirPath,
+            shell: true
+        });
+
+        child.stdout.on("data", data => {
+            if (data.toString("utf8").includes("gzip:")) {
+                return;
+            }
+
+            process.stdout.write(data);
+        });
+
+        child.stderr.on("data", data => process.stderr.write(data));
+
+        child.on("exit", code => dIsSuccess.resolve(code === 0));
+
+        const isSuccess = await dIsSuccess.pr;
+
+        return { isAppBuildSuccess: isSuccess };
+    }
+
     let commandCwd = pathDirname(buildContext.packageJsonFilePath);
 
     for (const subCommand of appBuildSubCommands) {

src/bin/start-keycloak/getSupportedDockerImageTags.ts

@@ -0,0 +1,267 @@
+import fetch from "make-fetch-happen";
+import type { BuildContext } from "../shared/buildContext";
+import { assert, type Equals } from "tsafe/assert";
+import { id } from "tsafe/id";
+import { z } from "zod";
+import { SemVer } from "../tools/SemVer";
+import { exclude } from "tsafe/exclude";
+import { getSupportedKeycloakMajorVersions } from "./realmConfig/defaultConfig";
+import { join as pathJoin, dirname as pathDirname } from "path";
+import * as fs from "fs/promises";
+import { existsAsync } from "../tools/fs.existsAsync";
+import { readThisNpmPackageVersion } from "../tools/readThisNpmPackageVersion";
+import type { ReturnType } from "tsafe";
+
+export type BuildContextLike = {
+    fetchOptions: BuildContext["fetchOptions"];
+    cacheDirPath: string;
+};
+
+assert<BuildContext extends BuildContextLike ? true : false>;
+
+export async function getSupportedDockerImageTags(params: {
+    buildContext: BuildContextLike;
+}): Promise<{
+    allSupportedTags: string[];
+    latestMajorTags: string[];
+}> {
+    const { buildContext } = params;
+
+    {
+        const result = await getCachedValue({ cacheDirPath: buildContext.cacheDirPath });
+
+        if (result !== undefined) {
+            return result;
+        }
+    }
+
+    const tags_queryResponse: string[] = [];
+
+    await (async function callee(url: string) {
+        const r = await fetch(url, buildContext.fetchOptions);
+
+        await Promise.all([
+            (async () => {
+                tags_queryResponse.push(
+                    ...z
+                        .object({
+                            tags: z.array(z.string())
+                        })
+                        .parse(await r.json()).tags
+                );
+            })(),
+            (async () => {
+                const link = r.headers.get("link");
+
+                if (link === null) {
+                    return;
+                }
+
+                const split = link.split(";").map(s => s.trim());
+
+                assert(split.length === 2);
+
+                assert(split[1] === 'rel="next"');
+
+                const match = split[0].match(/^<(.+)>$/);
+
+                assert(match !== null);
+
+                const nextUrl = new URL(url).origin + match[1];
+
+                await callee(nextUrl);
+            })()
+        ]);
+    })("https://quay.io/v2/keycloak/keycloak/tags/list");
+
+    const supportedKeycloakMajorVersions = getSupportedKeycloakMajorVersions();
+
+    const allSupportedTags_withVersion = tags_queryResponse
+        .map(tag => ({
+            tag,
+            version: (() => {
+                if (tag.includes("-")) {
+                    return undefined;
+                }
+
+                let version: SemVer;
+
+                try {
+                    version = SemVer.parse(tag);
+                } catch {
+                    return undefined;
+                }
+
+                if (tag.split(".").length !== 3) {
+                    return undefined;
+                }
+
+                if (!supportedKeycloakMajorVersions.includes(version.major)) {
+                    return undefined;
+                }
+
+                return version;
+            })()
+        }))
+        .map(({ tag, version }) => (version === undefined ? undefined : { tag, version }))
+        .filter(exclude(undefined))
+        .sort(({ version: a }, { version: b }) => SemVer.compare(b, a));
+
+    const latestTagByMajor: Record<number, SemVer | undefined> = {};
+
+    for (const { version } of allSupportedTags_withVersion) {
+        const version_current = latestTagByMajor[version.major];
+
+        if (
+            version_current === undefined ||
+            SemVer.compare(version_current, version) === -1
+        ) {
+            latestTagByMajor[version.major] = version;
+        }
+    }
+
+    const latestMajorTags = Object.entries(latestTagByMajor)
+        .sort(([a], [b]) => parseInt(b) - parseInt(a))
+        .map(([, version]) => version)
+        .map(version => {
+            assert(version !== undefined);
+
+            if (!supportedKeycloakMajorVersions.includes(version.major)) {
+                return undefined;
+            }
+
+            return SemVer.stringify(version);
+        })
+        .filter(exclude(undefined));
+
+    const allSupportedTags = allSupportedTags_withVersion.map(({ tag }) => tag);
+
+    const result = {
+        latestMajorTags,
+        allSupportedTags
+    };
+
+    await setCachedValue({ cacheDirPath: buildContext.cacheDirPath, result });
+
+    return result;
+}
+
+const { getCachedValue, setCachedValue } = (() => {
+    type Result = ReturnType<typeof getSupportedDockerImageTags>;
+
+    const zResult = (() => {
+        type TargetType = Result;
+
+        const zTargetType = z.object({
+            allSupportedTags: z.array(z.string()),
+            latestMajorTags: z.array(z.string())
+        });
+
+        type InferredType = z.infer<typeof zTargetType>;
+
+        assert<Equals<TargetType, InferredType>>;
+
+        return id<z.ZodType<TargetType>>(zTargetType);
+    })();
+
+    type Cache = {
+        keycloakifyVersion: string;
+        time: number;
+        result: Result;
+    };
+
+    const zCache = (() => {
+        type TargetType = Cache;
+
+        const zTargetType = z.object({
+            keycloakifyVersion: z.string(),
+            time: z.number(),
+            result: zResult
+        });
+
+        type InferredType = z.infer<typeof zTargetType>;
+
+        assert<Equals<TargetType, InferredType>>;
+
+        return id<z.ZodType<TargetType>>(zTargetType);
+    })();
+
+    let inMemoryCachedResult: Cache["result"] | undefined = undefined;
+
+    function getCacheFilePath(params: { cacheDirPath: string }) {
+        const { cacheDirPath } = params;
+
+        return pathJoin(cacheDirPath, "supportedDockerImageTags.json");
+    }
+
+    async function getCachedValue(params: { cacheDirPath: string }) {
+        const { cacheDirPath } = params;
+
+        if (inMemoryCachedResult !== undefined) {
+            return inMemoryCachedResult;
+        }
+
+        const cacheFilePath = getCacheFilePath({ cacheDirPath });
+
+        if (!(await existsAsync(cacheFilePath))) {
+            return undefined;
+        }
+
+        let cache: Cache | undefined;
+
+        try {
+            cache = zCache.parse(JSON.parse(await fs.readFile(cacheFilePath, "utf8")));
+        } catch {
+            return undefined;
+        }
+
+        if (cache.keycloakifyVersion !== readThisNpmPackageVersion()) {
+            return undefined;
+        }
+
+        if (Date.now() - cache.time > 3_600 * 24) {
+            return undefined;
+        }
+
+        inMemoryCachedResult = cache.result;
+
+        return cache.result;
+    }
+
+    async function setCachedValue(params: {
+        cacheDirPath: string;
+        result: Cache["result"];
+    }) {
+        const { cacheDirPath, result } = params;
+
+        inMemoryCachedResult = result;
+
+        const cacheFilePath = getCacheFilePath({ cacheDirPath });
+
+        {
+            const dirPath = pathDirname(cacheFilePath);
+
+            if (!(await existsAsync(dirPath))) {
+                await fs.mkdir(dirPath, { recursive: true });
+            }
+        }
+
+        await fs.writeFile(
+            cacheFilePath,
+            JSON.stringify(
+                zCache.parse({
+                    keycloakifyVersion: readThisNpmPackageVersion(),
+                    time: Date.now(),
+                    result
+                }),
+                null,
+                2
+            )
+        );
+    }
+
+    return {
+        getCachedValue,
+        setCachedValue
+    };
+})();

src/bin/start-keycloak/realmConfig/ParsedRealmJson/ParsedRealmJson.ts

@@ -0,0 +1,118 @@
+import { z } from "zod";
+import { assert, type Equals } from "tsafe/assert";
+import { id } from "tsafe/id";
+
+export type ParsedRealmJson = {
+    realm: string;
+    loginTheme?: string;
+    accountTheme?: string;
+    adminTheme?: string;
+    emailTheme?: string;
+    eventsListeners: string[];
+    users: {
+        id: string;
+        email: string;
+        username: string;
+        credentials: {
+            type: string /* "password" or something else */;
+        }[];
+        clientRoles?: Record<string, string[]>;
+    }[];
+    roles: {
+        client: Record<
+            string,
+            {
+                name: string;
+                containerId: string; // client id
+            }[]
+        >;
+    };
+    clients: {
+        id: string;
+        clientId: string; // example: realm-management
+        baseUrl?: string;
+        redirectUris?: string[];
+        webOrigins?: string[];
+        attributes?: {
+            "post.logout.redirect.uris"?: string;
+        };
+        protocol?: string;
+        protocolMappers?: {
+            id: string;
+            name: string;
+            protocol: string; // "openid-connect" or something else
+            protocolMapper: string; // "oidc-hardcoded-claim-mapper" or something else
+            consentRequired: boolean;
+            config?: Record<string, string>;
+        }[];
+    }[];
+};
+
+export const zParsedRealmJson = (() => {
+    type TargetType = ParsedRealmJson;
+
+    const zTargetType = z.object({
+        realm: z.string(),
+        loginTheme: z.string().optional(),
+        accountTheme: z.string().optional(),
+        adminTheme: z.string().optional(),
+        emailTheme: z.string().optional(),
+        eventsListeners: z.array(z.string()),
+        users: z.array(
+            z.object({
+                id: z.string(),
+                email: z.string(),
+                username: z.string(),
+                credentials: z.array(
+                    z.object({
+                        type: z.string()
+                    })
+                ),
+                clientRoles: z.record(z.array(z.string())).optional()
+            })
+        ),
+        roles: z.object({
+            client: z.record(
+                z.array(
+                    z.object({
+                        name: z.string(),
+                        containerId: z.string()
+                    })
+                )
+            )
+        }),
+        clients: z.array(
+            z.object({
+                id: z.string(),
+                clientId: z.string(),
+                baseUrl: z.string().optional(),
+                redirectUris: z.array(z.string()).optional(),
+                webOrigins: z.array(z.string()).optional(),
+                attributes: z
+                    .object({
+                        "post.logout.redirect.uris": z.string().optional()
+                    })
+                    .optional(),
+                protocol: z.string().optional(),
+                protocolMappers: z
+                    .array(
+                        z.object({
+                            id: z.string(),
+                            name: z.string(),
+                            protocol: z.string(),
+                            protocolMapper: z.string(),
+                            consentRequired: z.boolean(),
+                            config: z.record(z.string()).optional()
+                        })
+                    )
+                    .optional()
+            })
+        )
+    });
+
+    type InferredType = z.infer<typeof zTargetType>;
+
+    assert<Equals<TargetType, InferredType>>;
+
+    return id<z.ZodType<TargetType>>(zTargetType);
+})();

src/bin/start-keycloak/realmConfig/ParsedRealmJson/index.ts

@@ -0,0 +1,3 @@
+export type { ParsedRealmJson } from "./ParsedRealmJson";
+export { readRealmJsonFile } from "./readRealmJsonFile";
+export { writeRealmJsonFile } from "./writeRealmJsonFile";

src/bin/start-keycloak/realmConfig/ParsedRealmJson/readRealmJsonFile.ts

@@ -0,0 +1,20 @@
+import { assert } from "tsafe/assert";
+import { is } from "tsafe/is";
+import * as fs from "fs";
+import { type ParsedRealmJson, zParsedRealmJson } from "./ParsedRealmJson";
+
+export function readRealmJsonFile(params: {
+    realmJsonFilePath: string;
+}): ParsedRealmJson {
+    const { realmJsonFilePath } = params;
+
+    const parsedRealmJson = JSON.parse(
+        fs.readFileSync(realmJsonFilePath).toString("utf8")
+    ) as unknown;
+
+    zParsedRealmJson.parse(parsedRealmJson);
+
+    assert(is<ParsedRealmJson>(parsedRealmJson));
+
+    return parsedRealmJson;
+}

src/bin/start-keycloak/realmConfig/ParsedRealmJson/writeRealmJsonFile.ts

@@ -0,0 +1,29 @@
+import * as fsPr from "fs/promises";
+import { getIsPrettierAvailable, runPrettier } from "../../../tools/runPrettier";
+import { canonicalStringify } from "../../../tools/canonicalStringify";
+import type { ParsedRealmJson } from "./ParsedRealmJson";
+import { getDefaultConfig } from "../defaultConfig";
+
+export async function writeRealmJsonFile(params: {
+    realmJsonFilePath: string;
+    parsedRealmJson: ParsedRealmJson;
+    keycloakMajorVersionNumber: number;
+}): Promise<void> {
+    const { realmJsonFilePath, parsedRealmJson, keycloakMajorVersionNumber } = params;
+
+    let sourceCode = canonicalStringify({
+        data: parsedRealmJson,
+        referenceData: getDefaultConfig({
+            keycloakMajorVersionNumber
+        })
+    });
+
+    if (await getIsPrettierAvailable()) {
+        sourceCode = await runPrettier({
+            sourceCode: sourceCode,
+            filePath: realmJsonFilePath
+        });
+    }
+
+    await fsPr.writeFile(realmJsonFilePath, Buffer.from(sourceCode, "utf8"));
+}

src/bin/start-keycloak/realmConfig/defaultConfig/defaultConfig.ts

@@ -0,0 +1,74 @@
+import { join as pathJoin, dirname as pathDirname } from "path";
+import { getThisCodebaseRootDirPath } from "../../../tools/getThisCodebaseRootDirPath";
+import * as fs from "fs";
+import { exclude } from "tsafe/exclude";
+import { assert } from "tsafe/assert";
+import { readRealmJsonFile } from "../ParsedRealmJson/readRealmJsonFile";
+import type { ParsedRealmJson } from "../ParsedRealmJson/ParsedRealmJson";
+
+function getDefaultRealmJsonFilePath(params: { keycloakMajorVersionNumber: number }) {
+    const { keycloakMajorVersionNumber } = params;
+
+    return pathJoin(
+        getThisCodebaseRootDirPath(),
+        "src",
+        "bin",
+        "start-keycloak",
+        "realmConfig",
+        "defaultConfig",
+        `realm-kc-${keycloakMajorVersionNumber}.json`
+    );
+}
+
+export const { getSupportedKeycloakMajorVersions } = (() => {
+    let cache: number[] | undefined = undefined;
+
+    function getSupportedKeycloakMajorVersions(): number[] {
+        if (cache !== undefined) {
+            return cache;
+        }
+
+        cache = fs
+            .readdirSync(
+                pathDirname(
+                    getDefaultRealmJsonFilePath({ keycloakMajorVersionNumber: 0 })
+                )
+            )
+            .map(fileBasename => {
+                const match = fileBasename.match(/^realm-kc-(\d+)\.json$/);
+
+                if (match === null) {
+                    return undefined;
+                }
+
+                const n = parseInt(match[1]);
+
+                assert(!isNaN(n));
+
+                return n;
+            })
+            .filter(exclude(undefined))
+            .sort((a, b) => b - a);
+
+        return cache;
+    }
+
+    return { getSupportedKeycloakMajorVersions };
+})();
+
+export function getDefaultConfig(params: {
+    keycloakMajorVersionNumber: number;
+}): ParsedRealmJson {
+    const { keycloakMajorVersionNumber } = params;
+
+    assert(
+        getSupportedKeycloakMajorVersions().includes(keycloakMajorVersionNumber),
+        `We do not have a default config for Keycloak ${keycloakMajorVersionNumber}`
+    );
+
+    return readRealmJsonFile({
+        realmJsonFilePath: getDefaultRealmJsonFilePath({
+            keycloakMajorVersionNumber
+        })
+    });
+}

src/bin/start-keycloak/realmConfig/defaultConfig/index.ts

@@ -0,0 +1 @@
+export * from "./defaultConfig";

src/bin/start-keycloak/realmConfig/defaultConfig/realm-kc-18.json

@@ -73,7 +73,7 @@
                 "composites": {
                     "realm": ["offline_access", "uma_authorization"],
                     "client": {
-                        "account": ["delete-account", "view-profile", "manage-account"]
+                        "account": ["view-profile", "manage-account", "delete-account"]
                     }
                 },
                 "clientRole": false,
@@ -398,6 +398,26 @@
     "otpPolicyLookAheadWindow": 1,
     "otpPolicyPeriod": 30,
     "otpSupportedApplications": ["FreeOTP", "Google Authenticator"],
+    "webAuthnPolicyRpEntityName": "keycloak",
+    "webAuthnPolicySignatureAlgorithms": ["ES256"],
+    "webAuthnPolicyRpId": "",
+    "webAuthnPolicyAttestationConveyancePreference": "not specified",
+    "webAuthnPolicyAuthenticatorAttachment": "not specified",
+    "webAuthnPolicyRequireResidentKey": "not specified",
+    "webAuthnPolicyUserVerificationRequirement": "not specified",
+    "webAuthnPolicyCreateTimeout": 0,
+    "webAuthnPolicyAvoidSameAuthenticatorRegister": false,
+    "webAuthnPolicyAcceptableAaguids": [],
+    "webAuthnPolicyPasswordlessRpEntityName": "keycloak",
+    "webAuthnPolicyPasswordlessSignatureAlgorithms": ["ES256"],
+    "webAuthnPolicyPasswordlessRpId": "",
+    "webAuthnPolicyPasswordlessAttestationConveyancePreference": "not specified",
+    "webAuthnPolicyPasswordlessAuthenticatorAttachment": "not specified",
+    "webAuthnPolicyPasswordlessRequireResidentKey": "not specified",
+    "webAuthnPolicyPasswordlessUserVerificationRequirement": "not specified",
+    "webAuthnPolicyPasswordlessCreateTimeout": 0,
+    "webAuthnPolicyPasswordlessAvoidSameAuthenticatorRegister": false,
+    "webAuthnPolicyPasswordlessAcceptableAaguids": [],
     "users": [
         {
             "id": "00a62e75-bcc1-419a-a292-63ee5d161ed3",
@@ -422,30 +442,43 @@
             "disableableCredentialTypes": [],
             "requiredActions": [],
             "realmRoles": ["default-roles-myrealm"],
+            "clientRoles": {
+                "realm-management": [
+                    "create-client",
+                    "view-identity-providers",
+                    "manage-realm",
+                    "query-groups",
+                    "manage-clients",
+                    "query-users",
+                    "realm-admin",
+                    "view-authorization",
+                    "view-events",
+                    "view-clients",
+                    "view-realm",
+                    "manage-events",
+                    "query-realms",
+                    "query-clients",
+                    "manage-identity-providers",
+                    "manage-users",
+                    "view-users",
+                    "impersonation",
+                    "manage-authorization"
+                ],
+                "broker": ["read-token"],
+                "account": [
+                    "view-profile",
+                    "manage-account-links",
+                    "view-applications",
+                    "manage-consent",
+                    "delete-account",
+                    "manage-account",
+                    "view-consent"
+                ]
+            },
             "notBefore": 0,
             "groups": []
         }
     ],
-    "webAuthnPolicyRpEntityName": "keycloak",
-    "webAuthnPolicySignatureAlgorithms": ["ES256"],
-    "webAuthnPolicyRpId": "",
-    "webAuthnPolicyAttestationConveyancePreference": "not specified",
-    "webAuthnPolicyAuthenticatorAttachment": "not specified",
-    "webAuthnPolicyRequireResidentKey": "not specified",
-    "webAuthnPolicyUserVerificationRequirement": "not specified",
-    "webAuthnPolicyCreateTimeout": 0,
-    "webAuthnPolicyAvoidSameAuthenticatorRegister": false,
-    "webAuthnPolicyAcceptableAaguids": [],
-    "webAuthnPolicyPasswordlessRpEntityName": "keycloak",
-    "webAuthnPolicyPasswordlessSignatureAlgorithms": ["ES256"],
-    "webAuthnPolicyPasswordlessRpId": "",
-    "webAuthnPolicyPasswordlessAttestationConveyancePreference": "not specified",
-    "webAuthnPolicyPasswordlessAuthenticatorAttachment": "not specified",
-    "webAuthnPolicyPasswordlessRequireResidentKey": "not specified",
-    "webAuthnPolicyPasswordlessUserVerificationRequirement": "not specified",
-    "webAuthnPolicyPasswordlessCreateTimeout": 0,
-    "webAuthnPolicyPasswordlessAvoidSameAuthenticatorRegister": false,
-    "webAuthnPolicyPasswordlessAcceptableAaguids": [],
     "scopeMappings": [
         {
             "clientScope": "offline_access",
@@ -505,8 +538,12 @@
             "enabled": true,
             "alwaysDisplayInConsole": false,
             "clientAuthenticatorType": "client-secret",
-            "redirectUris": ["/realms/myrealm/account/*"],
-            "webOrigins": [],
+            "redirectUris": [
+                "http://localhost*",
+                "http://127.0.0.1*",
+                "/realms/myrealm/account/*"
+            ],
+            "webOrigins": ["*"],
             "notBefore": 0,
             "bearerOnly": false,
             "consentRequired": false,
@@ -518,6 +555,7 @@
             "frontchannelLogout": false,
             "protocol": "openid-connect",
             "attributes": {
+                "post.logout.redirect.uris": "+",
                 "pkce.code.challenge.method": "S256"
             },
             "authenticationFlowBindingOverrides": {},
@@ -636,7 +674,7 @@
             "attributes": {
                 "oidc.ciba.grant.enabled": "false",
                 "backchannel.logout.session.required": "true",
-                "login_theme": "keycloakify-starter",
+                "post.logout.redirect.uris": "+",
                 "display.on.consent.screen": "false",
                 "oauth2.device.authorization.grant.enabled": "false",
                 "backchannel.logout.revoke.offline.tokens": "false"
@@ -694,8 +732,12 @@
             "enabled": true,
             "alwaysDisplayInConsole": false,
             "clientAuthenticatorType": "client-secret",
-            "redirectUris": ["/admin/myrealm/console/*"],
-            "webOrigins": ["+"],
+            "redirectUris": [
+                "http://localhost*",
+                "http://127.0.0.1*",
+                "/admin/myrealm/console/*"
+            ],
+            "webOrigins": ["*"],
             "notBefore": 0,
             "bearerOnly": false,
             "consentRequired": false,
@@ -707,12 +749,31 @@
             "frontchannelLogout": false,
             "protocol": "openid-connect",
             "attributes": {
+                "post.logout.redirect.uris": "+",
                 "pkce.code.challenge.method": "S256"
             },
             "authenticationFlowBindingOverrides": {},
             "fullScopeAllowed": false,
             "nodeReRegistrationTimeout": 0,
             "protocolMappers": [
+                {
+                    "id": "8fd0d584-7052-4d04-a615-d18a71050873",
+                    "name": "allowed-origins",
+                    "protocol": "openid-connect",
+                    "protocolMapper": "oidc-hardcoded-claim-mapper",
+                    "consentRequired": false,
+                    "config": {
+                        "userinfo.token.claim": "true",
+                        "id.token.claim": "false",
+                        "access.token.claim": "true",
+                        "claim.name": "allowed-origins",
+                        "jsonType.label": "JSON",
+                        "access.tokenResponse.claim": "false",
+                        "claim.value": "[\"*\"]",
+                        "introspection.token.claim": "true",
+                        "lightweight.claim": "true"
+                    }
+                },
                 {
                     "id": "7779f8fa-c2fe-4e68-be56-66ee97bf8f13",
                     "name": "locale",
@@ -757,7 +818,8 @@
                     "consentRequired": false,
                     "config": {
                         "id.token.claim": "true",
-                        "access.token.claim": "true"
+                        "access.token.claim": "true",
+                        "userinfo.token.claim": "true"
                     }
                 }
             ]
@@ -1205,6 +1267,7 @@
                     "consentRequired": false,
                     "config": {
                         "multivalued": "true",
+                        "userinfo.token.claim": "true",
                         "user.attribute": "foo",
                         "id.token.claim": "true",
                         "access.token.claim": "true",
@@ -1271,11 +1334,11 @@
     },
     "smtpServer": {},
     "loginTheme": "keycloakify-starter",
-    "accountTheme": "keycloakify-starter",
+    "accountTheme": "",
     "adminTheme": "",
     "emailTheme": "",
     "eventsEnabled": false,
-    "eventsListeners": ["jboss-logging"],
+    "eventsListeners": ["keycloakify-logging", "jboss-logging"],
     "enabledEventTypes": [],
     "adminEventsEnabled": false,
     "adminEventsDetailsEnabled": false,
@@ -1291,14 +1354,14 @@
                 "subComponents": {},
                 "config": {
                     "allowed-protocol-mapper-types": [
-                        "oidc-full-name-mapper",
                         "saml-user-property-mapper",
+                        "oidc-sha256-pairwise-sub-mapper",
+                        "oidc-address-mapper",
+                        "oidc-full-name-mapper",
                         "oidc-usermodel-attribute-mapper",
                         "saml-user-attribute-mapper",
-                        "oidc-address-mapper",
-                        "oidc-sha256-pairwise-sub-mapper",
-                        "saml-role-list-mapper",
-                        "oidc-usermodel-property-mapper"
+                        "oidc-usermodel-property-mapper",
+                        "saml-role-list-mapper"
                     ]
                 }
             },
@@ -1347,14 +1410,14 @@
                 "subComponents": {},
                 "config": {
                     "allowed-protocol-mapper-types": [
-                        "oidc-usermodel-property-mapper",
-                        "oidc-address-mapper",
                         "oidc-full-name-mapper",
-                        "saml-user-property-mapper",
-                        "saml-user-attribute-mapper",
+                        "oidc-address-mapper",
+                        "saml-role-list-mapper",
                         "oidc-sha256-pairwise-sub-mapper",
-                        "oidc-usermodel-attribute-mapper",
-                        "saml-role-list-mapper"
+                        "saml-user-attribute-mapper",
+                        "saml-user-property-mapper",
+                        "oidc-usermodel-property-mapper",
+                        "oidc-usermodel-attribute-mapper"
                     ]
                 }
             },
@@ -1394,6 +1457,12 @@
                 "providerId": "rsa-generated",
                 "subComponents": {},
                 "config": {
+                    "privateKey": [
+                        "MIIEpAIBAAKCAQEA+VQAcuaRivrzLVI8H/tt8PKbtRznTQKmmxOdLRR37leY/ph7sFnEmZt6K02Rvut7R0dxUFtTdiEHUKxhyM8CADMznGUjDYj/EXQzLfZ3LEwbwmR39zp+fZL/H24UDO03zt23Ov9C8Aly0ufXZ1Ic1c33KW6UtUEK/3M52pU8Y0daWdjx7nBj1eRlzWfVG+BYotTTWEnFJuEoZPFQMiXqeA5ob1zZdXjL5JDuGEiBsYjtiiaKbKL5545+FmEBnoCmWXqGu0qWxI2TzvV2dohxfl5KjNzRoKt40ydraiVk5rtBpoNDpeEApuphbokH5dJVwJ5cvWu1CSTnYPW2jXeG4wIDAQABAoIBAQDHV6AcPbhz8/xlafBkabQXBwHzJi7QZaQrLN1n44uX5jWOqP+LmdoULjjZUmWKzd98t+QjKUFrmzCsEYcE9G1XF5jWHA6Qjc3ReKRKxVm28wrmu0knQ39KizKrQGmLhEYwgRg0dU5heExzz6VrGD2xu8E3QRBocp6GauwAlXz4qcnTPHOl8OBPeDHAc0RUdaL5+jRLgKQzf9nnnKB19imBKP++zwrwFrkOZti2ZPs1I7j/ym27mHUbi8TDI2VepDX4QwjjC5a+v3vTsVAGE+1tUAZtqpxpIP9hiUkLH3ajyvp3typhnmZHklqsSZdwtRcK94WiMzL3TkiY70y8abMhAoGBAP8I4EQRXxcKfBn23eaRw8Cd4PFrOouz4zFbYLrBODsvXfku/jnQOMFD0If4IzT6y0FGgBd+t/yqnFJi98oZOKm3P8w+NZBXTbFLH8rgmsElXyS0+9LVMjVa7+UlqZB1eRZbUeLREp03Fsz1y2rflnoWgUnpDIlyhmJqGhCsJdebAoGBAPpFmJ9P42mUTeDWpCyCxgg0zpp6rlpAP8StqZkcvr7kYjhbWrJfJuxrTXtzTTA1zZ59L9EvEAxuug/gl9BkuZ11Uzg8ZLOr4gSuAJZlAORaxJlcoylmNMYIL1fP/K0dxhdO0eHZOpPVpBmGctgev2HBtWp9ZwzQ3DddKimZfNZZAoGAfNOOWSKbhT6HgXnYIHtl8YgUynUuYaR5ZfYQwTfDWwyTFVzP5+IndUjI71Qff1XlWBy2o0lNqmijPJveJlfz6PWdT01/kBd7GnTnqbgHZtPw3pmKzCW3fm/1DRZDCUbGLpAh4z9rufF1wnnnx3aKQ1VykId1sGySo+bEvTZVC1MCgYAlv6uWk/ksKpdYi2d14z+1aymieVClAj3cD4meM4y9xDrgXz8d2mZHkKO+NBT3aZYbCqzUs3GLPoRH8stTPm4UxuaHe+yAgTN1Gz2xcYih6OLwct2VV/oryH5Dk3Z8Mhp314amtxozxCydQP8/g9vABfS0HDgX4cTlgOLkJWeD+QKBgQDuRtsstQ4Q3yK44himPi1JQMMvbYAqyGgRxWH8G1Kr41DV2sQ4wt9CbYxeh6RwMsE+YYNMkTAw1kksUTugWdcDnYpcSVG7xHLJk8WMti0WTqI/7KlkoRehXXv18WJNEXaCr5mJTtJL9wuQcd8nhkEDrrCZubZiJzX9IDnEqZc4Mg=="
+                    ],
+                    "certificate": [
+                        "MIICnTCCAYUCBgGTy58etTANBgkqhkiG9w0BAQsFADASMRAwDgYDVQQDDAdteXJlYWxtMB4XDTI0MTIxNTE4Mzg0M1oXDTM0MTIxNTE4NDAyM1owEjEQMA4GA1UEAwwHbXlyZWFsbTCCASIwDQYJKoZIhvcNAQEBBQADggEPADCCAQoCggEBAPlUAHLmkYr68y1SPB/7bfDym7Uc500CppsTnS0Ud+5XmP6Ye7BZxJmbeitNkb7re0dHcVBbU3YhB1CsYcjPAgAzM5xlIw2I/xF0My32dyxMG8Jkd/c6fn2S/x9uFAztN87dtzr/QvAJctLn12dSHNXN9ylulLVBCv9zOdqVPGNHWlnY8e5wY9XkZc1n1RvgWKLU01hJxSbhKGTxUDIl6ngOaG9c2XV4y+SQ7hhIgbGI7Yomimyi+eeOfhZhAZ6Apll6hrtKlsSNk871dnaIcX5eSozc0aCreNMna2olZOa7QaaDQ6XhAKbqYW6JB+XSVcCeXL1rtQkk52D1to13huMCAwEAATANBgkqhkiG9w0BAQsFAAOCAQEAH/nsEi88hFiNPCWYvTB3lERZpeUCbpDzAXQT/4TONmOw8zi7Cd2OlX8BGBFqjh/fESHv+adlzsY1mUdMvpVaYgHr3gYi8sBSrq5TMUfSYaWp4WCD7utiXXGprG08GCdbye1lpyyNnniWp12Bgjao+rtGamL/M1d6+WZTC+XL+H30u4VHURAiFBsAEoX6tlGV8ynhYOr/b8B43jy0/R0JfrzLjwSKEcA6RfKM7ozbZ0QZuQDALULymPIesrV4mvZ2Qwg4YgpAKaki9Sse45yiIhsIY0p5RnuNZRZnCbukyeBzIyDJobEBGhpui/KT2dqXBlRgRuOhCUf7OGCcPVHKNQ=="
+                    ],
                     "priority": ["100"]
                 }
             },
@@ -1403,6 +1472,12 @@
                 "providerId": "rsa-enc-generated",
                 "subComponents": {},
                 "config": {
+                    "privateKey": [
+                        "MIIEogIBAAKCAQEAn82AU+InXwYlE8u9lMwhQghZB7oQ71Hg3PdFqS9ICGzw1u1JcENooCsZse55V6nqptdYF1oZA8QrxnhHzCVCGIqFHtXSoPGHVtozO3Fe1cVIVFm1D9TNS3JHe1C8SBQQT4hGItO5cjDyfGdK3x09RkoAcelrzH5uQ78zd0FKHkzbsTMsP2V8V94c35+ViIUjyGhH2T2BpIyGRLignL+6d0wHbw463L1Ewj/J9z8BtNLCH9PaVLWiGQARjlWyL9vtWBig9XXL0Z9tZUuoLihjh4StkXt2lQ++DKxUklsAjyenRAG5d72T2rY8MO5a1Z2ZSt8+s86D5esrAEIFZc9mqwIDAQABAoIBAAmmCcqGzCPDpjd0xMSYMqXfBSkfReh9RBtzXqRhc3L2yO/hMd7yYv3QvGNu56qwWreqJup6CSqeDJqWJpef5EbBDlqXRHltO+O1lwROyxATMlPNes4y5hZZFxHOBSBA/d8fdkSiDf9kDzANuIqSJGH7E93M3zJgq92xTLU1nvkHR/VYJQv+j+Pjye7MWvjIePfhwFeBqEWlWPTlw/080Mpfp8Hhbl6JeKjx2inkSphp43v4wR1Wmp+E2JIHF4P4sVXPPuPf3JDwg5uGOrROw1ziloD3jTI+LnQ+kRm6R2EbqRqqVsehXT7mZy2puQNqVc4vVqWQdxIErMBazYEpZOECgYEA+8PEcDiIPr2PTYZk+/jErRVYwsxyLgDJexPak7onLxLBJRNRnp1Uk6b1LXM6af5qp+Y510kyAe1k+9xkQLx1gW8rMka9rvVsM+1A2ACvF99V23sRw29CVxeFV/zNn83MinYPX5biUl6MkOX2PvWUhdwRGhKByjiYcAeBOsXkz3ECgYEAon2yYXGzph8Vb8Fetv0wFFbjQOixuL02OjVp/nU1XVE8Aw9BJ7uzA6GQ7akPG0HsaUq7AEHP1uUOsJWQTNQ8WYD9LDuDOl/JFqkG+zrmdUdm0mAIYyH1/GBqgaTLvMq78qqosua8BBJojEyoXDz69UBHpu7cwtUgmzRNQSYqgdsCgYASvD3JEBvrd1XLsh2ftqKEMtt5G5e/nqVfuFmCts6lrSKcbLSdNh4OItWJ/VIygxFSz0osoDDNfeoO6Ba5zox8BlbTlfoVpAPaVWSG7n4ZK7CK9bybq5LnQkPVCWYP51O6VhDMz0CmWozhV4ucoc/cqkTHiOsJrm6Bn71ZL1LYsQKBgFNb8qgk4YnGhoPHiuSLbR/yFzGUbqAciXZBMrg0vwS5iPT03XMZytOBDk2uHi7YmgTGLrsKCCrxZaDXiaiwdKliD/+iJEdNHmc+nXNDGzltQOWKGKNqp7wqZllOBqs6wkLSpCrrTec03mejZ/ex3Pj2WgvcnGpjVg/pO/zBLKtjAoGACzGQNEF93fabHQJTsHmb/g+jO2iumjF6ZIWzdFh2KzQABONcoBvy1MJNASFQj3iVy/8kEo4SfmexvMWLBW9igi2z1pHeHY32EuImzuc4xnVDm6dkmDdsO43Ex6CFBx8lM40H4l27mXu+EZRzGClUY8TnmV/FBGmX+LPtOiiwT7s="
+                    ],
+                    "certificate": [
+                        "MIICnTCCAYUCBgGTy58fHjANBgkqhkiG9w0BAQsFADASMRAwDgYDVQQDDAdteXJlYWxtMB4XDTI0MTIxNTE4Mzg0M1oXDTM0MTIxNTE4NDAyM1owEjEQMA4GA1UEAwwHbXlyZWFsbTCCASIwDQYJKoZIhvcNAQEBBQADggEPADCCAQoCggEBAJ/NgFPiJ18GJRPLvZTMIUIIWQe6EO9R4Nz3RakvSAhs8NbtSXBDaKArGbHueVep6qbXWBdaGQPEK8Z4R8wlQhiKhR7V0qDxh1baMztxXtXFSFRZtQ/UzUtyR3tQvEgUEE+IRiLTuXIw8nxnSt8dPUZKAHHpa8x+bkO/M3dBSh5M27EzLD9lfFfeHN+flYiFI8hoR9k9gaSMhkS4oJy/undMB28OOty9RMI/yfc/AbTSwh/T2lS1ohkAEY5Vsi/b7VgYoPV1y9GfbWVLqC4oY4eErZF7dpUPvgysVJJbAI8np0QBuXe9k9q2PDDuWtWdmUrfPrPOg+XrKwBCBWXPZqsCAwEAATANBgkqhkiG9w0BAQsFAAOCAQEATwmKBzLiZiUjyB9BWUR4BCXh46DxsiM0BCublewlUFY6FBTn7ea6q3G+X3QP2WM6xa0oAmQz9dq1KChbIoC2WPbceAbwd5XZZfziWsRCv6+xPswtpHPIrsenz8TR4K4P73aeCC+vTVs/y+2tGPEVbnSkcNnOP71hRQGlt0LvjKlEetJSRyYz5depSdJOjl4F3ehpxQtTK/48xUVAytu9ZotJj6AUA7jWFlP5GHgoB+mPk6QTHNWddnc7BQx2FMvg151vxu722ywLh5Dh7WzgFhJNwkX4xpwzhfo0Q1gSygGTdZaJCGj5jfF+KwdiKpN04UxJ8OrRgJqklQgrSVnsgQ=="
+                    ],
                     "priority": ["100"],
                     "algorithm": ["RSA-OAEP"]
                 }
@@ -1413,6 +1488,8 @@
                 "providerId": "aes-generated",
                 "subComponents": {},
                 "config": {
+                    "kid": ["132fb843-59e9-4f36-ad55-5ce2d3a13fb3"],
+                    "secret": ["ETyyqapnrkUsNXLQ-tBVKw"],
                     "priority": ["100"]
                 }
             },
@@ -1422,6 +1499,10 @@
                 "providerId": "hmac-generated",
                 "subComponents": {},
                 "config": {
+                    "kid": ["5110d380-c930-49d9-b91b-87f338f6170b"],
+                    "secret": [
+                        "uCpQrJvP5OBuTxXfDb4JRL0bCKpXUgfGn5vb8UvL-Sfs_sZ9rtvBmd6vuFWARqyezjJQtpoNlMv7sXgxkN-yxQ"
+                    ],
                     "priority": ["100"],
                     "algorithm": ["HS256"]
                 }
@@ -1454,7 +1535,7 @@
     "defaultLocale": "en",
     "authenticationFlows": [
         {
-            "id": "f7f2b89b-43cb-491d-8e7c-f1814024a6da",
+            "id": "f664efe4-102d-4ec1-bf11-11af67e3f178",
             "alias": "Account verification options",
             "description": "Method with which to verity the existing account",
             "providerId": "basic-flow",
@@ -1480,7 +1561,7 @@
             ]
         },
         {
-            "id": "17cdac6f-d2a3-4907-8d44-a42827610b63",
+            "id": "8a5630c5-eca1-4b6a-8e59-459cb6c84535",
             "alias": "Authentication Options",
             "description": "Authentication options.",
             "providerId": "basic-flow",
@@ -1514,7 +1595,7 @@
             ]
         },
         {
-            "id": "53a3e43f-9468-401f-8051-40f982d12f85",
+            "id": "c1a3eed3-25ce-44ae-93d1-f0b8148a0f8c",
             "alias": "Browser - Conditional OTP",
             "description": "Flow to determine if the OTP is required for the authentication",
             "providerId": "basic-flow",
@@ -1540,7 +1621,7 @@
             ]
         },
         {
-            "id": "26286808-3b7b-43df-b32e-af55a37af2e9",
+            "id": "6eb188ad-1041-44dd-bf8f-37cae0d98bf1",
             "alias": "Direct Grant - Conditional OTP",
             "description": "Flow to determine if the OTP is required for the authentication",
             "providerId": "basic-flow",
@@ -1566,7 +1647,7 @@
             ]
         },
         {
-            "id": "8a6a752a-9a9a-4d38-b1f8-edf0a9433490",
+            "id": "4ee215ac-f4e5-4edb-bf76-65dc9e211543",
             "alias": "First broker login - Conditional OTP",
             "description": "Flow to determine if the OTP is required for the authentication",
             "providerId": "basic-flow",
@@ -1592,7 +1673,7 @@
             ]
         },
         {
-            "id": "a6f6804c-4160-4a84-8a1f-c2747a2d3f27",
+            "id": "5a1eac7e-06a0-46d8-b9ae-1f2c934331f9",
             "alias": "Handle Existing Account",
             "description": "Handle what to do if there is existing account with same email/username like authenticated identity provider",
             "providerId": "basic-flow",
@@ -1618,7 +1699,7 @@
             ]
         },
         {
-            "id": "740baa9e-8328-4035-9e1a-8fc1616d1f0f",
+            "id": "ed165166-4521-4a62-b185-c4b51643cbb1",
             "alias": "Reset - Conditional OTP",
             "description": "Flow to determine if the OTP should be reset or not. Set to REQUIRED to force.",
             "providerId": "basic-flow",
@@ -1644,7 +1725,7 @@
             ]
         },
         {
-            "id": "e60187a8-3e16-4a0c-9daa-f3a4a1fcfdba",
+            "id": "4788fb1f-fd81-4f5d-9abe-4199dd641c1e",
             "alias": "User creation or linking",
             "description": "Flow for the existing/non-existing user alternatives",
             "providerId": "basic-flow",
@@ -1671,7 +1752,7 @@
             ]
         },
         {
-            "id": "d959d0c2-4004-4633-b280-f80d6423f574",
+            "id": "d778a70f-f472-4dd3-ac40-cb5612ddc171",
             "alias": "Verify Existing Account by Re-authentication",
             "description": "Reauthentication of existing account",
             "providerId": "basic-flow",
@@ -1697,7 +1778,7 @@
             ]
         },
         {
-            "id": "ba02689d-b9e8-4a4b-8fdd-0d1386b198fc",
+            "id": "9c1ea8ea-7c23-4e60-b02d-1900d9dc4109",
             "alias": "browser",
             "description": "browser based authentication",
             "providerId": "basic-flow",
@@ -1739,7 +1820,7 @@
             ]
         },
         {
-            "id": "f09ac92a-e091-4e84-9cd1-cb905ca57b89",
+            "id": "0ebdf418-d57d-4318-9359-7bd0cb2381f2",
             "alias": "clients",
             "description": "Base authentication for clients",
             "providerId": "client-flow",
@@ -1781,7 +1862,7 @@
             ]
         },
         {
-            "id": "aaf72b22-cec4-4714-93d6-f54d5a986ab8",
+            "id": "5cc89293-c72e-4c5e-b31c-15558588a60d",
             "alias": "direct grant",
             "description": "OpenID Connect Resource Owner Grant",
             "providerId": "basic-flow",
@@ -1815,7 +1896,7 @@
             ]
         },
         {
-            "id": "c4a54bb3-f009-4231-a82b-376c2515e07e",
+            "id": "5ae5a321-ccac-449e-9c19-d6dc22ab8085",
             "alias": "docker auth",
             "description": "Used by Docker clients to authenticate against the IDP",
             "providerId": "basic-flow",
@@ -1833,7 +1914,7 @@
             ]
         },
         {
-            "id": "f55ded54-683a-4f5a-a101-9cfbd7b96781",
+            "id": "7737fdd1-0875-47e6-977b-12561cddfdc3",
             "alias": "first broker login",
             "description": "Actions taken after first broker login with identity provider account, which is not yet linked to any Keycloak account",
             "providerId": "basic-flow",
@@ -1860,7 +1941,7 @@
             ]
         },
         {
-            "id": "931d5a82-378f-4533-8c69-2239a4acd047",
+            "id": "90f975c3-9826-461f-88ca-27c697aff86b",
             "alias": "forms",
             "description": "Username, password, otp and other auth forms.",
             "providerId": "basic-flow",
@@ -1886,7 +1967,7 @@
             ]
         },
         {
-            "id": "22b05374-f480-4ca8-aca8-9db8b6dd1729",
+            "id": "ce2722d5-9f4f-41a2-8f81-e01f7b6cee57",
             "alias": "http challenge",
             "description": "An authentication flow based on challenge-response HTTP Authentication Schemes",
             "providerId": "basic-flow",
@@ -1912,7 +1993,7 @@
             ]
         },
         {
-            "id": "c0371832-e4b7-485e-bf23-6babe4c6ac83",
+            "id": "31b5bfa7-98ad-47a2-b8e6-0669022cd8cb",
             "alias": "registration",
             "description": "registration flow",
             "providerId": "basic-flow",
@@ -1931,7 +2012,7 @@
             ]
         },
         {
-            "id": "4d0445da-073e-465e-b25b-af522915c73f",
+            "id": "bf8a950b-be3b-4e44-8602-64e0bba492eb",
             "alias": "registration form",
             "description": "registration form",
             "providerId": "form-flow",
@@ -1973,7 +2054,7 @@
             ]
         },
         {
-            "id": "740d467f-4203-425b-8203-9bfd3eed25ae",
+            "id": "e3519800-971b-4b1d-b64e-3983ccd02dea",
             "alias": "reset credentials",
             "description": "Reset credentials for a user if they forgot their password or something",
             "providerId": "basic-flow",
@@ -2015,7 +2096,7 @@
             ]
         },
         {
-            "id": "cf1a9af9-dadd-4cb9-a26e-fbbba216f8e1",
+            "id": "9d5a33a2-e777-4beb-95de-b84812f69c56",
             "alias": "saml ecp",
             "description": "SAML ECP Profile Authentication Flow",
             "providerId": "basic-flow",
@@ -2035,14 +2116,14 @@
     ],
     "authenticatorConfig": [
         {
-            "id": "4e65eb4b-9f0a-4ab8-98b2-6daf50cd1bf8",
+            "id": "4901c91d-59bd-4727-b585-8e4e44828d0a",
             "alias": "create unique user config",
             "config": {
                 "require.password.update.after.registration": "false"
             }
         },
         {
-            "id": "5e8dc1c5-1489-4d39-bb75-9c499583b91b",
+            "id": "5062a078-83a7-4933-b0d5-3f75cc2a5003",
             "alias": "review profile config",
             "config": {
                 "update.profile.on.first.login": "missing"
@@ -2132,8 +2213,8 @@
     "attributes": {
         "cibaBackchannelTokenDeliveryMode": "poll",
         "cibaAuthRequestedUserHint": "login_hint",
-        "oauth2DevicePollingInterval": "5",
         "clientOfflineSessionMaxLifespan": "0",
+        "oauth2DevicePollingInterval": "5",
         "clientSessionIdleTimeout": "0",
         "userProfileEnabled": "true",
         "clientOfflineSessionIdleTimeout": "0",