Update garronej_modules_update

Create FUNDING.yml
2022-09-04 19:09:53 +00:00 · 2022-09-02 18:41:02 +02:00 · 2022-08-26 16:39:19 +00:00 · 2022-08-26 16:12:55 +07:00 · 2022-08-26 15:52:28 +07:00 · 2022-08-04 14:15:23 +07:00
304 changed files with 37316 additions and 25606 deletions
--- a/.all-contributorsrc
+++ b/.all-contributorsrc
@ -1,243 +0,0 @@
 {
  "files": [
    "README.md"
  ],
  "imageSize": 100,
  "commit": false,
  "commitConvention": "angular",
  "contributors": [
    {
      "login": "lordvlad",
      "name": "Waldemar Reusch",
      "avatar_url": "https://avatars.githubusercontent.com/u/1217769?v=4",
      "profile": "https://github.com/lordvlad",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "willwill96",
      "name": "William Will",
      "avatar_url": "https://avatars.githubusercontent.com/u/10997562?v=4",
      "profile": "https://willwill96.github.io/the-ui-dawg-static-site/en/introduction/",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "Ann2827",
      "name": "Bystrova Ann",
      "avatar_url": "https://avatars.githubusercontent.com/u/32645809?v=4",
      "profile": "https://github.com/Ann2827",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "mkreuzmayr",
      "name": "Michael Kreuzmayr",
      "avatar_url": "https://avatars.githubusercontent.com/u/20108212?v=4",
      "profile": "https://github.com/mkreuzmayr",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "Mstrodl",
      "name": "Mary ",
      "avatar_url": "https://avatars.githubusercontent.com/u/6877780?v=4",
      "profile": "https://coolmathgames.tech",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "Tasyp",
      "name": "German Öö",
      "avatar_url": "https://avatars.githubusercontent.com/u/6623212?v=4",
      "profile": "https://tasyp.xyz/",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "revolunet",
      "name": "Julien Bouquillon",
      "avatar_url": "https://avatars.githubusercontent.com/u/124937?v=4",
      "profile": "https://revolunet.com",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "aidangilmore",
      "name": "Aidan Gilmore",
      "avatar_url": "https://avatars.githubusercontent.com/u/32880357?v=4",
      "profile": "https://github.com/aidangilmore",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "0x-Void",
      "name": "Void",
      "avatar_url": "https://avatars.githubusercontent.com/u/32745739?v=4",
      "profile": "https://github.com/0x-Void",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "juffe",
      "name": "juffe",
      "avatar_url": "https://avatars.githubusercontent.com/u/5393231?v=4",
      "profile": "https://github.com/juffe",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "lazToum",
      "name": "Lazaros Toumanidis",
      "avatar_url": "https://avatars.githubusercontent.com/u/4764837?v=4",
      "profile": "https://github.com/lazToum",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "marcmrf",
      "name": "Marc",
      "avatar_url": "https://avatars.githubusercontent.com/u/9928519?v=4",
      "profile": "https://github.com/marcmrf",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "kasir-barati",
      "name": "Kasir Barati",
      "avatar_url": "https://avatars.githubusercontent.com/u/73785723?v=4",
      "profile": "http://kasir-barati.github.io",
      "contributions": [
        "doc"
      ]
    },
    {
      "login": "asashay",
      "name": "Alex Oliynyk",
      "avatar_url": "https://avatars.githubusercontent.com/u/10714670?v=4",
      "profile": "https://github.com/asashay",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "thosil",
      "name": "Thomas Silvestre",
      "avatar_url": "https://avatars.githubusercontent.com/u/1140574?v=4",
      "profile": "https://www.gravitysoftware.be",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "satanshiro",
      "name": "satanshiro",
      "avatar_url": "https://avatars.githubusercontent.com/u/38865738?v=4",
      "profile": "https://github.com/satanshiro",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "kpoelhekke",
      "name": "Koen Poelhekke",
      "avatar_url": "https://avatars.githubusercontent.com/u/1632377?v=4",
      "profile": "https://poelhekke.dev",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "zavoloklom",
      "name": "Sergey Kupletsky",
      "avatar_url": "https://avatars.githubusercontent.com/u/4151869?v=4",
      "profile": "https://github.com/zavoloklom",
      "contributions": [
        "test",
        "code"
      ]
    },
    {
      "login": "rome-user",
      "name": "rome-user",
      "avatar_url": "https://avatars.githubusercontent.com/u/114131048?v=4",
      "profile": "https://github.com/rome-user",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "celinepelletier",
      "name": "Céline Pelletier",
      "avatar_url": "https://avatars.githubusercontent.com/u/82821620?v=4",
      "profile": "https://github.com/celinepelletier",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "xgp",
      "name": "Garth",
      "avatar_url": "https://avatars.githubusercontent.com/u/244253?v=4",
      "profile": "https://github.com/xgp",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "BlackVoid",
      "name": "Felix Gustavsson",
      "avatar_url": "https://avatars.githubusercontent.com/u/673720?v=4",
      "profile": "https://github.com/BlackVoid",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "msiemens",
      "name": "Markus Siemens",
      "avatar_url": "https://avatars.githubusercontent.com/u/1873922?v=4",
      "profile": "https://m-siemens.de/",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "law108000",
      "name": "Rlok",
      "avatar_url": "https://avatars.githubusercontent.com/u/8112024?v=4",
      "profile": "https://github.com/law108000",
      "contributions": [
        "code"
      ]
    },
    {
      "login": "Moulyy",
      "name": "Moulyy",
      "avatar_url": "https://avatars.githubusercontent.com/u/115405804?v=4",
      "profile": "https://github.com/Moulyy",
      "contributions": [
        "code"
      ]
    }
  ],
  "contributorsPerLine": 7,
  "skipCi": true,
  "repoType": "github",
  "repoHost": "https://github.com",
  "projectName": "keycloakify",
  "projectOwner": "keycloakify",
  "commitType": "docs"
 }
--- a/.gitattributes
+++ b/.gitattributes
@ -1,3 +1,3 @@
 src/lib/i18n/generated_kcMessages/* linguist-documentation
-src/bin/keycloakify/index.ts -linguist-detectable
+src/bin/build-keycloak-theme/index.ts -linguist-detectable
 src/bin/install-builtin-keycloak-themes.ts -linguist-detectable
--- a/.github/FUNDING.yaml
+++ b/.github/FUNDING.yaml
@ -1,4 +1,5 @@
 # These are supported funding model platforms
 github: [garronej]
 open_collective: keycloakify
 custom: ['https://www.ringerhq.com/experts/garronej']
--- a/.github/workflows/ci.yaml
+++ b/.github/workflows/ci.yaml
@ -3,9 +3,6 @@ on:
  push:
    branches:
      - main
      - v5
      - v6
      - v7
  pull_request:
    branches:
      - main
@ -16,52 +13,49 @@ jobs:
    runs-on: ubuntu-latest
    if: ${{ !github.event.created && github.repository != 'garronej/ts-ci' }}
    steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v2.3.4
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v2.1.3
    - uses: bahmutov/npm-install@v1
-    - name: If this step fails run 'yarn format' then commit again.
+    - name: If this step fails run 'npm run lint' and 'npm run format' then commit again.
-      run: yarn format:check
+      run: |
        PACKAGE_MANAGER=npm
        if [ -f "./yarn.lock" ]; then
            PACKAGE_MANAGER=yarn
        fi
        $PACKAGE_MANAGER run format:check
  test:
-    runs-on: ${{ matrix.os }}
+    runs-on: macos-10.15
    needs: test_lint
    env: 
      GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 
    strategy:
      matrix:
-        node: [ '18' ]
+        node: [ '15', '14' ]
-        os: [ ubuntu-latest ]
+    name: Test with Node v${{ matrix.node }}
    name: Test with Node v${{ matrix.node }} on ${{ matrix.os }}
    steps:
-    - uses: actions/checkout@v3
+    - name: Tell if project is using npm or yarn
-    - uses: actions/setup-node@v3
+      id: step1
      uses: garronej/ts-ci@v1.1.4
      with: 
        action_name: tell_if_project_uses_npm_or_yarn
    - uses: actions/checkout@v2.3.4
    - uses: actions/setup-node@v2.1.3
      with:
        node-version: ${{ matrix.node }}
    - uses: bahmutov/npm-install@v1
-    - run: yarn build
+    - if: steps.step1.outputs.npm_or_yarn == 'yarn'
-    - run: yarn test
+      run: |
-    #- run: yarn test:keycloakify-starter
+        yarn build
-
+        yarn test
-  storybook:
+    - if: steps.step1.outputs.npm_or_yarn == 'npm'
-    runs-on: ubuntu-latest
+      run: |
-    if: github.event_name == 'push'
+        npm run build
-    needs: test
+        npm test
    steps:
    - uses: actions/checkout@v3
    - uses: actions/setup-node@v3
      with:
        node-version: '18'
    - uses: bahmutov/npm-install@v1
    - run: yarn build-storybook -o ./build_storybook
    - 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 ./build_storybook -u "github-actions-bot <actions@github.com>" 
  check_if_version_upgraded:
    name: Check if version upgrade
-    # When someone forks the repo and opens a PR we want to enables the tests to be run (the previous jobs)
+    # We run this only if it's a push on the default branch or if it's a PR from a 
-    # but obviously only us should be allowed to release.
+    # branch (meaning not a PR from a fork). It would be more straightforward to test if secrets.NPM_TOKEN is 
-    # In the following check we make sure that we own the branch this CI workflow is running on before continuing.
+    # defined but GitHub Action don't allow it yet.
    # Without this check, trying to release would fail anyway because only us have the correct secret.NPM_TOKEN but
    # it's cleaner to stop the execution instead of letting the CI crash.
    if: |
      github.event_name == 'push' || 
      github.event.pull_request.head.repo.owner.login == github.event.pull_request.base.repo.owner.login 
@ -71,22 +65,23 @@ jobs:
      from_version: ${{ steps.step1.outputs.from_version }}
      to_version: ${{ steps.step1.outputs.to_version }}
      is_upgraded_version: ${{ steps.step1.outputs.is_upgraded_version }}
-      is_pre_release: ${{steps.step1.outputs.is_pre_release }}
+      is_release_beta: ${{steps.step1.outputs.is_release_beta }}
    steps:
-    - uses: garronej/ts-ci@v2.1.0
+    - uses: garronej/ts-ci@v1.1.7
      id: step1
      with: 
        action_name: is_package_json_version_upgraded
        branch: ${{ github.head_ref || github.ref }}
  create_github_release:
    runs-on: ubuntu-latest
-    # We create release only if the version in the package.json have been upgraded and this CI is running against the main branch.
+    # We create a release only if the version have been upgraded and we are on a default branch
-    # We allow branches with a PR open on main to publish pre-release (x.y.z-rc.u) but not actual releases.
+    # PR on the default branch can release beta but not real release
    if: |
      needs.check_if_version_upgraded.outputs.is_upgraded_version == 'true' &&
      (
        github.event_name == 'push' ||
-        needs.check_if_version_upgraded.outputs.is_pre_release == 'true'
+        needs.check_if_version_upgraded.outputs.is_release_beta == 'true'
      )
    needs: 
      - check_if_version_upgraded
@ -98,7 +93,7 @@ jobs:
        target_commitish: ${{ github.head_ref || github.ref }}
        generate_release_notes: true
        draft: false
-        prerelease: ${{ needs.check_if_version_upgraded.outputs.is_pre_release == 'true' }}
+        prerelease: ${{ needs.check_if_version_upgraded.outputs.is_release_beta == 'true' }}
      env:
        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 
@ -108,20 +103,23 @@ jobs:
      - create_github_release
      - check_if_version_upgraded
    steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v2.3.4
      with:
        ref: ${{ github.ref }}
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v2.1.3
      with:
        node-version: '15'
        registry-url: https://registry.npmjs.org/
    - uses: bahmutov/npm-install@v1
-    - run: yarn build
+    - run: |
-    - run: npx -y -p denoify@1.3.0 enable_short_npm_import_path
+        PACKAGE_MANAGER=npm
        if [ -f "./yarn.lock" ]; then
            PACKAGE_MANAGER=yarn
        fi
        $PACKAGE_MANAGER run build
    - run: npx -y -p denoify@0.6.5 denoify_enable_short_npm_import_path
      env:
        DRY_RUN: "0"
    - uses: garronej/ts-ci@v2.1.0
      with: 
        action_name: remove_dark_mode_specific_images_from_readme
    - name: Publishing on NPM
      run: |
        if [ "$(npm show . version)" = "$VERSION" ]; then
@ -133,11 +131,11 @@ jobs:
          false
        fi
        EXTRA_ARGS=""
-        if [ "$IS_PRE_RELEASE" = "true" ]; then
+        if [ "$IS_BETA" = "true" ]; then
-            EXTRA_ARGS="--tag next"
+            EXTRA_ARGS="--tag beta"
        fi
        npm publish $EXTRA_ARGS
      env:
        NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
        VERSION: ${{ needs.check_if_version_upgraded.outputs.to_version }}
-        IS_PRE_RELEASE: ${{ needs.check_if_version_upgraded.outputs.is_pre_release }}
+        IS_BETA: ${{ needs.check_if_version_upgraded.outputs.is_release_beta }}
--- a/.gitignore
+++ b/.gitignore
@ -41,21 +41,11 @@ jspm_packages
 .DS_Store
 /dist
-/keycloakify_starter_test/
+
 /sample_custom_react_project/
 /sample_react_project/
 /.yarn_home/
 .idea
-/src/login/i18n/baseMessages/
+/keycloak_email
-/src/account/i18n/baseMessages/
+/build_keycloak
 # VS Code devcontainers
 .devcontainer
 /.yarn
 /.yarnrc.yml
 /stories/assets/fonts/
 /build_storybook/
 /storybook-static/
--- a/.prettierignore
+++ b/.prettierignore
@ -4,12 +4,5 @@ node_modules/
 /.yarn_home/
 /src/test/apps/
 /src/tools/types/
-/build_keycloak/
+/sample_react_project
-/.vscode/
+/build_keycloak/
 /src/login/i18n/baseMessages/
 /src/account/i18n/baseMessages/
 /dist_test
 /sample_react_project/
 /sample_custom_react_project/
 /keycloakify_starter_test/
 /.storybook/static/keycloak-resources/
--- a/.prettierrc.json
+++ b/.prettierrc.json
@ -5,7 +5,7 @@
    "semi": true,
    "singleQuote": false,
    "quoteProps": "preserve",
-    "trailingComma": "none",
+    "trailingComma": "all",
    "bracketSpacing": true,
    "arrowParens": "avoid"
 }
--- a/.storybook/Containers.js
+++ b/.storybook/Containers.js
@ -1,76 +0,0 @@
 import React from "react";
 import { DocsContainer as BaseContainer } from "@storybook/addon-docs";
 import { useDarkMode } from "storybook-dark-mode";
 import { darkTheme, lightTheme } from "./customTheme";
 import "./static/fonts/WorkSans/font.css";
 export function DocsContainer({ children, context }) {
    const isStorybookUiDark = useDarkMode();
    const theme = isStorybookUiDark ? darkTheme : lightTheme;
    const backgroundColor = theme.appBg;
    return (
        <>
            <style>{`
                body {
                    padding: 0 !important;
                    background-color: ${backgroundColor};
                }
                .docs-story {
                    background-color: ${backgroundColor};
                }
                [id^=story--] .container {
                    border: 1px dashed #e8e8e8;
                }
                .docblock-argstable-head th:nth-child(3), .docblock-argstable-body tr > td:nth-child(3) {
                    visibility: collapse;
                }
                .docblock-argstable-head th:nth-child(3), .docblock-argstable-body tr > td:nth-child(2) p {
                    font-size: 13px;
                }
            `}</style>
            <BaseContainer
                context={{
                    ...context,
                    "storyById": id => {
                        const storyContext = context.storyById(id);
                        return {
                            ...storyContext,
                            "parameters": {
                                ...storyContext?.parameters,
                                "docs": {
                                    ...storyContext?.parameters?.docs,
                                    "theme": isStorybookUiDark ? darkTheme : lightTheme
                                }
                            }
                        };
                    }
                }}
            >
                {children}
            </BaseContainer>
        </>
    );
 }
 export function CanvasContainer({ children }) {
    return (
        <>
            <style>{`
                body {
                    padding: 0 !important;
                }
            `}</style>
            {children}
        </>
    );
 }
--- a/.storybook/customTheme.js
+++ b/.storybook/customTheme.js
@ -1,35 +0,0 @@
 import { create } from "@storybook/theming";
 const brandImage = "logo.png";
 const brandTitle = "Keycloakify";
 const brandUrl = "https://github.com/keycloakify/keycloakify";
 const fontBase = '"Work Sans", sans-serif';
 const fontCode = "monospace";
 export const darkTheme = create({
    "base": "dark",
    "appBg": "#1E1E1E",
    "appContentBg": "#161616",
    "barBg": "#161616",
    "colorSecondary": "#8585F6",
    "textColor": "#FFFFFF",
    brandImage,
    brandTitle,
    brandUrl,
    fontBase,
    fontCode
 });
 export const lightTheme = create({
    "base": "light",
    "appBg": "#F6F6F6",
    "appContentBg": "#FFFFFF",
    "barBg": "#FFFFFF",
    "colorSecondary": "#000091",
    "textColor": "#212121",
    brandImage,
    brandTitle,
    brandUrl,
    fontBase,
    fontCode
 });
--- a/.storybook/main.js
+++ b/.storybook/main.js
@ -1,15 +0,0 @@
 module.exports = {
    "stories": [
        "../stories/**/*.stories.@(ts|tsx|mdx)"
    ],
    "addons": [
        "@storybook/addon-links",
        "@storybook/addon-essentials",
        "storybook-dark-mode",
        "@storybook/addon-a11y"
    ],
    "core": {
        "builder": "webpack5"
    },
    "staticDirs": ["./static"]
 };
--- a/.storybook/manager-head.html
+++ b/.storybook/manager-head.html
@ -1,32 +0,0 @@
 <!-- start favicon -->
 <link rel="apple-touch-icon" sizes="180x180" href="/favicon_package/apple-touch-icon.png">
 <link rel="icon" type="image/png" sizes="32x32" href="/favicon_package/favicon-32x32.png">
 <link rel="icon" type="image/png" sizes="16x16" href="/favicon_package/favicon-16x16.png">
 <link rel="manifest" href="/favicon_package/site.webmanifest">
 <link rel="mask-icon" href="/favicon_package/safari-pinned-tab.svg" color="#5bbad5">
 <!-- end favicon -->
 <!-- Meta tags generated by metatags.io -->
 <!-- Primary Meta Tags -->
 <title>Keycloakify Storybook</title>
 <meta name="title" content="Keycloakify Storybook">
 <meta name="description" content="Storybook of default components to use as a reference when building a custom Keycloak theme">
 <!-- Facebook Meta Tags -->
 <meta property="og:url" content="https://www.keycloakify.dev">
 <meta property="og:type" content="website">
 <meta property="og:title" content="Keycloakify Storybook">
 <meta property="og:description" content="Storybook of default components to use as a reference when building a custom Keycloak theme">
 <meta property="og:image" content="https://storybook.keycloakify.dev/preview.png">
 <!-- Twitter Meta Tags -->
 <meta name="twitter:card" content="summary_large_image">
 <meta name="twitter:title" content="Keycloakify Storybook">
 <meta name="twitter:description" content="Storybook of default components to use as a reference when building a custom Keycloak theme">
 <meta name="twitter:image" content="https://storybook.keycloakify.dev/preview.png">
 <link rel="preload" href="/fonts/WorkSans/worksans-bold-webfont.woff2" as="font" crossorigin="anonymous">
 <link rel="preload" href="/fonts/WorkSans/worksans-medium-webfont.woff2" as="font" crossorigin="anonymous">
 <link rel="preload" href="/fonts/WorkSans/worksans-regular-webfont.woff2" as="font" crossorigin="anonymous">
 <link rel="preload" href="/fonts/WorkSans/worksans-semibold-webfont.woff2" as="font" crossorigin="anonymous">
 <link rel="stylesheet" type="text/css" href="/fonts/WorkSans/font.css">
--- a/.storybook/manager.js
+++ b/.storybook/manager.js
@ -1,6 +0,0 @@
 import { addons } from '@storybook/addons';
 addons.setConfig({
  "selectedPanel": 'storybook/a11y/panel',
  "showPanel": false,
 });
--- a/.storybook/preview.js
+++ b/.storybook/preview.js
@ -1,137 +0,0 @@
 import { darkTheme, lightTheme } from "./customTheme";
 import { DocsContainer, CanvasContainer } from "./Containers";
 export const parameters = {
    "actions": { "argTypesRegex": "^on[A-Z].*" },
    "controls": {
        "matchers": {
            "color": /(background|color)$/i,
            "date": /Date$/,
        },
    },
    "backgrounds": { "disable": true },
    "darkMode": {
        "light": lightTheme,
        "dark": darkTheme,
    },
    "docs": {
        "container": DocsContainer
    },
    "controls": {
        "disable": true,
    },
    "actions": {
        "disable": true
    },
    "viewport": {
        "viewports": {
            "1440p": {
                "name": "1440p",
                "styles": {
                    "width": "2560px",
                    "height": "1440px",
                },
            },
            "fullHD": {
                "name": "Full HD",
                "styles": {
                    "width": "1920px",
                    "height": "1080px",
                },
            },
            "macBookProBig": {
                "name": "MacBook Pro Big",
                "styles": {
                    "width": "1024px",
                    "height": "640px",
                },
            },
            "macBookProMedium": {
                "name": "MacBook Pro Medium",
                "styles": {
                    "width": "1440px",
                    "height": "900px",
                },
            },
            "macBookProSmall": {
                "name": "MacBook Pro Small",
                "styles": {
                    "width": "1680px",
                    "height": "1050px",
                },
            },
            "pcAgent": {
                "name": "PC Agent",
                "styles": {
                    "width": "960px",
                    "height": "540px",
                },
            },
            "iphone12Pro": {
                "name": "Iphone 12 pro",
                "styles": {
                    "width": "390px",
                    "height": "844px",
                },
            },
            "iphone5se": {
                "name": "Iphone 5/SE",
                "styles": {
                    "width": "320px",
                    "height": "568px",
                },
            },
            "ipadPro": {
                "name": "Ipad pro",
                "styles": {
                    "width": "1240px",
                    "height": "1366px",
                },
            },
            "Galaxy s9+": {
                "name": "Galaxy S9+",
                "styles": {
                    "width": "320px",
                    "height": "658px",
                },
            }
        },
    },
    "options": {
        "storySort": (a, b) =>
            getHardCodedWeight(b[1].kind) - getHardCodedWeight(a[1].kind),
    },
 };
 export const decorators = [
    (Story) => (
        <CanvasContainer>
            <Story />
        </CanvasContainer>
    ),
 ];
 const { getHardCodedWeight } = (() => {
    const orderedPagesPrefix = [
        "Introduction",
        "login/login.ftl",
        "login/register-user-profile.ftl",
        "login/register.ftl",
        "login/terms.ftl",
        "login/error.ftl",
    ];
    function getHardCodedWeight(kind) {
        for (let i = 0; i < orderedPagesPrefix.length; i++) {
            if (kind.toLowerCase().startsWith(orderedPagesPrefix[i].toLowerCase())) {
                return orderedPagesPrefix.length - i;
            }
        }
        return 0;
    }
    return { getHardCodedWeight };
 })();
--- a/.storybook/static/CNAME
+++ b/.storybook/static/CNAME
@ -1 +0,0 @@
 storybook.keycloakify.dev
--- a/.storybook/static/favicon_package/android-chrome-192x192.png
+++ b/.storybook/static/favicon_package/android-chrome-192x192.png
--- a/.storybook/static/favicon_package/android-chrome-384x384.png
+++ b/.storybook/static/favicon_package/android-chrome-384x384.png
--- a/.storybook/static/favicon_package/apple-touch-icon.png
+++ b/.storybook/static/favicon_package/apple-touch-icon.png
--- a/.storybook/static/favicon_package/browserconfig.xml
+++ b/.storybook/static/favicon_package/browserconfig.xml
@ -1,9 +0,0 @@
 <?xml version="1.0" encoding="utf-8"?>
 <browserconfig>
    <msapplication>
        <tile>
            <square150x150logo src="/mstile-150x150.png"/>
            <TileColor>#da532c</TileColor>
        </tile>
    </msapplication>
 </browserconfig>
--- a/.storybook/static/favicon_package/favicon-16x16.png
+++ b/.storybook/static/favicon_package/favicon-16x16.png
--- a/.storybook/static/favicon_package/favicon-32x32.png
+++ b/.storybook/static/favicon_package/favicon-32x32.png
--- a/.storybook/static/favicon_package/favicon.ico
+++ b/.storybook/static/favicon_package/favicon.ico
--- a/.storybook/static/favicon_package/mstile-150x150.png
+++ b/.storybook/static/favicon_package/mstile-150x150.png
--- a/.storybook/static/favicon_package/safari-pinned-tab.svg
+++ b/.storybook/static/favicon_package/safari-pinned-tab.svg
@ -1,193 +0,0 @@
 <?xml version="1.0" standalone="no"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
 "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
 <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
 width="447.000000pt" height="447.000000pt" viewBox="0 0 447.000000 447.000000"
 preserveAspectRatio="xMidYMid meet">
 <metadata>
 Created by potrace 1.14, written by Peter Selinger 2001-2017
 </metadata>
 <g transform="translate(0.000000,447.000000) scale(0.100000,-0.100000)"
 fill="#000000" stroke="none">
 <path d="M2177 4413 c-3 -2 -17 -6 -33 -9 -85 -15 -204 -109 -286 -225 -95
 -133 -229 -437 -263 -597 -4 -18 -10 -30 -13 -28 -4 2 -7 -11 -8 -30 0 -19 -3
 -36 -6 -39 -3 -4 -23 1 -44 10 -51 22 -213 73 -289 92 -301 73 -516 74 -670 3
 -124 -57 -186 -153 -188 -295 -1 -67 5 -128 18 -180 3 -13 15 -45 26 -70 43
 -99 57 -135 53 -135 -3 0 4 -10 16 -22 11 -12 20 -26 20 -31 0 -5 9 -22 21
 -38 11 -16 18 -29 14 -29 -3 0 4 -10 15 -22 11 -12 18 -28 15 -36 -2 -7 -1
 -11 3 -8 4 2 19 -12 32 -32 13 -20 33 -47 44 -59 11 -13 17 -23 13 -23 -3 0
 12 -19 33 -42 22 -24 38 -49 35 -55 -2 -7 -1 -12 4 -10 4 1 32 -25 62 -58 30
 -33 88 -94 131 -135 l76 -75 -71 -70 c-112 -110 -174 -181 -262 -300 -106
 -144 -142 -202 -203 -325 -9 -19 -21 -38 -27 -42 -5 -4 -7 -8 -3 -8 4 0 -4
 -27 -18 -60 -25 -63 -58 -199 -50 -208 3 -2 1 -12 -4 -22 -5 -10 -6 -20 -3
 -24 4 -4 8 -23 10 -44 9 -107 77 -201 183 -251 33 -16 56 -32 52 -36 -4 -5 -2
 -5 4 -2 6 4 44 1 85 -6 41 -7 102 -12 136 -12 41 1 60 -2 55 -9 -3 -6 2 -5 11
 3 11 8 44 14 86 15 38 0 67 4 64 9 -4 6 10 8 79 11 14 0 24 3 22 5 -4 4 33 14
 145 37 13 3 33 10 43 15 11 6 26 8 34 5 10 -4 12 -2 8 6 -5 8 -2 9 9 5 10 -3
 17 -2 17 3 0 6 8 10 18 10 9 0 36 9 58 19 32 15 45 16 54 8 9 -9 11 -9 8 2 -2
 7 2 15 8 18 10 3 23 -34 38 -108 2 -8 6 -21 9 -29 15 -36 70 -206 70 -217 0
 -7 4 -13 8 -13 11 0 30 -61 22 -74 -3 -6 -3 -8 2 -4 8 7 86 -135 88 -159 0 -7
 4 -13 8 -13 13 0 39 -56 31 -66 -4 -5 -3 -6 2 -2 5 4 22 -12 39 -35 17 -23 49
 -59 71 -80 23 -21 40 -42 39 -47 -2 -6 0 -9 5 -8 15 3 63 -22 68 -37 3 -8 10
 -12 15 -10 5 3 22 -1 39 -10 17 -9 35 -13 40 -10 6 3 10 2 10 -2 0 -5 12 -8
 28 -8 15 1 33 -4 41 -9 11 -8 13 -8 8 0 -4 7 7 13 33 17 21 3 53 12 71 21 17
 9 36 13 42 9 5 -3 7 -1 3 5 -3 6 3 13 14 17 11 3 20 11 20 16 0 5 5 9 11 9 5
 0 7 -6 3 -13 -4 -7 -3 -9 2 -4 5 5 9 12 9 17 0 4 14 21 30 37 69 67 162 196
 179 251 4 12 12 20 17 16 5 -3 8 -2 7 3 -1 4 6 29 17 56 14 33 24 45 35 41 11
 -4 12 -2 4 6 -14 14 -6 52 9 43 5 -3 7 -2 4 4 -3 5 8 45 24 88 17 44 33 86 35
 94 7 34 56 206 59 209 1 1 15 -3 31 -9 16 -7 34 -13 39 -15 61 -18 144 -51
 139 -56 -3 -4 3 -4 14 -1 11 2 23 0 26 -6 4 -5 14 -7 23 -4 9 4 14 2 10 -3 -3
 -5 7 -9 21 -8 34 1 63 -6 58 -15 -2 -3 19 -7 47 -9 28 -2 55 -6 61 -10 13 -8
 18 -9 79 -10 27 -1 46 -5 44 -9 -3 -5 20 -6 50 -5 44 3 54 1 48 -10 -6 -10 -5
 -11 6 0 16 15 33 16 23 0 -5 -7 -3 -8 7 -3 7 5 29 10 49 12 74 5 116 11 135
 18 11 4 37 13 57 21 28 10 38 11 41 1 4 -8 6 -7 6 3 1 8 21 28 46 44 43 26 92
 86 109 131 28 73 27 217 -3 313 -5 18 -10 33 -9 35 2 23 -118 257 -184 356
 -44 67 -124 177 -138 191 -3 3 -34 39 -70 80 -36 41 -97 107 -137 146 l-72 71
 25 22 c14 12 30 19 36 15 6 -4 8 -3 4 4 -3 6 24 42 61 80 38 38 86 91 108 117
 22 27 46 54 53 61 6 7 12 17 12 23 0 6 3 11 8 11 4 0 22 22 41 50 19 27 37 47
 41 45 4 -3 7 3 6 13 0 9 5 16 12 14 8 -1 11 2 7 7 -5 9 36 83 55 101 5 5 101
 200 121 245 7 18 26 84 36 125 2 8 4 27 5 42 0 16 5 25 11 21 6 -4 7 -1 2 7
 -11 18 -11 62 0 80 5 8 4 11 -2 7 -6 -4 -12 10 -16 36 -6 51 -10 70 -18 77 -3
 3 -15 21 -27 41 -42 70 -184 145 -292 155 -205 20 -451 -18 -709 -108 -30 -10
 -60 -17 -68 -14 -8 3 -12 2 -9 -3 5 -7 -42 -31 -60 -31 -1 0 -5 15 -9 33 -18
 86 -108 342 -156 444 -17 35 -29 66 -29 69 1 4 -2 10 -7 13 -5 3 -24 32 -42
 64 -108 190 -245 296 -403 311 -20 2 -39 2 -41 -1z m53 -124 c0 -5 5 -7 10 -4
 14 9 52 -4 45 -16 -3 -5 0 -6 8 -4 17 7 69 -33 61 -47 -5 -7 -2 -8 5 -4 13 8
 43 -23 35 -36 -3 -4 1 -6 8 -3 7 2 24 -11 38 -31 14 -19 30 -41 35 -47 50 -56
 148 -233 139 -249 -4 -6 -3 -9 2 -5 12 7 97 -192 90 -210 -3 -8 -2 -12 3 -9
 11 7 45 -120 35 -135 -4 -8 -3 -9 4 -5 7 4 12 3 12 -3 0 -5 3 -16 6 -25 4 -11
 -23 -30 -113 -75 -138 -71 -276 -145 -350 -189 -29 -17 -53 -29 -53 -26 0 3
 -7 -1 -15 -10 -14 -14 -19 -13 -53 6 -20 11 -62 34 -92 51 -30 16 -59 33 -65
 37 -5 4 -86 47 -180 95 -93 48 -173 91 -177 94 -11 10 3 52 15 44 6 -3 7 -1 3
 6 -9 14 12 113 22 107 4 -2 8 7 8 20 2 24 42 134 53 144 3 3 7 12 9 20 2 8 17
 44 33 80 24 50 32 61 40 50 8 -11 9 -10 4 7 -5 17 10 47 60 123 36 55 71 98
 76 94 5 -3 9 -2 8 3 -4 23 2 35 17 29 8 -3 12 -2 9 3 -7 12 60 78 100 99 25
 13 70 27 98 31 4 1 7 -4 7 -10z m-1411 -783 c9 -6 12 -5 8 1 -4 6 10 10 34 11
 29 1 38 -1 33 -11 -5 -9 -4 -9 7 1 7 6 19 12 27 12 8 0 10 -5 6 -12 -6 -10 -5
 -10 7 -1 9 7 26 10 40 8 13 -3 47 -8 74 -11 63 -7 155 -23 175 -31 15 -6 35
 -10 71 -12 12 -1 17 -5 13 -13 -4 -7 -3 -8 4 -4 6 4 31 1 54 -5 24 -7 49 -13
 55 -15 25 -5 73 -29 73 -37 0 -5 4 -6 9 -3 12 8 41 -4 41 -16 0 -5 -4 -6 -10
 -3 -6 3 -7 -1 -4 -9 3 -9 1 -45 -5 -81 -6 -36 -14 -91 -17 -122 -4 -32 -11
 -61 -18 -65 -8 -6 -7 -8 2 -8 7 0 11 -4 8 -8 -3 -4 -8 -42 -11 -83 -4 -40 -9
 -81 -12 -89 -3 -8 -6 -44 -8 -80 -1 -36 -3 -65 -4 -65 -1 0 -3 -27 -4 -61 -3
 -66 0 -62 -92 -139 -33 -27 -62 -53 -63 -58 -2 -4 -8 -5 -13 -1 -5 3 -9 1 -9
 -3 0 -5 -41 -44 -91 -88 -50 -43 -98 -85 -106 -93 -13 -14 -23 -6 -91 64 -86
 90 -172 188 -186 213 -5 9 -12 18 -16 21 -12 9 -106 154 -139 215 -18 33 -37
 66 -43 72 -6 7 -8 20 -4 28 3 9 2 14 -3 11 -19 -12 -102 225 -105 296 0 27 -4
 48 -7 48 -16 0 9 108 32 142 22 31 125 81 151 74 10 -2 18 0 18 5 0 5 14 7 30
 5 17 -2 30 0 30 4 0 9 42 7 59 -4z m2823 1 c6 -9 8 -9 8 1 0 7 4 10 10 7 5 -3
 29 -8 52 -11 113 -13 201 -66 197 -118 0 -5 4 -12 10 -15 9 -6 11 -27 11 -124
 0 -16 -4 -26 -9 -23 -5 3 -7 -2 -4 -13 11 -41 -89 -307 -110 -294 -6 3 -7 1
 -3 -6 13 -20 -142 -281 -166 -281 -6 0 -8 -3 -5 -7 11 -10 -51 -84 -197 -238
 l-86 -89 -47 44 c-26 25 -52 50 -58 55 -7 6 -39 33 -71 61 -33 29 -86 73 -119
 100 -86 69 -87 71 -90 112 -5 69 -16 207 -21 242 -4 33 -10 92 -18 170 -4 37
 -14 114 -21 165 -2 17 -9 52 -14 80 -5 27 -9 50 -8 51 50 22 109 44 129 48 15
 2 36 10 48 16 12 6 28 9 35 6 8 -3 15 -1 17 5 2 5 19 11 39 13 20 2 40 6 45 9
 5 3 29 8 54 12 25 4 48 9 52 11 5 3 8 -1 8 -8 0 -9 2 -10 8 -2 9 16 43 21 61
 10 10 -7 12 -6 6 4 -6 10 -3 12 12 8 12 -3 25 -3 31 1 20 12 206 11 214 -2z
 m-1950 -189 c23 -13 46 -27 49 -31 3 -5 9 -8 13 -7 15 3 64 -25 59 -34 -3 -5
 -1 -6 5 -2 14 9 63 -14 55 -27 -3 -6 -2 -7 4 -4 5 3 56 -21 113 -53 57 -33
 107 -60 111 -60 4 0 11 -5 15 -12 5 -8 2 -9 -9 -5 -9 3 -16 2 -14 -2 1 -5 -48
 -42 -110 -83 -61 -40 -144 -95 -183 -123 -40 -27 -80 -54 -89 -60 -9 -5 -18
 -12 -21 -15 -17 -17 -80 -60 -80 -54 0 3 -9 -4 -20 -17 l-20 -24 6 105 c3 58
 7 121 9 140 2 19 5 52 6 72 1 20 5 36 8 34 3 -2 7 19 7 47 2 79 15 149 31 176
 8 13 10 20 4 17 -6 -4 -11 -2 -11 3 0 6 4 11 10 11 5 0 7 7 4 15 -8 20 -4 19
 48 -7z m1114 -66 c3 -26 8 -56 10 -67 10 -50 19 -145 19 -192 0 -28 3 -49 7
 -47 4 3 6 -16 5 -41 -1 -25 0 -45 3 -45 3 0 6 -32 7 -70 2 -39 -1 -70 -5 -70
 -5 0 -18 9 -30 20 -12 11 -26 20 -31 20 -5 0 -17 10 -25 22 -9 12 -16 19 -16
 15 0 -6 -92 56 -135 90 -25 20 -253 169 -278 182 -15 8 -26 15 -25 16 9 7 158
 95 184 108 17 9 34 13 38 10 3 -4 6 -1 6 5 0 11 175 102 197 102 7 0 13 4 13
 9 0 5 8 11 18 13 20 4 29 -14 38 -80z m-531 -268 c30 -20 55 -41 55 -45 0 -5
 6 -8 13 -6 6 1 11 -4 9 -11 -1 -8 2 -11 7 -7 14 8 82 -38 76 -52 -2 -7 2 -10
 11 -6 8 3 25 -3 37 -14 12 -11 35 -27 50 -37 16 -9 25 -22 21 -28 -4 -7 -3 -8
 4 -4 10 6 242 -148 250 -166 2 -5 9 -8 16 -8 7 0 21 -9 31 -20 17 -19 14 -24
 -10 -21 -5 1 -3 -4 5 -11 12 -10 15 -40 16 -138 0 -77 -4 -128 -10 -132 -7 -5
 -7 -8 -1 -8 12 0 14 -259 2 -277 -5 -7 -4 -13 1 -13 12 0 7 -79 -5 -90 -7 -7
 -244 -174 -287 -203 -10 -6 -24 -16 -30 -22 -12 -10 -34 -26 -211 -146 -96
 -65 -108 -71 -131 -60 -14 6 -22 16 -19 21 3 5 0 7 -7 5 -8 -3 -23 4 -35 15
 -12 11 -24 20 -27 20 -5 0 -246 166 -271 187 -5 4 -30 22 -55 38 -25 17 -49
 33 -55 38 -5 4 -44 31 -85 61 l-75 54 0 337 c1 317 2 338 19 351 11 7 23 11
 29 7 6 -3 7 -1 3 5 -4 7 3 17 18 24 14 6 26 15 26 20 0 4 7 8 15 8 8 0 15 5
 15 11 0 6 7 8 16 5 8 -3 13 -2 9 3 -3 5 12 20 32 32 21 13 41 27 44 32 4 5 12
 6 19 2 8 -5 11 -4 7 2 -9 15 38 44 60 37 12 -4 14 -3 6 3 -9 6 1 19 37 46 27
 20 54 37 59 37 5 0 11 3 13 8 5 12 131 95 144 95 7 0 12 4 11 8 -2 8 51 47 66
 48 4 1 32 -15 62 -35z m-822 -752 c2 -270 4 -262 -48 -215 -12 10 -41 34 -65
 53 -43 33 -83 67 -157 136 l-34 31 57 49 c177 153 219 185 228 176 4 -4 7 -2
 6 3 -4 17 0 29 6 23 3 -4 6 -119 7 -256z m1539 245 c7 -7 26 -20 41 -30 15
 -10 25 -23 21 -29 -4 -7 -3 -8 4 -4 7 4 12 2 12 -3 0 -6 6 -10 13 -8 6 1 11
 -4 9 -11 -1 -8 2 -11 7 -8 5 4 14 -2 20 -11 5 -10 13 -18 18 -18 4 0 7 -3 6
 -7 -2 -5 1 -7 5 -5 5 1 37 -22 71 -52 l62 -54 -53 -49 c-29 -27 -66 -59 -81
 -71 -16 -12 -34 -27 -41 -33 -43 -40 -129 -105 -133 -101 -2 3 0 14 6 25 7 13
 7 23 -2 32 -9 10 -9 14 1 17 6 3 9 9 6 14 -5 9 -8 289 -4 314 1 6 2 14 1 19
 -4 22 -8 86 -5 86 1 0 9 -6 16 -13z m-1862 -353 c48 -45 72 -65 109 -93 17
 -13 31 -30 31 -37 0 -8 3 -13 8 -13 21 4 32 -3 32 -18 0 -9 3 -14 6 -10 4 3
 13 -1 21 -9 8 -8 30 -26 49 -40 18 -15 31 -31 27 -37 -3 -5 -2 -7 4 -4 23 14
 43 -19 48 -78 10 -127 16 -186 40 -410 4 -33 10 -79 14 -102 5 -27 4 -46 -3
 -54 -8 -9 -8 -10 0 -6 7 4 14 -2 17 -13 3 -11 0 -20 -5 -20 -6 0 -5 -6 2 -15
 7 -8 10 -26 8 -40 -3 -13 -1 -22 3 -19 5 3 9 1 9 -5 0 -8 -35 -25 -50 -23 -3
 0 -14 -5 -25 -11 -11 -6 -22 -12 -25 -12 -3 -1 -36 -11 -75 -23 -61 -18 -120
 -33 -190 -48 -11 -2 -40 -7 -65 -10 -25 -3 -49 -8 -53 -11 -5 -3 -70 -6 -145
 -8 -122 -3 -168 0 -263 18 -72 14 -145 78 -155 136 -3 20 -8 44 -11 54 -2 9
 -1 17 4 17 4 0 8 17 7 37 -1 50 6 74 20 66 8 -4 8 -3 0 6 -12 14 33 164 47
 155 5 -3 6 2 3 10 -3 9 6 36 20 62 14 26 26 53 26 60 0 8 5 14 10 14 6 0 10 5
 10 11 0 22 93 168 103 162 6 -3 7 -2 4 4 -10 17 64 118 77 105 4 -3 5 0 2 8
 -4 9 12 35 39 65 25 28 73 80 106 117 34 38 65 65 70 62 5 -3 8 -2 7 3 -5 13
 26 42 37 35 6 -3 26 -21 45 -38z m2364 -103 c-1 -3 7 -12 18 -19 10 -7 15 -18
 12 -24 -4 -6 -2 -8 3 -5 6 4 21 -8 34 -25 13 -17 29 -36 34 -42 30 -33 63 -84
 58 -90 -4 -3 -1 -6 5 -6 17 0 85 -108 76 -121 -4 -7 -3 -9 3 -6 13 8 106 -169
 97 -185 -4 -6 -3 -8 3 -5 12 7 36 -50 28 -63 -3 -4 1 -10 9 -13 7 -3 17 -23
 21 -44 5 -21 10 -45 12 -53 2 -8 4 -24 6 -35 1 -11 6 -23 10 -26 5 -3 8 -36 8
 -73 0 -178 -108 -238 -417 -231 -78 2 -150 5 -161 8 -10 3 -34 8 -53 11 -19 3
 -48 8 -65 11 -114 22 -337 94 -329 106 3 5 -2 6 -12 2 -12 -5 -15 -2 -11 13 6
 20 16 78 22 129 2 17 6 46 9 65 3 19 8 60 11 90 3 30 8 69 11 87 2 17 7 62 10
 100 3 37 10 73 15 80 7 7 6 14 -1 18 -6 3 -7 12 -3 18 4 6 6 26 5 45 -2 25 1
 32 10 26 10 -6 10 -5 2 7 -16 21 -6 71 18 88 11 8 30 25 41 38 11 12 24 23 29
 23 4 0 25 16 45 36 63 60 110 94 118 86 5 -4 5 -2 2 4 -4 7 9 24 29 39 20 15
 49 40 66 57 l30 29 71 -72 c40 -39 71 -74 71 -78z m-1901 -294 c-3 -5 -2 -7 4
 -4 12 8 83 -39 83 -55 0 -6 3 -8 6 -5 7 7 136 -80 142 -95 2 -4 10 -8 18 -8 8
 0 14 -3 14 -8 0 -4 20 -18 45 -32 25 -14 45 -28 45 -32 0 -5 5 -8 10 -8 12 0
 124 -72 128 -82 2 -5 11 -8 20 -8 10 0 -36 -32 -101 -70 -65 -39 -124 -67
 -130 -64 -7 4 -8 3 -4 -2 5 -5 -41 -33 -110 -66 -80 -38 -120 -52 -125 -45 -3
 7 -9 32 -12 57 -3 25 -8 58 -11 74 -3 15 -8 49 -11 75 -3 25 -7 62 -9 81 -2
 19 -7 62 -10 94 -3 33 -8 64 -11 68 -3 4 0 8 6 8 6 0 8 5 4 11 -3 6 -8 43 -11
 82 -5 65 -4 70 11 58 9 -7 13 -18 9 -24z m1261 -64 c-4 -94 -9 -162 -18 -228
 -2 -16 -7 -55 -10 -85 -4 -30 -8 -62 -10 -70 -1 -8 -7 -37 -11 -65 -5 -27 -10
 -53 -11 -57 -1 -5 -2 -13 -3 -20 -1 -9 -4 -9 -13 0 -7 7 -20 12 -30 12 -10 0
 -18 5 -18 12 0 6 -3 9 -6 5 -4 -3 -54 19 -113 50 -58 31 -123 64 -143 75 -21
 10 -38 23 -38 29 0 6 -4 8 -9 5 -5 -3 -19 2 -32 12 -13 10 -37 24 -52 32 -25
 12 -26 15 -10 24 10 6 22 11 26 11 4 0 11 5 15 12 4 6 13 13 21 15 8 2 24 12
 36 23 13 12 36 27 52 35 15 8 35 21 43 28 8 7 18 12 23 12 4 0 16 8 26 18 42
 37 52 43 64 36 6 -4 9 -3 4 1 -9 11 43 46 56 38 6 -3 7 -2 4 4 -3 5 27 33 68
 62 41 28 77 56 80 61 12 20 13 8 9 -87z m-524 -403 c8 -5 30 -17 48 -26 17 -9
 32 -21 32 -26 0 -5 4 -7 9 -3 5 3 36 -11 68 -30 32 -19 63 -35 69 -35 5 0 21
 -10 34 -22 14 -13 25 -21 25 -18 1 8 154 -64 155 -73 0 -5 -4 -5 -10 -2 -6 4
 -7 -1 -3 -10 3 -10 0 -21 -8 -26 -11 -6 -11 -9 -1 -9 9 0 10 -5 4 -17 -5 -10
 -15 -40 -21 -68 -7 -27 -18 -63 -26 -80 -7 -16 -24 -58 -36 -92 -13 -34 -28
 -59 -33 -56 -5 3 -6 1 -3 -4 9 -14 -22 -75 -34 -68 -5 4 -6 -1 -3 -10 4 -9 -5
 -33 -20 -55 -14 -22 -26 -42 -26 -46 0 -3 -19 -33 -42 -67 -185 -267 -312
 -305 -471 -142 -56 56 -164 205 -150 205 4 0 3 4 -3 8 -14 8 -97 164 -109 202
 -4 14 -16 43 -26 65 -25 55 -76 216 -81 251 -2 23 1 29 14 28 10 -1 16 1 14 5
 -3 4 19 18 47 31 29 13 55 29 59 35 4 5 8 7 8 3 0 -4 23 6 50 22 28 16 50 26
 50 22 0 -4 4 -2 8 3 4 6 25 19 47 30 22 11 47 25 55 31 38 28 169 92 176 86 4
 -4 4 -2 1 5 -19 32 42 11 133 -47z"/>
 <path d="M2556 3192 c-3 -5 1 -9 9 -9 8 0 12 4 9 9 -3 4 -7 8 -9 8 -2 0 -6 -4
 -9 -8z"/>
 <path d="M2455 2831 c-3 -5 -2 -12 3 -15 5 -3 9 1 9 9 0 17 -3 19 -12 6z"/>
 <path d="M2500 2790 c-9 -6 -10 -10 -3 -10 6 0 15 5 18 10 8 12 4 12 -15 0z"/>
 <path d="M2144 2592 c-70 -35 -108 -103 -100 -179 3 -38 32 -93 62 -118 9 -7
 1 -43 -31 -140 -65 -196 -66 -176 5 -173 33 2 60 -1 60 -5 0 -5 4 -6 8 -3 13
 8 227 10 239 3 18 -11 23 7 13 39 -6 16 -28 83 -49 149 l-39 120 29 27 c16 16
 29 30 29 33 0 22 1 26 8 22 4 -3 8 20 8 51 3 88 -33 145 -108 176 -44 19 -96
 18 -134 -2z"/>
 <path d="M1113 2105 c0 -8 4 -12 9 -9 5 3 6 10 3 15 -9 13 -12 11 -12 -6z"/>
 <path d="M859 1903 c-13 -16 -12 -17 4 -4 9 7 17 15 17 17 0 8 -8 3 -21 -13z"/>
 <path d="M1436 1803 c-6 -14 -5 -15 5 -6 7 7 10 15 7 18 -3 3 -9 -2 -12 -12z"/>
 <path d="M3760 1596 c0 -2 8 -10 18 -17 15 -13 16 -12 3 4 -13 16 -21 21 -21
 13z"/>
 <path d="M1616 1691 c-3 -5 2 -15 12 -22 15 -12 16 -12 5 2 -7 9 -10 19 -6 22
 3 4 4 7 0 7 -3 0 -8 -4 -11 -9z"/>
 <path d="M2710 1590 c0 -5 5 -10 11 -10 5 0 7 5 4 10 -3 6 -8 10 -11 10 -2 0
 -4 -4 -4 -10z"/>
 <path d="M1090 831 c0 -6 4 -13 10 -16 6 -3 7 1 4 9 -7 18 -14 21 -14 7z"/>
 </g>
 </svg>
--- a/.storybook/static/favicon_package/site.webmanifest
+++ b/.storybook/static/favicon_package/site.webmanifest
@ -1,19 +0,0 @@
 {
    "name": "",
    "short_name": "",
    "icons": [
        {
            "src": "/android-chrome-192x192.png",
            "sizes": "192x192",
            "type": "image/png"
        },
        {
            "src": "/android-chrome-384x384.png",
            "sizes": "384x384",
            "type": "image/png"
        }
    ],
    "theme_color": "#ffffff",
    "background_color": "#ffffff",
    "display": "standalone"
 }
--- a/.storybook/static/fonts/WorkSans/font.css
+++ b/.storybook/static/fonts/WorkSans/font.css
@ -1,37 +0,0 @@
 /* latin */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: normal;
  /*400*/
  font-display: swap;
  src: url("./worksans-regular-webfont.woff2") format("woff2");
 }
 /* latin */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("./worksans-medium-webfont.woff2") format("woff2");
 }
 /* latin */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("./worksans-semibold-webfont.woff2") format("woff2");
 }
 /* latin */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: bold;
  /*700*/
  font-display: swap;
  src: url("./worksans-bold-webfont.woff2") format("woff2");
 }
--- a/.storybook/static/fonts/WorkSans/worksans-bold-webfont.woff2
+++ b/.storybook/static/fonts/WorkSans/worksans-bold-webfont.woff2
--- a/.storybook/static/fonts/WorkSans/worksans-medium-webfont.woff2
+++ b/.storybook/static/fonts/WorkSans/worksans-medium-webfont.woff2
--- a/.storybook/static/fonts/WorkSans/worksans-regular-webfont.woff2
+++ b/.storybook/static/fonts/WorkSans/worksans-regular-webfont.woff2
--- a/.storybook/static/fonts/WorkSans/worksans-semibold-webfont.woff2
+++ b/.storybook/static/fonts/WorkSans/worksans-semibold-webfont.woff2
--- a/.storybook/static/logo.png
+++ b/.storybook/static/logo.png
--- a/.storybook/static/preview.png
+++ b/.storybook/static/preview.png
--- a/README.md
+++ b/README.md
@ -2,340 +2,130 @@
    <img src="https://user-images.githubusercontent.com/6702424/109387840-eba11f80-7903-11eb-9050-db1dad883f78.png">  
 </p>
 <p align="center">
-    <i>🔏 Create Keycloak themes using React 🔏</i>
+    <i>🔏  Create Keycloak themes using React 🔏</i>
    <br>
    <br>
    <a href="https://github.com/garronej/keycloakify/actions">
      <img src="https://github.com/garronej/keycloakify/workflows/ci/badge.svg?branch=main">
    </a>
    <a href="https://bundlephobia.com/package/keycloakify">
      <img src="https://img.shields.io/bundlephobia/minzip/keycloakify">
    </a>
    <a href="https://www.npmjs.com/package/keycloakify">
      <img src="https://img.shields.io/npm/dm/keycloakify">
    </a>
    <a href="https://github.com/garronej/keycloakify/blob/main/LICENSE">
      <img src="https://img.shields.io/npm/l/keycloakify">
    </a>
-    <a href="https://github.com/keycloakify/keycloakify/blob/729503fe31a155a823f46dd66ad4ff34ca274e0a/tsconfig.json#L14">
+    <a href="https://github.com/InseeFrLab/keycloakify/blob/729503fe31a155a823f46dd66ad4ff34ca274e0a/tsconfig.json#L14">
        <img src="https://camo.githubusercontent.com/0f9fcc0ac1b8617ad4989364f60f78b2d6b32985ad6a508f215f14d8f897b8d3/68747470733a2f2f62616467656e2e6e65742f62616467652f547970655363726970742f7374726963742532302546302539462539322541412f626c7565">
    </a>
    <a href="https://github.com/thomasdarimont/awesome-keycloak">
        <img src="https://awesome.re/mentioned-badge.svg"/>
    </a>
    <a href="https://discord.gg/kYFZG7fQmn">
        <img src="https://img.shields.io/discord/1097708346976505977"/>
    </a>
    <p align="center">
        <a href="https://www.keycloakify.dev">Home</a>
        -
        <a href="https://docs.keycloakify.dev">Documentation</a>
-        -
+</p>
-        <a href="https://storybook.keycloakify.dev">Storybook</a>
+
        -
        <a href="https://github.com/codegouvfr/keycloakify-starter">Starter project</a>
    </p>
 </p>
 <p align="center">
-    <i>This build tool generates a Keycloak theme <a href="https://www.keycloakify.dev">Learn more</a></i>
+    <i>Ultimately this build tool generates a Keycloak theme <a href="https://www.keycloakify.dev">Learn more</a></i>
-    <br/>
+    <img src="https://user-images.githubusercontent.com/6702424/110260457-a1c3d380-7fac-11eb-853a-80459b65626b.png">
    <br/>
    <img width="400" src="https://github.com/keycloakify/keycloakify/assets/6702424/e66d105c-c06f-47d1-8a31-a6ab09da4e80">
 </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** [and up](https://github.com/keycloakify/keycloakify/discussions/346#discussioncomment-5889791)!
+> 🗣 Beloved contributors: [Keycloakify v6](https://docs.keycloakify.dev/v/v6/) is just around the corner, please stop
-
+> submitting PRs against `main` but work on [the `v6` branch](https://github.com/InseeFrLab/keycloakify/tree/v6) instead.
 > 📣 I've observed that a few people have unstarred the project recently.  
 > I'm concerned that I may have inadvertently introduced some misinformation in the documentation, leading to frustration.  
 > If you're having a negative experience, [please let me know so I can resolve the issue](https://github.com/keycloakify/keycloakify/discussions/507).
 ## Sponsor 👼
 We are exclusively sponsored by [Cloud IAM](https://cloud-iam.com/?mtm_campaign=keycloakify-deal&mtm_source=keycloakify-github), a French company offering Keycloak as a service.  
 Their dedicated support helps us continue the development and maintenance of this project.
 [Cloud IAM](https://cloud-iam.com/?mtm_campaign=keycloakify-deal&mtm_source=keycloakify-github) provides the following services:
 -   Simplify and secure your Keycloak Identity and Access Management. Keycloak as a Service.
 -   Custom theme building for your brand using Keycloakify.
 <div align="center">
 ![Logo Dark](https://user-images.githubusercontent.com/6702424/234135797-c84d0a90-0526-43e5-a186-70cbebdeb278.png#gh-dark-mode-only)
 </div>
 <div align="center">
 ![Logo Light](https://user-images.githubusercontent.com/6702424/234135799-68684c33-4ec5-48d4-8763-0f3922c86643.png#gh-light-mode-only)
 </div>
 <p align="center">
    <i>Checkout <a href="https://cloud-iam.com/?mtm_campaign=keycloakify-deal&mtm_source=keycloakify-github">Cloud IAM</a> and use promo code <code>keycloakify5</code></i>
    <br/>
    <i>5% of your annual subscription will be donated to us, and you'll get 5% off too.</i>
 </p>
 Thank you, [Cloud IAM](https://cloud-iam.com/?mtm_campaign=keycloakify-deal&mtm_source=keycloakify-github), for your support!
 ## Contributors ✨
 Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
 <!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
 <!-- prettier-ignore-start -->
 <!-- markdownlint-disable -->
 <table>
  <tbody>
    <tr>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/lordvlad"><img src="https://avatars.githubusercontent.com/u/1217769?v=4?s=100" width="100px;" alt="Waldemar Reusch"/><br /><sub><b>Waldemar Reusch</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=lordvlad" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://willwill96.github.io/the-ui-dawg-static-site/en/introduction/"><img src="https://avatars.githubusercontent.com/u/10997562?v=4?s=100" width="100px;" alt="William Will"/><br /><sub><b>William Will</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=willwill96" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/Ann2827"><img src="https://avatars.githubusercontent.com/u/32645809?v=4?s=100" width="100px;" alt="Bystrova Ann"/><br /><sub><b>Bystrova Ann</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=Ann2827" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/mkreuzmayr"><img src="https://avatars.githubusercontent.com/u/20108212?v=4?s=100" width="100px;" alt="Michael Kreuzmayr"/><br /><sub><b>Michael Kreuzmayr</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=mkreuzmayr" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://coolmathgames.tech"><img src="https://avatars.githubusercontent.com/u/6877780?v=4?s=100" width="100px;" alt="Mary "/><br /><sub><b>Mary </b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=Mstrodl" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://tasyp.xyz/"><img src="https://avatars.githubusercontent.com/u/6623212?v=4?s=100" width="100px;" alt="German Öö"/><br /><sub><b>German Öö</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=Tasyp" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://revolunet.com"><img src="https://avatars.githubusercontent.com/u/124937?v=4?s=100" width="100px;" alt="Julien Bouquillon"/><br /><sub><b>Julien Bouquillon</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=revolunet" title="Code">💻</a></td>
    </tr>
    <tr>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/aidangilmore"><img src="https://avatars.githubusercontent.com/u/32880357?v=4?s=100" width="100px;" alt="Aidan Gilmore"/><br /><sub><b>Aidan Gilmore</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=aidangilmore" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/0x-Void"><img src="https://avatars.githubusercontent.com/u/32745739?v=4?s=100" width="100px;" alt="Void"/><br /><sub><b>Void</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=0x-Void" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/juffe"><img src="https://avatars.githubusercontent.com/u/5393231?v=4?s=100" width="100px;" alt="juffe"/><br /><sub><b>juffe</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=juffe" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/lazToum"><img src="https://avatars.githubusercontent.com/u/4764837?v=4?s=100" width="100px;" alt="Lazaros Toumanidis"/><br /><sub><b>Lazaros Toumanidis</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=lazToum" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/marcmrf"><img src="https://avatars.githubusercontent.com/u/9928519?v=4?s=100" width="100px;" alt="Marc"/><br /><sub><b>Marc</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=marcmrf" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="http://kasir-barati.github.io"><img src="https://avatars.githubusercontent.com/u/73785723?v=4?s=100" width="100px;" alt="Kasir Barati"/><br /><sub><b>Kasir Barati</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=kasir-barati" title="Documentation">📖</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/asashay"><img src="https://avatars.githubusercontent.com/u/10714670?v=4?s=100" width="100px;" alt="Alex Oliynyk"/><br /><sub><b>Alex Oliynyk</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=asashay" title="Code">💻</a></td>
    </tr>
    <tr>
      <td align="center" valign="top" width="14.28%"><a href="https://www.gravitysoftware.be"><img src="https://avatars.githubusercontent.com/u/1140574?v=4?s=100" width="100px;" alt="Thomas Silvestre"/><br /><sub><b>Thomas Silvestre</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=thosil" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/satanshiro"><img src="https://avatars.githubusercontent.com/u/38865738?v=4?s=100" width="100px;" alt="satanshiro"/><br /><sub><b>satanshiro</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=satanshiro" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://poelhekke.dev"><img src="https://avatars.githubusercontent.com/u/1632377?v=4?s=100" width="100px;" alt="Koen Poelhekke"/><br /><sub><b>Koen Poelhekke</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=kpoelhekke" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/zavoloklom"><img src="https://avatars.githubusercontent.com/u/4151869?v=4?s=100" width="100px;" alt="Sergey Kupletsky"/><br /><sub><b>Sergey Kupletsky</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=zavoloklom" title="Tests">⚠️</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=zavoloklom" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/rome-user"><img src="https://avatars.githubusercontent.com/u/114131048?v=4?s=100" width="100px;" alt="rome-user"/><br /><sub><b>rome-user</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=rome-user" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/celinepelletier"><img src="https://avatars.githubusercontent.com/u/82821620?v=4?s=100" width="100px;" alt="Céline Pelletier"/><br /><sub><b>Céline Pelletier</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=celinepelletier" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/xgp"><img src="https://avatars.githubusercontent.com/u/244253?v=4?s=100" width="100px;" alt="Garth"/><br /><sub><b>Garth</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=xgp" title="Code">💻</a></td>
    </tr>
    <tr>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/BlackVoid"><img src="https://avatars.githubusercontent.com/u/673720?v=4?s=100" width="100px;" alt="Felix Gustavsson"/><br /><sub><b>Felix Gustavsson</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=BlackVoid" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://m-siemens.de/"><img src="https://avatars.githubusercontent.com/u/1873922?v=4?s=100" width="100px;" alt="Markus Siemens"/><br /><sub><b>Markus Siemens</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=msiemens" title="Code">💻</a></td>
      <td align="center" valign="top" width="14.28%"><a href="https://github.com/law108000"><img src="https://avatars.githubusercontent.com/u/8112024?v=4?s=100" width="100px;" alt="Rlok"/><br /><sub><b>Rlok</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=law108000" title="Code">💻</a></td>
      <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/giorgoslytos"><img src="https://avatars.githubusercontent.com/u/50946162?v=4?s=100" width="100px;" alt="giorgoslytos"/><br /><sub><b>giorgoslytos</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=giorgoslytos" title="Code">💻</a></td>
    </tr>
  </tbody>
 </table>
 <!-- markdownlint-restore -->
 <!-- prettier-ignore-end -->
 <!-- ALL-CONTRIBUTORS-LIST:END -->
 # Changelog highlights
 ## 9.0
 Bring back support for account themes in Keycloak v23 and up! [See issue](https://github.com/keycloakify/keycloakify/issues/389).
 ### Breaking changes
 Very few. Check them out [here](https://docs.keycloakify.dev/migration-guides/v8-greater-than-v9).
 ## 8.0
 -   Much smaller .jar size. 70.2 MB -> 7.8 MB.  
    Keycloakify now detects which of the static resources from the default theme are actually used by your theme and only include those in the .jar.
 -   Build time: The first build is slowed but the subsequent build are faster. [Update your CI so that the cache is persisted across CI build](https://github.com/keycloakify/keycloakify-starter/commit/bc378d5afb67e796f520afbc348185f3e319d9d0).
 ### Breaking changes
 There are very few breaking changes in this major version. [Check them out](https://docs.keycloakify.dev/migration-guides/v7-greater-than-v8).
 ## 7.15
 -   The i18n messages you defines in your theme are now also maid available to Keycloak.
    In practice this mean that you can now customize the `kcContext.message.summary` that
    display a general alert and the values returned by `kcContext.messagesPerField.get()` that
    are used to display specific error on some field of the form.
    [See video](https://youtu.be/D6tZcemReTI)
 ## 7.14
 -   Deprecate the `extraPages` build option. Keycloakify is now able to analyze your code to detect extra pages.
 ## 7.13
 -   Deprecate `customUserAttribute`, Keycloakify now analyze your code to predict field name usage. [See doc](https://docs.keycloakify.dev/build-options#customuserattributes).  
    It's now mandatory to [adopt the new directory structure](https://docs.keycloakify.dev/migration-guides/v6-greater-than-v7).
 ## 7.12
 -   You can now pack multiple themes variant in a single `.jar` bundle. In vanilla Keycloak themes you have the ability to extend a base theme.
    There is now an idiomatic way of achieving the same result. [Learn more](https://docs.keycloakify.dev/build-options#keycloakify.themeVariantNames).
 ## 7.9
 -   Separate script for copying the default theme static assets to the public directory.  
    Theses assets are only needed for testing your theme locally in Storybook or with a `mockPageId`.  
    You are now expected to have a `"prepare": "copy-keycloak-resources-to-public",` in your package.json scripts.  
    This script will create `public/keycloak-assets` when you run `yarn install` (If you are using another package manager
    like `pnpm` makes sure that `"prepare"` is actually ran.)  
    [See the updated starter](https://github.com/keycloakify/keycloakify-starter/blob/94532fcf10bf8b19e0873be8575fd28a8958a806/package.json#L11). `public/keycloak-assets` shouldn't be tracked by GIT and is automatically ignored.
 ## 7.7
 -   Better storybook support, see [the starter project](https://github.com/keycloakify/keycloakify-starter).
 ## 7.0 🍾
 -   Account theme support 🚀
 -   It's much easier to customize pages at the CSS level, you can now see in the browser dev tool the customizable classes.
 -   New interactive CLI tool `npx eject-keycloak-page`, that enables to select the page you want to customize at the component level.
 -   There is [a Storybook](https://storybook.keycloakify.dev)
 -   [Remember me is fixed](https://github.com/keycloakify/keycloakify/pull/272)
 ## 6.13
 -   Build work behind corporate proxies, [see issue](https://github.com/keycloakify/keycloakify/issues/257).
 ## 6.12
 Massive improvement in the developer experience:
 -   There is now only one starter repo: https://github.com/codegouvfr/keycloakify-starter
 -   A lot of comments have been added in the code of the starter to make it easier to get started.
 -   The doc has been updated: https://docs.keycloakify.dev
 -   A lot of improvements in the type system.
 ## 6.11.4
 -   You no longer need to have Maven installed to build the theme. Thanks to @lordvlad, [see PR](https://github.com/keycloakify/keycloakify/pull/239).
 -   Feature new build options: [`bundler`](https://docs.keycloakify.dev/build-options#keycloakify.bundler), [`groupId`](https://docs.keycloakify.dev/build-options#keycloakify.groupid), [`artifactId`](https://docs.keycloakify.dev/build-options#keycloakify.artifactid), [`version`](https://docs.keycloakify.dev/build-options#version).  
    Theses options can be user to customize the output name of the .jar. You can use environnement variables to overrides the values read in the package.json. Thanks to @lordvlad.
 ## 6.10.0
 -   Widows compat (thanks to @lordvlad, [see PR](https://github.com/keycloakify/keycloakify/pull/226)). WSL is no longer required 🎉
 ## 6.8.4
 -   `@emotion/react` is no longer a peer dependency of Keycloakify.
 ## 6.8.0
 -   It is now possible to pass a custom `<Template />` component as a prop to `<KcApp />` and every
    individual page (`<Login />`, `<RegisterUserProfile />`, ...) it enables to customize only the header and footer for
    example without having to switch to a full-component level customization. [See issue](https://github.com/keycloakify/keycloakify/issues/191).
 ## 6.7.0
 -   Add support for `webauthn-authenticate.ftl` thanks to [@mstrodl](https://github.com/Mstrodl)'s hacktoberfest [PR](https://github.com/keycloakify/keycloakify/pull/185).
 ## 6.6.0
 -   Add support for `login-password.ftl` thanks to [@mstrodl](https://github.com/Mstrodl)'s hacktoberfest [PR](https://github.com/keycloakify/keycloakify/pull/184).
 ## 6.5.0
 -   Add support for `login-username.ftl` thanks to [@mstrodl](https://github.com/Mstrodl)'s hacktoberfest [PR](https://github.com/keycloakify/keycloakify/pull/183).
 ## 6.4.0
 -   You can now optionally pass a `doFetchDefaultThemeResources: boolean` prop to every page component and the default `<KcApp />`
    This enables you to prevent the default CSS and JS that comes with the builtin Keycloak theme to be downloaded.  
    You'll get [a black slate](https://user-images.githubusercontent.com/6702424/192619083-4baa5df4-4a21-4ec7-8e28-d200d1208299.png).
 ## 6.0.0
 -   Bundle size drastically reduced, locals and component dynamically loaded.
 -   First print much quicker, use of React.lazy() everywhere.
 -   Real i18n API.
 -   Actual documentation for build options.
 Checkout [the migration guide](https://docs.keycloakify.dev/v5-to-v6)
 ## 5.8.0
-   [React.lazy()](https://reactjs.org/docs/code-splitting.html#reactlazy) support 🎉. [#141](https://github.com/keycloakify/keycloakify/issues/141)
+-   [React.lazy()](https://reactjs.org/docs/code-splitting.html#reactlazy) support 🎉. [#141](https://github.com/InseeFrLab/keycloakify/issues/141)
 ## 5.7.0
-   Feat `logout-confirm.ftl`. [PR](https://github.com/keycloakify/keycloakify/pull/120)
+-   Feat `logout-confirm.ftl`. [PR](https://github.com/InseeFrLab/keycloakify/pull/120)
 ## 5.6.4
 Fix `login-verify-email.ftl` page. [Before](https://user-images.githubusercontent.com/6702424/177436014-0bad22c4-5bfb-45bb-8fc9-dad65143cd0c.png) - [After](https://user-images.githubusercontent.com/6702424/177435797-ec5d7db3-84cf-49cb-8efc-3427a81f744e.png)
-## 5.6.0
+## v5.6.0
-Add support for `login-config-totp.ftl` page [#127](https://github.com/keycloakify/keycloakify/pull/127).
+Add support for `login-config-totp.ftl` page [#127](https://github.com/InseeFrLab/keycloakify/pull/127).
-## 5.3.0
+## v5.3.0
 Rename `keycloak_theme_email` to `keycloak_email`.  
 If you already had a `keycloak_theme_email` you should rename it `keycloak_email`.
-## 5.0.0
+## v5.0.0
 [Migration guide](https://github.com/garronej/keycloakify-demo-app/blob/a5b6a50f24bc25e082931f5ad9ebf47492acd12a/src/index.tsx#L46-L63)  
 New i18n system.  
 Import of terms and services have changed. [See example](https://github.com/garronej/keycloakify-demo-app/blob/a5b6a50f24bc25e082931f5ad9ebf47492acd12a/src/index.tsx#L46-L63).
-## 4.10.0
+## v4.10.0
-Add `login-idp-link-email.ftl` page [See PR](https://github.com/keycloakify/keycloakify/pull/92).
+Add `login-idp-link-email.ftl` page [See PR](https://github.com/InseeFrLab/keycloakify/pull/92).
-## 4.8.0
+## v4.8.0
 [Email template customization.](#email-template-customization)
-## 4.7.4
+## v4.7.4
 **M1 Mac** support (for testing locally with a dockerized Keycloak).
-## 4.7.2
+## v4.7.2
 > WARNING: This is broken.  
-> Testing with local Keycloak container working with M1 Mac. Thanks to [@eduardosanzb](https://github.com/keycloakify/keycloakify/issues/43#issuecomment-975699658).  
+> Testing with local Keycloak container working with M1 Mac. Thanks to [@eduardosanzb](https://github.com/InseeFrLab/keycloakify/issues/43#issuecomment-975699658).  
 > Be aware: When running M1s you are testing with Keycloak v15 else the local container spun will be a Keycloak v16.1.0.
-## 4.7.0
+## v4.7.0
 Register with user profile enabled: Out of the box `options` validator support.  
 [Example](https://user-images.githubusercontent.com/6702424/158911163-81e6bbe8-feb0-4dc8-abff-de199d7a678e.mov)
-## 4.6.0
+## v4.6.0
 `tss-react` and `powerhooks` are no longer peer dependencies of `keycloakify`.
 After updating Keycloakify you can remove `tss-react` and `powerhooks` from your dependencies if you don't use them explicitly.
-## 4.5.3
+## v4.5.3
 There is a new recommended way to setup highly customized theme. See [here](https://github.com/garronej/keycloakify-demo-app/blob/look_and_feel/src/KcApp/KcApp.tsx).  
 Unlike with [the previous recommended method](https://github.com/garronej/keycloakify-demo-app/blob/a51660578bea15fb3e506b8a2b78e1056c6d68bb/src/KcApp/KcApp.tsx),
 with this new method your theme wont break on minor Keycloakify update.
-## 4.3.0
+## v4.3.0
 Feature [`login-update-password.ftl`](https://user-images.githubusercontent.com/6702424/147517600-6191cf72-93dd-437b-a35c-47180142063e.png).  
 Every time a page is added it's a breaking change for non CSS-only theme.  
 Change [this](https://github.com/garronej/keycloakify-demo-app/blob/df664c13c77ce3c53ac7df0622d94d04e76d3f9f/src/KcApp/KcApp.tsx#L17) and [this](https://github.com/garronej/keycloakify-demo-app/blob/df664c13c77ce3c53ac7df0622d94d04e76d3f9f/src/KcApp/KcApp.tsx#L37) to update.
-## 4
+## v4
 -   Out of the box [frontend form validation](#user-profile-and-frontend-form-validation) 🥳
 -   Improvements (and breaking changes in `import { useKcMessage } from "keycloakify"`.
-## 3
+## v3
 No breaking changes except that `@emotion/react`, [`tss-react`](https://www.npmjs.com/package/tss-react) and [`powerhooks`](https://www.npmjs.com/package/powerhooks) are now `peerDependencies` instead of being just dependencies.  
 It's important to avoid problem when using `keycloakify` alongside [`mui`](https://mui.com) and
-[when passing params from the app to the login page](https://github.com/keycloakify/keycloakify#implement-context-persistence-optional).
+[when passing params from the app to the login page](https://github.com/InseeFrLab/keycloakify#implement-context-persistence-optional).
-## 2.5
+## v2.5
-   Feature [Use advanced message](https://github.com/keycloakify/keycloakify/blob/59f106bf9e210b63b190826da2bf5f75fc8b7644/src/lib/i18n/useKcMessage.tsx#L53-L66)
+-   Feature [Use advanced message](https://github.com/InseeFrLab/keycloakify/blob/59f106bf9e210b63b190826da2bf5f75fc8b7644/src/lib/i18n/useKcMessage.tsx#L53-L66)
-    and [`messagesPerFields`](https://github.com/keycloakify/keycloakify/blob/59f106bf9e210b63b190826da2bf5f75fc8b7644/src/lib/getKcContext/KcContextBase.ts#L70-L75) (implementation [here](https://github.com/keycloakify/keycloakify/blob/59f106bf9e210b63b190826da2bf5f75fc8b7644/src/bin/build-keycloak-theme/generateFtl/common.ftl#L130-L189))
+    and [`messagesPerFields`](https://github.com/InseeFrLab/keycloakify/blob/59f106bf9e210b63b190826da2bf5f75fc8b7644/src/lib/getKcContext/KcContextBase.ts#L70-L75) (implementation [here](https://github.com/InseeFrLab/keycloakify/blob/59f106bf9e210b63b190826da2bf5f75fc8b7644/src/bin/build-keycloak-theme/generateFtl/common.ftl#L130-L189))
 -   Test container now uses Keycloak version `15.0.2`.
-## 2
+## v2
 -   It's now possible to implement custom `.ftl` pages.
 -   Support for Keycloak plugins that introduce non standard ftl values.
--- a/package.json
+++ b/package.json
@ -1,39 +1,29 @@
 {
    "name": "keycloakify",
-    "version": "9.4.0-rc.16",
+    "version": "5.9.2",
-    "description": "Create Keycloak themes using React",
+    "description": "Keycloak theme generator for Reacts app",
    "repository": {
        "type": "git",
-        "url": "git://github.com/keycloakify/keycloakify.git"
+        "url": "git://github.com/garronej/keycloakify.git"
    },
-    "main": "dist/index.js",
+    "main": "dist/lib/index.js",
-    "types": "dist/index.d.ts",
+    "types": "dist/lib/index.d.ts",
    "scripts": {
-        "prepare": "yarn generate-i18n-messages",
+        "clean": "rimraf dist/",
-        "build": "rimraf dist/ && tsc -p src/bin && tsc -p src && tsc -p src/vite-plugin && tsc-alias -p src/tsconfig.json && yarn grant-exec-perms && yarn copy-files dist/ && cp -r src dist/",
+        "build": "yarn clean && tsc && yarn grant-exec-perms && yarn copy-files",
        "generate:json-schema": "ts-node scripts/generate-json-schema.ts",
        "grant-exec-perms": "node dist/bin/tools/grant-exec-perms.js",
-        "copy-files": "copyfiles -u 1 src/**/*.ftl src/**/*.java",
+        "test": "node dist/test/bin && node dist/test/lib",
-        "test": "yarn test:types && vitest run",
+        "copy-files": "copyfiles -u 1 src/**/*.ftl src/**/*.xml src/**/*.js dist/",
-        "test:keycloakify-starter": "ts-node scripts/test-keycloakify-starter",
+        "generate-messages": "node dist/bin/generate-i18n-messages.js",
-        "test:types": "tsc -p test/tsconfig.json --noEmit",
+        "link_in_test_app": "node dist/bin/link_in_test_app.js",
        "_format": "prettier '**/*.{ts,tsx,json,md}'",
        "format": "yarn _format --write",
-        "format:check": "yarn _format --list-different",
+        "format:check": "yarn _format --list-different"
        "generate-i18n-messages": "ts-node --skipProject scripts/generate-i18n-messages.ts",
        "link-in-app": "ts-node --skipProject scripts/link-in-app.ts",
        "link-in-starter": "yarn link-in-app keycloakify-starter",
        "watch-in-starter": "yarn build && yarn link-in-starter && (concurrently \"tsc -p src -w\" \"tsc-alias -p src/tsconfig.json\" \"tsc -p src/bin -w\")",
        "copy-keycloak-resources-to-storybook-static": "PUBLIC_DIR_PATH=.storybook/static node dist/bin/copy-keycloak-resources-to-public.js",
        "storybook": "yarn build && yarn copy-keycloak-resources-to-storybook-static && start-storybook -p 6006",
        "build-storybook": "yarn build && yarn copy-keycloak-resources-to-storybook-static && build-storybook"
    },
    "bin": {
-        "copy-keycloak-resources-to-public": "dist/bin/copy-keycloak-resources-to-public.js",
+        "build-keycloak-theme": "dist/bin/build-keycloak-theme/index.js",
-        "download-builtin-keycloak-theme": "dist/bin/download-builtin-keycloak-theme.js",
+        "create-keycloak-email-directory": "dist/bin/create-keycloak-email-directory.js",
-        "eject-keycloak-page": "dist/bin/eject-keycloak-page.js",
+        "download-builtin-keycloak-theme": "dist/bin/download-builtin-keycloak-theme.js"
        "initialize-email-theme": "dist/bin/initialize-email-theme.js",
        "keycloakify": "dist/bin/keycloakify/index.js"
    },
    "lint-staged": {
        "*.{ts,tsx,json,md}": [
@ -49,9 +39,10 @@
    "license": "MIT",
    "files": [
        "src/",
        "!src/test/",
        "dist/",
-        "!dist/tsconfig.tsbuildinfo",
+        "!dist/test/",
-        "!dist/bin/tsconfig.tsbuildinfo"
+        "!dist/tsconfig.tsbuildinfo"
    ],
    "keywords": [
        "bluehats",
@ -63,68 +54,37 @@
        "login",
        "register"
    ],
-    "homepage": "https://www.keycloakify.dev",
+    "homepage": "https://github.com/garronej/keycloakify",
    "peerDependencies": {
        "@emotion/react": "^11.4.1",
        "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
    },
    "devDependencies": {
-        "@babel/core": "^7.0.0",
+        "@emotion/react": "^11.4.1",
-        "@emotion/react": "^11.10.6",
+        "@types/memoizee": "^0.4.7",
-        "@storybook/addon-a11y": "^6.5.16",
+        "@types/node": "^17.0.25",
-        "@storybook/addon-actions": "^6.5.13",
+        "@types/react": "18.0.9",
        "@storybook/addon-essentials": "^6.5.13",
        "@storybook/addon-interactions": "^6.5.13",
        "@storybook/addon-links": "^6.5.13",
        "@storybook/builder-webpack5": "^6.5.13",
        "@storybook/manager-webpack5": "^6.5.13",
        "@storybook/react": "^6.5.13",
        "@storybook/testing-library": "^0.0.13",
        "@types/babel__generator": "^7.6.4",
        "@types/make-fetch-happen": "^10.0.1",
        "@types/minimist": "^1.2.2",
        "@types/node": "^18.15.3",
        "@types/react": "^18.0.35",
        "@types/react-dom": "^18.0.11",
        "@types/yauzl": "^2.10.0",
        "@types/yazl": "^2.4.2",
        "concurrently": "^8.0.1",
        "copyfiles": "^2.4.1",
        "eslint-plugin-storybook": "^0.6.7",
        "husky": "^4.3.8",
        "lint-staged": "^11.0.0",
        "powerhooks": "^0.26.7",
        "prettier": "^2.3.0",
        "properties-parser": "^0.3.1",
-        "react": "^18.2.0",
+        "react": "18.1.0",
        "react-dom": "^18.2.0",
        "rimraf": "^3.0.2",
-        "scripting-tools": "^0.19.13",
+        "typescript": "^4.2.3"
        "storybook-dark-mode": "^1.1.2",
        "ts-node": "^10.9.1",
        "tsc-alias": "^1.8.3",
        "tss-react": "^4.8.2",
        "typescript": "^4.9.1-beta",
        "vitest": "^0.29.8",
        "zod-to-json-schema": "^3.20.4",
        "vite": "^5.0.12"
    },
    "dependencies": {
        "@babel/generator": "^7.22.9",
        "@babel/parser": "^7.22.7",
        "@babel/types": "^7.22.5",
        "@octokit/rest": "^18.12.0",
        "cheerio": "^1.0.0-rc.5",
        "cli-select": "^1.1.2",
-        "evt": "^2.4.18",
+        "evt": "^2.4.1",
-        "make-fetch-happen": "^11.0.3",
+        "memoizee": "^0.4.15",
-        "minimal-polyfills": "^2.2.2",
+        "minimal-polyfills": "^2.2.1",
-        "minimist": "^1.2.6",
+        "path-browserify": "^1.0.1",
        "powerhooks": "^0.20.16",
        "react-markdown": "^5.0.3",
-        "recast": "^0.23.3",
+        "scripting-tools": "^0.19.13",
-        "rfc4648": "^1.5.2",
+        "tsafe": "^0.10.1",
-        "tsafe": "^1.6.0",
+        "tss-react": "^3.7.1"
        "yauzl": "^2.10.0",
        "yazl": "^2.5.1",
        "zod": "^3.17.10"
    }
 }
--- a/renovate.json
+++ b/renovate.json
@ -13,11 +13,11 @@
    "packageRules": [
        {
            "packagePatterns": ["*"],
-            "excludePackagePatterns": ["tsafe", "evt"],
+            "excludePackagePatterns": ["tss-react", "powerhooks", "tsafe", "evt"],
            "enabled": false
        },
        {
-            "packagePatterns": ["tsafe", "evt"],
+            "packagePatterns": ["tss-react", "powerhooks", "tsafe", "evt"],
            "matchUpdateTypes": ["minor", "patch"],
            "automerge": true,
            "automergeType": "branch",
--- a/scripts/generate-i18n-messages.ts
+++ b/scripts/generate-i18n-messages.ts
@ -1,139 +0,0 @@
 import "minimal-polyfills/Object.fromEntries";
 import * as fs from "fs";
 import { join as pathJoin, relative as pathRelative, dirname as pathDirname, sep as pathSep } from "path";
 import { crawl } from "../src/bin/tools/crawl";
 import { downloadBuiltinKeycloakTheme } from "../src/bin/download-builtin-keycloak-theme";
 import { getThisCodebaseRootDirPath } from "../src/bin/tools/getThisCodebaseRootDirPath";
 import { getLogger } from "../src/bin/tools/logger";
 // 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");
 const isSilent = true;
 const logger = getLogger({ isSilent });
 async function main() {
    const keycloakVersion = "23.0.4";
    const thisCodebaseRootDirPath = getThisCodebaseRootDirPath();
    const tmpDirPath = pathJoin(thisCodebaseRootDirPath, "tmp_xImOef9dOd44");
    fs.rmSync(tmpDirPath, { "recursive": true, "force": true });
    fs.mkdirSync(tmpDirPath);
    fs.writeFileSync(pathJoin(tmpDirPath, ".gitignore"), Buffer.from("/*\n!.gitignore\n", "utf8"));
    await downloadBuiltinKeycloakTheme({
        keycloakVersion,
        "destDirPath": tmpDirPath,
        "buildOptions": {
            "cacheDirPath": pathJoin(thisCodebaseRootDirPath, "node_modules", ".cache", "keycloakify"),
            "npmWorkspaceRootDirPath": thisCodebaseRootDirPath
        }
    });
    type Dictionary = { [idiomId: string]: string };
    const record: { [typeOfPage: string]: { [language: string]: Dictionary } } = {};
    {
        const baseThemeDirPath = pathJoin(tmpDirPath, "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"))).map(
                    ([key, value]: any) => [key, value.replace(/''/g, "'")]
                )
            );
        });
    }
    fs.rmSync(tmpDirPath, { recursive: true, force: true });
    Object.keys(record).forEach(themeType => {
        const recordForPageType = record[themeType];
        if (themeType !== "login" && themeType !== "account") {
            return;
        }
        const baseMessagesDirPath = pathJoin(thisCodebaseRootDirPath, "src", themeType, "i18n", "baseMessages");
        const languages = Object.keys(recordForPageType);
        const generatedFileHeader = [
            `//This code was automatically generated by running ${pathRelative(thisCodebaseRootDirPath, __filename)}`,
            "//PLEASE DO NOT EDIT MANUALLY"
        ].join("\n");
        languages.forEach(language => {
            const filePath = pathJoin(baseMessagesDirPath, `${language}.ts`);
            fs.mkdirSync(pathDirname(filePath), { "recursive": true });
            fs.writeFileSync(
                filePath,
                Buffer.from(
                    [
                        generatedFileHeader,
                        "",
                        "/* spell-checker: disable */",
                        `const messages= ${JSON.stringify(recordForPageType[language], null, 2)};`,
                        "",
                        "export default messages;",
                        "/* spell-checker: enable */"
                    ].join("\n"),
                    "utf8"
                )
            );
            logger.log(`${filePath} wrote`);
        });
        fs.writeFileSync(
            pathJoin(baseMessagesDirPath, "index.ts"),
            Buffer.from(
                [
                    generatedFileHeader,
                    `import * as en from "./en";`,
                    "",
                    "export async function getMessages(currentLanguageTag: string) {",
                    "    const { default: messages } = await (() => {",
                    "        switch (currentLanguageTag) {",
                    `            case "en": return en;`,
                    ...languages
                        .filter(language => language !== "en")
                        .map(language => `            case "${language}": return import("./${language}");`),
                    '            default: return { "default": {} };',
                    "        }",
                    "    })();",
                    "    return messages;",
                    "}"
                ].join("\n"),
                "utf8"
            )
        );
    });
 }
 if (require.main === module) {
    main();
 }
--- a/scripts/link-in-app.ts
+++ b/scripts/link-in-app.ts
@ -1,143 +0,0 @@
 import { execSync } from "child_process";
 import { join as pathJoin, relative as pathRelative } from "path";
 import { getThisCodebaseRootDirPath } from "../src/bin/tools/getThisCodebaseRootDirPath";
 import * as fs from "fs";
 const singletonDependencies: string[] = ["react", "@types/react"];
 const rootDirPath = getThisCodebaseRootDirPath();
 //NOTE: This is only required because of: https://github.com/garronej/ts-ci/blob/c0e207b9677523d4ec97fe672ddd72ccbb3c1cc4/README.md?plain=1#L54-L58
 fs.writeFileSync(
    pathJoin(rootDirPath, "dist", "package.json"),
    Buffer.from(
        JSON.stringify(
            (() => {
                const packageJsonParsed = JSON.parse(fs.readFileSync(pathJoin(rootDirPath, "package.json")).toString("utf8"));
                return {
                    ...packageJsonParsed,
                    "main": packageJsonParsed["main"]?.replace(/^dist\//, ""),
                    "types": packageJsonParsed["types"]?.replace(/^dist\//, ""),
                    "module": packageJsonParsed["module"]?.replace(/^dist\//, ""),
                    "exports": !("exports" in packageJsonParsed)
                        ? undefined
                        : Object.fromEntries(
                              Object.entries(packageJsonParsed["exports"]).map(([key, value]) => [
                                  key,
                                  (value as string).replace(/^\.\/dist\//, "./")
                              ])
                          )
                };
            })(),
            null,
            2
        ),
        "utf8"
    )
 );
 fs.cpSync(pathJoin(rootDirPath, "src"), pathJoin(rootDirPath, "dist", "src"), { "recursive": true });
 const commonThirdPartyDeps = (() => {
    // For example [ "@emotion" ] it's more convenient than
    // having to list every sub emotion packages (@emotion/css @emotion/utils ...)
    // in singletonDependencies
    const namespaceSingletonDependencies: string[] = [];
    return [
        ...namespaceSingletonDependencies
            .map(namespaceModuleName =>
                fs
                    .readdirSync(pathJoin(rootDirPath, "node_modules", namespaceModuleName))
                    .map(submoduleName => `${namespaceModuleName}/${submoduleName}`)
            )
            .reduce((prev, curr) => [...prev, ...curr], []),
        ...singletonDependencies
    ];
 })();
 const yarnGlobalDirPath = pathJoin(rootDirPath, ".yarn_home");
 fs.rmSync(yarnGlobalDirPath, { "recursive": true, "force": true });
 fs.mkdirSync(yarnGlobalDirPath);
 const execYarnLink = (params: { targetModuleName?: string; cwd: string }) => {
    const { targetModuleName, cwd } = params;
    const cmd = ["yarn", "link", ...(targetModuleName !== undefined ? [targetModuleName] : ["--no-bin-links"])].join(" ");
    console.log(`$ cd ${pathRelative(rootDirPath, cwd) || "."} && ${cmd}`);
    execSync(cmd, {
        cwd,
        "env": {
            ...process.env,
            "HOME": yarnGlobalDirPath
        }
    });
 };
 const testAppPaths = (() => {
    const [, , ...testAppNames] = process.argv;
    return testAppNames
        .map(testAppName => {
            const testAppPath = pathJoin(rootDirPath, "..", testAppName);
            if (fs.existsSync(testAppPath)) {
                return testAppPath;
            }
            console.warn(`Skipping ${testAppName} since it cant be found here: ${testAppPath}`);
            return undefined;
        })
        .filter((path): path is string => path !== undefined);
 })();
 if (testAppPaths.length === 0) {
    console.error("No test app to link into!");
    process.exit(-1);
 }
 testAppPaths.forEach(testAppPath => execSync("yarn install", { "cwd": testAppPath }));
 console.log("=== Linking common dependencies ===");
 const total = commonThirdPartyDeps.length;
 let current = 0;
 commonThirdPartyDeps.forEach(commonThirdPartyDep => {
    current++;
    console.log(`${current}/${total} ${commonThirdPartyDep}`);
    const localInstallPath = pathJoin(
        ...[rootDirPath, "node_modules", ...(commonThirdPartyDep.startsWith("@") ? commonThirdPartyDep.split("/") : [commonThirdPartyDep])]
    );
    execYarnLink({ "cwd": localInstallPath });
 });
 commonThirdPartyDeps.forEach(commonThirdPartyDep =>
    testAppPaths.forEach(testAppPath =>
        execYarnLink({
            "cwd": testAppPath,
            "targetModuleName": commonThirdPartyDep
        })
    )
 );
 console.log("=== Linking in house dependencies ===");
 execYarnLink({ "cwd": pathJoin(rootDirPath, "dist") });
 testAppPaths.forEach(testAppPath =>
    execYarnLink({
        "cwd": testAppPath,
        "targetModuleName": JSON.parse(fs.readFileSync(pathJoin(rootDirPath, "package.json")).toString("utf8"))["name"]
    })
 );
 export {};
--- a/scripts/test-keycloakify-starter.ts
+++ b/scripts/test-keycloakify-starter.ts
@ -1,29 +0,0 @@
 import { execSync } from "child_process";
 import { existsSync, readFileSync, rmSync, writeFileSync } from "fs";
 import path from "path";
 const testDir = "keycloakify_starter_test";
 if (existsSync(path.join(process.cwd(), testDir))) {
    rmSync(path.join(process.cwd(), testDir), { recursive: true });
 }
 // Build and link package
 execSync("yarn build");
 const pkgJSON = JSON.parse(readFileSync(path.join(process.cwd(), "package.json")).toString("utf8"));
 pkgJSON.main = "./index.js";
 pkgJSON.types = "./index.d.ts";
 pkgJSON.scripts.prepare = undefined;
 writeFileSync(path.join(process.cwd(), "dist", "package.json"), JSON.stringify(pkgJSON));
 // Wrapped in a try/catch because unlink errors if the package isn't linked
 try {
    execSync("yarn unlink");
 } catch {}
 execSync("yarn link", { "cwd": path.join(process.cwd(), "dist") });
 // Clone latest keycloakify-starter and link to keycloakify output
 execSync(`git clone https://github.com/keycloakify/keycloakify-starter.git ${testDir}`);
 execSync("yarn install", { "cwd": path.join(process.cwd(), testDir) });
 execSync("yarn link keycloakify", { "cwd": path.join(process.cwd(), testDir) });
 //Ensure keycloak theme can be built
 execSync("yarn build-keycloak-theme", { "cwd": path.join(process.cwd(), testDir) });
--- a/src/PUBLIC_URL.ts
+++ b/src/PUBLIC_URL.ts
@ -1,21 +0,0 @@
 import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "keycloakify/bin/constants";
 import { assert } from "tsafe/assert";
 /**
 * This is an equivalent of process.env.PUBLIC_URL thay you can use in Webpack projects.
 * This works both in your main app and in your Keycloak theme.
 */
 export const PUBLIC_URL = (() => {
    const kcContext = (window as any)[nameOfTheGlobal];
    if (kcContext === undefined || process.env.NODE_ENV === "development") {
        assert(
            process.env.PUBLIC_URL !== undefined,
            `If you use keycloakify/PUBLIC_URL you should be in Webpack and thus process.env.PUBLIC_URL should be defined`
        );
        return process.env.PUBLIC_URL;
    }
    return `${kcContext.url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}`;
 })();
--- a/src/account/Fallback.tsx
+++ b/src/account/Fallback.tsx
@ -1,26 +0,0 @@
 import { lazy, Suspense } from "react";
 import type { PageProps } from "keycloakify/account/pages/PageProps";
 import type { I18n } from "keycloakify/account/i18n";
 import type { KcContext } from "./kcContext";
 import { assert, type Equals } from "tsafe/assert";
 const Password = lazy(() => import("keycloakify/account/pages/Password"));
 const Account = lazy(() => import("keycloakify/account/pages/Account"));
 export default function Fallback(props: PageProps<KcContext, I18n>) {
    const { kcContext, ...rest } = props;
    return (
        <Suspense>
            {(() => {
                switch (kcContext.pageId) {
                    case "password.ftl":
                        return <Password kcContext={kcContext} {...rest} />;
                    case "account.ftl":
                        return <Account kcContext={kcContext} {...rest} />;
                }
                assert<Equals<typeof kcContext, never>>(false);
            })()}
        </Suspense>
    );
 }
--- a/src/account/Template.tsx
+++ b/src/account/Template.tsx
@ -1,133 +0,0 @@
 import { clsx } from "keycloakify/tools/clsx";
 import { usePrepareTemplate } from "keycloakify/lib/usePrepareTemplate";
 import { type TemplateProps } from "keycloakify/account/TemplateProps";
 import { useGetClassName } from "keycloakify/account/lib/useGetClassName";
 import type { KcContext } from "./kcContext";
 import type { I18n } from "./i18n";
 import { assert } from "keycloakify/tools/assert";
 export default function Template(props: TemplateProps<KcContext, I18n>) {
    const { kcContext, i18n, doUseDefaultCss, active, classes, children } = props;
    const { getClassName } = useGetClassName({ doUseDefaultCss, classes });
    const { msg, changeLocale, labelBySupportedLanguageTag, currentLanguageTag } = i18n;
    const { locale, url, features, realm, message, referrer } = kcContext;
    const { isReady } = usePrepareTemplate({
        "doFetchDefaultThemeResources": doUseDefaultCss,
        "styles": [
            `${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`
        ],
        "htmlClassName": getClassName("kcHtmlClass"),
        "bodyClassName": clsx("admin-console", "user", getClassName("kcBodyClass"))
    });
    if (!isReady) {
        return null;
    }
    return (
        <>
            <header className="navbar navbar-default navbar-pf navbar-main header">
                <nav className="navbar" role="navigation">
                    <div className="navbar-header">
                        <div className="container">
                            <h1 className="navbar-title">Keycloak</h1>
                        </div>
                    </div>
                    <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 && (
                                    <li>
                                        <div className="kc-dropdown" id="kc-locale-dropdown">
                                            {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                                            <a href="#" id="kc-current-locale-link">
                                                {labelBySupportedLanguageTag[currentLanguageTag]}
                                            </a>
                                            <ul>
                                                {locale.supported.map(({ languageTag }) => (
                                                    <li key={languageTag} className="kc-dropdown-item">
                                                        {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                                                        <a href="#" onClick={() => changeLocale(languageTag)}>
                                                            {labelBySupportedLanguageTag[languageTag]}
                                                        </a>
                                                    </li>
                                                ))}
                                            </ul>
                                        </div>
                                    </li>
                                )}
                                {referrer?.url && (
                                    <li>
                                        <a href={referrer.url} id="referrer">
                                            {msg("backTo", referrer.name)}
                                        </a>
                                    </li>
                                )}
                                <li>
                                    <a href={url.getLogoutUrl()}>{msg("doSignOut")}</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </nav>
            </header>
            <div className="container">
                <div className="bs-sidebar col-sm-3">
                    <ul>
                        <li className={clsx(active === "account" && "active")}>
                            <a href={url.accountUrl}>{msg("account")}</a>
                        </li>
                        {features.passwordUpdateSupported && (
                            <li className={clsx(active === "password" && "active")}>
                                <a href={url.passwordUrl}>{msg("password")}</a>
                            </li>
                        )}
                        <li className={clsx(active === "totp" && "active")}>
                            <a href={url.totpUrl}>{msg("authenticator")}</a>
                        </li>
                        {features.identityFederation && (
                            <li className={clsx(active === "social" && "active")}>
                                <a href={url.socialUrl}>{msg("federatedIdentity")}</a>
                            </li>
                        )}
                        <li className={clsx(active === "sessions" && "active")}>
                            <a href={url.sessionsUrl}>{msg("sessions")}</a>
                        </li>
                        <li className={clsx(active === "applications" && "active")}>
                            <a href={url.applicationsUrl}>{msg("applications")}</a>
                        </li>
                        {features.log && (
                            <li className={clsx(active === "log" && "active")}>
                                <a href={url.logUrl}>{msg("log")}</a>
                            </li>
                        )}
                        {realm.userManagedAccessAllowed && features.authorization && (
                            <li className={clsx(active === "authorization" && "active")}>
                                <a href={url.resourceUrl}>{msg("myResources")}</a>
                            </li>
                        )}
                    </ul>
                </div>
                <div className="col-sm-9 content-area">
                    {message !== undefined && (
                        <div className={clsx("alert", `alert-${message.type}`)}>
                            {message.type === "success" && <span className="pficon pficon-ok"></span>}
                            {message.type === "error" && <span className="pficon pficon-error-circle-o"></span>}
                            <span className="kc-feedback-text">{message.summary}</span>
                        </div>
                    )}
                    {children}
                </div>
            </div>
        </>
    );
 }
--- a/src/account/TemplateProps.ts
+++ b/src/account/TemplateProps.ts
@ -1,14 +0,0 @@
 import type { ReactNode } from "react";
 import type { KcContext } from "./kcContext";
 import type { I18n } from "./i18n";
 export type TemplateProps<KcContext extends KcContext.Common, I18nExtended extends I18n> = {
    kcContext: KcContext;
    i18n: I18nExtended;
    doUseDefaultCss: boolean;
    active: string;
    classes?: Partial<Record<ClassKey, string>>;
    children: ReactNode;
 };
 export type ClassKey = "kcHtmlClass" | "kcBodyClass" | "kcButtonClass" | "kcButtonPrimaryClass" | "kcButtonLargeClass" | "kcButtonDefaultClass";
--- a/src/account/i18n/i18n.tsx
+++ b/src/account/i18n/i18n.tsx
@ -1,233 +0,0 @@
 import "minimal-polyfills/Object.fromEntries";
 //NOTE for later: https://github.com/remarkjs/react-markdown/blob/236182ecf30bd89c1e5a7652acaf8d0bf81e6170/src/renderers.js#L7-L35
 import { useEffect, useState, useRef } from "react";
 import fallbackMessages from "./baseMessages/en";
 import { getMessages } from "./baseMessages";
 import { assert } from "tsafe/assert";
 import type { KcContext } from "../kcContext/KcContext";
 import { Markdown } from "keycloakify/tools/Markdown";
 export const fallbackLanguageTag = "en";
 export type KcContextLike = {
    locale?: {
        currentLanguageTag: string;
        supported: { languageTag: string; url: string; label: string }[];
    };
 };
 assert<KcContext extends KcContextLike ? true : false>();
 export type MessageKey = keyof typeof fallbackMessages | keyof (typeof keycloakifyExtraMessages)[typeof fallbackLanguageTag];
 export type GenericI18n<MessageKey extends string> = {
    /**
     * e.g: "en", "fr", "zh-CN"
     *
     * The current language
     */
    currentLanguageTag: string;
    /**
     * To call when the user switch language.
     * This will cause the page to be reloaded,
     * on next load currentLanguageTag === newLanguageTag
     */
    changeLocale: (newLanguageTag: string) => never;
    /**
     * 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"
     *
     * msg("access-denied") === <span>Access denied</span>
     * msg("impersonateTitleHtml", "Foo") === <span><strong>Foo</strong> Impersonate User</span>
     */
    msg: (key: MessageKey, ...args: (string | undefined)[]) => JSX.Element;
    /**
     * It's the same thing as msg() but instead of returning a JSX.Element it returns a string.
     * It can be more convenient to manipulate strings but if there are HTML tags it wont render.
     * msgStr("impersonateTitleHtml", "Foo") === "<strong>Foo</strong> Impersonate User"
     */
    msgStr: (key: MessageKey, ...args: (string | undefined)[]) => string;
    /**
     * Examples assuming currentLanguageTag === "en"
     * advancedMsg("${access-denied} foo bar") === <span>${msgStr("access-denied")} foo bar<span> === <span>Access denied foo bar</span>
     * advancedMsg("${access-denied}") === advancedMsg("access-denied") === msg("access-denied") === <span>Access denied</span>
     * advancedMsg("${not-a-message-key}") === advancedMsg(not-a-message-key") === <span>not-a-message-key</span>
     */
    advancedMsg: (key: string, ...args: (string | undefined)[]) => JSX.Element;
    /**
     * Examples assuming currentLanguageTag === "en"
     * advancedMsg("${access-denied} foo bar") === msg("access-denied") + " foo bar" === "Access denied foo bar"
     * advancedMsg("${not-a-message-key}") === advancedMsg(not-a-message-key") === "not-a-message-key"
     */
    advancedMsgStr: (key: string, ...args: (string | undefined)[]) => string;
 };
 export type I18n = GenericI18n<MessageKey>;
 export function createUseI18n<ExtraMessageKey extends string = never>(extraMessages: {
    [languageTag: string]: { [key in ExtraMessageKey]: string };
 }) {
    function useI18n(params: { kcContext: KcContextLike }): GenericI18n<MessageKey | ExtraMessageKey> | null {
        const { kcContext } = params;
        const [i18n, setI18n] = useState<GenericI18n<ExtraMessageKey | MessageKey> | undefined>(undefined);
        const refHasStartedFetching = useRef(false);
        useEffect(() => {
            if (refHasStartedFetching.current) {
                return;
            }
            refHasStartedFetching.current = true;
            (async () => {
                const { currentLanguageTag = fallbackLanguageTag } = kcContext.locale ?? {};
                setI18n({
                    ...createI18nTranslationFunctions({
                        "fallbackMessages": {
                            ...fallbackMessages,
                            ...(keycloakifyExtraMessages[fallbackLanguageTag] ?? {}),
                            ...(extraMessages[fallbackLanguageTag] ?? {})
                        } as any,
                        "messages": {
                            ...(await getMessages(currentLanguageTag)),
                            ...((keycloakifyExtraMessages as any)[currentLanguageTag] ?? {}),
                            ...(extraMessages[currentLanguageTag] ?? {})
                        } as any
                    }),
                    currentLanguageTag,
                    "changeLocale": 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`);
                        window.location.href = targetSupportedLocale.url;
                        assert(false, "never");
                    },
                    "labelBySupportedLanguageTag": Object.fromEntries(
                        (kcContext.locale?.supported ?? []).map(({ languageTag, label }) => [languageTag, label])
                    )
                });
            })();
        }, []);
        return i18n ?? null;
    }
    return { useI18n };
 }
 function createI18nTranslationFunctions<MessageKey extends string>(params: {
    fallbackMessages: Record<MessageKey, string>;
    messages: Record<MessageKey, string>;
 }): Pick<GenericI18n<MessageKey>, "msg" | "msgStr" | "advancedMsg" | "advancedMsgStr"> {
    const { fallbackMessages, messages } = params;
    function resolveMsg(props: { key: string; args: (string | undefined)[]; doRenderMarkdown: boolean }): string | JSX.Element | undefined {
        const { key, args, doRenderMarkdown } = props;
        const messageOrUndefined: string | undefined = (messages as any)[key] ?? (fallbackMessages as any)[key];
        if (messageOrUndefined === undefined) {
            return undefined;
        }
        const message = messageOrUndefined;
        const messageWithArgsInjectedIfAny = (() => {
            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);
            });
            return messageWithArgsInjected;
        })();
        return doRenderMarkdown ? (
            <Markdown allowDangerousHtml renderers={{ "paragraph": "span" }}>
                {messageWithArgsInjectedIfAny}
            </Markdown>
        ) : (
            messageWithArgsInjectedIfAny
        );
    }
    function resolveMsgAdvanced(props: { key: string; args: (string | undefined)[]; doRenderMarkdown: boolean }): JSX.Element | string {
        const { key, args, doRenderMarkdown } = props;
        const match = key.match(/^\$\{([^{]+)\}$/);
        const keyUnwrappedFromCurlyBraces = match === null ? key : match[1];
        const out = resolveMsg({
            "key": keyUnwrappedFromCurlyBraces,
            args,
            doRenderMarkdown
        });
        return (out !== undefined ? out : doRenderMarkdown ? <span>{keyUnwrappedFromCurlyBraces}</span> : keyUnwrappedFromCurlyBraces) as any;
    }
    return {
        "msgStr": (key, ...args) => resolveMsg({ key, args, "doRenderMarkdown": false }) as string,
        "msg": (key, ...args) => resolveMsg({ key, args, "doRenderMarkdown": true }) as JSX.Element,
        "advancedMsg": (key, ...args) => resolveMsgAdvanced({ key, args, "doRenderMarkdown": true }) as JSX.Element,
        "advancedMsgStr": (key, ...args) => resolveMsgAdvanced({ key, args, "doRenderMarkdown": false }) as string
    };
 }
 const keycloakifyExtraMessages = {
    "en": {
        "shouldBeEqual": "{0} should be equal to {1}",
        "shouldBeDifferent": "{0} should be different to {1}",
        "shouldMatchPattern": "Pattern should match: `/{0}/`",
        "mustBeAnInteger": "Must be an integer",
        "notAValidOption": "Not a valid option",
        "newPasswordSameAsOld": "New password must be different from the old one",
        "passwordConfirmNotMatch": "Password confirmation does not match"
    },
    "fr": {
        /* spell-checker: disable */
        "shouldBeEqual": "{0} doit être égal à {1}",
        "shouldBeDifferent": "{0} doit être différent de {1}",
        "shouldMatchPattern": "Dois respecter le schéma: `/{0}/`",
        "mustBeAnInteger": "Doit être un nombre entier",
        "notAValidOption": "N'est pas une option valide",
        "logoutConfirmTitle": "Déconnexion",
        "logoutConfirmHeader": "Êtes-vous sûr(e) de vouloir vous déconnecter ?",
        "doLogout": "Se déconnecter",
        "newPasswordSameAsOld": "Le nouveau mot de passe doit être différent de l'ancien",
        "passwordConfirmNotMatch": "La confirmation du mot de passe ne correspond pas"
        /* spell-checker: enable */
    }
 };
--- a/src/account/i18n/index.ts
+++ b/src/account/i18n/index.ts
@ -1 +0,0 @@
 export type { I18n } from "./i18n";
--- a/src/account/index.ts
+++ b/src/account/index.ts
@ -1,10 +0,0 @@
 import Fallback from "keycloakify/account/Fallback";
 export default Fallback;
 export { getKcContext } from "keycloakify/account/kcContext/getKcContext";
 export { createGetKcContext } from "keycloakify/account/kcContext/createGetKcContext";
 export type { AccountThemePageId as PageId } from "keycloakify/bin/keycloakify/generateFtl";
 export { createUseI18n } from "keycloakify/account/i18n/i18n";
 export type { PageProps } from "keycloakify/account/pages/PageProps";
--- a/src/account/kcContext/KcContext.ts
+++ b/src/account/kcContext/KcContext.ts
@ -1,127 +0,0 @@
 import type { AccountThemePageId } from "keycloakify/bin/keycloakify/generateFtl";
 import { assert } from "tsafe/assert";
 import type { Equals } from "tsafe";
 import { type ThemeType } from "keycloakify/bin/constants";
 export type KcContext = KcContext.Password | KcContext.Account;
 export declare namespace KcContext {
    export type Common = {
        themeVersion: string;
        keycloakifyVersion: string;
        themeType: "account";
        themeName: string;
        locale?: {
            supported: {
                url: string;
                label: string;
                languageTag: string;
            }[];
            currentLanguageTag: string;
        };
        url: {
            accountUrl: string;
            passwordUrl: string;
            totpUrl: string;
            socialUrl: string;
            sessionsUrl: string;
            applicationsUrl: string;
            logUrl: string;
            resourceUrl: string;
            resourcesCommonPath: string;
            resourcesPath: string;
            /** @deprecated, not present in recent keycloak version apparently, use kcContext.referrer instead */
            referrerURI?: string;
            getLogoutUrl: () => string;
        };
        features: {
            passwordUpdateSupported: boolean;
            identityFederation: boolean;
            log: boolean;
            authorization: boolean;
        };
        realm: {
            internationalizationEnabled: boolean;
            userManagedAccessAllowed: boolean;
        };
        // Present only if redirected to account page with ?referrer=xxx&referrer_uri=http...
        message?: {
            type: "success" | "warning" | "error" | "info";
            summary: string;
        };
        referrer?: {
            url: string; // The url of the App
            name: string; // Client id
        };
        messagesPerField: {
            /**
             * Return text if message for given field exists. Useful eg. to add css styles for fields with message.
             *
             * @param fieldName to check for
             * @param text to return
             * @return text if message exists for given field, else undefined
             */
            printIfExists: <T extends string>(fieldName: string, text: T) => T | undefined;
            /**
             * Check if exists error message for given fields
             *
             * @param fields
             * @return boolean
             */
            existsError: (fieldName: string) => boolean;
            /**
             * Get message for given field.
             *
             * @param fieldName
             * @return message text or empty string
             */
            get: (fieldName: string) => string;
            /**
             * Check if message for given field exists
             *
             * @param field
             * @return boolean
             */
            exists: (fieldName: string) => boolean;
        };
        account: {
            email?: string;
            firstName: string;
            lastName?: string;
            username?: string;
        };
    };
    export type Password = Common & {
        pageId: "password.ftl";
        password: {
            passwordSet: boolean;
        };
        stateChecker: string;
    };
    export type Account = Common & {
        pageId: "account.ftl";
        url: {
            accountUrl: string;
        };
        realm: {
            registrationEmailAsUsername: boolean;
            editUsernameAllowed: boolean;
        };
        stateChecker: string;
    };
 }
 {
    type Got = KcContext["pageId"];
    type Expected = AccountThemePageId;
    type OnlyInGot = Exclude<Got, Expected>;
    type OnlyInExpected = Exclude<Expected, Got>;
    assert<Equals<OnlyInGot, never>>();
    assert<Equals<OnlyInExpected, never>>();
 }
 assert<KcContext["themeType"] extends ThemeType ? true : false>();
--- a/src/account/kcContext/createGetKcContext.ts
+++ b/src/account/kcContext/createGetKcContext.ts
@ -1,100 +0,0 @@
 import type { DeepPartial } from "keycloakify/tools/DeepPartial";
 import { deepAssign } from "keycloakify/tools/deepAssign";
 import { isStorybook } from "keycloakify/lib/isStorybook";
 import type { ExtendKcContext } from "./getKcContextFromWindow";
 import { getKcContextFromWindow } from "./getKcContextFromWindow";
 import { symToStr } from "tsafe/symToStr";
 import { kcContextMocks, kcContextCommonMock } from "keycloakify/account/kcContext/kcContextMocks";
 export function createGetKcContext<KcContextExtension extends { pageId: string } = never>(params?: {
    mockData?: readonly DeepPartial<ExtendKcContext<KcContextExtension>>[];
 }) {
    const { mockData } = params ?? {};
    function getKcContext<PageId extends ExtendKcContext<KcContextExtension>["pageId"] | undefined = undefined>(params?: {
        mockPageId?: PageId;
        storyPartialKcContext?: DeepPartial<Extract<ExtendKcContext<KcContextExtension>, { pageId: PageId }>>;
    }): {
        kcContext: PageId extends undefined
            ? ExtendKcContext<KcContextExtension> | undefined
            : Extract<ExtendKcContext<KcContextExtension>, { pageId: PageId }>;
    } {
        const { mockPageId, storyPartialKcContext } = params ?? {};
        const realKcContext = getKcContextFromWindow<KcContextExtension>();
        if (mockPageId !== undefined && realKcContext === undefined) {
            //TODO maybe trow if no mock fo custom page
            warn_that_mock_is_enbaled: {
                if (isStorybook) {
                    break warn_that_mock_is_enbaled;
                }
                console.log(`%cKeycloakify: ${symToStr({ mockPageId })} set to ${mockPageId}.`, "background: red; color: yellow; font-size: medium");
            }
            const kcContextDefaultMock = kcContextMocks.find(({ pageId }) => pageId === mockPageId);
            const partialKcContextCustomMock = (() => {
                const out: DeepPartial<ExtendKcContext<KcContextExtension>> = {};
                const mockDataPick = mockData?.find(({ pageId }) => pageId === mockPageId);
                if (mockDataPick !== undefined) {
                    deepAssign({
                        "target": out,
                        "source": mockDataPick
                    });
                }
                if (storyPartialKcContext !== undefined) {
                    deepAssign({
                        "target": out,
                        "source": storyPartialKcContext
                    });
                }
                return Object.keys(out).length === 0 ? undefined : out;
            })();
            if (kcContextDefaultMock === undefined && partialKcContextCustomMock === undefined) {
                console.warn(
                    [
                        `WARNING: You declared the non build in page ${mockPageId} but you didn't `,
                        `provide mock data needed to debug the page outside of Keycloak as you are trying to do now.`,
                        `Please check the documentation of the getKcContext function`
                    ].join("\n")
                );
            }
            const kcContext: any = {};
            deepAssign({
                "target": kcContext,
                "source": kcContextDefaultMock !== undefined ? kcContextDefaultMock : { "pageId": mockPageId, ...kcContextCommonMock }
            });
            if (partialKcContextCustomMock !== undefined) {
                deepAssign({
                    "target": kcContext,
                    "source": partialKcContextCustomMock
                });
            }
            return { kcContext };
        }
        if (realKcContext === undefined) {
            return { "kcContext": undefined as any };
        }
        if (realKcContext.themeType !== "account") {
            return { "kcContext": undefined as any };
        }
        return { "kcContext": realKcContext as any };
    }
    return { getKcContext };
 }
--- a/src/account/kcContext/getKcContext.ts
+++ b/src/account/kcContext/getKcContext.ts
@ -1,21 +0,0 @@
 import type { DeepPartial } from "keycloakify/tools/DeepPartial";
 import type { ExtendKcContext } from "./getKcContextFromWindow";
 import { createGetKcContext } from "./createGetKcContext";
 /** NOTE: We now recommend using createGetKcContext instead of this function to make storybook integration easier
 *  See: https://github.com/keycloakify/keycloakify-starter/blob/main/src/keycloak-theme/account/kcContext.ts
 */
 export function getKcContext<KcContextExtension extends { pageId: string } = never>(params?: {
    mockPageId?: ExtendKcContext<KcContextExtension>["pageId"];
    mockData?: readonly DeepPartial<ExtendKcContext<KcContextExtension>>[];
 }): { kcContext: ExtendKcContext<KcContextExtension> | undefined } {
    const { mockPageId, mockData } = params ?? {};
    const { getKcContext } = createGetKcContext({
        mockData
    });
    const { kcContext } = getKcContext({ mockPageId });
    return { kcContext };
 }
--- a/src/account/kcContext/getKcContextFromWindow.ts
+++ b/src/account/kcContext/getKcContextFromWindow.ts
@ -1,11 +0,0 @@
 import type { AndByDiscriminatingKey } from "keycloakify/tools/AndByDiscriminatingKey";
 import { nameOfTheGlobal } from "keycloakify/bin/constants";
 import type { KcContext } from "./KcContext";
 export type ExtendKcContext<KcContextExtension extends { pageId: string }> = [KcContextExtension] extends [never]
    ? KcContext
    : AndByDiscriminatingKey<"pageId", KcContextExtension & KcContext.Common, KcContext>;
 export function getKcContextFromWindow<KcContextExtension extends { pageId: string } = never>(): ExtendKcContext<KcContextExtension> | undefined {
    return typeof window === "undefined" ? undefined : (window as any)[nameOfTheGlobal];
 }
--- a/src/account/kcContext/index.ts
+++ b/src/account/kcContext/index.ts
@ -1 +0,0 @@
 export type { KcContext } from "./KcContext";
--- a/src/account/kcContext/kcContextMocks.ts
+++ b/src/account/kcContext/kcContextMocks.ts
@ -1,175 +0,0 @@
 import "minimal-polyfills/Object.fromEntries";
 import { resources_common, keycloak_resources } from "keycloakify/bin/constants";
 import { id } from "tsafe/id";
 import type { KcContext } from "./KcContext";
 import { BASE_URL } from "keycloakify/lib/BASE_URL";
 const resourcesPath = `${BASE_URL}${keycloak_resources}/account/resources`;
 export const kcContextCommonMock: KcContext.Common = {
    "themeVersion": "0.0.0",
    "keycloakifyVersion": "0.0.0",
    "themeType": "account",
    "themeName": "my-theme-name",
    "url": {
        resourcesPath,
        "resourcesCommonPath": `${resourcesPath}/${resources_common}`,
        "resourceUrl": "#",
        "accountUrl": "#",
        "applicationsUrl": "#",
        "getLogoutUrl": () => "#",
        "logUrl": "#",
        "passwordUrl": "#",
        "sessionsUrl": "#",
        "socialUrl": "#",
        "totpUrl": "#"
    },
    "realm": {
        "internationalizationEnabled": true,
        "userManagedAccessAllowed": true
    },
    "messagesPerField": {
        "printIfExists": () => {
            return undefined;
        },
        "existsError": () => false,
        "get": key => `Fake error for ${key}`,
        "exists": () => false
    },
    "locale": {
        "supported": [
            /* spell-checker: disable */
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=de",
                "label": "Deutsch",
                "languageTag": "de"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=no",
                "label": "Norsk",
                "languageTag": "no"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=ru",
                "label": "Русский",
                "languageTag": "ru"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=sv",
                "label": "Svenska",
                "languageTag": "sv"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=pt-BR",
                "label": "Português (Brasil)",
                "languageTag": "pt-BR"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=lt",
                "label": "Lietuvių",
                "languageTag": "lt"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=en",
                "label": "English",
                "languageTag": "en"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=it",
                "label": "Italiano",
                "languageTag": "it"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=fr",
                "label": "Français",
                "languageTag": "fr"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=zh-CN",
                "label": "中文简体",
                "languageTag": "zh-CN"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=es",
                "label": "Español",
                "languageTag": "es"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=cs",
                "label": "Čeština",
                "languageTag": "cs"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=ja",
                "label": "日本語",
                "languageTag": "ja"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=sk",
                "label": "Slovenčina",
                "languageTag": "sk"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=pl",
                "label": "Polski",
                "languageTag": "pl"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=ca",
                "label": "Català",
                "languageTag": "ca"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=nl",
                "label": "Nederlands",
                "languageTag": "nl"
            },
            {
                "url": "/auth/realms/myrealm/login-actions/authenticate?client_id=account&tab_id=HoAx28ja4xg&execution=ee6c2834-46a4-4a20-a1b6-f6d6f6451b36&kc_locale=tr",
                "label": "Türkçe",
                "languageTag": "tr"
            }
            /* spell-checker: enable */
        ],
        "currentLanguageTag": "en"
    },
    "features": {
        "authorization": true,
        "identityFederation": true,
        "log": true,
        "passwordUpdateSupported": true
    },
    "referrer": undefined,
    "account": {
        "firstName": "john",
        "lastName": "doe",
        "email": "john.doe@code.gouv.fr",
        "username": "doe_j"
    }
 };
 export const kcContextMocks: KcContext[] = [
    id<KcContext.Password>({
        ...kcContextCommonMock,
        "pageId": "password.ftl",
        "password": {
            "passwordSet": true
        },
        "stateChecker": "state checker"
    }),
    id<KcContext.Account>({
        ...kcContextCommonMock,
        "pageId": "account.ftl",
        "url": {
            ...kcContextCommonMock.url,
            "referrerURI": "#",
            "accountUrl": "#"
        },
        "realm": {
            ...kcContextCommonMock.realm,
            "registrationEmailAsUsername": true,
            "editUsernameAllowed": true
        },
        "stateChecker": ""
    })
 ];
--- a/src/account/lib/useGetClassName.ts
+++ b/src/account/lib/useGetClassName.ts
@ -1,13 +0,0 @@
 import { createUseClassName } from "keycloakify/lib/useGetClassName";
 import type { ClassKey } from "keycloakify/account/TemplateProps";
 export const { useGetClassName } = createUseClassName<ClassKey>({
    "defaultClasses": {
        "kcHtmlClass": undefined,
        "kcBodyClass": undefined,
        "kcButtonClass": "btn",
        "kcButtonPrimaryClass": "btn-primary",
        "kcButtonLargeClass": "btn-lg",
        "kcButtonDefaultClass": "btn-default"
    }
 });
--- a/src/account/pages/Account.tsx
+++ b/src/account/pages/Account.tsx
@ -1,133 +0,0 @@
 import { clsx } from "keycloakify/tools/clsx";
 import type { PageProps } from "keycloakify/account/pages/PageProps";
 import { useGetClassName } from "keycloakify/account/lib/useGetClassName";
 import type { KcContext } from "../kcContext";
 import type { I18n } from "../i18n";
 export default function Account(props: PageProps<Extract<KcContext, { pageId: "account.ftl" }>, I18n>) {
    const { kcContext, i18n, doUseDefaultCss, Template, classes } = props;
    const { getClassName } = useGetClassName({
        doUseDefaultCss,
        "classes": {
            ...classes,
            "kcBodyClass": clsx(classes?.kcBodyClass, "user")
        }
    });
    const { url, realm, messagesPerField, stateChecker, account, referrer } = kcContext;
    const { msg } = i18n;
    return (
        <Template {...{ kcContext, i18n, doUseDefaultCss, classes }} active="account">
            <div className="row">
                <div className="col-md-10">
                    <h2>{msg("editAccountHtmlTitle")}</h2>
                </div>
                <div className="col-md-2 subtitle">
                    <span className="subtitle">
                        <span className="required">*</span> {msg("requiredFields")}
                    </span>
                </div>
            </div>
            <form action={url.accountUrl} className="form-horizontal" method="post">
                <input type="hidden" id="stateChecker" name="stateChecker" value={stateChecker} />
                {!realm.registrationEmailAsUsername && (
                    <div className={clsx("form-group", messagesPerField.printIfExists("username", "has-error"))}>
                        <div className="col-sm-2 col-md-2">
                            <label htmlFor="username" className="control-label">
                                {msg("username")}
                            </label>
                            {realm.editUsernameAllowed && <span className="required">*</span>}
                        </div>
                        <div className="col-sm-10 col-md-10">
                            <input
                                type="text"
                                className="form-control"
                                id="username"
                                name="username"
                                disabled={!realm.editUsernameAllowed}
                                defaultValue={account.username ?? ""}
                            />
                        </div>
                    </div>
                )}
                <div className={clsx("form-group", messagesPerField.printIfExists("email", "has-error"))}>
                    <div className="col-sm-2 col-md-2">
                        <label htmlFor="email" className="control-label">
                            {msg("email")}
                        </label>{" "}
                        <span className="required">*</span>
                    </div>
                    <div className="col-sm-10 col-md-10">
                        <input type="text" className="form-control" id="email" name="email" autoFocus defaultValue={account.email ?? ""} />
                    </div>
                </div>
                <div className={clsx("form-group", messagesPerField.printIfExists("firstName", "has-error"))}>
                    <div className="col-sm-2 col-md-2">
                        <label htmlFor="firstName" className="control-label">
                            {msg("firstName")}
                        </label>{" "}
                        <span className="required">*</span>
                    </div>
                    <div className="col-sm-10 col-md-10">
                        <input type="text" className="form-control" id="firstName" name="firstName" defaultValue={account.firstName ?? ""} />
                    </div>
                </div>
                <div className={clsx("form-group", messagesPerField.printIfExists("lastName", "has-error"))}>
                    <div className="col-sm-2 col-md-2">
                        <label htmlFor="lastName" className="control-label">
                            {msg("lastName")}
                        </label>{" "}
                        <span className="required">*</span>
                    </div>
                    <div className="col-sm-10 col-md-10">
                        <input type="text" className="form-control" id="lastName" name="lastName" defaultValue={account.lastName ?? ""} />
                    </div>
                </div>
                <div className="form-group">
                    <div id="kc-form-buttons" className="col-md-offset-2 col-md-10 submit">
                        <div>
                            {referrer !== undefined && <a href={referrer?.url}>{msg("backToApplication")}</a>}
                            <button
                                type="submit"
                                className={clsx(
                                    getClassName("kcButtonClass"),
                                    getClassName("kcButtonPrimaryClass"),
                                    getClassName("kcButtonLargeClass")
                                )}
                                name="submitAction"
                                value="Save"
                            >
                                {msg("doSave")}
                            </button>
                            <button
                                type="submit"
                                className={clsx(
                                    getClassName("kcButtonClass"),
                                    getClassName("kcButtonDefaultClass"),
                                    getClassName("kcButtonLargeClass")
                                )}
                                name="submitAction"
                                value="Cancel"
                            >
                                {msg("doCancel")}
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </Template>
    );
 }
--- a/src/account/pages/PageProps.ts
+++ b/src/account/pages/PageProps.ts
@ -1,12 +0,0 @@
 import type { I18n } from "keycloakify/account/i18n";
 import type { TemplateProps, ClassKey } from "keycloakify/account/TemplateProps";
 import type { LazyOrNot } from "keycloakify/tools/LazyOrNot";
 import type { KcContext } from "keycloakify/account/kcContext";
 export type PageProps<NarowedKcContext = KcContext, I18nExtended extends I18n = I18n> = {
    Template: LazyOrNot<(props: TemplateProps<any, any>) => JSX.Element | null>;
    kcContext: NarowedKcContext;
    i18n: I18nExtended;
    doUseDefaultCss: boolean;
    classes?: Partial<Record<ClassKey, string>>;
 };
--- a/src/account/pages/Password.tsx
+++ b/src/account/pages/Password.tsx
@ -1,211 +0,0 @@
 import { useState } from "react";
 import { clsx } from "keycloakify/tools/clsx";
 import type { PageProps } from "keycloakify/account/pages/PageProps";
 import { useGetClassName } from "keycloakify/account/lib/useGetClassName";
 import type { KcContext } from "../kcContext";
 import type { I18n } from "../i18n";
 export default function Password(props: PageProps<Extract<KcContext, { pageId: "password.ftl" }>, I18n>) {
    const { kcContext, i18n, doUseDefaultCss, Template, classes } = props;
    const { getClassName } = useGetClassName({
        doUseDefaultCss,
        "classes": {
            ...classes,
            "kcBodyClass": clsx(classes?.kcBodyClass, "password")
        }
    });
    const { url, password, account, stateChecker } = kcContext;
    const { msgStr, msg } = i18n;
    const [currentPassword, setCurrentPassword] = useState("");
    const [newPassword, setNewPassword] = useState("");
    const [newPasswordConfirm, setNewPasswordConfirm] = useState("");
    const [newPasswordError, setNewPasswordError] = useState("");
    const [newPasswordConfirmError, setNewPasswordConfirmError] = useState("");
    const [hasNewPasswordBlurred, setHasNewPasswordBlurred] = useState(false);
    const [hasNewPasswordConfirmBlurred, setHasNewPasswordConfirmBlurred] = useState(false);
    const checkNewPassword = (newPassword: string) => {
        if (!password.passwordSet) {
            return;
        }
        if (newPassword === currentPassword) {
            setNewPasswordError(msgStr("newPasswordSameAsOld"));
        } else {
            setNewPasswordError("");
        }
    };
    const checkNewPasswordConfirm = (newPasswordConfirm: string) => {
        if (newPasswordConfirm === "") {
            return;
        }
        if (newPassword !== newPasswordConfirm) {
            setNewPasswordConfirmError(msgStr("passwordConfirmNotMatch"));
        } else {
            setNewPasswordConfirmError("");
        }
    };
    return (
        <Template
            {...{
                kcContext: {
                    ...kcContext,
                    "message": (() => {
                        if (newPasswordError !== "") {
                            return {
                                "type": "error",
                                "summary": newPasswordError
                            };
                        }
                        if (newPasswordConfirmError !== "") {
                            return {
                                "type": "error",
                                "summary": newPasswordConfirmError
                            };
                        }
                        return kcContext.message;
                    })()
                },
                i18n,
                doUseDefaultCss,
                classes
            }}
            active="password"
        >
            <div className="row">
                <div className="col-md-10">
                    <h2>{msg("changePasswordHtmlTitle")}</h2>
                </div>
                <div className="col-md-2 subtitle">
                    <span className="subtitle">{msg("allFieldsRequired")}</span>
                </div>
            </div>
            <form action={url.passwordUrl} className="form-horizontal" method="post">
                <input
                    type="text"
                    id="username"
                    name="username"
                    value={account.username ?? ""}
                    autoComplete="username"
                    readOnly
                    style={{ "display": "none" }}
                />
                {password.passwordSet && (
                    <div className="form-group">
                        <div className="col-sm-2 col-md-2">
                            <label htmlFor="password" className="control-label">
                                {msg("password")}
                            </label>
                        </div>
                        <div className="col-sm-10 col-md-10">
                            <input
                                type="password"
                                className="form-control"
                                id="password"
                                name="password"
                                autoFocus
                                autoComplete="current-password"
                                value={currentPassword}
                                onChange={event => setCurrentPassword(event.target.value)}
                            />
                        </div>
                    </div>
                )}
                <input type="hidden" id="stateChecker" name="stateChecker" value={stateChecker} />
                <div className="form-group">
                    <div className="col-sm-2 col-md-2">
                        <label htmlFor="password-new" className="control-label">
                            {msg("passwordNew")}
                        </label>
                    </div>
                    <div className="col-sm-10 col-md-10">
                        <input
                            type="password"
                            className="form-control"
                            id="password-new"
                            name="password-new"
                            autoComplete="new-password"
                            value={newPassword}
                            onChange={event => {
                                const newPassword = event.target.value;
                                setNewPassword(newPassword);
                                if (hasNewPasswordBlurred) {
                                    checkNewPassword(newPassword);
                                }
                            }}
                            onBlur={() => {
                                setHasNewPasswordBlurred(true);
                                checkNewPassword(newPassword);
                            }}
                        />
                    </div>
                </div>
                <div className="form-group">
                    <div className="col-sm-2 col-md-2">
                        <label htmlFor="password-confirm" className="control-label two-lines">
                            {msg("passwordConfirm")}
                        </label>
                    </div>
                    <div className="col-sm-10 col-md-10">
                        <input
                            type="password"
                            className="form-control"
                            id="password-confirm"
                            name="password-confirm"
                            autoComplete="new-password"
                            value={newPasswordConfirm}
                            onChange={event => {
                                const newPasswordConfirm = event.target.value;
                                setNewPasswordConfirm(newPasswordConfirm);
                                if (hasNewPasswordConfirmBlurred) {
                                    checkNewPasswordConfirm(newPasswordConfirm);
                                }
                            }}
                            onBlur={() => {
                                setHasNewPasswordConfirmBlurred(true);
                                checkNewPasswordConfirm(newPasswordConfirm);
                            }}
                        />
                    </div>
                </div>
                <div className="form-group">
                    <div id="kc-form-buttons" className="col-md-offset-2 col-md-10 submit">
                        <div>
                            <button
                                disabled={newPasswordError !== "" || newPasswordConfirmError !== ""}
                                type="submit"
                                className={clsx(
                                    getClassName("kcButtonClass"),
                                    getClassName("kcButtonPrimaryClass"),
                                    getClassName("kcButtonLargeClass")
                                )}
                                name="submitAction"
                                value="Save"
                            >
                                {msg("doSave")}
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </Template>
    );
 }
--- a/src/bin/build-keycloak-theme/build-keycloak-theme.ts
+++ b/src/bin/build-keycloak-theme/build-keycloak-theme.ts
@ -0,0 +1,155 @@
 import { generateKeycloakThemeResources } from "./generateKeycloakThemeResources";
 import { generateJavaStackFiles } from "./generateJavaStackFiles";
 import { join as pathJoin, relative as pathRelative, basename as pathBasename } from "path";
 import * as child_process from "child_process";
 import { generateStartKeycloakTestingContainer } from "./generateStartKeycloakTestingContainer";
 import { URL } from "url";
 import * as fs from "fs";
 type ParsedPackageJson = {
    name: string;
    version: string;
    homepage?: string;
 };
 const reactProjectDirPath = process.cwd();
 const doUseExternalAssets = process.argv[2]?.toLowerCase() === "--external-assets";
 const parsedPackageJson: ParsedPackageJson = require(pathJoin(reactProjectDirPath, "package.json"));
 export const keycloakThemeBuildingDirPath = pathJoin(reactProjectDirPath, "build_keycloak");
 export const keycloakThemeEmailDirPath = pathJoin(keycloakThemeBuildingDirPath, "..", "keycloak_email");
 function sanitizeThemeName(name: string) {
    return name
        .replace(/^@(.*)/, "$1")
        .split("/")
        .join("-");
 }
 export function main() {
    console.log("🔏 Building the keycloak theme...⌚");
    const extraPagesId: string[] = (parsedPackageJson as any)["keycloakify"]?.["extraPages"] ?? [];
    const extraThemeProperties: string[] = (parsedPackageJson as any)["keycloakify"]?.["extraThemeProperties"] ?? [];
    const themeName = sanitizeThemeName(parsedPackageJson.name);
    const { doBundleEmailTemplate } = generateKeycloakThemeResources({
        keycloakThemeBuildingDirPath,
        keycloakThemeEmailDirPath,
        "reactAppBuildDirPath": pathJoin(reactProjectDirPath, "build"),
        themeName,
        ...(() => {
            const url = (() => {
                const { homepage } = parsedPackageJson;
                if (homepage !== undefined) {
                    return new URL(homepage);
                }
                const cnameFilePath = pathJoin(reactProjectDirPath, "public", "CNAME");
                if (fs.existsSync(cnameFilePath)) {
                    return new URL(`https://${fs.readFileSync(cnameFilePath).toString("utf8").replace(/\s+$/, "")}`);
                }
                return undefined;
            })();
            return {
                "urlPathname": url === undefined ? "/" : url.pathname.replace(/([^/])$/, "$1/"),
                "urlOrigin": !doUseExternalAssets
                    ? undefined
                    : (() => {
                          if (url === undefined) {
                              console.error("ERROR: You must specify 'homepage' in your package.json");
                              process.exit(-1);
                          }
                          return url.origin;
                      })(),
            };
        })(),
        extraPagesId,
        extraThemeProperties,
        //We have to leave it at that otherwise we break our default theme.
        //Problem is that we can't guarantee that the the old resources
        //will still be available on the newer keycloak version.
        "keycloakVersion": "11.0.3",
    });
    const { jarFilePath } = generateJavaStackFiles({
        "version": parsedPackageJson.version,
        themeName,
        "homepage": parsedPackageJson.homepage,
        keycloakThemeBuildingDirPath,
        doBundleEmailTemplate,
    });
    child_process.execSync("mvn package", {
        "cwd": keycloakThemeBuildingDirPath,
    });
    //We want, however, to test in a container running the latest Keycloak version
    const containerKeycloakVersion = "18.0.2";
    generateStartKeycloakTestingContainer({
        keycloakThemeBuildingDirPath,
        themeName,
        "keycloakVersion": containerKeycloakVersion,
    });
    console.log(
        [
            "",
            `✅ Your keycloak theme has been generated and bundled into ./${pathRelative(reactProjectDirPath, jarFilePath)} 🚀`,
            `It is to be placed in "/opt/keycloak/providers" in the container running a quay.io/keycloak/keycloak Docker image.`,
            "",
            //TODO: Restore when we find a good Helm chart for Keycloak.
            //"Using Helm (https://github.com/codecentric/helm-charts), edit to reflect:",
            "",
            "value.yaml: ",
            "    extraInitContainers: |",
            "        - name: realm-ext-provider",
            "          image: curlimages/curl",
            "          imagePullPolicy: IfNotPresent",
            "          command:",
            "            - sh",
            "          args:",
            "            - -c",
            `            - curl -L -f -S -o /extensions/${pathBasename(jarFilePath)} https://AN.URL.FOR/${pathBasename(jarFilePath)}`,
            "          volumeMounts:",
            "            - name: extensions",
            "              mountPath: /extensions",
            "        ",
            "        extraVolumeMounts: |",
            "            - name: extensions",
            "              mountPath: /opt/keycloak/providers",
            "    extraEnv: |",
            "    - name: KEYCLOAK_USER",
            "      value: admin",
            "    - name: KEYCLOAK_PASSWORD",
            "      value: xxxxxxxxx",
            "    - name: JAVA_OPTS",
            "      value: -Dkeycloak.profile=preview",
            "",
            "",
            `To test your theme locally you can spin up a Keycloak ${containerKeycloakVersion} container image with the theme pre loaded by running:`,
            "",
            `👉 $ ./${pathRelative(reactProjectDirPath, pathJoin(keycloakThemeBuildingDirPath, generateStartKeycloakTestingContainer.basename))} 👈`,
            "",
            "Test with different Keycloak versions by editing the .sh file. see available versions here: https://quay.io/repository/keycloak/keycloak?tab=tags",
            "",
            "Once your container is up and running: ",
            "- Log into the admin console 👉 http://localhost:8080/admin username: admin, password: admin 👈",
            '- Create a realm named "myrealm"',
            '- Create a client with ID: "myclient", "Root URL": "https://www.keycloak.org/app/" and "Valid redirect URIs": "https://www.keycloak.org/app/*"',
            `- Select Login Theme: ${themeName} (don't forget to save at the bottom of the page)`,
            `- Go to 👉 https://www.keycloak.org/app/ 👈 Click "Save" then "Sign in". You should see your login page`,
            "",
            "Video demoing this process: https://youtu.be/N3wlBoH4hKg",
            "",
        ].join("\n"),
    );
 }
--- a/src/bin/build-keycloak-theme/ftlValuesGlobalName.ts
+++ b/src/bin/build-keycloak-theme/ftlValuesGlobalName.ts
@ -0,0 +1 @@
 export const ftlValuesGlobalName = "kcContext";
--- a/src/bin/build-keycloak-theme/generateFtl/ftl_object_to_js_code_declaring_an_object.ftl
+++ b/src/bin/build-keycloak-theme/generateFtl/ftl_object_to_js_code_declaring_an_object.ftl
@ -0,0 +1,342 @@
 <script>const _= 
 <#assign pageId="PAGE_ID_xIgLsPgGId9D8e">
 (()=>{
    const out = 
 ${ftl_object_to_js_code_declaring_an_object(.data_model, [])?no_esc};
    out["msg"]= function(){ throw new Error("use import { useKcMessage } from 'keycloakify'"); };
    out["advancedMsg"]= function(){ throw new Error("use import { useKcMessage } from 'keycloakify'"); };
    out["messagesPerField"]= {
        <#assign fieldNames = [
            "global", "userLabel", "username", "email", "firstName", "lastName", "password", "password-confirm",
            "totp", "totpSecret", "SAMLRequest", "SAMLResponse", "relayState", "device_user_code", "code", 
            "password-new", "rememberMe", "login", "authenticationExecution", "cancel-aia", "clientDataJSON", 
            "authenticatorData", "signature", "credentialId", "userHandle", "error", "authn_use_chk", "authenticationExecution", 
            "isSetRetry", "try-again", "attestationObject", "publicKeyCredentialId", "authenticatorLabel",
            "user.attributes.dateOfBirth", "user.attributes.country", "user.attributes.acceptedTermsAndConditions"
        ]>
        <#attempt>
            <#if profile?? && profile.attributes?? && profile.attributes?is_enumerable>
                <#list profile.attributes as attribute>
                    <#if fieldNames?seq_contains(attribute.name)>
                        <#continue>
                    </#if>
                    <#assign fieldNames += [attribute.name]>
                </#list>
            </#if>
        <#recover>
        </#attempt>
        "printIfExists": function (fieldName, x) {
            <#if !messagesPerField?? >
                return undefined;
            </#if>
            <#list fieldNames as fieldName>
                if(fieldName === "${fieldName}" ){
                    <#attempt>
                        return "${messagesPerField.printIfExists(fieldName,'1')}" ? x : undefined;
                    <#recover>
                    </#attempt>
                }
            </#list>
            throw new Error("There is no " + fieldName + " field");
        },
        "existsError": function (fieldName) {
            <#if !messagesPerField?? >
                return false;
            </#if>
            <#list fieldNames as fieldName>
                if(fieldName === "${fieldName}" ){
                    <#attempt>
                        return <#if messagesPerField.existsError('${fieldName}')>true<#else>false</#if>;
                    <#recover>
                    </#attempt>
                }
            </#list>
            throw new Error("There is no " + fieldName + " field");
        },
        "get": function (fieldName) {
            <#if !messagesPerField?? >
                return '';
            </#if>
            <#list fieldNames as fieldName>
                if(fieldName === "${fieldName}" ){
                    <#attempt>
                        <#if messagesPerField.existsError('${fieldName}')>
                            return "${messagesPerField.get('${fieldName}')?no_esc}";
                        </#if>
                    <#recover>
                    </#attempt>
                }
            </#list>
            throw new Error("There is no " + fieldName + " field");
        },
        "exists": function (fieldName) {
            <#if !messagesPerField?? >
                return false;
            </#if>
            <#list fieldNames as fieldName>
                if(fieldName === "${fieldName}" ){
                    <#attempt>
                        return <#if messagesPerField.exists('${fieldName}')>true<#else>false</#if>;
                    <#recover>
                    </#attempt>
                }
            </#list>
            throw new Error("There is no " + fieldName + " field");
        }
    };
    out["pageId"] = "${pageId}";
    return out;
 })()
 <#function ftl_object_to_js_code_declaring_an_object object path>
        <#local isHash = "">
        <#attempt>
            <#local isHash = object?is_hash || object?is_hash_ex>
        <#recover>
            <#return "ABORT: Can't evaluate if " + path?join(".") + " is hash">
        </#attempt>
        <#if isHash>
            <#if path?size gt 10>
                <#return "ABORT: Too many recursive calls">
            </#if>
            <#local keys = "">
            <#attempt>
                <#local keys = object?keys>
            <#recover>
                <#return "ABORT: We can't list keys on this object">
            </#attempt>
            <#local out_seq = []>
            <#list keys as key>
                <#if ["class","declaredConstructors","superclass","declaringClass" ]?seq_contains(key) >
                    <#continue>
                </#if>
                <#if 
                    (
                        ["loginUpdatePasswordUrl", "loginUpdateProfileUrl", "loginUsernameReminderUrl", "loginUpdateTotpUrl"]?seq_contains(key) && 
                        are_same_path(path, ["url"])
                    ) || (
                        key == "updateProfileCtx" && 
                        are_same_path(path, [])
                    ) || (
                        <#-- https://github.com/InseeFrLab/keycloakify/pull/65#issuecomment-991896344 (reports with saml-post-form.ftl) -->
                        <#-- https://github.com/InseeFrLab/keycloakify/issues/91#issue-1212319466 (reports with error.ftl and Kc18) -->
                        <#-- https://github.com/InseeFrLab/keycloakify/issues/109#issuecomment-1134610163 -->
                        key == "loginAction" && 
                        are_same_path(path, ["url"]) && 
                        ["saml-post-form.ftl", "error.ftl", "info.ftl"]?seq_contains(pageId) &&
                        !(auth?has_content && auth.showTryAnotherWayLink())
                    ) || (
                        ["contextData", "idpConfig", "idp", "authenticationSession"]?seq_contains(key) &&
                        are_same_path(path, ["brokerContext"]) &&
                        ["login-idp-link-confirm.ftl", "login-idp-link-email.ftl" ]?seq_contains(pageId)
                    ) || (
                        key == "identityProviderBrokerCtx" && 
                        are_same_path(path, []) &&
                        ["login-idp-link-confirm.ftl", "login-idp-link-email.ftl" ]?seq_contains(pageId)
                    ) ||  (
                        ["masterAdminClient", "delegateForUpdate", "defaultRole"]?seq_contains(key) &&
                        are_same_path(path, ["realm"])
                    )
                >
                    <#local out_seq += ["/*If you need '" + key + "' on " + pageId + ", please submit an issue to the Keycloakify repo*/"]>
                    <#continue>
                </#if>
                <#if key == "attemptedUsername" && are_same_path(path, ["auth"])>
                    <#attempt>
                        <#-- https://github.com/keycloak/keycloak/blob/3a2bf0c04bcde185e497aaa32d0bb7ab7520cf4a/themes/src/main/resources/theme/base/login/template.ftl#L63 -->
                        <#if !(auth?has_content && auth.showUsername() && !auth.showResetCredentials())>
                            <#continue>
                        </#if>
                    <#recover>
                    </#attempt>
                </#if>
                <#attempt>
                    <#if !object[key]??>
                        <#continue>
                    </#if>
                <#recover>
                    <#local out_seq += ["/*Couldn't test if '" + key + "' is available on this object*/"]>
                    <#continue>
                </#attempt>
                <#local propertyValue = "">
                <#attempt>
                    <#local propertyValue = object[key]>
                <#recover>
                    <#local out_seq += ["/*Couldn't dereference '" + key + "' on this object*/"]>
                    <#continue>
                </#attempt>
                <#local rec_out = ftl_object_to_js_code_declaring_an_object(propertyValue, path + [ key ])>
                <#if rec_out?starts_with("ABORT:")>
                    <#local errorMessage = rec_out?remove_beginning("ABORT:")>
                    <#if errorMessage != " It's a method" >
                        <#local out_seq += ["/*" + key + ": " + errorMessage + "*/"]>
                    </#if>
                    <#continue>
                </#if>
                <#local out_seq +=  ['"' + key + '": ' + rec_out + ","]>
            </#list>
            <#return (["{"] + out_seq?map(str -> ""?right_pad(4 * (path?size + 1)) + str) + [ ""?right_pad(4 * path?size) + "}"])?join("\n")>
        </#if>
        <#local isMethod = "">
        <#attempt>
            <#local isMethod = object?is_method>
        <#recover>
            <#return "ABORT: Can't test if it'sa method.">
        </#attempt>
        <#if isMethod>
            <#if are_same_path(path, ["auth", "showUsername"])>
                <#attempt>
                    <#return auth.showUsername()?c>
                <#recover>
                    <#return "ABORT: Couldn't evaluate auth.showUsername()">
                </#attempt>
            </#if>
            <#if are_same_path(path, ["auth", "showResetCredentials"])>
                <#attempt>
                    <#return auth.showResetCredentials()?c>
                <#recover>
                    <#return "ABORT: Couldn't evaluate auth.showResetCredentials()">
                </#attempt>
            </#if>
            <#if are_same_path(path, ["auth", "showTryAnotherWayLink"])>
                <#attempt>
                    <#return auth.showTryAnotherWayLink()?c>
                <#recover>
                    <#return "ABORT: Couldn't evaluate auth.showTryAnotherWayLink()">
                </#attempt>
            </#if>
            <#return "ABORT: It's a method">
        </#if>
        <#local isBoolean = "">
        <#attempt>
            <#local isBoolean = object?is_boolean>
        <#recover>
            <#return "ABORT: Can't test if it's a boolean">
        </#attempt>
        <#if isBoolean>
            <#return object?c>
        </#if>
        <#local isEnumerable = "">
        <#attempt>
            <#local isEnumerable = object?is_enumerable>
        <#recover>
            <#return "ABORT: Can't test if it's an enumerable">
        </#attempt>
        <#if isEnumerable>
            <#local out_seq = []>
            <#local i = 0>
            <#list object as array_item>
                <#local rec_out = ftl_object_to_js_code_declaring_an_object(array_item, path + [ i ])>
                <#local i = i + 1>
                <#if rec_out?starts_with("ABORT:")>
                    <#local errorMessage = rec_out?remove_beginning("ABORT:")>
                    <#if errorMessage != " It's a method" >
                        <#local out_seq += ["/*" + i?string + ": " + errorMessage + "*/"]>
                    </#if>
                    <#continue>
                </#if>
                <#local out_seq += [rec_out + ","]>
            </#list>
            <#return (["["] + out_seq?map(str -> ""?right_pad(4 * (path?size + 1)) + str) + [ ""?right_pad(4 * path?size) + "]"])?join("\n")>
        </#if>
        <#attempt>
            <#return '"' + object?js_string + '"'>;
        <#recover>
        </#attempt>
        <#return "ABORT: Couldn't convert into string non hash, non method, non boolean, non enumerable object">
 </#function>
 <#function are_same_path path searchedPath>
    <#if path?size != searchedPath?size>
        <#return false>
    </#if>
    <#local i=0>
    <#list path as property>
        <#local searchedProperty=searchedPath[i]>
        <#if searchedProperty?is_string && searchedProperty == "*">
            <#continue>
        </#if>
        <#if searchedProperty?is_string && !property?is_string>
            <#return false>
        </#if>
        <#if searchedProperty?is_number && !property?is_number>
            <#return false>
        </#if>
        <#if searchedProperty?string != property?string>
            <#return false>
        </#if>
        <#local i+= 1>
    </#list>
    <#return true>
 </#function>
 </script>
--- a/src/bin/build-keycloak-theme/generateFtl/generateFtl.ts
+++ b/src/bin/build-keycloak-theme/generateFtl/generateFtl.ts
@ -0,0 +1,139 @@
 import cheerio from "cheerio";
 import { replaceImportsFromStaticInJsCode, replaceImportsInInlineCssCode, generateCssCodeToDefineGlobals } from "../replaceImportFromStatic";
 import fs from "fs";
 import { join as pathJoin } from "path";
 import { objectKeys } from "tsafe/objectKeys";
 import { ftlValuesGlobalName } from "../ftlValuesGlobalName";
 // https://github.com/keycloak/keycloak/blob/main/services/src/main/java/org/keycloak/forms/login/freemarker/Templates.java
 export const pageIds = [
    "login.ftl",
    "register.ftl",
    "register-user-profile.ftl",
    "info.ftl",
    "error.ftl",
    "login-reset-password.ftl",
    "login-verify-email.ftl",
    "terms.ftl",
    "login-otp.ftl",
    "login-update-profile.ftl",
    "login-update-password.ftl",
    "login-idp-link-confirm.ftl",
    "login-idp-link-email.ftl",
    "login-page-expired.ftl",
    "login-config-totp.ftl",
    "logout-confirm.ftl",
 ] as const;
 export type PageId = typeof pageIds[number];
 export function generateFtlFilesCodeFactory(params: {
    cssGlobalsToDefine: Record<string, string>;
    indexHtmlCode: string;
    urlPathname: string;
    urlOrigin: undefined | string;
 }) {
    const { cssGlobalsToDefine, indexHtmlCode, urlPathname, urlOrigin } = params;
    const $ = cheerio.load(indexHtmlCode);
    $("script:not([src])").each((...[, element]) => {
        const { fixedJsCode } = replaceImportsFromStaticInJsCode({
            "jsCode": $(element).html()!,
            urlOrigin,
        });
        $(element).text(fixedJsCode);
    });
    $("style").each((...[, element]) => {
        const { fixedCssCode } = replaceImportsInInlineCssCode({
            "cssCode": $(element).html()!,
            "urlPathname": params.urlPathname,
            urlOrigin,
        });
        $(element).text(fixedCssCode);
    });
    (
        [
            ["link", "href"],
            ["script", "src"],
        ] as const
    ).forEach(([selector, attrName]) =>
        $(selector).each((...[, element]) => {
            const href = $(element).attr(attrName);
            if (href === undefined) {
                return;
            }
            $(element).attr(
                attrName,
                urlOrigin !== undefined
                    ? href.replace(/^\//, `${urlOrigin}/`)
                    : href.replace(new RegExp(`^${urlPathname.replace(/\//g, "\\/")}`), "${url.resourcesPath}/build/"),
            );
        }),
    );
    //FTL is no valid html, we can't insert with cheerio, we put placeholder for injecting later.
    const replaceValueBySearchValue = {
        '{ "x": "vIdLqMeOed9sdLdIdOxdK0d" }': fs
            .readFileSync(pathJoin(__dirname, "ftl_object_to_js_code_declaring_an_object.ftl"))
            .toString("utf8")
            .match(/^<script>const _=((?:.|\n)+)<\/script>[\n]?$/)![1],
        "<!-- xIdLqMeOedErIdLsPdNdI9dSlxI -->": [
            "<#if scripts??>",
            "    <#list scripts as script>",
            '        <script src="${script}" type="text/javascript"></script>',
            "    </#list>",
            "</#if>",
        ].join("\n"),
    };
    $("head").prepend(
        [
            ...(Object.keys(cssGlobalsToDefine).length === 0
                ? []
                : [
                      "",
                      "<style>",
                      generateCssCodeToDefineGlobals({
                          cssGlobalsToDefine,
                          urlPathname,
                      }).cssCodeToPrependInHead,
                      "</style>",
                      "",
                  ]),
            "<script>",
            `    window.${ftlValuesGlobalName}= ${objectKeys(replaceValueBySearchValue)[0]};`,
            "</script>",
            "",
            objectKeys(replaceValueBySearchValue)[1],
        ].join("\n"),
    );
    const partiallyFixedIndexHtmlCode = $.html();
    function generateFtlFilesCode(params: { pageId: string }): {
        ftlCode: string;
    } {
        const { pageId } = params;
        const $ = cheerio.load(partiallyFixedIndexHtmlCode);
        let ftlCode = $.html();
        Object.entries({
            ...replaceValueBySearchValue,
            //If updated, don't forget to change in the ftl script as well.
            "PAGE_ID_xIgLsPgGId9D8e": pageId,
        }).map(([searchValue, replaceValue]) => (ftlCode = ftlCode.replace(searchValue, replaceValue)));
        return { ftlCode };
    }
    return { generateFtlFilesCode };
 }
--- a/src/bin/build-keycloak-theme/generateFtl/index.ts
+++ b/src/bin/build-keycloak-theme/generateFtl/index.ts
@ -1,2 +1 @@
 export * from "./generateFtl";
 export * from "./pageId";
--- a/src/bin/build-keycloak-theme/generateJavaStackFiles.ts
+++ b/src/bin/build-keycloak-theme/generateJavaStackFiles.ts
@ -0,0 +1,87 @@
 import * as url from "url";
 import * as fs from "fs";
 import { join as pathJoin, dirname as pathDirname } from "path";
 export function generateJavaStackFiles(params: {
    version: string;
    themeName: string;
    homepage?: string;
    keycloakThemeBuildingDirPath: string;
    doBundleEmailTemplate: boolean;
 }): {
    jarFilePath: string;
 } {
    const { themeName, version, homepage, keycloakThemeBuildingDirPath, doBundleEmailTemplate } = params;
    {
        const { pomFileCode } = (function generatePomFileCode(): {
            pomFileCode: string;
        } {
            const groupId = (() => {
                const fallbackGroupId = `there.was.no.homepage.field.in.the.package.json.${themeName}`;
                return (
                    (!homepage
                        ? fallbackGroupId
                        : url
                              .parse(homepage)
                              .host?.replace(/:[0-9]+$/, "")
                              ?.split(".")
                              .reverse()
                              .join(".") ?? fallbackGroupId) + ".keycloak"
                );
            })();
            const artefactId = `${themeName}-keycloak-theme`;
            const pomFileCode = [
                `<?xml version="1.0"?>`,
                `<project xmlns="http://maven.apache.org/POM/4.0.0"`,
                `	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"`,
                `	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">`,
                `	<modelVersion>4.0.0</modelVersion>`,
                `	<groupId>${groupId}</groupId>`,
                `	<artifactId>${artefactId}</artifactId>`,
                `	<version>${version}</version>`,
                `	<name>${artefactId}</name>`,
                `	<description />`,
                `</project>`,
            ].join("\n");
            return { pomFileCode };
        })();
        fs.writeFileSync(pathJoin(keycloakThemeBuildingDirPath, "pom.xml"), Buffer.from(pomFileCode, "utf8"));
    }
    {
        const themeManifestFilePath = pathJoin(keycloakThemeBuildingDirPath, "src", "main", "resources", "META-INF", "keycloak-themes.json");
        try {
            fs.mkdirSync(pathDirname(themeManifestFilePath));
        } catch {}
        fs.writeFileSync(
            themeManifestFilePath,
            Buffer.from(
                JSON.stringify(
                    {
                        "themes": [
                            {
                                "name": themeName,
                                "types": ["login", ...(doBundleEmailTemplate ? ["email"] : [])],
                            },
                        ],
                    },
                    null,
                    2,
                ),
                "utf8",
            ),
        );
    }
    return {
        "jarFilePath": pathJoin(keycloakThemeBuildingDirPath, "target", `${themeName}-${version}.jar`),
    };
 }
--- a/src/bin/build-keycloak-theme/generateKeycloakThemeResources.ts
+++ b/src/bin/build-keycloak-theme/generateKeycloakThemeResources.ts
@ -0,0 +1,168 @@
 import { transformCodebase } from "../tools/transformCodebase";
 import * as fs from "fs";
 import { join as pathJoin, basename as pathBasename } from "path";
 import { replaceImportsInCssCode, replaceImportsFromStaticInJsCode } from "./replaceImportFromStatic";
 import { generateFtlFilesCodeFactory, pageIds } from "./generateFtl";
 import { downloadBuiltinKeycloakTheme } from "../download-builtin-keycloak-theme";
 import * as child_process from "child_process";
 import { resourcesCommonPath, resourcesPath, subDirOfPublicDirBasename } from "../../lib/getKcContext/kcContextMocks/urlResourcesPath";
 import { isInside } from "../tools/isInside";
 export function generateKeycloakThemeResources(params: {
    themeName: string;
    reactAppBuildDirPath: string;
    keycloakThemeBuildingDirPath: string;
    keycloakThemeEmailDirPath: string;
    urlPathname: string;
    //If urlOrigin is not undefined then it means --externals-assets
    urlOrigin: undefined | string;
    extraPagesId: string[];
    extraThemeProperties: string[];
    keycloakVersion: string;
 }): { doBundleEmailTemplate: boolean } {
    const {
        themeName,
        reactAppBuildDirPath,
        keycloakThemeBuildingDirPath,
        keycloakThemeEmailDirPath,
        urlPathname,
        urlOrigin,
        extraPagesId,
        extraThemeProperties,
        keycloakVersion,
    } = params;
    const themeDirPath = pathJoin(keycloakThemeBuildingDirPath, "src", "main", "resources", "theme", themeName, "login");
    let allCssGlobalsToDefine: Record<string, string> = {};
    transformCodebase({
        "destDirPath": urlOrigin === undefined ? pathJoin(themeDirPath, "resources", "build") : reactAppBuildDirPath,
        "srcDirPath": reactAppBuildDirPath,
        "transformSourceCode": ({ filePath, sourceCode }) => {
            //NOTE: Prevent cycles, excludes the folder we generated for debug in public/
            if (
                urlOrigin === undefined &&
                isInside({
                    "dirPath": pathJoin(reactAppBuildDirPath, subDirOfPublicDirBasename),
                    filePath,
                })
            ) {
                return undefined;
            }
            if (urlOrigin === undefined && /\.css?$/i.test(filePath)) {
                const { cssGlobalsToDefine, fixedCssCode } = replaceImportsInCssCode({
                    "cssCode": sourceCode.toString("utf8"),
                });
                allCssGlobalsToDefine = {
                    ...allCssGlobalsToDefine,
                    ...cssGlobalsToDefine,
                };
                return {
                    "modifiedSourceCode": Buffer.from(fixedCssCode, "utf8"),
                };
            }
            if (/\.js?$/i.test(filePath)) {
                const { fixedJsCode } = replaceImportsFromStaticInJsCode({
                    "jsCode": sourceCode.toString("utf8"),
                    urlOrigin,
                });
                return {
                    "modifiedSourceCode": Buffer.from(fixedJsCode, "utf8"),
                };
            }
            return urlOrigin === undefined ? { "modifiedSourceCode": sourceCode } : undefined;
        },
    });
    let doBundleEmailTemplate: boolean;
    email: {
        if (!fs.existsSync(keycloakThemeEmailDirPath)) {
            console.log(
                [
                    `Not bundling email template because ${pathBasename(keycloakThemeEmailDirPath)} does not exist`,
                    `To start customizing the email template, run: 👉 npx create-keycloak-email-directory 👈`,
                ].join("\n"),
            );
            doBundleEmailTemplate = false;
            break email;
        }
        doBundleEmailTemplate = true;
        transformCodebase({
            "srcDirPath": keycloakThemeEmailDirPath,
            "destDirPath": pathJoin(themeDirPath, "..", "email"),
        });
    }
    const { generateFtlFilesCode } = generateFtlFilesCodeFactory({
        "cssGlobalsToDefine": allCssGlobalsToDefine,
        "indexHtmlCode": fs.readFileSync(pathJoin(reactAppBuildDirPath, "index.html")).toString("utf8"),
        urlPathname,
        urlOrigin,
    });
    [...pageIds, ...extraPagesId].forEach(pageId => {
        const { ftlCode } = generateFtlFilesCode({ pageId });
        fs.mkdirSync(themeDirPath, { "recursive": true });
        fs.writeFileSync(pathJoin(themeDirPath, pageId), Buffer.from(ftlCode, "utf8"));
    });
    {
        const tmpDirPath = pathJoin(themeDirPath, "..", "tmp_xxKdLpdIdLd");
        downloadBuiltinKeycloakTheme({
            keycloakVersion,
            "destDirPath": tmpDirPath,
        });
        const themeResourcesDirPath = pathJoin(themeDirPath, "resources");
        transformCodebase({
            "srcDirPath": pathJoin(tmpDirPath, "keycloak", "login", "resources"),
            "destDirPath": themeResourcesDirPath,
        });
        const reactAppPublicDirPath = pathJoin(reactAppBuildDirPath, "..", "public");
        transformCodebase({
            "srcDirPath": pathJoin(tmpDirPath, "keycloak", "common", "resources"),
            "destDirPath": pathJoin(themeResourcesDirPath, pathBasename(resourcesCommonPath)),
        });
        transformCodebase({
            "srcDirPath": themeResourcesDirPath,
            "destDirPath": pathJoin(reactAppPublicDirPath, resourcesPath),
        });
        const keycloakResourcesWithinPublicDirPath = pathJoin(reactAppPublicDirPath, subDirOfPublicDirBasename);
        fs.writeFileSync(
            pathJoin(keycloakResourcesWithinPublicDirPath, "README.txt"),
            Buffer.from(
                ["This is just a test folder that helps develop", "the login and register page without having to run a Keycloak container"].join(" "),
            ),
        );
        fs.writeFileSync(pathJoin(keycloakResourcesWithinPublicDirPath, ".gitignore"), Buffer.from("*", "utf8"));
        child_process.execSync(`rm -r ${tmpDirPath}`);
    }
    fs.writeFileSync(
        pathJoin(themeDirPath, "theme.properties"),
        Buffer.from("parent=keycloak".concat("\n\n", extraThemeProperties.join("\n\n")), "utf8"),
    );
    return { doBundleEmailTemplate };
 }
--- a/src/bin/build-keycloak-theme/generateStartKeycloakTestingContainer.ts
+++ b/src/bin/build-keycloak-theme/generateStartKeycloakTestingContainer.ts
@ -0,0 +1,44 @@
 import * as fs from "fs";
 import { join as pathJoin } from "path";
 generateStartKeycloakTestingContainer.basename = "start_keycloak_testing_container.sh";
 const containerName = "keycloak-testing-container";
 /** Files for being able to run a hot reload keycloak container */
 export function generateStartKeycloakTestingContainer(params: { keycloakVersion: string; themeName: string; keycloakThemeBuildingDirPath: string }) {
    const { themeName, keycloakThemeBuildingDirPath, keycloakVersion } = params;
    fs.writeFileSync(
        pathJoin(keycloakThemeBuildingDirPath, generateStartKeycloakTestingContainer.basename),
        Buffer.from(
            [
                "#!/bin/bash",
                "",
                `docker rm ${containerName} || true`,
                "",
                `cd ${keycloakThemeBuildingDirPath}`,
                "",
                "docker run \\",
                "   -p 8080:8080 \\",
                `   --name ${containerName} \\`,
                "   -e KEYCLOAK_ADMIN=admin \\",
                "   -e KEYCLOAK_ADMIN_PASSWORD=admin \\",
                "   -e JAVA_OPTS=-Dkeycloak.profile=preview \\",
                `   -v ${pathJoin(
                    keycloakThemeBuildingDirPath,
                    "src",
                    "main",
                    "resources",
                    "theme",
                    themeName,
                )}:/opt/keycloak/themes/${themeName}:rw \\`,
                `   -it quay.io/keycloak/keycloak:${keycloakVersion} \\`,
                `   start-dev`,
                "",
            ].join("\n"),
            "utf8",
        ),
        { "mode": 0o755 },
    );
 }
--- a/src/bin/build-keycloak-theme/index.ts
+++ b/src/bin/build-keycloak-theme/index.ts
@ -0,0 +1,8 @@
 #!/usr/bin/env node
 export * from "./build-keycloak-theme";
 import { main } from "./build-keycloak-theme";
 if (require.main === module) {
    main();
 }
--- a/src/bin/build-keycloak-theme/replaceImportFromStatic.ts
+++ b/src/bin/build-keycloak-theme/replaceImportFromStatic.ts
@ -0,0 +1,116 @@
 import * as crypto from "crypto";
 import { ftlValuesGlobalName } from "./ftlValuesGlobalName";
 export function replaceImportsFromStaticInJsCode(params: { jsCode: string; urlOrigin: undefined | string }): { fixedJsCode: string } {
    /* 
    NOTE:
    When we have urlOrigin defined it means that 
    we are building with --external-assets
    so we have to make sur that the fixed js code will run 
    inside and outside keycloak.
    When urlOrigin isn't defined we can assume the fixedJsCode
    will always run in keycloak context.
    */
    const { jsCode, urlOrigin } = params;
    const fixedJsCode = jsCode
        .replace(
            /([a-zA-Z]+)\.([a-zA-Z]+)=function\(([a-zA-Z]+)\){return"static\/js\/"/g,
            (...[, n, u, e]) => `
 			${n}[(function(){
                ${
                    urlOrigin === undefined
                        ? `
                        Object.defineProperty(${n}, "p", {
                            get: function() { return window.${ftlValuesGlobalName}.url.resourcesPath; },
                            set: function (){}
                        });
                    `
                        : `
                    var p= "";
                    Object.defineProperty(${n}, "p", {
                        get: function() { return ("${ftlValuesGlobalName}" in window ? "${urlOrigin}" : "") + p; },
                        set: function (value){ p = value;}
                    });
                    `
                }
 				return "${u}";
 			})()] = function(${e}) { return "${urlOrigin === undefined ? "/build/" : ""}static/js/"`,
        )
        .replace(/([a-zA-Z]+\.[a-zA-Z]+)\+"static\//g, (...[, group]) =>
            urlOrigin === undefined
                ? `window.${ftlValuesGlobalName}.url.resourcesPath + "/build/static/`
                : `("${ftlValuesGlobalName}" in window ? "${urlOrigin}" : "") + ${group} + "static/`,
        )
        //TODO: Write a test case for this
        .replace(/".chunk.css",([a-zA-Z])+=([a-zA-Z]+\.[a-zA-Z]+)\+([a-zA-Z]+),/, (...[, group1, group2, group3]) =>
            urlOrigin === undefined
                ? `".chunk.css",${group1} = window.${ftlValuesGlobalName}.url.resourcesPath + "/build/" + ${group3},`
                : `".chunk.css",${group1} = ("${ftlValuesGlobalName}" in window ? "${urlOrigin}" : "") + ${group2} + ${group3},`,
        );
    return { fixedJsCode };
 }
 export function replaceImportsInInlineCssCode(params: { cssCode: string; urlPathname: string; urlOrigin: undefined | string }): {
    fixedCssCode: string;
 } {
    const { cssCode, urlPathname, urlOrigin } = params;
    const fixedCssCode = cssCode.replace(
        urlPathname === "/" ? /url\(["']?\/([^/][^)"']+)["']?\)/g : new RegExp(`url\\(["']?${urlPathname}([^)"']+)["']?\\)`, "g"),
        (...[, group]) => `url(${urlOrigin === undefined ? "${url.resourcesPath}/build/" + group : params.urlOrigin + urlPathname + group})`,
    );
    return { fixedCssCode };
 }
 export function replaceImportsInCssCode(params: { cssCode: string }): {
    fixedCssCode: string;
    cssGlobalsToDefine: Record<string, string>;
 } {
    const { cssCode } = params;
    const cssGlobalsToDefine: Record<string, string> = {};
    new Set(cssCode.match(/url\(["']?\/[^/][^)"']+["']?\)[^;}]*/g) ?? []).forEach(
        match => (cssGlobalsToDefine["url" + crypto.createHash("sha256").update(match).digest("hex").substring(0, 15)] = match),
    );
    let fixedCssCode = cssCode;
    Object.keys(cssGlobalsToDefine).forEach(
        cssVariableName =>
            //NOTE: split/join pattern ~ replace all
            (fixedCssCode = fixedCssCode.split(cssGlobalsToDefine[cssVariableName]).join(`var(--${cssVariableName})`)),
    );
    return { fixedCssCode, cssGlobalsToDefine };
 }
 export function generateCssCodeToDefineGlobals(params: { cssGlobalsToDefine: Record<string, string>; urlPathname: string }): {
    cssCodeToPrependInHead: string;
 } {
    const { cssGlobalsToDefine, urlPathname } = params;
    return {
        "cssCodeToPrependInHead": [
            ":root {",
            ...Object.keys(cssGlobalsToDefine)
                .map(cssVariableName =>
                    [
                        `--${cssVariableName}:`,
                        cssGlobalsToDefine[cssVariableName].replace(
                            new RegExp(`url\\(${urlPathname.replace(/\//g, "\\/")}`, "g"),
                            "url(${url.resourcesPath}/build/",
                        ),
                    ].join(" "),
                )
                .map(line => `    ${line};`),
            "}",
        ].join("\n"),
    };
 }
--- a/src/bin/constants.ts
+++ b/src/bin/constants.ts
@ -1,12 +0,0 @@
 export const nameOfTheGlobal = "kcContext";
 export const keycloak_resources = "keycloak-resources";
 export const resources_common = "resources-common";
 export const lastKeycloakVersionWithAccountV1 = "21.1.2";
 export const resolvedViteConfigJsonBasename = "vite.json";
 export const basenameOfTheKeycloakifyResourcesDir = "build";
 export const themeTypes = ["login", "account"] as const;
 export const retrocompatPostfix = "_retrocompat";
 export const accountV1ThemeName = "account-v1";
 export type ThemeType = (typeof themeTypes)[number];
--- a/src/bin/copy-keycloak-resources-to-public.ts
+++ b/src/bin/copy-keycloak-resources-to-public.ts
@ -1,112 +0,0 @@
 #!/usr/bin/env node
 import { downloadKeycloakStaticResources, type BuildOptionsLike } from "./keycloakify/generateTheme/downloadKeycloakStaticResources";
 import { join as pathJoin, relative as pathRelative } from "path";
 import { readBuildOptions } from "./keycloakify/buildOptions";
 import { themeTypes, keycloak_resources, lastKeycloakVersionWithAccountV1 } from "./constants";
 import { readThisNpmProjectVersion } from "./tools/readThisNpmProjectVersion";
 import { assert, type Equals } from "tsafe/assert";
 import * as fs from "fs";
 import { rmSync } from "./tools/fs.rmSync";
 export async function copyKeycloakResourcesToPublic(params: { processArgv: string[] }) {
    const { processArgv } = params;
    const buildOptions = readBuildOptions({ processArgv });
    const destDirPath = pathJoin(buildOptions.publicDirPath, keycloak_resources);
    const keycloakifyBuildinfoFilePath = pathJoin(destDirPath, "keycloakify.buildinfo");
    const { keycloakifyBuildinfoRaw } = generateKeycloakifyBuildinfoRaw({
        destDirPath,
        "keycloakifyVersion": readThisNpmProjectVersion(),
        buildOptions
    });
    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 });
    for (const themeType of themeTypes) {
        await downloadKeycloakStaticResources({
            "keycloakVersion": (() => {
                switch (themeType) {
                    case "login":
                        return buildOptions.loginThemeResourcesFromKeycloakVersion;
                    case "account":
                        return lastKeycloakVersionWithAccountV1;
                }
            })(),
            themeType,
            "themeDirPath": destDirPath,
            buildOptions
        });
    }
    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"
            ].join(" ")
        )
    );
    fs.writeFileSync(pathJoin(buildOptions.publicDirPath, keycloak_resources, ".gitignore"), Buffer.from("*", "utf8"));
    fs.writeFileSync(keycloakifyBuildinfoFilePath, Buffer.from(keycloakifyBuildinfoRaw, "utf8"));
 }
 export function generateKeycloakifyBuildinfoRaw(params: {
    destDirPath: string;
    keycloakifyVersion: string;
    buildOptions: BuildOptionsLike & {
        loginThemeResourcesFromKeycloakVersion: string;
    };
 }) {
    const { destDirPath, keycloakifyVersion, buildOptions } = params;
    const { cacheDirPath, npmWorkspaceRootDirPath, loginThemeResourcesFromKeycloakVersion, ...rest } = buildOptions;
    assert<Equals<typeof rest, {}>>(true);
    const keycloakifyBuildinfoRaw = JSON.stringify(
        {
            keycloakifyVersion,
            "buildOptions": {
                loginThemeResourcesFromKeycloakVersion,
                "cacheDirPath": pathRelative(destDirPath, cacheDirPath),
                "npmWorkspaceRootDirPath": pathRelative(destDirPath, npmWorkspaceRootDirPath)
            }
        },
        null,
        2
    );
    return { keycloakifyBuildinfoRaw };
 }
 async function main() {
    await copyKeycloakResourcesToPublic({
        "processArgv": process.argv.slice(2)
    });
 }
 if (require.main === module) {
    main();
 }
--- a/src/bin/create-keycloak-email-directory.ts
+++ b/src/bin/create-keycloak-email-directory.ts
@ -0,0 +1,36 @@
 #!/usr/bin/env node
 import { downloadBuiltinKeycloakTheme } from "./download-builtin-keycloak-theme";
 import { keycloakThemeEmailDirPath } from "./build-keycloak-theme";
 import { join as pathJoin, basename as pathBasename } from "path";
 import { transformCodebase } from "./tools/transformCodebase";
 import { promptKeycloakVersion } from "./promptKeycloakVersion";
 import * as fs from "fs";
 if (require.main === module) {
    (async () => {
        if (fs.existsSync(keycloakThemeEmailDirPath)) {
            console.log(`There is already a ./${pathBasename(keycloakThemeEmailDirPath)} directory in your project. Aborting.`);
            process.exit(-1);
        }
        const { keycloakVersion } = await promptKeycloakVersion();
        const builtinKeycloakThemeTmpDirPath = pathJoin(keycloakThemeEmailDirPath, "..", "tmp_xIdP3_builtin_keycloak_theme");
        downloadBuiltinKeycloakTheme({
            keycloakVersion,
            "destDirPath": builtinKeycloakThemeTmpDirPath,
        });
        transformCodebase({
            "srcDirPath": pathJoin(builtinKeycloakThemeTmpDirPath, "base", "email"),
            "destDirPath": keycloakThemeEmailDirPath,
        });
        console.log(`./${pathBasename(keycloakThemeEmailDirPath)} ready to be customized`);
        fs.rmSync(builtinKeycloakThemeTmpDirPath, { "recursive": true, "force": true });
    })();
 }
--- a/src/bin/download-builtin-keycloak-theme.ts
+++ b/src/bin/download-builtin-keycloak-theme.ts
@ -1,262 +1,33 @@
 #!/usr/bin/env node
 import { keycloakThemeBuildingDirPath } from "./build-keycloak-theme";
 import { join as pathJoin } from "path";
-import { downloadAndUnzip } from "./downloadAndUnzip";
+import { downloadAndUnzip } from "./tools/downloadAndUnzip";
 import { promptKeycloakVersion } from "./promptKeycloakVersion";
 import { getLogger } from "./tools/logger";
 import { readBuildOptions, type BuildOptions } from "./keycloakify/buildOptions";
 import { assert } from "tsafe/assert";
 import * as child_process from "child_process";
 import * as fs from "fs";
 import { rmSync } from "./tools/fs.rmSync";
 import { lastKeycloakVersionWithAccountV1 } from "./constants";
 import { transformCodebase } from "./tools/transformCodebase";
-export type BuildOptionsLike = {
+export function downloadBuiltinKeycloakTheme(params: { keycloakVersion: string; destDirPath: string }) {
-    cacheDirPath: string;
+    const { keycloakVersion, destDirPath } = params;
    npmWorkspaceRootDirPath: string;
 };
-assert<BuildOptions extends BuildOptionsLike ? true : false>();
+    for (const ext of ["", "-community"]) {
-
+        downloadAndUnzip({
-export async function downloadBuiltinKeycloakTheme(params: { keycloakVersion: string; destDirPath: string; buildOptions: BuildOptionsLike }) {
+            "destDirPath": destDirPath,
-    const { keycloakVersion, destDirPath, buildOptions } = params;
+            "url": `https://github.com/keycloak/keycloak/archive/refs/tags/${keycloakVersion}.zip`,
-
+            "pathOfDirToExtractInArchive": `keycloak-${keycloakVersion}/themes/src/main/resources${ext}/theme`,
-    await downloadAndUnzip({
+        });
-        destDirPath,
+    }
        "url": `https://github.com/keycloak/keycloak/archive/refs/tags/${keycloakVersion}.zip`,
        "specificDirsToExtract": ["", "-community"].map(ext => `keycloak-${keycloakVersion}/themes/src/main/resources${ext}/theme`),
        buildOptions,
        "preCacheTransform": {
            "actionCacheId": "npm install and build",
            "action": async ({ destDirPath }) => {
                install_common_node_modules: {
                    const commonResourcesDirPath = pathJoin(destDirPath, "keycloak", "common", "resources");
                    if (!fs.existsSync(commonResourcesDirPath)) {
                        break install_common_node_modules;
                    }
                    if (!fs.existsSync(pathJoin(commonResourcesDirPath, "package.json"))) {
                        break install_common_node_modules;
                    }
                    if (fs.existsSync(pathJoin(commonResourcesDirPath, "node_modules"))) {
                        break install_common_node_modules;
                    }
                    child_process.execSync("npm install --omit=dev", {
                        "cwd": commonResourcesDirPath,
                        "stdio": "ignore"
                    });
                }
                remove_keycloak_v2: {
                    const keycloakV2DirPath = pathJoin(destDirPath, "keycloak.v2");
                    if (!fs.existsSync(keycloakV2DirPath)) {
                        break remove_keycloak_v2;
                    }
                    rmSync(keycloakV2DirPath, { "recursive": true });
                }
                // Note, this is an optimization for reducing the size of the jar
                remove_unused_node_modules: {
                    const nodeModuleDirPath = pathJoin(destDirPath, "keycloak", "common", "resources", "node_modules");
                    if (!fs.existsSync(nodeModuleDirPath)) {
                        break remove_unused_node_modules;
                    }
                    const toDeletePerfixes = [
                        "angular",
                        "bootstrap",
                        "rcue",
                        "font-awesome",
                        "ng-file-upload",
                        pathJoin("patternfly", "dist", "sass"),
                        pathJoin("patternfly", "dist", "less"),
                        pathJoin("patternfly", "dist", "js"),
                        "d3",
                        pathJoin("jquery", "src"),
                        "c3",
                        "core-js",
                        "eonasdan-bootstrap-datetimepicker",
                        "moment",
                        "react",
                        "patternfly-bootstrap-treeview",
                        "popper.js",
                        "tippy.js",
                        "jquery-match-height",
                        "google-code-prettify",
                        "patternfly-bootstrap-combobox",
                        "focus-trap",
                        "tabbable",
                        "scheduler",
                        "@types",
                        "datatables.net",
                        "datatables.net-colreorder",
                        "tslib",
                        "prop-types",
                        "file-selector",
                        "datatables.net-colreorder-bs",
                        "object-assign",
                        "warning",
                        "js-tokens",
                        "loose-envify",
                        "prop-types-extra",
                        "attr-accept",
                        "datatables.net-select",
                        "drmonty-datatables-colvis",
                        "datatables.net-bs",
                        pathJoin("@patternfly", "react"),
                        pathJoin("@patternfly", "patternfly", "docs")
                    ];
                    transformCodebase({
                        "srcDirPath": nodeModuleDirPath,
                        "destDirPath": nodeModuleDirPath,
                        "transformSourceCode": ({ sourceCode, fileRelativePath }) => {
                            if (fileRelativePath.endsWith(".map")) {
                                return undefined;
                            }
                            if (toDeletePerfixes.find(prefix => fileRelativePath.startsWith(prefix)) !== undefined) {
                                return undefined;
                            }
                            if (fileRelativePath.startsWith(pathJoin("patternfly", "dist", "fonts"))) {
                                if (
                                    !fileRelativePath.endsWith(".woff2") &&
                                    !fileRelativePath.endsWith(".woff") &&
                                    !fileRelativePath.endsWith(".ttf")
                                ) {
                                    return undefined;
                                }
                            }
                            return { "modifiedSourceCode": sourceCode };
                        }
                    });
                }
                // Just like node_modules
                remove_unused_lib: {
                    const libDirPath = pathJoin(destDirPath, "keycloak", "common", "resources", "lib");
                    if (!fs.existsSync(libDirPath)) {
                        break remove_unused_lib;
                    }
                    const toDeletePerfixes = ["ui-ace", "filesaver", "fileupload", "angular", "ui-ace", "pficon"];
                    transformCodebase({
                        "srcDirPath": libDirPath,
                        "destDirPath": libDirPath,
                        "transformSourceCode": ({ sourceCode, fileRelativePath }) => {
                            if (fileRelativePath.endsWith(".map")) {
                                return undefined;
                            }
                            if (toDeletePerfixes.find(prefix => fileRelativePath.startsWith(prefix)) !== undefined) {
                                return undefined;
                            }
                            return { "modifiedSourceCode": sourceCode };
                        }
                    });
                }
                last_account_v1_transformations: {
                    if (lastKeycloakVersionWithAccountV1 !== keycloakVersion) {
                        break last_account_v1_transformations;
                    }
                    {
                        const accountCssFilePath = pathJoin(destDirPath, "keycloak", "account", "resources", "css", "account.css");
                        fs.writeFileSync(
                            accountCssFilePath,
                            Buffer.from(fs.readFileSync(accountCssFilePath).toString("utf8").replace("top: -34px;", "top: -34px !important;"), "utf8")
                        );
                    }
                    {
                        const totpFtlFilePath = pathJoin(destDirPath, "base", "account", "totp.ftl");
                        fs.writeFileSync(
                            totpFtlFilePath,
                            Buffer.from(
                                fs
                                    .readFileSync(totpFtlFilePath)
                                    .toString("utf8")
                                    .replace(
                                        [
                                            "                <#list totp.policy.supportedApplications as app>",
                                            "                    <li>${app}</li>",
                                            "                </#list>"
                                        ].join("\n"),
                                        [
                                            "                <#if totp.policy.supportedApplications?has_content>",
                                            "                    <#list totp.policy.supportedApplications as app>",
                                            "                        <li>${app}</li>",
                                            "                    </#list>",
                                            "                </#if>"
                                        ].join("\n")
                                    ),
                                "utf8"
                            )
                        );
                    }
                    // Note, this is an optimization for reducing the size of the jar,
                    // For this version we know exactly which resources are used.
                    {
                        const nodeModulesDirPath = pathJoin(destDirPath, "keycloak", "common", "resources", "node_modules");
                        const toKeepPrefixes = [
                            ...["patternfly.min.css", "patternfly-additions.min.css", "patternfly-additions.min.css"].map(fileBasename =>
                                pathJoin("patternfly", "dist", "css", fileBasename)
                            ),
                            pathJoin("patternfly", "dist", "fonts")
                        ];
                        transformCodebase({
                            "srcDirPath": nodeModulesDirPath,
                            "destDirPath": nodeModulesDirPath,
                            "transformSourceCode": ({ sourceCode, fileRelativePath }) => {
                                if (toKeepPrefixes.find(prefix => fileRelativePath.startsWith(prefix)) === undefined) {
                                    return undefined;
                                }
                                return { "modifiedSourceCode": sourceCode };
                            }
                        });
                    }
                }
            }
        }
    });
 }
 async function main() {
    const buildOptions = readBuildOptions({
        "processArgv": process.argv.slice(2)
    });
    const logger = getLogger({ "isSilent": buildOptions.isSilent });
    const { keycloakVersion } = await promptKeycloakVersion();
    const destDirPath = pathJoin(buildOptions.keycloakifyBuildDirPath, "src", "main", "resources", "theme");
    logger.log(`Downloading builtins theme of Keycloak ${keycloakVersion} here ${destDirPath}`);
    await downloadBuiltinKeycloakTheme({
        keycloakVersion,
        destDirPath,
        buildOptions
    });
 }
 if (require.main === module) {
-    main();
+    (async () => {
        const { keycloakVersion } = await promptKeycloakVersion();
        const destDirPath = pathJoin(keycloakThemeBuildingDirPath, "src", "main", "resources", "theme");
        console.log(`Downloading builtins theme of Keycloak ${keycloakVersion} here ${destDirPath}`);
        downloadBuiltinKeycloakTheme({
            keycloakVersion,
            destDirPath,
        });
    })();
 }
--- a/src/bin/downloadAndUnzip.ts
+++ b/src/bin/downloadAndUnzip.ts
@ -1,203 +0,0 @@
 import { createHash } from "crypto";
 import { mkdir, writeFile, unlink } from "fs/promises";
 import fetch from "make-fetch-happen";
 import { dirname as pathDirname, join as pathJoin, basename as pathBasename } from "path";
 import { assert } from "tsafe/assert";
 import { transformCodebase } from "./tools/transformCodebase";
 import { unzip, zip } from "./tools/unzip";
 import { rm } from "./tools/fs.rm";
 import * as child_process from "child_process";
 import { existsAsync } from "./tools/fs.existsAsync";
 import type { BuildOptions } from "./keycloakify/buildOptions";
 import { getProxyFetchOptions } from "./tools/fetchProxyOptions";
 export type BuildOptionsLike = {
    cacheDirPath: string;
    npmWorkspaceRootDirPath: string;
 };
 assert<BuildOptions extends BuildOptionsLike ? true : false>();
 export async function downloadAndUnzip(params: {
    url: string;
    destDirPath: string;
    specificDirsToExtract?: string[];
    preCacheTransform?: {
        actionCacheId: string;
        action: (params: { destDirPath: string }) => Promise<void>;
    };
    buildOptions: BuildOptionsLike;
 }) {
    const { url, destDirPath, specificDirsToExtract, preCacheTransform, buildOptions } = params;
    const { extractDirPath, zipFilePath } = (() => {
        const zipFileBasenameWithoutExt = generateFileNameFromURL({
            url,
            "preCacheTransform":
                preCacheTransform === undefined
                    ? undefined
                    : {
                          "actionCacheId": preCacheTransform.actionCacheId,
                          "actionFootprint": preCacheTransform.action.toString()
                      }
        });
        const zipFilePath = pathJoin(buildOptions.cacheDirPath, `${zipFileBasenameWithoutExt}.zip`);
        const extractDirPath = pathJoin(buildOptions.cacheDirPath, `tmp_unzip_${zipFileBasenameWithoutExt}`);
        return { zipFilePath, extractDirPath };
    })();
    download_zip_and_transform: {
        if (await existsAsync(zipFilePath)) {
            break download_zip_and_transform;
        }
        const { response, isFromRemoteCache } = await (async () => {
            const proxyFetchOptions = await getProxyFetchOptions({
                "npmWorkspaceRootDirPath": buildOptions.npmWorkspaceRootDirPath
            });
            const response = await fetch(
                `https://github.com/keycloakify/keycloakify/releases/download/v0.0.1/${pathBasename(zipFilePath)}`,
                proxyFetchOptions
            );
            if (response.status === 200) {
                return {
                    response,
                    "isFromRemoteCache": true
                };
            }
            return {
                "response": await fetch(url, proxyFetchOptions),
                "isFromRemoteCache": false
            };
        })();
        await mkdir(pathDirname(zipFilePath), { "recursive": true });
        /**
         * The correct way to fix this is to upgrade node-fetch beyond 3.2.5
         * (see https://github.com/node-fetch/node-fetch/issues/1295#issuecomment-1144061991.)
         * Unfortunately, octokit (a dependency of keycloakify) also uses node-fetch, and
         * does not support node-fetch 3.x. So we stick around with this band-aid until
         * octokit upgrades.
         */
        response.body?.setMaxListeners(Number.MAX_VALUE);
        assert(typeof response.body !== "undefined" && response.body != null);
        await writeFile(zipFilePath, response.body);
        if (isFromRemoteCache) {
            break download_zip_and_transform;
        }
        if (specificDirsToExtract === undefined && preCacheTransform === undefined) {
            break download_zip_and_transform;
        }
        await unzip(zipFilePath, extractDirPath, specificDirsToExtract);
        try {
            await preCacheTransform?.action({
                "destDirPath": extractDirPath
            });
        } catch (error) {
            await Promise.all([rm(extractDirPath, { "recursive": true }), unlink(zipFilePath)]);
            throw error;
        }
        await unlink(zipFilePath);
        await zip(extractDirPath, zipFilePath);
        await rm(extractDirPath, { "recursive": true });
        upload_to_remot_cache_if_admin: {
            const githubToken = process.env["KEYCLOAKIFY_ADMIN_GITHUB_PERSONAL_ACCESS_TOKEN"];
            if (githubToken === undefined) {
                break upload_to_remot_cache_if_admin;
            }
            console.log("uploading to remote cache");
            try {
                child_process.execSync(`which putasset`);
            } catch {
                child_process.execSync(`npm install -g putasset`);
            }
            try {
                child_process.execFileSync("putasset", [
                    "--owner",
                    "keycloakify",
                    "--repo",
                    "keycloakify",
                    "--tag",
                    "v0.0.1",
                    "--filename",
                    zipFilePath,
                    "--token",
                    githubToken
                ]);
            } catch {
                console.log("upload failed, asset probably already exists in remote cache");
            }
        }
    }
    await unzip(zipFilePath, extractDirPath);
    transformCodebase({
        "srcDirPath": extractDirPath,
        "destDirPath": destDirPath
    });
    await rm(extractDirPath, { "recursive": true });
 }
 function generateFileNameFromURL(params: {
    url: string;
    preCacheTransform:
        | {
              actionCacheId: string;
              actionFootprint: string;
          }
        | undefined;
 }): string {
    const { preCacheTransform } = params;
    // Parse the URL
    const url = new URL(params.url);
    // Extract pathname and remove leading slashes
    let fileName = url.pathname.replace(/^\//, "").replace(/\//g, "_");
    // Optionally, add query parameters replacing special characters
    if (url.search) {
        fileName += url.search.replace(/[&=?]/g, "-");
    }
    // Replace any characters that are not valid in filenames
    fileName = fileName.replace(/[^a-zA-Z0-9-_]/g, "");
    // Trim or pad the fileName to a specific length
    fileName = fileName.substring(0, 50);
    add_pre_cache_transform: {
        if (preCacheTransform === undefined) {
            break add_pre_cache_transform;
        }
        // Sanitize actionCacheId the same way as other components
        const sanitizedActionCacheId = preCacheTransform.actionCacheId.replace(/[^a-zA-Z0-9-_]/g, "_");
        fileName += `_${sanitizedActionCacheId}_${createHash("sha256").update(preCacheTransform.actionFootprint).digest("hex").substring(0, 5)}`;
    }
    return fileName;
 }
--- a/src/bin/eject-keycloak-page.ts
+++ b/src/bin/eject-keycloak-page.ts
@ -1,64 +0,0 @@
 #!/usr/bin/env node
 import { getThisCodebaseRootDirPath } from "./tools/getThisCodebaseRootDirPath";
 import cliSelect from "cli-select";
 import { loginThemePageIds, accountThemePageIds, type LoginThemePageId, type AccountThemePageId } from "./keycloakify/generateFtl";
 import { capitalize } from "tsafe/capitalize";
 import { readFile, writeFile } from "fs/promises";
 import { existsSync } from "fs";
 import { join as pathJoin, relative as pathRelative } from "path";
 import { kebabCaseToCamelCase } from "./tools/kebabCaseToSnakeCase";
 import { assert, Equals } from "tsafe/assert";
 import { getThemeSrcDirPath } from "./getThemeSrcDirPath";
 import { themeTypes, type ThemeType } from "./constants";
 import { getReactAppRootDirPath } from "./keycloakify/buildOptions/getReactAppRootDirPath";
 (async () => {
    console.log("Select a theme type");
    const { reactAppRootDirPath } = getReactAppRootDirPath({
        "processArgv": process.argv.slice(2)
    });
    const { value: themeType } = await cliSelect<ThemeType>({
        "values": [...themeTypes]
    }).catch(() => {
        console.log("Aborting");
        process.exit(-1);
    });
    console.log("Select a page you would like to eject");
    const { value: pageId } = await cliSelect<LoginThemePageId | AccountThemePageId>({
        "values": (() => {
            switch (themeType) {
                case "login":
                    return [...loginThemePageIds];
                case "account":
                    return [...accountThemePageIds];
            }
            assert<Equals<typeof themeType, never>>(false);
        })()
    }).catch(() => {
        console.log("Aborting");
        process.exit(-1);
    });
    const pageBasename = capitalize(kebabCaseToCamelCase(pageId)).replace(/ftl$/, "tsx");
    const { themeSrcDirPath } = getThemeSrcDirPath({ reactAppRootDirPath });
    const targetFilePath = pathJoin(themeSrcDirPath, themeType, "pages", pageBasename);
    if (existsSync(targetFilePath)) {
        console.log(`${pageId} is already ejected, ${pathRelative(process.cwd(), targetFilePath)} already exists`);
        process.exit(-1);
    }
    await writeFile(targetFilePath, await readFile(pathJoin(getThisCodebaseRootDirPath(), "src", themeType, "pages", pageBasename)));
    console.log(`${pathRelative(process.cwd(), targetFilePath)} created`);
 })();
--- a/src/bin/generate-i18n-messages.ts
+++ b/src/bin/generate-i18n-messages.ts
@ -0,0 +1,74 @@
 import "minimal-polyfills/Object.fromEntries";
 import * as fs from "fs";
 import { join as pathJoin, relative as pathRelative } from "path";
 import { crawl } from "./tools/crawl";
 import { downloadBuiltinKeycloakTheme } from "./download-builtin-keycloak-theme";
 import { getProjectRoot } from "./tools/getProjectRoot";
 import { rm_rf, rm_r } from "./tools/rm";
 //@ts-ignore
 const propertiesParser = require("properties-parser");
 for (const keycloakVersion of ["11.0.3", "15.0.2", "18.0.1"]) {
    console.log({ keycloakVersion });
    const tmpDirPath = pathJoin(getProjectRoot(), "tmp_xImOef9dOd44");
    rm_rf(tmpDirPath);
    downloadBuiltinKeycloakTheme({
        keycloakVersion,
        "destDirPath": tmpDirPath,
    });
    type Dictionary = { [idiomId: string]: string };
    const record: { [typeOfPage: string]: { [language: string]: Dictionary } } = {};
    {
        const baseThemeDirPath = pathJoin(tmpDirPath, "base");
        crawl(baseThemeDirPath).forEach(filePath => {
            const match = filePath.match(/^([^/]+)\/messages\/messages_([^.]+)\.properties$/);
            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"))).map(
                    ([key, value]: any) => [key, value.replace(/''/g, "'")],
                ),
            );
        });
    }
    rm_r(tmpDirPath);
    const targetDirPath = pathJoin(getProjectRoot(), "src", "lib", "i18n", "generated_kcMessages", keycloakVersion);
    fs.mkdirSync(targetDirPath, { "recursive": true });
    Object.keys(record).forEach(pageType => {
        const filePath = pathJoin(targetDirPath, `${pageType}.ts`);
        fs.writeFileSync(
            filePath,
            Buffer.from(
                [
                    `//This code was automatically generated by running ${pathRelative(getProjectRoot(), __filename)}`,
                    "//PLEASE DO NOT EDIT MANUALLY",
                    "",
                    "/* spell-checker: disable */",
                    `export const kcMessages= ${JSON.stringify(record[pageType], null, 2)};`,
                    "/* spell-checker: enable */",
                ].join("\n"),
                "utf8",
            ),
        );
        console.log(`${filePath} wrote`);
    });
 }
--- a/src/bin/getThemeSrcDirPath.ts
+++ b/src/bin/getThemeSrcDirPath.ts
@ -1,47 +0,0 @@
 import * as fs from "fs";
 import { exclude } from "tsafe";
 import { crawl } from "./tools/crawl";
 import { join as pathJoin } from "path";
 import { themeTypes } from "./constants";
 const themeSrcDirBasenames = ["keycloak-theme", "keycloak_theme"];
 /** Can't catch error, if the directory isn't found, this function will just exit the process with an error message. */
 export function getThemeSrcDirPath(params: { reactAppRootDirPath: string }) {
    const { reactAppRootDirPath } = params;
    const srcDirPath = pathJoin(reactAppRootDirPath, "src");
    const themeSrcDirPath: string | undefined = crawl({ "dirPath": srcDirPath, "returnedPathsType": "relative to dirPath" })
        .map(fileRelativePath => {
            for (const themeSrcDirBasename of themeSrcDirBasenames) {
                const split = fileRelativePath.split(themeSrcDirBasename);
                if (split.length === 2) {
                    return pathJoin(srcDirPath, split[0] + themeSrcDirBasename);
                }
            }
            return undefined;
        })
        .filter(exclude(undefined))[0];
    if (themeSrcDirPath !== undefined) {
        return { themeSrcDirPath };
    }
    for (const themeType of [...themeTypes, "email"]) {
        if (!fs.existsSync(pathJoin(srcDirPath, themeType))) {
            continue;
        }
        return { "themeSrcDirPath": srcDirPath };
    }
    console.error(
        [
            "Can't locate your theme source directory. It should be either: ",
            "src/ or src/keycloak-theme or src/keycloak_theme.",
            "Example in the starter: https://github.com/keycloakify/keycloakify-starter/tree/main/src/keycloak-theme"
        ].join("\n")
    );
    process.exit(-1);
 }
--- a/src/bin/initialize-email-theme.ts
+++ b/src/bin/initialize-email-theme.ts
@ -1,60 +0,0 @@
 #!/usr/bin/env node
 import { downloadBuiltinKeycloakTheme } from "./download-builtin-keycloak-theme";
 import { join as pathJoin, relative as pathRelative } from "path";
 import { transformCodebase } from "./tools/transformCodebase";
 import { promptKeycloakVersion } from "./promptKeycloakVersion";
 import { readBuildOptions } from "./keycloakify/buildOptions";
 import * as fs from "fs";
 import { getLogger } from "./tools/logger";
 import { getThemeSrcDirPath } from "./getThemeSrcDirPath";
 import { rmSync } from "./tools/fs.rmSync";
 export async function main() {
    const buildOptions = readBuildOptions({
        "processArgv": process.argv.slice(2)
    });
    const logger = getLogger({ "isSilent": buildOptions.isSilent });
    const { themeSrcDirPath } = getThemeSrcDirPath({
        "reactAppRootDirPath": buildOptions.reactAppRootDirPath
    });
    const emailThemeSrcDirPath = pathJoin(themeSrcDirPath, "email");
    if (fs.existsSync(emailThemeSrcDirPath)) {
        logger.warn(`There is already a ${pathRelative(process.cwd(), emailThemeSrcDirPath)} directory in your project. Aborting.`);
        process.exit(-1);
    }
    const { keycloakVersion } = await promptKeycloakVersion();
    const builtinKeycloakThemeTmpDirPath = pathJoin(emailThemeSrcDirPath, "..", "tmp_xIdP3_builtin_keycloak_theme");
    await downloadBuiltinKeycloakTheme({
        keycloakVersion,
        "destDirPath": builtinKeycloakThemeTmpDirPath,
        buildOptions
    });
    transformCodebase({
        "srcDirPath": pathJoin(builtinKeycloakThemeTmpDirPath, "base", "email"),
        "destDirPath": emailThemeSrcDirPath
    });
    {
        const themePropertyFilePath = pathJoin(emailThemeSrcDirPath, "theme.properties");
        fs.writeFileSync(themePropertyFilePath, Buffer.from(`parent=base\n${fs.readFileSync(themePropertyFilePath).toString("utf8")}`, "utf8"));
    }
    logger.log(`${pathRelative(process.cwd(), emailThemeSrcDirPath)} ready to be customized, feel free to remove every file you do not customize`);
    rmSync(builtinKeycloakThemeTmpDirPath, { "recursive": true, "force": true });
 }
 if (require.main === module) {
    main();
 }
--- a/src/bin/keycloakify/buildOptions/buildOptions.ts
+++ b/src/bin/keycloakify/buildOptions/buildOptions.ts
@ -1,185 +0,0 @@
 import { parse as urlParse } from "url";
 import { readParsedPackageJson } from "./parsedPackageJson";
 import { join as pathJoin } from "path";
 import parseArgv from "minimist";
 import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath";
 import { readResolvedViteConfig } from "./resolvedViteConfig";
 import * as fs from "fs";
 import { getCacheDirPath } from "./getCacheDirPath";
 import { getReactAppRootDirPath } from "./getReactAppRootDirPath";
 import { getNpmWorkspaceRootDirPath } from "./getNpmWorkspaceRootDirPath";
 /** Consolidated build option gathered form CLI arguments and config in package.json */
 export type BuildOptions = {
    bundler: "vite" | "webpack";
    isSilent: boolean;
    themeVersion: string;
    themeNames: string[];
    extraThemeProperties: string[] | undefined;
    groupId: string;
    artifactId: string;
    doCreateJar: boolean;
    loginThemeResourcesFromKeycloakVersion: string;
    reactAppRootDirPath: string;
    reactAppBuildDirPath: string;
    /** Directory that keycloakify outputs to. Defaults to {cwd}/build_keycloak */
    keycloakifyBuildDirPath: string;
    publicDirPath: string;
    cacheDirPath: string;
    /** If your app is hosted under a subpath, it's the case in CRA if you have "homepage": "https://example.com/my-app" in your package.json
     * In this case the urlPathname will be "/my-app/" */
    urlPathname: string | undefined;
    assetsDirPath: string;
    doBuildRetrocompatAccountTheme: boolean;
    npmWorkspaceRootDirPath: string;
 };
 export function readBuildOptions(params: { processArgv: string[] }): BuildOptions {
    const { processArgv } = params;
    const { reactAppRootDirPath } = getReactAppRootDirPath({ processArgv });
    const { cacheDirPath } = getCacheDirPath({ reactAppRootDirPath });
    const { resolvedViteConfig } = readResolvedViteConfig({ cacheDirPath });
    if (resolvedViteConfig === undefined && fs.existsSync(pathJoin(reactAppRootDirPath, "vite.config.ts"))) {
        throw new Error("Keycloakify's Vite plugin output not found");
    }
    const parsedPackageJson = readParsedPackageJson({ reactAppRootDirPath });
    const themeNames = (() => {
        if (parsedPackageJson.keycloakify?.themeName === undefined) {
            return [
                parsedPackageJson.name
                    .replace(/^@(.*)/, "$1")
                    .split("/")
                    .join("-")
            ];
        }
        if (typeof parsedPackageJson.keycloakify.themeName === "string") {
            return [parsedPackageJson.keycloakify.themeName];
        }
        return parsedPackageJson.keycloakify.themeName;
    })();
    const reactAppBuildDirPath = (() => {
        webpack: {
            if (resolvedViteConfig !== undefined) {
                break webpack;
            }
            if (parsedPackageJson.keycloakify?.reactAppBuildDirPath !== undefined) {
                return getAbsoluteAndInOsFormatPath({
                    "pathIsh": parsedPackageJson.keycloakify?.reactAppBuildDirPath,
                    "cwd": reactAppRootDirPath
                });
            }
            return pathJoin(reactAppRootDirPath, "build");
        }
        return pathJoin(reactAppRootDirPath, resolvedViteConfig.buildDir);
    })();
    const argv = parseArgv(processArgv);
    const { npmWorkspaceRootDirPath } = getNpmWorkspaceRootDirPath({ reactAppRootDirPath });
    return {
        "bundler": resolvedViteConfig !== undefined ? "vite" : "webpack",
        "isSilent": typeof argv["silent"] === "boolean" ? argv["silent"] : false,
        "themeVersion": process.env.KEYCLOAKIFY_THEME_VERSION ?? parsedPackageJson.version ?? "0.0.0",
        themeNames,
        "extraThemeProperties": parsedPackageJson.keycloakify?.extraThemeProperties,
        "groupId": (() => {
            const fallbackGroupId = `${themeNames[0]}.keycloak`;
            return (
                process.env.KEYCLOAKIFY_GROUP_ID ??
                parsedPackageJson.keycloakify?.groupId ??
                (parsedPackageJson.homepage === undefined
                    ? fallbackGroupId
                    : urlParse(parsedPackageJson.homepage)
                          .host?.replace(/:[0-9]+$/, "")
                          ?.split(".")
                          .reverse()
                          .join(".") ?? fallbackGroupId) + ".keycloak"
            );
        })(),
        "artifactId": process.env.KEYCLOAKIFY_ARTIFACT_ID ?? parsedPackageJson.keycloakify?.artifactId ?? `${themeNames[0]}-keycloak-theme`,
        "doCreateJar": parsedPackageJson.keycloakify?.doCreateJar ?? true,
        "loginThemeResourcesFromKeycloakVersion": parsedPackageJson.keycloakify?.loginThemeResourcesFromKeycloakVersion ?? "11.0.3",
        reactAppRootDirPath,
        reactAppBuildDirPath,
        "keycloakifyBuildDirPath": (() => {
            if (parsedPackageJson.keycloakify?.keycloakifyBuildDirPath !== undefined) {
                return getAbsoluteAndInOsFormatPath({
                    "pathIsh": parsedPackageJson.keycloakify?.keycloakifyBuildDirPath,
                    "cwd": reactAppRootDirPath
                });
            }
            return resolvedViteConfig?.buildDir === undefined ? "build_keycloak" : `${resolvedViteConfig.buildDir}_keycloak`;
        })(),
        "publicDirPath": (() => {
            webpack: {
                if (resolvedViteConfig !== undefined) {
                    break webpack;
                }
                if (process.env.PUBLIC_DIR_PATH !== undefined) {
                    return getAbsoluteAndInOsFormatPath({
                        "pathIsh": process.env.PUBLIC_DIR_PATH,
                        "cwd": reactAppRootDirPath
                    });
                }
                return pathJoin(reactAppRootDirPath, "public");
            }
            return pathJoin(reactAppRootDirPath, resolvedViteConfig.publicDir);
        })(),
        cacheDirPath,
        "urlPathname": (() => {
            webpack: {
                if (resolvedViteConfig !== undefined) {
                    break webpack;
                }
                const { homepage } = parsedPackageJson;
                let url: URL | undefined = undefined;
                if (homepage !== undefined) {
                    url = new URL(homepage);
                }
                if (url === undefined) {
                    return undefined;
                }
                const out = url.pathname.replace(/([^/])$/, "$1/");
                return out === "/" ? undefined : out;
            }
            return resolvedViteConfig.urlPathname;
        })(),
        "assetsDirPath": (() => {
            webpack: {
                if (resolvedViteConfig !== undefined) {
                    break webpack;
                }
                return pathJoin(reactAppBuildDirPath, "static");
            }
            return pathJoin(reactAppBuildDirPath, resolvedViteConfig.assetsDir);
        })(),
        "doBuildRetrocompatAccountTheme": parsedPackageJson.keycloakify?.doBuildRetrocompatAccountTheme ?? true,
        npmWorkspaceRootDirPath
    };
 }
--- a/src/bin/keycloakify/buildOptions/getCacheDirPath.ts
+++ b/src/bin/keycloakify/buildOptions/getCacheDirPath.ts
@ -1,25 +0,0 @@
 import { join as pathJoin } from "path";
 import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath";
 import { getNpmWorkspaceRootDirPath } from "./getNpmWorkspaceRootDirPath";
 export function getCacheDirPath(params: { reactAppRootDirPath: string }) {
    const { reactAppRootDirPath } = params;
    const { npmWorkspaceRootDirPath } = getNpmWorkspaceRootDirPath({ reactAppRootDirPath });
    const cacheDirPath = pathJoin(
        (() => {
            if (process.env.XDG_CACHE_HOME !== undefined) {
                return getAbsoluteAndInOsFormatPath({
                    "pathIsh": process.env.XDG_CACHE_HOME,
                    "cwd": reactAppRootDirPath
                });
            }
            return pathJoin(npmWorkspaceRootDirPath, "node_modules", ".cache");
        })(),
        "keycloakify"
    );
    return { cacheDirPath };
 }
--- a/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts
+++ b/src/bin/keycloakify/buildOptions/getNpmWorkspaceRootDirPath.ts
@ -1,49 +0,0 @@
 import * as child_process from "child_process";
 import { join as pathJoin, resolve as pathResolve, sep as pathSep } from "path";
 import { assert } from "tsafe/assert";
 let cache:
    | {
          reactAppRootDirPath: string;
          npmWorkspaceRootDirPath: string;
      }
    | undefined = undefined;
 export function getNpmWorkspaceRootDirPath(params: { reactAppRootDirPath: string }) {
    const { reactAppRootDirPath } = params;
    use_cache: {
        if (cache === undefined || cache.reactAppRootDirPath !== reactAppRootDirPath) {
            break use_cache;
        }
        const { npmWorkspaceRootDirPath } = cache;
        return { npmWorkspaceRootDirPath };
    }
    const npmWorkspaceRootDirPath = (function callee(depth: number): string {
        const cwd = pathResolve(pathJoin(...[reactAppRootDirPath, ...Array(depth).fill("..")]));
        try {
            child_process.execSync("npm config get", { cwd: cwd });
        } catch (error) {
            if (String(error).includes("ENOWORKSPACES")) {
                assert(cwd !== pathSep, "NPM workspace not found");
                return callee(depth + 1);
            }
            throw error;
        }
        return cwd;
    })(0);
    cache = {
        reactAppRootDirPath,
        npmWorkspaceRootDirPath
    };
    return { npmWorkspaceRootDirPath };
 }
--- a/src/bin/keycloakify/buildOptions/getReactAppRootDirPath.ts
+++ b/src/bin/keycloakify/buildOptions/getReactAppRootDirPath.ts
@ -1,23 +0,0 @@
 import parseArgv from "minimist";
 import { getAbsoluteAndInOsFormatPath } from "../../tools/getAbsoluteAndInOsFormatPath";
 export function getReactAppRootDirPath(params: { processArgv: string[] }) {
    const { processArgv } = params;
    const argv = parseArgv(processArgv);
    const reactAppRootDirPath = (() => {
        const arg = argv["project"] ?? argv["p"];
        if (typeof arg !== "string") {
            return process.cwd();
        }
        return getAbsoluteAndInOsFormatPath({
            "pathIsh": arg,
            "cwd": process.cwd()
        });
    })();
    return { reactAppRootDirPath };
 }
--- a/src/bin/keycloakify/buildOptions/index.ts
+++ b/src/bin/keycloakify/buildOptions/index.ts
@ -1 +0,0 @@
 export * from "./buildOptions";
--- a/src/bin/keycloakify/buildOptions/parsedPackageJson.ts
+++ b/src/bin/keycloakify/buildOptions/parsedPackageJson.ts
@ -1,53 +0,0 @@
 import * as fs from "fs";
 import { assert } from "tsafe";
 import type { Equals } from "tsafe";
 import { z } from "zod";
 import { join as pathJoin } from "path";
 export type ParsedPackageJson = {
    name: string;
    version?: string;
    homepage?: string;
    keycloakify?: {
        extraThemeProperties?: string[];
        artifactId?: string;
        groupId?: string;
        doCreateJar?: boolean;
        loginThemeResourcesFromKeycloakVersion?: string;
        reactAppBuildDirPath?: string;
        keycloakifyBuildDirPath?: string;
        themeName?: string | string[];
        doBuildRetrocompatAccountTheme?: boolean;
    };
 };
 const zParsedPackageJson = z.object({
    "name": z.string(),
    "version": z.string().optional(),
    "homepage": z.string().optional(),
    "keycloakify": z
        .object({
            "extraThemeProperties": z.array(z.string()).optional(),
            "artifactId": z.string().optional(),
            "groupId": z.string().optional(),
            "doCreateJar": z.boolean().optional(),
            "loginThemeResourcesFromKeycloakVersion": z.string().optional(),
            "reactAppBuildDirPath": z.string().optional(),
            "keycloakifyBuildDirPath": z.string().optional(),
            "themeName": z.union([z.string(), z.array(z.string())]).optional(),
            "doBuildRetrocompatAccountTheme": z.boolean().optional()
        })
        .optional()
 });
 assert<Equals<ReturnType<(typeof zParsedPackageJson)["parse"]>, ParsedPackageJson>>();
 let parsedPackageJson: undefined | ParsedPackageJson;
 export function readParsedPackageJson(params: { reactAppRootDirPath: string }) {
    const { reactAppRootDirPath } = params;
    if (parsedPackageJson) {
        return parsedPackageJson;
    }
    parsedPackageJson = zParsedPackageJson.parse(JSON.parse(fs.readFileSync(pathJoin(reactAppRootDirPath, "package.json")).toString("utf8")));
    return parsedPackageJson;
 }
--- a/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts
+++ b/src/bin/keycloakify/buildOptions/resolvedViteConfig.ts
@ -1,71 +0,0 @@
 import * as fs from "fs";
 import { assert } from "tsafe";
 import type { Equals } from "tsafe";
 import { z } from "zod";
 import { join as pathJoin } from "path";
 import { resolvedViteConfigJsonBasename } from "../../constants";
 import type { OptionalIfCanBeUndefined } from "../../tools/OptionalIfCanBeUndefined";
 export type ResolvedViteConfig = {
    buildDir: string;
    publicDir: string;
    assetsDir: string;
    urlPathname: string | undefined;
 };
 const zResolvedViteConfig = z.object({
    "buildDir": z.string(),
    "publicDir": z.string(),
    "assetsDir": z.string(),
    "urlPathname": z.string().optional()
 });
 {
    type Got = ReturnType<(typeof zResolvedViteConfig)["parse"]>;
    type Expected = OptionalIfCanBeUndefined<ResolvedViteConfig>;
    assert<Equals<Got, Expected>>();
 }
 export function readResolvedViteConfig(params: { cacheDirPath: string }): {
    resolvedViteConfig: ResolvedViteConfig | undefined;
 } {
    const { cacheDirPath } = params;
    const resolvedViteConfigJsonFilePath = pathJoin(cacheDirPath, resolvedViteConfigJsonBasename);
    if (!fs.existsSync(resolvedViteConfigJsonFilePath)) {
        return { "resolvedViteConfig": undefined };
    }
    const resolvedViteConfig = (() => {
        if (!fs.existsSync(resolvedViteConfigJsonFilePath)) {
            throw new Error("Missing Keycloakify Vite plugin output.");
        }
        let out: ResolvedViteConfig;
        try {
            out = JSON.parse(fs.readFileSync(resolvedViteConfigJsonFilePath).toString("utf8"));
        } catch {
            throw new Error("The output of the Keycloakify Vite plugin is not a valid JSON.");
        }
        try {
            const zodParseReturn = zResolvedViteConfig.parse(out);
            // So that objectKeys from tsafe return the expected result no matter what.
            Object.keys(zodParseReturn)
                .filter(key => !(key in out))
                .forEach(key => {
                    delete (out as any)[key];
                });
        } catch {
            throw new Error("The output of the Keycloakify Vite plugin do not match the expected schema.");
        }
        return out;
    })();
    return { resolvedViteConfig };
 }
--- a/src/bin/keycloakify/generateFtl/ftl_object_to_js_code_declaring_an_object.ftl
+++ b/src/bin/keycloakify/generateFtl/ftl_object_to_js_code_declaring_an_object.ftl
@ -1,696 +0,0 @@
 <script>const _= 
 <#assign pageId="PAGE_ID_xIgLsPgGId9D8e">
 (()=>{
    const out = ${ftl_object_to_js_code_declaring_an_object(.data_model, [])?no_esc};
    out["msg"]= function(){ throw new Error("use import { useKcMessage } from 'keycloakify'"); };
    out["advancedMsg"]= function(){ throw new Error("use import { useKcMessage } from 'keycloakify'"); };
    out["messagesPerField"]= {
        <#assign fieldNames = [ FIELD_NAMES_eKsIY4ZsZ4xeM ]>
        <#attempt>
            <#if profile?? && profile.attributes?? && profile.attributes?is_enumerable>
                <#list profile.attributes as attribute>
                    <#if fieldNames?seq_contains(attribute.name)>
                        <#continue>
                    </#if>
                    <#assign fieldNames += [attribute.name]>
                </#list>
            </#if>
        <#recover>
        </#attempt>
        "printIfExists": function (fieldName, text) {
            <#if !messagesPerField?? || !(messagesPerField?is_hash)>   
                throw new Error("You're not supposed to use messagesPerField.printIfExists in this page");
            <#else>
                <#list fieldNames as fieldName>
                    if(fieldName === "${fieldName}" ){
                        <#-- https://github.com/keycloakify/keycloakify/pull/359 Compat with Keycloak prior v12 -->
                        <#if !messagesPerField.existsError??>
                            <#-- https://github.com/keycloakify/keycloakify/pull/218 -->
                            <#if ('${fieldName}' == 'username' || '${fieldName}' == 'password') && pageId != 'register.ftl' && pageId != 'register-user-profile.ftl'>
                                <#assign doExistMessageForUsernameOrPassword = "">
                                <#attempt>
                                    <#assign doExistMessageForUsernameOrPassword = messagesPerField.exists('username')>
                                <#recover>
                                    <#assign doExistMessageForUsernameOrPassword = true>
                                </#attempt>
                                <#if !doExistMessageForUsernameOrPassword>
                                    <#attempt>
                                        <#assign doExistMessageForUsernameOrPassword = messagesPerField.exists('password')>
                                    <#recover>
                                        <#assign doExistMessageForUsernameOrPassword = true>
                                    </#attempt>
                                </#if>
                                return <#if doExistMessageForUsernameOrPassword>text<#else>undefined</#if>;
                            <#else>
                                <#assign doExistMessageForField = "">
                                <#attempt>
                                    <#assign doExistMessageForField = messagesPerField.exists('${fieldName}')>
                                <#recover>
                                    <#assign doExistMessageForField = true>
                                </#attempt>
                                return <#if doExistMessageForField>text<#else>undefined</#if>;
                            </#if>
                        <#else>
                            <#-- https://github.com/keycloakify/keycloakify/pull/218 -->
                            <#if ('${fieldName}' == 'username' || '${fieldName}' == 'password') && pageId != 'register.ftl' && pageId != 'register-user-profile.ftl'>
                                <#assign doExistErrorOnUsernameOrPassword = "">
                                <#attempt>
                                    <#assign doExistErrorOnUsernameOrPassword = messagesPerField.existsError('username', 'password')>
                                <#recover>
                                    <#assign doExistErrorOnUsernameOrPassword = true>
                                </#attempt>
                                <#if doExistErrorOnUsernameOrPassword>
                                    return text;
                                <#else>
                                    <#assign doExistMessageForField = "">
                                    <#attempt>
                                        <#assign doExistMessageForField = messagesPerField.exists('${fieldName}')>
                                    <#recover>
                                        <#assign doExistMessageForField = true>
                                    </#attempt>
                                    return <#if doExistMessageForField>text<#else>undefined</#if>;
                                </#if>
                            <#else>
                                <#assign doExistMessageForField = "">
                                <#attempt>
                                    <#assign doExistMessageForField = messagesPerField.exists('${fieldName}')>
                                <#recover>
                                    <#assign doExistMessageForField = true>
                                </#attempt>
                                return <#if doExistMessageForField>text<#else>undefined</#if>;
                            </#if>
                        </#if>
                    }
                </#list>
                throw new Error(fieldName + "is probably runtime generated, see: https://docs.keycloakify.dev/limitations#field-names-cant-be-runtime-generated");
            </#if>
        },
        "existsError": function (fieldName) {
            <#if !messagesPerField?? || !(messagesPerField?is_hash)>   
                throw new Error("You're not supposed to use messagesPerField.printIfExists in this page");
            <#else>
                <#list fieldNames as fieldName>
                    if(fieldName === "${fieldName}" ){
                        <#-- https://github.com/keycloakify/keycloakify/pull/359 Compat with Keycloak prior v12 -->
                        <#if !messagesPerField.existsError??>
                            <#-- https://github.com/keycloakify/keycloakify/pull/218 -->
                            <#if ('${fieldName}' == 'username' || '${fieldName}' == 'password') && pageId != 'register.ftl' && pageId != 'register-user-profile.ftl'>
                                <#assign doExistMessageForUsernameOrPassword = "">
                                <#attempt>
                                    <#assign doExistMessageForUsernameOrPassword = messagesPerField.exists('username')>
                                <#recover>
                                    <#assign doExistMessageForUsernameOrPassword = true>
                                </#attempt>
                                <#if !doExistMessageForUsernameOrPassword>
                                    <#attempt>
                                        <#assign doExistMessageForUsernameOrPassword = messagesPerField.exists('password')>
                                    <#recover>
                                        <#assign doExistMessageForUsernameOrPassword = true>
                                    </#attempt>
                                </#if>
                                return <#if doExistMessageForUsernameOrPassword>true<#else>false</#if>;
                            <#else>
                                <#assign doExistMessageForField = "">
                                <#attempt>
                                    <#assign doExistMessageForField = messagesPerField.exists('${fieldName}')>
                                <#recover>
                                    <#assign doExistMessageForField = true>
                                </#attempt>
                                return <#if doExistMessageForField>true<#else>false</#if>;
                            </#if>
                        <#else>
                            <#-- https://github.com/keycloakify/keycloakify/pull/218 -->
                            <#if ('${fieldName}' == 'username' || '${fieldName}' == 'password') && pageId != 'register.ftl' && pageId != 'register-user-profile.ftl'>
                                <#assign doExistErrorOnUsernameOrPassword = "">
                                <#attempt>
                                    <#assign doExistErrorOnUsernameOrPassword = messagesPerField.existsError('username', 'password')>
                                <#recover>
                                    <#assign doExistErrorOnUsernameOrPassword = true>
                                </#attempt>
                                return <#if doExistErrorOnUsernameOrPassword>true<#else>false</#if>;
                            <#else>
                                <#assign doExistErrorMessageForField = "">
                                <#attempt>
                                    <#assign doExistErrorMessageForField = messagesPerField.existsError('${fieldName}')>
                                <#recover>
                                    <#assign doExistErrorMessageForField = true>
                                </#attempt>
                                return <#if doExistErrorMessageForField>true<#else>false</#if>;
                            </#if>
                        </#if>
                    }
                </#list>
                throw new Error(fieldName + "is probably runtime generated, see: https://docs.keycloakify.dev/limitations#field-names-cant-be-runtime-generated");
            </#if>
        },
        "get": function (fieldName) {
            <#if !messagesPerField?? || !(messagesPerField?is_hash)>   
                throw new Error("You're not supposed to use messagesPerField.get in this page");
            <#else>
                <#list fieldNames as fieldName>
                    if(fieldName === "${fieldName}" ){
                        <#-- https://github.com/keycloakify/keycloakify/pull/359 Compat with Keycloak prior v12 -->
                        <#if !messagesPerField.existsError??>
                            <#-- https://github.com/keycloakify/keycloakify/pull/218 -->
                            <#if ('${fieldName}' == 'username' || '${fieldName}' == 'password') && pageId != 'register.ftl' && pageId != 'register-user-profile.ftl'>
                                <#assign doExistMessageForUsernameOrPassword = "">
                                <#attempt>
                                    <#assign doExistMessageForUsernameOrPassword = messagesPerField.exists('username')>
                                <#recover>
                                    <#assign doExistMessageForUsernameOrPassword = true>
                                </#attempt>
                                <#if !doExistMessageForUsernameOrPassword>
                                    <#attempt>
                                        <#assign doExistMessageForUsernameOrPassword = messagesPerField.exists('password')>
                                    <#recover>
                                        <#assign doExistMessageForUsernameOrPassword = true>
                                    </#attempt>
                                </#if>
                                <#if !doExistMessageForUsernameOrPassword>
                                    return "";
                                <#else>
                                    <#attempt>
                                        return "${kcSanitize(msg('invalidUserMessage'))?no_esc}";
                                    <#recover>
                                        return "Invalid username or password.";
                                    </#attempt>
                                </#if>
                            <#else>
                                <#attempt>
                                    return "${messagesPerField.get('${fieldName}')?no_esc}";
                                <#recover>
                                    return "invalid field";
                                </#attempt>
                            </#if>
                        <#else>
                            <#-- https://github.com/keycloakify/keycloakify/pull/218 -->
                            <#if ('${fieldName}' == 'username' || '${fieldName}' == 'password') && pageId != 'register.ftl' && pageId != 'register-user-profile.ftl'>
                                <#assign doExistErrorOnUsernameOrPassword = "">
                                <#attempt>
                                    <#assign doExistErrorOnUsernameOrPassword = messagesPerField.existsError('username', 'password')>
                                <#recover>
                                    <#assign doExistErrorOnUsernameOrPassword = true>
                                </#attempt>
                                <#if doExistErrorOnUsernameOrPassword>
                                    <#attempt>
                                        return "${kcSanitize(msg('invalidUserMessage'))?no_esc}";
                                    <#recover>
                                        return "Invalid username or password.";
                                    </#attempt>
                                <#else>
                                    <#attempt>
                                        return "${messagesPerField.get('${fieldName}')?no_esc}";
                                    <#recover>
                                        return "";
                                    </#attempt>
                                </#if>
                            <#else>
                                <#attempt>
                                    return "${messagesPerField.get('${fieldName}')?no_esc}";
                                <#recover>
                                    return "invalid field";
                                </#attempt>
                            </#if>
                        </#if>
                    }
                </#list>
                throw new Error(fieldName + "is probably runtime generated, see: https://docs.keycloakify.dev/limitations#field-names-cant-be-runtime-generated");
            </#if>
        },
        "exists": function (fieldName) {
            <#if !messagesPerField?? || !(messagesPerField?is_hash)>   
                throw new Error("You're not supposed to use messagesPerField.exists in this page");
            <#else>
                <#list fieldNames as fieldName>
                    if(fieldName === "${fieldName}" ){
                        <#-- https://github.com/keycloakify/keycloakify/pull/359 Compat with Keycloak prior v12 -->
                        <#if !messagesPerField.existsError??>
                            <#-- https://github.com/keycloakify/keycloakify/pull/218 -->
                            <#if ('${fieldName}' == 'username' || '${fieldName}' == 'password') && pageId != 'register.ftl' && pageId != 'register-user-profile.ftl'>
                                <#assign doExistMessageForUsernameOrPassword = "">
                                <#attempt>
                                    <#assign doExistMessageForUsernameOrPassword = messagesPerField.exists('username')>
                                <#recover>
                                    <#assign doExistMessageForUsernameOrPassword = true>
                                </#attempt>
                                <#if !doExistMessageForUsernameOrPassword>
                                    <#attempt>
                                        <#assign doExistMessageForUsernameOrPassword = messagesPerField.exists('password')>
                                    <#recover>
                                        <#assign doExistMessageForUsernameOrPassword = true>
                                    </#attempt>
                                </#if>
                                return <#if doExistMessageForUsernameOrPassword>true<#else>false</#if>;
                            <#else>
                                <#assign doExistMessageForField = "">
                                <#attempt>
                                    <#assign doExistMessageForField = messagesPerField.exists('${fieldName}')>
                                <#recover>
                                    <#assign doExistMessageForField = true>
                                </#attempt>
                                return <#if doExistMessageForField>true<#else>false</#if>;
                            </#if>
                        <#else>
                            <#-- https://github.com/keycloakify/keycloakify/pull/218 -->
                            <#if ('${fieldName}' == 'username' || '${fieldName}' == 'password') && pageId != 'register.ftl' && pageId != 'register-user-profile.ftl'>
                                <#assign doExistErrorOnUsernameOrPassword = "">
                                <#attempt>
                                    <#assign doExistErrorOnUsernameOrPassword = messagesPerField.existsError('username', 'password')>
                                <#recover>
                                    <#assign doExistErrorOnUsernameOrPassword = true>
                                </#attempt>
                                return <#if doExistErrorOnUsernameOrPassword>true<#else>false</#if>;
                            <#else>
                                <#assign doExistErrorMessageForField = "">
                                <#attempt>
                                    <#assign doExistErrorMessageForField = messagesPerField.exists('${fieldName}')>
                                <#recover>
                                    <#assign doExistErrorMessageForField = true>
                                </#attempt>
                                return <#if doExistErrorMessageForField>true<#else>false</#if>;
                            </#if>
                        </#if>
                    }
                </#list>
                throw new Error(fieldName + "is probably runtime generated, see: https://docs.keycloakify.dev/limitations#field-names-cant-be-runtime-generated");
            </#if>
        }
    };
    <#if account??>
        out["url"]["getLogoutUrl"] = function () {
            <#attempt>
                return "${url.getLogoutUrl()}";
            <#recover>
            </#attempt>
        };
    </#if>
    out["keycloakifyVersion"] = "KEYCLOAKIFY_VERSION_xEdKd3xEdr";
    out["themeVersion"] = "KEYCLOAKIFY_THEME_VERSION_sIgKd3xEdr3dx";
    out["themeType"] = "KEYCLOAKIFY_THEME_TYPE_dExKd3xEdr";
    out["themeName"] = "KEYCLOAKIFY_THEME_NAME_cXxKd3xEer";
    out["pageId"] = "${pageId}";
    try {
        out["url"]["resourcesCommonPath"] = out["url"]["resourcesPath"] + "/" + "RESOURCES_COMMON_cLsLsMrtDkpVv";
    } catch(error) {
    }
    return out;
 })()
 <#function ftl_object_to_js_code_declaring_an_object object path>
        <#local isHash = "">
        <#attempt>
            <#local isHash = object?is_hash || object?is_hash_ex>
        <#recover>
            <#return "ABORT: Can't evaluate if " + path?join(".") + " is hash">
        </#attempt>
        <#if isHash>
            <#if path?size gt 10>
                <#return "ABORT: Too many recursive calls">
            </#if>
            <#local keys = "">
            <#attempt>
                <#local keys = object?keys>
            <#recover>
                <#return "ABORT: We can't list keys on this object">
            </#attempt>
            <#local out_seq = []>
            <#list keys as key>
                <#if ["class","declaredConstructors","superclass","declaringClass" ]?seq_contains(key) >
                    <#continue>
                </#if>
                <#if 
                    (
                        ["loginUpdatePasswordUrl", "loginUpdateProfileUrl", "loginUsernameReminderUrl", "loginUpdateTotpUrl"]?seq_contains(key) && 
                        are_same_path(path, ["url"])
                    ) || (
                        key == "updateProfileCtx" && 
                        are_same_path(path, [])
                    ) || (
                        <#-- https://github.com/keycloakify/keycloakify/pull/65#issuecomment-991896344 (reports with saml-post-form.ftl) -->
                        <#-- https://github.com/keycloakify/keycloakify/issues/91#issue-1212319466 (reports with error.ftl and Kc18) -->
                        <#-- https://github.com/keycloakify/keycloakify/issues/109#issuecomment-1134610163 -->
                        <#-- https://github.com/keycloakify/keycloakify/issues/357 -->
                        key == "loginAction" && 
                        are_same_path(path, ["url"]) && 
                        ["saml-post-form.ftl", "error.ftl", "info.ftl", "login-oauth-grant.ftl", "logout-confirm.ftl"]?seq_contains(pageId) &&
                        !(auth?has_content && auth.showTryAnotherWayLink())
                    ) || (
                        <#-- https://github.com/keycloakify/keycloakify/issues/362 -->
                        ["secretData", "value"]?seq_contains(key) && 
                        are_same_path(path, [ "totp", "otpCredentials", "*" ])
                    ) || (
                        ["contextData", "idpConfig", "idp", "authenticationSession"]?seq_contains(key) &&
                        are_same_path(path, ["brokerContext"]) &&
                        ["login-idp-link-confirm.ftl", "login-idp-link-email.ftl" ]?seq_contains(pageId)
                    ) || (
                        key == "identityProviderBrokerCtx" && 
                        are_same_path(path, []) &&
                        ["login-idp-link-confirm.ftl", "login-idp-link-email.ftl" ]?seq_contains(pageId)
                    ) ||  (
                        ["masterAdminClient", "delegateForUpdate", "defaultRole"]?seq_contains(key) &&
                        are_same_path(path, ["realm"])
                    ) || (
                        "error.ftl" == pageId &&
                        are_same_path(path, ["realm"]) &&
                        !["name", "displayName", "displayNameHtml", "internationalizationEnabled", "registrationEmailAsUsername" ]?seq_contains(key)
                    ) || (
                        "applications.ftl" == pageId &&
                        are_same_path(path, ["applications", "applications", "*", "client", "realm"])
                    ) || (
                        "applications.ftl" == pageId &&
                        "masterAdminClient" == key
                    )
                >
                    <#local out_seq += ["/*If you need '" + key + "' on " + pageId + ", please submit an issue to the Keycloakify repo*/"]>
                    <#continue>
                </#if>
                <#if pageId == "register.ftl" && key == "attemptedUsername" && are_same_path(path, ["auth"])>
                    <#attempt>
                        <#-- https://github.com/keycloak/keycloak/blob/3a2bf0c04bcde185e497aaa32d0bb7ab7520cf4a/themes/src/main/resources/theme/base/login/template.ftl#L63 -->
                        <#-- https://github.com/keycloakify/keycloakify/discussions/406 -->
                        <#if !(auth?has_content && auth.showUsername() && !auth.showResetCredentials())>
                            <#continue>
                        </#if>
                    <#recover>
                    </#attempt>
                </#if>
                <#attempt>
                    <#if !object[key]??>
                        <#continue>
                    </#if>
                <#recover>
                    <#local out_seq += ["/*Couldn't test if '" + key + "' is available on this object*/"]>
                    <#continue>
                </#attempt>
                <#local propertyValue = "">
                <#attempt>
                    <#local propertyValue = object[key]>
                <#recover>
                    <#local out_seq += ["/*Couldn't dereference '" + key + "' on this object*/"]>
                    <#continue>
                </#attempt>
                <#local rec_out = ftl_object_to_js_code_declaring_an_object(propertyValue, path + [ key ])>
                <#if rec_out?starts_with("ABORT:")>
                    <#local errorMessage = rec_out?remove_beginning("ABORT:")>
                    <#if errorMessage != " It's a method" >
                        <#local out_seq += ["/*" + key + ": " + errorMessage + "*/"]>
                    </#if>
                    <#continue>
                </#if>
                <#local out_seq +=  ['"' + key + '": ' + rec_out + ","]>
            </#list>
            <#return (["{"] + out_seq?map(str -> ""?right_pad(4 * (path?size + 1)) + str) + [ ""?right_pad(4 * path?size) + "}"])?join("\n")>
        </#if>
        <#local isMethod = "">
        <#attempt>
            <#local isMethod = object?is_method>
        <#recover>
            <#return "ABORT: Can't test if it'sa method.">
        </#attempt>
        <#if isMethod>
            <#if are_same_path(path, ["auth", "showUsername"])>
                <#attempt>
                    <#return auth.showUsername()?c>
                <#recover>
                    <#return "ABORT: Couldn't evaluate auth.showUsername()">
                </#attempt>
            </#if>
            <#if are_same_path(path, ["auth", "showResetCredentials"])>
                <#attempt>
                    <#return auth.showResetCredentials()?c>
                <#recover>
                    <#return "ABORT: Couldn't evaluate auth.showResetCredentials()">
                </#attempt>
            </#if>
            <#if are_same_path(path, ["auth", "showTryAnotherWayLink"])>
                <#attempt>
                    <#return auth.showTryAnotherWayLink()?c>
                <#recover>
                    <#return "ABORT: Couldn't evaluate auth.showTryAnotherWayLink()">
                </#attempt>
            </#if>
            <#return "ABORT: It's a method">
        </#if>
        <#local isBoolean = "">
        <#attempt>
            <#local isBoolean = object?is_boolean>
        <#recover>
            <#return "ABORT: Can't test if it's a boolean">
        </#attempt>
        <#if isBoolean>
            <#return object?c>
        </#if>
        <#local isEnumerable = "">
        <#attempt>
            <#local isEnumerable = object?is_enumerable>
        <#recover>
            <#return "ABORT: Can't test if it's an enumerable">
        </#attempt>
        <#if isEnumerable>
            <#local out_seq = []>
            <#local i = 0>
            <#list object as array_item>
                <#if !array_item??>
                    <#local out_seq += ["null,"]>
                    <#continue>
                </#if>
                <#local rec_out = ftl_object_to_js_code_declaring_an_object(array_item, path + [ i ])>
                <#local i = i + 1>
                <#if rec_out?starts_with("ABORT:")>
                    <#local errorMessage = rec_out?remove_beginning("ABORT:")>
                    <#if errorMessage != " It's a method" >
                        <#local out_seq += ["/*" + i?string + ": " + errorMessage + "*/"]>
                    </#if>
                    <#continue>
                </#if>
                <#local out_seq += [rec_out + ","]>
            </#list>
            <#return (["["] + out_seq?map(str -> ""?right_pad(4 * (path?size + 1)) + str) + [ ""?right_pad(4 * path?size) + "]"])?join("\n")>
        </#if>
        <#local isDate = "">
        <#attempt>
            <#local isDate = object?is_date_like>
        <#recover>
            <#return "ABORT: Can't test if it's a date">
        </#attempt>
        <#if isDate>
            <#return '"' + object?datetime?iso_utc + '"'>
        </#if>
        <#attempt>
            <#return '"' + object?js_string + '"'>;
        <#recover>
        </#attempt>
        <#return "ABORT: Couldn't convert into string non hash, non method, non boolean, non enumerable object">
 </#function>
 <#function are_same_path path searchedPath>
    <#if path?size != searchedPath?size>
        <#return false>
    </#if>
    <#local i=0>
    <#list path as property>
        <#local searchedProperty=searchedPath[i]>
        <#if searchedProperty?is_string && searchedProperty == "*">
            <#continue>
        </#if>
        <#if searchedProperty?is_string && !property?is_string>
            <#return false>
        </#if>
        <#if searchedProperty?is_number && !property?is_number>
            <#return false>
        </#if>
        <#if searchedProperty?string != property?string>
            <#return false>
        </#if>
        <#local i+= 1>
    </#list>
    <#return true>
 </#function>
 </script>
--- a/src/bin/keycloakify/generateFtl/generateFtl.ts
+++ b/src/bin/keycloakify/generateFtl/generateFtl.ts
@ -1,170 +0,0 @@
 import cheerio from "cheerio";
 import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode";
 import { generateCssCodeToDefineGlobals } from "../replacers/replaceImportsInCssCode";
 import { replaceImportsInInlineCssCode } from "../replacers/replaceImportsInInlineCssCode";
 import * as fs from "fs";
 import { join as pathJoin } from "path";
 import { objectKeys } from "tsafe/objectKeys";
 import type { BuildOptions } from "../buildOptions";
 import { assert } from "tsafe/assert";
 import { type ThemeType, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir, resources_common } from "../../constants";
 export type BuildOptionsLike = {
    bundler: "vite" | "webpack";
    themeVersion: string;
    urlPathname: string | undefined;
    reactAppBuildDirPath: string;
    assetsDirPath: string;
 };
 assert<BuildOptions extends BuildOptionsLike ? true : false>();
 export function generateFtlFilesCodeFactory(params: {
    themeName: string;
    indexHtmlCode: string;
    cssGlobalsToDefine: Record<string, string>;
    buildOptions: BuildOptionsLike;
    keycloakifyVersion: string;
    themeType: ThemeType;
    fieldNames: string[];
 }) {
    const { themeName, cssGlobalsToDefine, indexHtmlCode, buildOptions, keycloakifyVersion, themeType, fieldNames } = params;
    const $ = cheerio.load(indexHtmlCode);
    fix_imports_statements: {
        $("script:not([src])").each((...[, element]) => {
            const jsCode = $(element).html();
            assert(jsCode !== null);
            const { fixedJsCode } = replaceImportsInJsCode({ jsCode, buildOptions });
            $(element).text(fixedJsCode);
        });
        $("style").each((...[, element]) => {
            const cssCode = $(element).html();
            assert(cssCode !== null);
            const { fixedCssCode } = replaceImportsInInlineCssCode({
                cssCode,
                buildOptions
            });
            $(element).text(fixedCssCode);
        });
        (
            [
                ["link", "href"],
                ["script", "src"]
            ] as const
        ).forEach(([selector, attrName]) =>
            $(selector).each((...[, element]) => {
                const href = $(element).attr(attrName);
                if (href === undefined) {
                    return;
                }
                $(element).attr(
                    attrName,
                    href.replace(
                        new RegExp(`^${(buildOptions.urlPathname ?? "/").replace(/\//g, "\\/")}`),
                        `\${url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}/`
                    )
                );
            })
        );
        if (Object.keys(cssGlobalsToDefine).length !== 0) {
            $("head").prepend(
                [
                    "",
                    "<style>",
                    generateCssCodeToDefineGlobals({
                        cssGlobalsToDefine,
                        buildOptions
                    }).cssCodeToPrependInHead,
                    "</style>",
                    ""
                ].join("\n")
            );
        }
    }
    //FTL is no valid html, we can't insert with cheerio, we put placeholder for injecting later.
    const replaceValueBySearchValue = {
        '{ "x": "vIdLqMeOed9sdLdIdOxdK0d" }': fs
            .readFileSync(pathJoin(__dirname, "ftl_object_to_js_code_declaring_an_object.ftl"))
            .toString("utf8")
            .match(/^<script>const _=((?:.|\n)+)<\/script>[\n]?$/)![1]
            .replace("FIELD_NAMES_eKsIY4ZsZ4xeM", fieldNames.map(name => `"${name}"`).join(", "))
            .replace("KEYCLOAKIFY_VERSION_xEdKd3xEdr", keycloakifyVersion)
            .replace("KEYCLOAKIFY_THEME_VERSION_sIgKd3xEdr3dx", buildOptions.themeVersion)
            .replace("KEYCLOAKIFY_THEME_TYPE_dExKd3xEdr", themeType)
            .replace("KEYCLOAKIFY_THEME_NAME_cXxKd3xEer", themeName)
            .replace("RESOURCES_COMMON_cLsLsMrtDkpVv", resources_common),
        "<!-- xIdLqMeOedErIdLsPdNdI9dSlxI -->": [
            "<#if scripts??>",
            "    <#list scripts as script>",
            '        <script src="${script}" type="text/javascript"></script>',
            "    </#list>",
            "</#if>"
        ].join("\n")
    };
    $("head").prepend(
        [
            "<script>",
            `    window.${nameOfTheGlobal}= ${objectKeys(replaceValueBySearchValue)[0]};`,
            "</script>",
            "",
            objectKeys(replaceValueBySearchValue)[1]
        ].join("\n")
    );
    // Remove part of the document marked as ignored.
    {
        const startTags = $('meta[name="keycloakify-ignore-start"]');
        startTags.each((...[, startTag]) => {
            const $startTag = $(startTag);
            const $endTag = $startTag.nextAll('meta[name="keycloakify-ignore-end"]').first();
            if ($endTag.length) {
                let currentNode = $startTag.next();
                while (currentNode.length && !currentNode.is($endTag)) {
                    currentNode.remove();
                    currentNode = $startTag.next();
                }
                $startTag.remove();
                $endTag.remove();
            }
        });
    }
    const partiallyFixedIndexHtmlCode = $.html();
    function generateFtlFilesCode(params: { pageId: string }): {
        ftlCode: string;
    } {
        const { pageId } = params;
        const $ = cheerio.load(partiallyFixedIndexHtmlCode);
        let ftlCode = $.html();
        Object.entries({
            ...replaceValueBySearchValue,
            "PAGE_ID_xIgLsPgGId9D8e": pageId
        }).map(([searchValue, replaceValue]) => (ftlCode = ftlCode.replace(searchValue, replaceValue)));
        return { ftlCode };
    }
    return { generateFtlFilesCode };
 }
--- a/src/bin/keycloakify/generateFtl/pageId.ts
+++ b/src/bin/keycloakify/generateFtl/pageId.ts
@ -1,33 +0,0 @@
 export const loginThemePageIds = [
    "login.ftl",
    "login-username.ftl",
    "login-password.ftl",
    "webauthn-authenticate.ftl",
    "register.ftl",
    "register-user-profile.ftl",
    "info.ftl",
    "error.ftl",
    "login-reset-password.ftl",
    "login-verify-email.ftl",
    "terms.ftl",
    "login-oauth2-device-verify-user-code.ftl",
    "login-oauth-grant.ftl",
    "login-otp.ftl",
    "login-update-profile.ftl",
    "login-update-password.ftl",
    "login-idp-link-confirm.ftl",
    "login-idp-link-email.ftl",
    "login-page-expired.ftl",
    "login-config-totp.ftl",
    "logout-confirm.ftl",
    "update-user-profile.ftl",
    "idp-review-user-profile.ftl",
    "update-email.ftl",
    "select-authenticator.ftl",
    "saml-post-form.ftl"
 ] as const;
 export const accountThemePageIds = ["password.ftl", "account.ftl"] as const;
 export type LoginThemePageId = (typeof loginThemePageIds)[number];
 export type AccountThemePageId = (typeof accountThemePageIds)[number];
--- a/src/bin/keycloakify/generatePom.ts
+++ b/src/bin/keycloakify/generatePom.ts
@ -1,70 +0,0 @@
 import { assert } from "tsafe/assert";
 import { Reflect } from "tsafe/Reflect";
 import type { BuildOptions } from "./buildOptions";
 type BuildOptionsLike = {
    groupId: string;
    artifactId: string;
    themeVersion: string;
    keycloakifyBuildDirPath: string;
 };
 {
    const buildOptions = Reflect<BuildOptions>();
    assert<typeof buildOptions extends BuildOptionsLike ? true : false>();
 }
 export function generatePom(params: { buildOptions: BuildOptionsLike }) {
    const { buildOptions } = params;
    const { pomFileCode } = (function generatePomFileCode(): {
        pomFileCode: string;
    } {
        const pomFileCode = [
            `<?xml version="1.0"?>`,
            `<project xmlns="http://maven.apache.org/POM/4.0.0"`,
            `	 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"`,
            `	 xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">`,
            `  <modelVersion>4.0.0</modelVersion>`,
            `	<groupId>${buildOptions.groupId}</groupId>`,
            `	<artifactId>${buildOptions.artifactId}</artifactId>`,
            `	<version>${buildOptions.themeVersion}</version>`,
            `	<name>${buildOptions.artifactId}</name>`,
            `  <description />`,
            `  <packaging>jar</packaging>`,
            `  <properties>`,
            `    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>`,
            `  </properties>`,
            `  <build>`,
            `    <plugins>`,
            `      <plugin>`,
            `        <groupId>org.apache.maven.plugins</groupId>`,
            `        <artifactId>maven-shade-plugin</artifactId>`,
            `	     <version>3.5.1</version>`,
            `        <executions>`,
            `          <execution>`,
            `            <phase>package</phase>`,
            `            <goals>`,
            `              <goal>shade</goal>`,
            `            </goals>`,
            `          </execution>`,
            `        </executions>`,
            `      </plugin>`,
            `    </plugins>`,
            `  </build>`,
            `  <dependencies>`,
            `    <dependency>`,
            `      <groupId>io.phasetwo.keycloak</groupId>`,
            `      <artifactId>keycloak-account-v1</artifactId>`,
            `      <version>0.1</version>`,
            `    </dependency>`,
            `  </dependencies>`,
            `</project>`
        ].join("\n");
        return { pomFileCode };
    })();
    return { pomFileCode };
 }
--- a/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts
+++ b/src/bin/keycloakify/generateStartKeycloakTestingContainer.ts
@ -1,65 +0,0 @@
 import * as fs from "fs";
 import { join as pathJoin, relative as pathRelative, basename as pathBasename } from "path";
 import { assert } from "tsafe/assert";
 import { Reflect } from "tsafe/Reflect";
 import type { BuildOptions } from "./buildOptions";
 export type BuildOptionsLike = {
    keycloakifyBuildDirPath: string;
 };
 {
    const buildOptions = Reflect<BuildOptions>();
    assert<typeof buildOptions extends BuildOptionsLike ? true : false>();
 }
 generateStartKeycloakTestingContainer.basename = "start_keycloak_testing_container.sh";
 const containerName = "keycloak-testing-container";
 /** Files for being able to run a hot reload keycloak container */
 export function generateStartKeycloakTestingContainer(params: { jarFilePath: string; keycloakVersion: string; buildOptions: BuildOptionsLike }) {
    const { jarFilePath, keycloakVersion, buildOptions } = params;
    const themeRelativeDirPath = pathJoin("src", "main", "resources", "theme");
    const themeDirPath = pathJoin(buildOptions.keycloakifyBuildDirPath, themeRelativeDirPath);
    fs.writeFileSync(
        pathJoin(buildOptions.keycloakifyBuildDirPath, generateStartKeycloakTestingContainer.basename),
        Buffer.from(
            [
                "#!/usr/bin/env bash",
                "",
                `docker rm ${containerName} || true`,
                "",
                `cd "${buildOptions.keycloakifyBuildDirPath}"`,
                "",
                "docker run \\",
                "   -p 8080:8080 \\",
                `   --name ${containerName} \\`,
                "   -e KEYCLOAK_ADMIN=admin \\",
                "   -e KEYCLOAK_ADMIN_PASSWORD=admin \\",
                `   -v "${pathJoin(
                    "$(pwd)",
                    pathRelative(buildOptions.keycloakifyBuildDirPath, jarFilePath)
                )}":"/opt/keycloak/providers/${pathBasename(jarFilePath)}" \\`,
                ...fs
                    .readdirSync(themeDirPath)
                    .filter(name => fs.lstatSync(pathJoin(themeDirPath, name)).isDirectory())
                    .map(
                        themeName =>
                            `   -v "${pathJoin("$(pwd)", themeRelativeDirPath, themeName).replace(
                                /\\/g,
                                "/"
                            )}":"/opt/keycloak/themes/${themeName}":rw \\`
                    ),
                `   -it quay.io/keycloak/keycloak:${keycloakVersion} \\`,
                `   start-dev --features=declarative-user-profile`,
                ""
            ].join("\n"),
            "utf8"
        ),
        { "mode": 0o755 }
    );
 }
--- a/src/bin/keycloakify/generateTheme/bringInAccountV1.ts
+++ b/src/bin/keycloakify/generateTheme/bringInAccountV1.ts
@ -1,84 +0,0 @@
 import * as fs from "fs";
 import { join as pathJoin } from "path";
 import { assert } from "tsafe/assert";
 import { Reflect } from "tsafe/Reflect";
 import type { BuildOptions } from "../buildOptions";
 import { resources_common, lastKeycloakVersionWithAccountV1, accountV1ThemeName } from "../../constants";
 import { downloadBuiltinKeycloakTheme } from "../../download-builtin-keycloak-theme";
 import { transformCodebase } from "../../tools/transformCodebase";
 import { rmSync } from "../../tools/fs.rmSync";
 type BuildOptionsLike = {
    keycloakifyBuildDirPath: string;
    cacheDirPath: string;
    npmWorkspaceRootDirPath: string;
 };
 {
    const buildOptions = Reflect<BuildOptions>();
    assert<typeof buildOptions extends BuildOptionsLike ? true : false>();
 }
 export async function bringInAccountV1(params: { buildOptions: BuildOptionsLike }) {
    const { buildOptions } = params;
    const builtinKeycloakThemeTmpDirPath = pathJoin(buildOptions.keycloakifyBuildDirPath, "..", "tmp_yxdE2_builtin_keycloak_theme");
    await downloadBuiltinKeycloakTheme({
        "destDirPath": builtinKeycloakThemeTmpDirPath,
        "keycloakVersion": lastKeycloakVersionWithAccountV1,
        buildOptions
    });
    const accountV1DirPath = pathJoin(buildOptions.keycloakifyBuildDirPath, "src", "main", "resources", "theme", accountV1ThemeName, "account");
    transformCodebase({
        "srcDirPath": pathJoin(builtinKeycloakThemeTmpDirPath, "base", "account"),
        "destDirPath": accountV1DirPath
    });
    transformCodebase({
        "srcDirPath": pathJoin(builtinKeycloakThemeTmpDirPath, "keycloak", "account", "resources"),
        "destDirPath": pathJoin(accountV1DirPath, "resources")
    });
    transformCodebase({
        "srcDirPath": pathJoin(builtinKeycloakThemeTmpDirPath, "keycloak", "common", "resources"),
        "destDirPath": pathJoin(accountV1DirPath, "resources", resources_common)
    });
    rmSync(builtinKeycloakThemeTmpDirPath, { "recursive": true });
    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"
        )
    );
 }
--- a/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts
+++ b/src/bin/keycloakify/generateTheme/downloadKeycloakStaticResources.ts
@ -1,49 +0,0 @@
 import { transformCodebase } from "../../tools/transformCodebase";
 import { join as pathJoin } from "path";
 import { downloadBuiltinKeycloakTheme } from "../../download-builtin-keycloak-theme";
 import { resources_common, type ThemeType } from "../../constants";
 import { BuildOptions } from "../buildOptions";
 import { assert } from "tsafe/assert";
 import * as crypto from "crypto";
 import { rmSync } from "../../tools/fs.rmSync";
 export type BuildOptionsLike = {
    cacheDirPath: string;
    npmWorkspaceRootDirPath: string;
 };
 assert<BuildOptions extends BuildOptionsLike ? true : false>();
 export async function downloadKeycloakStaticResources(params: {
    themeType: ThemeType;
    themeDirPath: string;
    keycloakVersion: string;
    buildOptions: BuildOptionsLike;
 }) {
    const { themeType, themeDirPath, keycloakVersion, buildOptions } = params;
    const tmpDirPath = pathJoin(
        themeDirPath,
        `tmp_suLeKsxId_${crypto.createHash("sha256").update(`${themeType}-${keycloakVersion}`).digest("hex").slice(0, 8)}`
    );
    await downloadBuiltinKeycloakTheme({
        keycloakVersion,
        "destDirPath": tmpDirPath,
        buildOptions
    });
    const resourcesPath = pathJoin(themeDirPath, themeType, "resources");
    transformCodebase({
        "srcDirPath": pathJoin(tmpDirPath, "keycloak", themeType, "resources"),
        "destDirPath": resourcesPath
    });
    transformCodebase({
        "srcDirPath": pathJoin(tmpDirPath, "keycloak", "common", "resources"),
        "destDirPath": pathJoin(resourcesPath, resources_common)
    });
    rmSync(tmpDirPath, { "recursive": true, "force": true });
 }
--- a/src/bin/keycloakify/generateTheme/generateMessageProperties.ts
+++ b/src/bin/keycloakify/generateTheme/generateMessageProperties.ts
@ -1,179 +0,0 @@
 import type { ThemeType } from "../../constants";
 import { crawl } from "../../tools/crawl";
 import { join as pathJoin } from "path";
 import { readFileSync } from "fs";
 import { symToStr } from "tsafe/symToStr";
 import { removeDuplicates } from "evt/tools/reducers/removeDuplicates";
 import * as recast from "recast";
 import * as babelParser from "@babel/parser";
 import babelGenerate from "@babel/generator";
 import * as babelTypes from "@babel/types";
 export function generateMessageProperties(params: {
    themeSrcDirPath: string;
    themeType: ThemeType;
 }): { languageTag: string; propertiesFileSource: string }[] {
    const { themeSrcDirPath, themeType } = params;
    let files = crawl({
        "dirPath": pathJoin(themeSrcDirPath, themeType),
        "returnedPathsType": "absolute"
    });
    files = files.filter(file => {
        const regex = /\.(js|ts|tsx)$/;
        return regex.test(file);
    });
    files = files.sort((a, b) => {
        const regex = /\.i18n\.(ts|js|tsx)$/;
        const aIsI18nFile = regex.test(a);
        const bIsI18nFile = regex.test(b);
        return aIsI18nFile === bIsI18nFile ? 0 : aIsI18nFile ? -1 : 1;
    });
    files = files.sort((a, b) => a.length - b.length);
    files = files.filter(file => readFileSync(file).toString("utf8").includes("createUseI18n"));
    if (files.length === 0) {
        return [];
    }
    const extraMessages = files
        .map(file => {
            const root = recast.parse(readFileSync(file).toString("utf8"), {
                "parser": {
                    "parse": (code: string) => babelParser.parse(code, { "sourceType": "module", "plugins": ["typescript"] }),
                    "generator": babelGenerate,
                    "types": babelTypes
                }
            });
            const codes: string[] = [];
            recast.visit(root, {
                "visitCallExpression": function (path) {
                    if (path.node.callee.type === "Identifier" && path.node.callee.name === "createUseI18n") {
                        codes.push(babelGenerate(path.node.arguments[0] as any).code);
                    }
                    this.traverse(path);
                }
            });
            return codes;
        })
        .flat()
        .map(code => {
            let extraMessages: { [languageTag: string]: Record<string, string> } = {};
            try {
                eval(`${symToStr({ extraMessages })} = ${code}`);
            } catch {
                console.warn(
                    [
                        "WARNING: Make sure that the first argument of createUseI18n can be evaluated in a javascript",
                        "runtime where only the node globals are available.",
                        "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",
                        code
                    ].join(" ")
                );
            }
            return extraMessages;
        });
    const languageTags = extraMessages
        .map(extraMessage => Object.keys(extraMessage))
        .flat()
        .reduce(...removeDuplicates<string>());
    const keyValueMapByLanguageTag: Record<string, Record<string, string>> = {};
    for (const languageTag of languageTags) {
        const keyValueMap: Record<string, string> = {};
        for (const extraMessage of extraMessages) {
            const keyValueMap_i = extraMessage[languageTag];
            if (keyValueMap_i === undefined) {
                continue;
            }
            for (const [key, value] of Object.entries(keyValueMap_i)) {
                if (keyValueMap[key] !== undefined) {
                    console.warn(
                        [
                            "WARNING: The following key is defined multiple times:",
                            "\n",
                            key,
                            "\n",
                            "The following value will be ignored:",
                            "\n",
                            value,
                            "\n",
                            "The following value was already defined:",
                            "\n",
                            keyValueMap[key]
                        ].join(" ")
                    );
                    continue;
                }
                keyValueMap[key] = value;
            }
        }
        keyValueMapByLanguageTag[languageTag] = keyValueMap;
    }
    const out: { languageTag: string; propertiesFileSource: string }[] = [];
    for (const [languageTag, keyValueMap] of Object.entries(keyValueMapByLanguageTag)) {
        const propertiesFileSource = Object.entries(keyValueMap)
            .map(([key, value]) => `${key}=${escapeString(value)}`)
            .join("\n");
        out.push({
            languageTag,
            "propertiesFileSource": ["# This file was generated by keycloakify", "", "parent=base", "", propertiesFileSource, ""].join("\n")
        });
    }
    return out;
 }
 // Convert a JavaScript string to UTF-16 encoding
 function toUTF16(codePoint: number): string {
    if (codePoint <= 0xffff) {
        // BMP character
        return "\\u" + codePoint.toString(16).padStart(4, "0");
    } else {
        // Non-BMP character
        codePoint -= 0x10000;
        let highSurrogate = (codePoint >> 10) + 0xd800;
        let lowSurrogate = (codePoint % 0x400) + 0xdc00;
        return "\\u" + highSurrogate.toString(16).padStart(4, "0") + "\\u" + lowSurrogate.toString(16).padStart(4, "0");
    }
 }
 // Escapes special characters and converts unicode to UTF-16 encoding
 function escapeString(str: string): string {
    let escapedStr = "";
    for (const char of [...str]) {
        const codePoint = char.codePointAt(0);
        if (!codePoint) continue;
        if (char === "'") {
            escapedStr += "''"; // double single quotes
        } else if (codePoint > 0x7f) {
            escapedStr += toUTF16(codePoint); // non-ascii characters
        } else {
            escapedStr += char;
        }
    }
    return escapedStr;
 }
--- a/src/bin/keycloakify/generateTheme/generateTheme.ts
+++ b/src/bin/keycloakify/generateTheme/generateTheme.ts
@ -1,331 +0,0 @@
 import { transformCodebase } from "../../tools/transformCodebase";
 import * as fs from "fs";
 import { join as pathJoin, basename as pathBasename, resolve as pathResolve, dirname as pathDirname } from "path";
 import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode";
 import { replaceImportsInCssCode } from "../replacers/replaceImportsInCssCode";
 import { generateFtlFilesCodeFactory, loginThemePageIds, accountThemePageIds } from "../generateFtl";
 import {
    type ThemeType,
    lastKeycloakVersionWithAccountV1,
    keycloak_resources,
    retrocompatPostfix,
    accountV1ThemeName,
    basenameOfTheKeycloakifyResourcesDir
 } from "../../constants";
 import { isInside } from "../../tools/isInside";
 import type { BuildOptions } from "../buildOptions";
 import { assert, type Equals } from "tsafe/assert";
 import { downloadKeycloakStaticResources } from "./downloadKeycloakStaticResources";
 import { readFieldNameUsage } from "./readFieldNameUsage";
 import { readExtraPagesNames } from "./readExtraPageNames";
 import { generateMessageProperties } from "./generateMessageProperties";
 import { bringInAccountV1 } from "./bringInAccountV1";
 import { rmSync } from "../../tools/fs.rmSync";
 export type BuildOptionsLike = {
    bundler: "vite" | "webpack";
    extraThemeProperties: string[] | undefined;
    themeVersion: string;
    loginThemeResourcesFromKeycloakVersion: string;
    keycloakifyBuildDirPath: string;
    reactAppBuildDirPath: string;
    cacheDirPath: string;
    assetsDirPath: string;
    urlPathname: string | undefined;
    doBuildRetrocompatAccountTheme: boolean;
    themeNames: string[];
    npmWorkspaceRootDirPath: string;
 };
 assert<BuildOptions extends BuildOptionsLike ? true : false>();
 export async function generateTheme(params: {
    themeName: string;
    themeSrcDirPath: string;
    keycloakifySrcDirPath: string;
    buildOptions: BuildOptionsLike;
    keycloakifyVersion: string;
 }): Promise<void> {
    const { themeName, themeSrcDirPath, keycloakifySrcDirPath, buildOptions, keycloakifyVersion } = params;
    const getThemeTypeDirPath = (params: { themeType: ThemeType | "email"; isRetrocompat?: true }) => {
        const { themeType, isRetrocompat = false } = params;
        return pathJoin(
            buildOptions.keycloakifyBuildDirPath,
            "src",
            "main",
            "resources",
            "theme",
            `${themeName}${isRetrocompat ? retrocompatPostfix : ""}`,
            themeType
        );
    };
    const cssGlobalsToDefine: Record<string, string> = {};
    const implementedThemeTypes: Record<ThemeType | "email", boolean> = {
        "login": false,
        "account": false,
        "email": false
    };
    for (const themeType of ["login", "account"] as const) {
        if (!fs.existsSync(pathJoin(themeSrcDirPath, themeType))) {
            continue;
        }
        implementedThemeTypes[themeType] = true;
        const themeTypeDirPath = getThemeTypeDirPath({ themeType });
        apply_replacers_and_move_to_theme_resources: {
            const destDirPath = pathJoin(themeTypeDirPath, "resources", basenameOfTheKeycloakifyResourcesDir);
            // 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" && implementedThemeTypes.login) {
                // NOTE: We prevend doing it twice, it has been done for the login theme.
                transformCodebase({
                    "srcDirPath": pathJoin(
                        getThemeTypeDirPath({
                            "themeType": "login"
                        }),
                        "resources",
                        basenameOfTheKeycloakifyResourcesDir
                    ),
                    destDirPath
                });
                break apply_replacers_and_move_to_theme_resources;
            }
            transformCodebase({
                "srcDirPath": buildOptions.reactAppBuildDirPath,
                destDirPath,
                "transformSourceCode": ({ filePath, sourceCode }) => {
                    //NOTE: Prevent cycles, excludes the folder we generated for debug in public/
                    // This should not happen if users follow the new instruction setup but we keep it for retrocompatibility.
                    if (
                        isInside({
                            "dirPath": pathJoin(buildOptions.reactAppBuildDirPath, keycloak_resources),
                            filePath
                        })
                    ) {
                        return undefined;
                    }
                    if (/\.css?$/i.test(filePath)) {
                        const { cssGlobalsToDefine: cssGlobalsToDefineForThisFile, fixedCssCode } = replaceImportsInCssCode({
                            "cssCode": sourceCode.toString("utf8")
                        });
                        Object.entries(cssGlobalsToDefineForThisFile).forEach(([key, value]) => {
                            cssGlobalsToDefine[key] = value;
                        });
                        return { "modifiedSourceCode": Buffer.from(fixedCssCode, "utf8") };
                    }
                    if (/\.js?$/i.test(filePath)) {
                        const { fixedJsCode } = replaceImportsInJsCode({
                            "jsCode": sourceCode.toString("utf8"),
                            buildOptions
                        });
                        return { "modifiedSourceCode": Buffer.from(fixedJsCode, "utf8") };
                    }
                    return { "modifiedSourceCode": sourceCode };
                }
            });
        }
        const { generateFtlFilesCode } = generateFtlFilesCodeFactory({
            themeName,
            "indexHtmlCode": fs.readFileSync(pathJoin(buildOptions.reactAppBuildDirPath, "index.html")).toString("utf8"),
            cssGlobalsToDefine,
            buildOptions,
            keycloakifyVersion,
            themeType,
            "fieldNames": readFieldNameUsage({
                keycloakifySrcDirPath,
                themeSrcDirPath,
                themeType
            })
        });
        [
            ...(() => {
                switch (themeType) {
                    case "login":
                        return loginThemePageIds;
                    case "account":
                        return accountThemePageIds;
                }
            })(),
            ...readExtraPagesNames({
                themeType,
                themeSrcDirPath
            })
        ].forEach(pageId => {
            const { ftlCode } = generateFtlFilesCode({ pageId });
            fs.mkdirSync(themeTypeDirPath, { "recursive": true });
            fs.writeFileSync(pathJoin(themeTypeDirPath, pageId), Buffer.from(ftlCode, "utf8"));
        });
        generateMessageProperties({
            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"));
        });
        await downloadKeycloakStaticResources({
            "keycloakVersion": (() => {
                switch (themeType) {
                    case "account":
                        return lastKeycloakVersionWithAccountV1;
                    case "login":
                        return buildOptions.loginThemeResourcesFromKeycloakVersion;
                }
            })(),
            "themeDirPath": pathResolve(pathJoin(themeTypeDirPath, "..")),
            themeType,
            buildOptions
        });
        fs.writeFileSync(
            pathJoin(themeTypeDirPath, "theme.properties"),
            Buffer.from(
                [
                    `parent=${(() => {
                        switch (themeType) {
                            case "account":
                                return accountV1ThemeName;
                            case "login":
                                return "keycloak";
                        }
                        assert<Equals<typeof themeType, never>>(false);
                    })()}`,
                    ...(buildOptions.extraThemeProperties ?? [])
                ].join("\n\n"),
                "utf8"
            )
        );
        if (themeType === "account" && buildOptions.doBuildRetrocompatAccountTheme) {
            transformCodebase({
                "srcDirPath": themeTypeDirPath,
                "destDirPath": getThemeTypeDirPath({ themeType, "isRetrocompat": true }),
                "transformSourceCode": ({ filePath, sourceCode }) => {
                    if (pathBasename(filePath) === "theme.properties") {
                        return {
                            "modifiedSourceCode": Buffer.from(
                                sourceCode.toString("utf8").replace(`parent=${accountV1ThemeName}`, "parent=keycloak"),
                                "utf8"
                            )
                        };
                    }
                    return { "modifiedSourceCode": sourceCode };
                }
            });
        }
    }
    email: {
        const emailThemeSrcDirPath = pathJoin(themeSrcDirPath, "email");
        if (!fs.existsSync(emailThemeSrcDirPath)) {
            break email;
        }
        implementedThemeTypes.email = true;
        transformCodebase({
            "srcDirPath": emailThemeSrcDirPath,
            "destDirPath": getThemeTypeDirPath({ "themeType": "email" })
        });
    }
    const parsedKeycloakThemeJson: { themes: { name: string; types: string[] }[] } = { "themes": [] };
    buildOptions.themeNames.forEach(themeName =>
        parsedKeycloakThemeJson.themes.push({
            "name": themeName,
            "types": Object.entries(implementedThemeTypes)
                .filter(([, isImplemented]) => isImplemented)
                .map(([themeType]) => themeType)
        })
    );
    account_specific_extra_work: {
        if (!implementedThemeTypes.account) {
            break account_specific_extra_work;
        }
        await bringInAccountV1({ buildOptions });
        parsedKeycloakThemeJson.themes.push({
            "name": accountV1ThemeName,
            "types": ["account"]
        });
        add_retrocompat_account_theme: {
            if (!buildOptions.doBuildRetrocompatAccountTheme) {
                break add_retrocompat_account_theme;
            }
            transformCodebase({
                "srcDirPath": getThemeTypeDirPath({ "themeType": "account" }),
                "destDirPath": getThemeTypeDirPath({ "themeType": "account", "isRetrocompat": true }),
                "transformSourceCode": ({ filePath, sourceCode }) => {
                    if (pathBasename(filePath) === "theme.properties") {
                        return {
                            "modifiedSourceCode": Buffer.from(
                                sourceCode.toString("utf8").replace(`parent=${accountV1ThemeName}`, "parent=keycloak"),
                                "utf8"
                            )
                        };
                    }
                    return { "modifiedSourceCode": sourceCode };
                }
            });
            buildOptions.themeNames.forEach(themeName =>
                parsedKeycloakThemeJson.themes.push({
                    "name": `${themeName}${retrocompatPostfix}`,
                    "types": ["account"]
                })
            );
        }
    }
    {
        const keycloakThemeJsonFilePath = pathJoin(
            buildOptions.keycloakifyBuildDirPath,
            "src",
            "main",
            "resources",
            "META-INF",
            "keycloak-themes.json"
        );
        try {
            fs.mkdirSync(pathDirname(keycloakThemeJsonFilePath));
        } catch {}
        fs.writeFileSync(keycloakThemeJsonFilePath, Buffer.from(JSON.stringify(parsedKeycloakThemeJson, null, 2), "utf8"));
    }
 }
--- a/src/bin/keycloakify/generateTheme/index.ts
+++ b/src/bin/keycloakify/generateTheme/index.ts
@ -1 +0,0 @@
 export * from "./generateTheme";
--- a/src/bin/keycloakify/generateTheme/readExtraPageNames.ts
+++ b/src/bin/keycloakify/generateTheme/readExtraPageNames.ts
@ -1,39 +0,0 @@
 import { crawl } from "../../tools/crawl";
 import { accountThemePageIds, loginThemePageIds } from "../generateFtl";
 import { id } from "tsafe/id";
 import { removeDuplicates } from "evt/tools/reducers/removeDuplicates";
 import * as fs from "fs";
 import { join as pathJoin } from "path";
 import type { ThemeType } from "../../constants";
 export function readExtraPagesNames(params: { themeSrcDirPath: string; themeType: ThemeType }): string[] {
    const { themeSrcDirPath, themeType } = params;
    const filePaths = crawl({
        "dirPath": pathJoin(themeSrcDirPath, themeType),
        "returnedPathsType": "absolute"
    }).filter(filePath => /\.(ts|tsx|js|jsx)$/.test(filePath));
    const candidateFilePaths = filePaths.filter(filePath => /kcContext\.[^.]+$/.test(filePath));
    if (candidateFilePaths.length === 0) {
        candidateFilePaths.push(...filePaths);
    }
    const extraPages: string[] = [];
    for (const candidateFilPath of candidateFilePaths) {
        const rawSourceFile = fs.readFileSync(candidateFilPath).toString("utf8");
        extraPages.push(...Array.from(rawSourceFile.matchAll(/["']?pageId["']?\s*:\s*["']([^.]+.ftl)["']/g), m => m[1]));
    }
    return extraPages.reduce(...removeDuplicates<string>()).filter(pageId => {
        switch (themeType) {
            case "account":
                return !id<readonly string[]>(accountThemePageIds).includes(pageId);
            case "login":
                return !id<readonly string[]>(loginThemePageIds).includes(pageId);
        }
    });
 }
--- a/src/bin/keycloakify/generateTheme/readFieldNameUsage.ts
+++ b/src/bin/keycloakify/generateTheme/readFieldNameUsage.ts
@ -1,32 +0,0 @@
 import { crawl } from "../../tools/crawl";
 import { removeDuplicates } from "evt/tools/reducers/removeDuplicates";
 import { join as pathJoin } from "path";
 import * as fs from "fs";
 import type { ThemeType } from "../../constants";
 /** Assumes the theme type exists */
 export function readFieldNameUsage(params: { keycloakifySrcDirPath: string; themeSrcDirPath: string; themeType: ThemeType }): string[] {
    const { keycloakifySrcDirPath, themeSrcDirPath, themeType } = params;
    const fieldNames: string[] = [];
    for (const srcDirPath of [pathJoin(keycloakifySrcDirPath, themeType), pathJoin(themeSrcDirPath, themeType)]) {
        const filePaths = crawl({ "dirPath": srcDirPath, "returnedPathsType": "absolute" }).filter(filePath => /\.(ts|tsx|js|jsx)$/.test(filePath));
        for (const filePath of filePaths) {
            const rawSourceFile = fs.readFileSync(filePath).toString("utf8");
            if (!rawSourceFile.includes("messagesPerField")) {
                continue;
            }
            fieldNames.push(
                ...Array.from(rawSourceFile.matchAll(/(?:(?:printIfExists)|(?:existsError)|(?:get)|(?:exists))\(\s*["']([^"']+)["']/g), m => m[1])
            );
        }
    }
    const out = fieldNames.reduce(...removeDuplicates<string>());
    return out;
 }
--- a/src/bin/keycloakify/index.ts
+++ b/src/bin/keycloakify/index.ts
@ -1,8 +0,0 @@
 #!/usr/bin/env node
 export * from "./keycloakify";
 import { main } from "./keycloakify";
 if (require.main === module) {
    main();
 }
--- a/src/bin/keycloakify/keycloakify.ts
+++ b/src/bin/keycloakify/keycloakify.ts
@ -1,111 +0,0 @@
 import { generateTheme } from "./generateTheme";
 import { generatePom } from "./generatePom";
 import { join as pathJoin, relative as pathRelative, basename as pathBasename, dirname as pathDirname, sep as pathSep } from "path";
 import * as child_process from "child_process";
 import { generateStartKeycloakTestingContainer } from "./generateStartKeycloakTestingContainer";
 import * as fs from "fs";
 import { readBuildOptions } from "./buildOptions";
 import { getLogger } from "../tools/logger";
 import { getThemeSrcDirPath } from "../getThemeSrcDirPath";
 import { getThisCodebaseRootDirPath } from "../tools/getThisCodebaseRootDirPath";
 import { readThisNpmProjectVersion } from "../tools/readThisNpmProjectVersion";
 export async function main() {
    const buildOptions = readBuildOptions({
        "processArgv": process.argv.slice(2)
    });
    const logger = getLogger({ "isSilent": buildOptions.isSilent });
    logger.log("🔏 Building the keycloak theme...⌚");
    const { themeSrcDirPath } = getThemeSrcDirPath({ "reactAppRootDirPath": buildOptions.reactAppRootDirPath });
    for (const themeName of buildOptions.themeNames) {
        await generateTheme({
            themeName,
            themeSrcDirPath,
            "keycloakifySrcDirPath": pathJoin(getThisCodebaseRootDirPath(), "src"),
            "keycloakifyVersion": readThisNpmProjectVersion(),
            buildOptions
        });
    }
    {
        const { pomFileCode } = generatePom({ buildOptions });
        fs.writeFileSync(pathJoin(buildOptions.keycloakifyBuildDirPath, "pom.xml"), Buffer.from(pomFileCode, "utf8"));
    }
    const jarFilePath = pathJoin(buildOptions.keycloakifyBuildDirPath, "target", `${buildOptions.artifactId}-${buildOptions.themeVersion}.jar`);
    if (buildOptions.doCreateJar) {
        child_process.execSync("mvn clean install", { "cwd": buildOptions.keycloakifyBuildDirPath });
        const jarDirPath = pathDirname(jarFilePath);
        const retrocompatJarFilePath = pathJoin(jarDirPath, "retrocompat-" + pathBasename(jarFilePath));
        fs.renameSync(pathJoin(jarDirPath, "original-" + pathBasename(jarFilePath)), retrocompatJarFilePath);
        fs.writeFileSync(
            pathJoin(jarDirPath, "README.md"),
            Buffer.from(
                [
                    `- The ${jarFilePath} is to be used in Keycloak 23 and up.  `,
                    `- The ${retrocompatJarFilePath} is to be used in Keycloak 22 and below.`,
                    `  Note that Keycloak 22 is only supported for login and email theme but not for account themes.  `
                ].join("\n"),
                "utf8"
            )
        );
    }
    const containerKeycloakVersion = "23.0.6";
    generateStartKeycloakTestingContainer({
        "keycloakVersion": containerKeycloakVersion,
        jarFilePath,
        buildOptions
    });
    logger.log(
        [
            "",
            ...(!buildOptions.doCreateJar
                ? []
                : [
                      `✅ Your keycloak theme has been generated and bundled into .${pathSep}${pathRelative(
                          buildOptions.reactAppRootDirPath,
                          jarFilePath
                      )} 🚀`
                  ]),
            "",
            `To test your theme locally you can spin up a Keycloak ${containerKeycloakVersion} container image with the theme pre loaded by running:`,
            "",
            `👉 $ .${pathSep}${pathRelative(
                buildOptions.reactAppRootDirPath,
                pathJoin(buildOptions.keycloakifyBuildDirPath, generateStartKeycloakTestingContainer.basename)
            )} 👈`,
            ``,
            `Once your container is up and running: `,
            "- Log into the admin console 👉 http://localhost:8080/admin username: admin, password: admin 👈",
            `- Create a realm:                       Master         -> AddRealm   -> Name: myrealm`,
            `- Enable registration:                  Realm settings -> Login tab  -> User registration: on`,
            `- Enable the Account theme (optional):  Realm settings -> Themes tab -> Account theme: ${buildOptions.themeNames[0]}`,
            `                                        Clients        -> account    -> Login theme:   ${buildOptions.themeNames[0]}`,
            `- Enable the email theme (optional):    Realm settings -> Themes tab -> Email theme:   ${buildOptions.themeNames[0]} (option will appear only if you have ran npx initialize-email-theme)`,
            `- Create a client                       Clients        -> Create     -> Client ID:                       myclient`,
            `                                                                        Root URL:                        https://www.keycloak.org/app/`,
            `                                                                        Valid redirect URIs:             https://www.keycloak.org/app* http://localhost* (localhost is optional)`,
            `                                                                        Valid post logout redirect URIs: https://www.keycloak.org/app* http://localhost*`,
            `                                                                        Web origins:                     *`,
            `                                                                        Login Theme:                     ${buildOptions.themeNames[0]}`,
            `                                                                        Save (button at the bottom of the page)`,
            ``,
            `- Go to  👉  https://www.keycloak.org/app/ 👈 Click "Save" then "Sign in". You should see your login page`,
            `- Got to 👉  http://localhost:8080/realms/myrealm/account 👈 to see your account theme`,
            ``,
            `Video tutorial: https://youtu.be/WMyGZNHQkjU`,
            ``
        ].join("\n")
    );
 }
--- a/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts
+++ b/src/bin/keycloakify/replacers/replaceImportsInCssCode.ts
@ -1,57 +0,0 @@
 import * as crypto from "crypto";
 import type { BuildOptions } from "../buildOptions";
 import { assert } from "tsafe/assert";
 import { basenameOfTheKeycloakifyResourcesDir } from "../../constants";
 export type BuildOptionsLike = {
    urlPathname: string | undefined;
 };
 assert<BuildOptions extends BuildOptionsLike ? true : false>();
 export function replaceImportsInCssCode(params: { cssCode: string }): {
    fixedCssCode: string;
    cssGlobalsToDefine: Record<string, string>;
 } {
    const { cssCode } = params;
    const cssGlobalsToDefine: Record<string, string> = {};
    new Set(cssCode.match(/url\(["']?\/[^/][^)"']+["']?\)[^;}]*?/g) ?? []).forEach(
        match => (cssGlobalsToDefine["url" + crypto.createHash("sha256").update(match).digest("hex").substring(0, 15)] = match)
    );
    let fixedCssCode = cssCode;
    Object.keys(cssGlobalsToDefine).forEach(
        cssVariableName =>
            //NOTE: split/join pattern ~ replace all
            (fixedCssCode = fixedCssCode.split(cssGlobalsToDefine[cssVariableName]).join(`var(--${cssVariableName})`))
    );
    return { fixedCssCode, cssGlobalsToDefine };
 }
 export function generateCssCodeToDefineGlobals(params: { cssGlobalsToDefine: Record<string, string>; buildOptions: BuildOptionsLike }): {
    cssCodeToPrependInHead: string;
 } {
    const { cssGlobalsToDefine, buildOptions } = params;
    return {
        "cssCodeToPrependInHead": [
            ":root {",
            ...Object.keys(cssGlobalsToDefine)
                .map(cssVariableName =>
                    [
                        `--${cssVariableName}:`,
                        cssGlobalsToDefine[cssVariableName].replace(
                            new RegExp(`url\\(${(buildOptions.urlPathname ?? "/").replace(/\//g, "\\/")}`, "g"),
                            `url(\${url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}/`
                        )
                    ].join(" ")
                )
                .map(line => `    ${line};`),
            "}"
        ].join("\n")
    };
 }
--- a/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts
+++ b/src/bin/keycloakify/replacers/replaceImportsInInlineCssCode.ts
@ -1,24 +0,0 @@
 import type { BuildOptions } from "../buildOptions";
 import { assert } from "tsafe/assert";
 import { basenameOfTheKeycloakifyResourcesDir } from "../../constants";
 export type BuildOptionsLike = {
    urlPathname: string | undefined;
 };
 assert<BuildOptions extends BuildOptionsLike ? true : false>();
 export function replaceImportsInInlineCssCode(params: { cssCode: string; buildOptions: BuildOptionsLike }): {
    fixedCssCode: string;
 } {
    const { cssCode, buildOptions } = params;
    const fixedCssCode = cssCode.replace(
        buildOptions.urlPathname === undefined
            ? /url\(["']?\/([^/][^)"']+)["']?\)/g
            : new RegExp(`url\\(["']?${buildOptions.urlPathname}([^)"']+)["']?\\)`, "g"),
        (...[, group]) => `url(\${url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}/${group})`
    );
    return { fixedCssCode };
 }
--- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/index.ts
+++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/index.ts
@ -1 +0,0 @@
 export * from "./replaceImportsInJsCode";
--- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts
+++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/replaceImportsInJsCode.ts
@ -1,66 +0,0 @@
 import { assert } from "tsafe/assert";
 import type { BuildOptions } from "../../buildOptions";
 import { replaceImportsInJsCode_vite } from "./vite";
 import { replaceImportsInJsCode_webpack } from "./webpack";
 import * as fs from "fs";
 export type BuildOptionsLike = {
    reactAppBuildDirPath: string;
    assetsDirPath: string;
    urlPathname: string | undefined;
    bundler: "vite" | "webpack";
 };
 assert<BuildOptions extends BuildOptionsLike ? true : false>();
 export function replaceImportsInJsCode(params: { jsCode: string; buildOptions: BuildOptionsLike }) {
    const { jsCode, buildOptions } = params;
    const { fixedJsCode } = (() => {
        switch (buildOptions.bundler) {
            case "vite":
                return replaceImportsInJsCode_vite({
                    jsCode,
                    buildOptions,
                    "basenameOfAssetsFiles": readAssetsDirSync({
                        "assetsDirPath": params.buildOptions.assetsDirPath
                    })
                });
            case "webpack":
                return replaceImportsInJsCode_webpack({
                    jsCode,
                    buildOptions
                });
        }
    })();
    return { fixedJsCode };
 }
 const { readAssetsDirSync } = (() => {
    let cache:
        | {
              assetsDirPath: string;
              basenameOfAssetsFiles: string[];
          }
        | undefined = undefined;
    function readAssetsDirSync(params: { assetsDirPath: string }): string[] {
        const { assetsDirPath } = params;
        if (cache !== undefined && cache.assetsDirPath === assetsDirPath) {
            return cache.basenameOfAssetsFiles;
        }
        const basenameOfAssetsFiles = fs.readdirSync(assetsDirPath);
        cache = {
            assetsDirPath,
            basenameOfAssetsFiles
        };
        return basenameOfAssetsFiles;
    }
    return { readAssetsDirSync };
 })();
--- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts
+++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/vite.ts
@ -1,85 +0,0 @@
 import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../../constants";
 import { assert } from "tsafe/assert";
 import type { BuildOptions } from "../../buildOptions";
 import * as nodePath from "path";
 import { replaceAll } from "../../../tools/String.prototype.replaceAll";
 export type BuildOptionsLike = {
    reactAppBuildDirPath: string;
    assetsDirPath: string;
    urlPathname: string | undefined;
 };
 assert<BuildOptions extends BuildOptionsLike ? true : false>();
 export function replaceImportsInJsCode_vite(params: {
    jsCode: string;
    buildOptions: BuildOptionsLike;
    basenameOfAssetsFiles: string[];
    systemType?: "posix" | "win32";
 }): {
    fixedJsCode: string;
 } {
    const { jsCode, buildOptions, basenameOfAssetsFiles, systemType = nodePath.sep === "/" ? "posix" : "win32" } = params;
    const { relative: pathRelative, sep: pathSep } = nodePath[systemType];
    let fixedJsCode = jsCode;
    replace_base_javacript_import: {
        if (buildOptions.urlPathname === undefined) {
            break replace_base_javacript_import;
        }
        // Optimization
        if (!jsCode.includes(buildOptions.urlPathname)) {
            break replace_base_javacript_import;
        }
        // Replace `Hv=function(e){return"/abcde12345/"+e}` by `Hv=function(e){return"/"+e}`
        fixedJsCode = fixedJsCode.replace(
            new RegExp(
                `([\\w\\$][\\w\\d\\$]*)=function\\(([\\w\\$][\\w\\d\\$]*)\\)\\{return"${replaceAll(buildOptions.urlPathname, "/", "\\/")}"\\+\\2\\}`,
                "g"
            ),
            (...[, funcName, paramName]) => `${funcName}=function(${paramName}){return"/"+${paramName}}`
        );
    }
    replace_javascript_relatives_import_paths: {
        // Example: "assets/ or "foo/bar/"
        const staticDir = (() => {
            let out = pathRelative(buildOptions.reactAppBuildDirPath, buildOptions.assetsDirPath);
            out = replaceAll(out, pathSep, "/") + "/";
            if (out === "/") {
                throw new Error(`The assetsDirPath must be a subdirectory of reactAppBuildDirPath`);
            }
            return out;
        })();
        // Optimization
        if (!jsCode.includes(staticDir)) {
            break replace_javascript_relatives_import_paths;
        }
        basenameOfAssetsFiles
            .map(basenameOfAssetsFile => `${staticDir}${basenameOfAssetsFile}`)
            .forEach(relativePathOfAssetFile => {
                fixedJsCode = replaceAll(
                    fixedJsCode,
                    `"${relativePathOfAssetFile}"`,
                    `(window.${nameOfTheGlobal}.url.resourcesPath.substring(1) + "/${basenameOfTheKeycloakifyResourcesDir}/${relativePathOfAssetFile}")`
                );
                fixedJsCode = replaceAll(
                    fixedJsCode,
                    `"${buildOptions.urlPathname ?? "/"}${relativePathOfAssetFile}"`,
                    `(window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/${relativePathOfAssetFile}")`
                );
            });
    }
    return { fixedJsCode };
 }
--- a/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts
+++ b/src/bin/keycloakify/replacers/replaceImportsInJsCode/webpack.ts
@ -1,76 +0,0 @@
 import { nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir } from "../../../constants";
 import { assert } from "tsafe/assert";
 import type { BuildOptions } from "../../buildOptions";
 import * as nodePath from "path";
 import { replaceAll } from "../../../tools/String.prototype.replaceAll";
 export type BuildOptionsLike = {
    reactAppBuildDirPath: string;
    assetsDirPath: string;
    urlPathname: string | undefined;
 };
 assert<BuildOptions extends BuildOptionsLike ? true : false>();
 export function replaceImportsInJsCode_webpack(params: { jsCode: string; buildOptions: BuildOptionsLike; systemType?: "posix" | "win32" }): {
    fixedJsCode: string;
 } {
    const { jsCode, buildOptions, systemType = nodePath.sep === "/" ? "posix" : "win32" } = params;
    const { relative: pathRelative, sep: pathSep } = nodePath[systemType];
    let fixedJsCode = jsCode;
    if (buildOptions.urlPathname !== undefined) {
        // "__esModule",{value:!0})},n.p="/foo-bar/",function(){if("undefined"  -> ... n.p="/" ...
        fixedJsCode = fixedJsCode.replace(
            new RegExp(`,([a-zA-Z]\\.[a-zA-Z])="${replaceAll(buildOptions.urlPathname, "/", "\\/")}",`, "g"),
            (...[, assignTo]) => `,${assignTo}="/",`
        );
    }
    // Example: "static/ or "foo/bar/"
    const staticDir = (() => {
        let out = pathRelative(buildOptions.reactAppBuildDirPath, buildOptions.assetsDirPath);
        out = replaceAll(out, pathSep, "/") + "/";
        if (out === "/") {
            throw new Error(`The assetsDirPath must be a subdirectory of reactAppBuildDirPath`);
        }
        return out;
    })();
    const getReplaceArgs = (language: "js" | "css"): Parameters<typeof String.prototype.replace> => [
        new RegExp(`([a-zA-Z_]+)\\.([a-zA-Z]+)=(function\\(([a-z]+)\\){return|([a-z]+)=>)"${staticDir.replace(/\//g, "\\/")}${language}\\/"`, "g"),
        (...[, n, u, matchedFunction, eForFunction]) => {
            const isArrowFunction = matchedFunction.includes("=>");
            const e = isArrowFunction ? matchedFunction.replace("=>", "").trim() : eForFunction;
            return `
            ${n}[(function(){
                var pd = Object.getOwnPropertyDescriptor(${n}, "p");
                if( pd === undefined || pd.configurable ){
                    Object.defineProperty(${n}, "p", {
                        get: function() { return window.${nameOfTheGlobal}.url.resourcesPath; },
                        set: function() {}
                    });
                }
                return "${u}";
            })()] = ${isArrowFunction ? `${e} =>` : `function(${e}) { return `} "/${basenameOfTheKeycloakifyResourcesDir}/${staticDir}${language}/"`
                .replace(/\s+/g, " ")
                .trim();
        }
    ];
    fixedJsCode = fixedJsCode
        .replace(...getReplaceArgs("js"))
        .replace(...getReplaceArgs("css"))
        .replace(
            new RegExp(`[a-zA-Z]+\\.[a-zA-Z]+\\+"${staticDir.replace(/\//g, "\\/")}`, "g"),
            `window.${nameOfTheGlobal}.url.resourcesPath + "/${basenameOfTheKeycloakifyResourcesDir}/${staticDir}`
        );
    return { fixedJsCode };
 }
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
renovate[bot]	ba432f8841	Update garronej_modules_update	2022-09-04 19:09:53 +00:00
Joseph Garrone	27aedbbc7f	Create FUNDING.yml	2022-09-02 18:41:02 +02:00
renovate[bot]	360ed3dc4b	Update garronej_modules_update	2022-08-26 16:39:19 +00:00
garronej	53fd8bd0ee	Fmt (changelog ignore)	2022-08-26 16:12:55 +07:00
Joseph Garrone	7e20ce4efa	Remove warning about website beeing down (changelog ignore)	2022-08-26 15:52:28 +07:00
Joseph Garrone	220d9d4d5e	Update README.md	2022-08-04 14:15:23 +07:00
Joseph Garrone	697171be1e	Update ci.yaml	2022-08-02 14:23:47 +02:00
garronej	cf91c6fb8a	Bump version (changelog ignore)	2022-08-02 09:07:11 +02:00
garronej	18a2e4ae04	Add extra field for u/loki344, in v6 such fields will have to be declared in the package.json #40	2022-08-02 09:06:29 +02:00
		`@ -1 +0,0 @@`
			`export type { KcContext } from "./KcContext";`
		`@ -0,0 +1 @@`
							`export const ftlValuesGlobalName = "kcContext";`
`@ -1,2 +1 @@`
	`export * from "./generateFtl";`	`export * from "./generateFtl";`
	`export * from "./pageId";`