Bump version

docs: add tripheo0412 as a contributor for doc

.all-contributorsrc

@@ -309,6 +309,24 @@
       "contributions": [
         "bug"
       ]
+    },
+    {
+      "login": "zvn2060",
+      "name": "HI_OuO",
+      "avatar_url": "https://avatars.githubusercontent.com/u/45450852?v=4",
+      "profile": "https://github.com/zvn2060",
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "tripheo0412",
+      "name": "Tri Hoang",
+      "avatar_url": "https://avatars.githubusercontent.com/u/25382052?v=4",
+      "profile": "https://github.com/tripheo0412",
+      "contributions": [
+        "doc"
+      ]
     }
   ],
   "contributorsPerLine": 7,

README.md

@@ -165,6 +165,8 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/luca-peruzzo"><img src="https://avatars.githubusercontent.com/u/69015314?v=4?s=100" width="100px;" alt="Luca Peruzzo"/><br /><sub><b>Luca Peruzzo</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=luca-peruzzo" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=luca-peruzzo" title="Tests">⚠️</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/nima70"><img src="https://avatars.githubusercontent.com/u/5094767?v=4?s=100" width="100px;" alt="Nima Shokouhfar"/><br /><sub><b>Nima Shokouhfar</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=nima70" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=nima70" title="Tests">⚠️</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://mruder.dev"><img src="https://avatars.githubusercontent.com/u/18495294?v=4?s=100" width="100px;" alt="Marvin A. Ruder"/><br /><sub><b>Marvin A. Ruder</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/issues?q=author%3Amarvinruder" title="Bug reports">🐛</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/zvn2060"><img src="https://avatars.githubusercontent.com/u/45450852?v=4?s=100" width="100px;" alt="HI_OuO"/><br /><sub><b>HI_OuO</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=zvn2060" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/tripheo0412"><img src="https://avatars.githubusercontent.com/u/25382052?v=4?s=100" width="100px;" alt="Tri Hoang"/><br /><sub><b>Tri Hoang</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=tripheo0412" title="Documentation">📖</a></td>
     </tr>
   </tbody>
 </table>

package.json

@@ -1,6 +1,6 @@
 {
     "name": "keycloakify",
-    "version": "11.4.0-rc.0",
+    "version": "11.3.28",
     "description": "Framework to create custom Keycloak UIs",
     "repository": {
         "type": "git",
@@ -64,7 +64,7 @@
     ],
     "homepage": "https://www.keycloakify.dev",
     "dependencies": {
-        "tsafe": "^1.7.5"
+        "tsafe": "^1.8.5"
     },
     "devDependencies": {
         "@babel/core": "^7.24.5",
@@ -95,14 +95,14 @@
         "cli-select": "^1.1.2",
         "dompurify": "^3.1.6",
         "eslint-plugin-storybook": "^0.6.7",
-        "evt": "^2.5.7",
+        "evt": "^2.5.8",
         "html-entities": "^2.5.2",
         "husky": "^4.3.8",
         "isomorphic-dompurify": "^2.15.0",
         "lint-staged": "^11.0.0",
         "magic-string": "^0.30.7",
         "make-fetch-happen": "^11.0.3",
-        "powerhooks": "^1.0.10",
+        "powerhooks": "^1.0.19",
         "prettier": "^3.2.5",
         "properties-parser": "^0.3.1",
         "react": "^18.2.0",

scripts/dump-keycloak-realm.ts

@@ -4,8 +4,7 @@ import { SemVer } from "../src/bin/tools/SemVer";
 import { join as pathJoin, relative as pathRelative } from "path";
 import chalk from "chalk";
 import { Deferred } from "evt/tools/Deferred";
-import { assert } from "tsafe/assert";
-import { is } from "tsafe/is";
+import { assert, is } from "tsafe/assert";
 import { run } from "./shared/run";
 
 (async () => {

scripts/link-in-app.ts

@@ -125,7 +125,54 @@ if (testAppPaths.length === 0) {
     process.exit(-1);
 }
 
-testAppPaths.forEach(testAppPath => execSync("yarn install", { cwd: testAppPath }));
+testAppPaths.forEach(testAppPath => {
+    const packageJsonFilePath = pathJoin(testAppPath, "package.json");
+
+    const packageJsonContent = fs.readFileSync(packageJsonFilePath);
+
+    const parsedPackageJson = JSON.parse(packageJsonContent.toString("utf8")) as {
+        scripts?: Record<string, string>;
+    };
+
+    let hasPostInstallOrPrepareScript = false;
+
+    if (parsedPackageJson.scripts !== undefined) {
+        for (const scriptName of ["postinstall", "prepare"]) {
+            if (parsedPackageJson.scripts[scriptName] === undefined) {
+                continue;
+            }
+
+            hasPostInstallOrPrepareScript = true;
+
+            delete parsedPackageJson.scripts[scriptName];
+        }
+    }
+
+    if (hasPostInstallOrPrepareScript) {
+        fs.writeFileSync(
+            packageJsonFilePath,
+            Buffer.from(JSON.stringify(parsedPackageJson, null, 2), "utf8")
+        );
+    }
+
+    const restorePackageJson = () => {
+        if (!hasPostInstallOrPrepareScript) {
+            return;
+        }
+
+        fs.writeFileSync(packageJsonFilePath, packageJsonContent);
+    };
+
+    try {
+        execSync("yarn install", { cwd: testAppPath });
+    } catch (error) {
+        restorePackageJson();
+
+        throw error;
+    }
+
+    restorePackageJson();
+});
 
 console.log("=== Linking common dependencies ===");
 
@@ -172,4 +219,20 @@ testAppPaths.forEach(testAppPath =>
     })
 );
 
+testAppPaths.forEach(testAppPath => {
+    const { scripts = {} } = JSON.parse(
+        fs.readFileSync(pathJoin(testAppPath, "package.json")).toString("utf8")
+    ) as {
+        scripts?: Record<string, string>;
+    };
+
+    for (const scriptName of ["postinstall", "prepare"]) {
+        if (scripts[scriptName] === undefined) {
+            continue;
+        }
+
+        execSync(`yarn run ${scriptName}`, { cwd: testAppPath });
+    }
+});
+
 export {};

src/bin/eject-page.ts

@@ -66,23 +66,30 @@ export async function command(params: { buildContext: BuildContext }) {
         return value;
     })();
 
+    if (themeType === "admin") {
+        console.log(
+            "Use `npx keycloakify eject-file` command instead, see documentation"
+        );
+
+        process.exit(-1);
+    }
+
     if (
-        themeType === "admin" ||
-        (themeType === "account" &&
-            (assert(buildContext.implementedThemeTypes.account.isImplemented),
-            buildContext.implementedThemeTypes.account.type === "Single-Page"))
+        themeType === "account" &&
+        (assert(buildContext.implementedThemeTypes.account.isImplemented),
+        buildContext.implementedThemeTypes.account.type === "Single-Page")
     ) {
         const srcDirPath = pathJoin(
             pathDirname(buildContext.packageJsonFilePath),
             "node_modules",
             "@keycloakify",
-            `keycloak-${themeType}-ui`,
+            `keycloak-account-ui`,
             "src"
         );
 
         console.log(
             [
-                `There isn't an interactive CLI to eject components of the ${themeType} UI.`,
+                `There isn't an interactive CLI to eject components of the Account SPA UI.`,
                 `You can however copy paste into your codebase the any file or directory from the following source directory:`,
                 ``,
                 `${chalk.bold(pathJoin(pathRelative(process.cwd(), srcDirPath)))}`,
@@ -91,9 +98,9 @@ export async function command(params: { buildContext: BuildContext }) {
         );
 
         eject_entrypoint: {
-            const kcUiTsxFileRelativePath = `Kc${capitalize(themeType)}Ui.tsx` as const;
+            const kcUiTsxFileRelativePath = `KcAccountUi.tsx` as const;
 
-            const themeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, themeType);
+            const themeSrcDirPath = pathJoin(buildContext.themeSrcDirPath, "account");
 
             const targetFilePath = pathJoin(themeSrcDirPath, kcUiTsxFileRelativePath);
 
@@ -113,11 +120,22 @@ export async function command(params: { buildContext: BuildContext }) {
                     ""
                 );
 
-                const modifiedKcPageTsxCode = kcPageTsxCode.replace(
-                    `@keycloakify/keycloak-${themeType}-ui/${componentName}`,
+                let modifiedKcPageTsxCode = kcPageTsxCode.replace(
+                    `@keycloakify/keycloak-account-ui/${componentName}`,
                     `./${componentName}`
                 );
 
+                run_prettier: {
+                    if (!(await getIsPrettierAvailable())) {
+                        break run_prettier;
+                    }
+
+                    modifiedKcPageTsxCode = await runPrettier({
+                        filePath: kcPageTsxFilePath,
+                        sourceCode: modifiedKcPageTsxCode
+                    });
+                }
+
                 fs.writeFileSync(
                     kcPageTsxFilePath,
                     Buffer.from(modifiedKcPageTsxCode, "utf8")

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

@@ -1,4 +1,4 @@
-import { join as pathJoin, relative as pathRelative, dirname as pathDirname } from "path";
+import { relative as pathRelative, dirname as pathDirname } from "path";
 import type { BuildContext } from "../shared/buildContext";
 import * as fs from "fs";
 import chalk from "chalk";
@@ -9,12 +9,10 @@ import {
 import { SemVer } from "../tools/SemVer";
 import fetch from "make-fetch-happen";
 import { z } from "zod";
-import { assert, type Equals } from "tsafe/assert";
-import { is } from "tsafe/is";
+import { assert, type Equals, is } from "tsafe/assert";
 import { id } from "tsafe/id";
 import { npmInstall } from "../tools/npmInstall";
 import { copyBoilerplate } from "./copyBoilerplate";
-import { getThisCodebaseRootDirPath } from "../tools/getThisCodebaseRootDirPath";
 
 type BuildContextLike = BuildContextLike_getLatestsSemVersionedTag & {
     fetchOptions: BuildContext["fetchOptions"];
@@ -121,20 +119,7 @@ export async function initializeAccountTheme_singlePage(params: {
         JSON.stringify(parsedPackageJson, undefined, 4)
     );
 
-    run_npm_install: {
-        if (
-            JSON.parse(
-                fs
-                    .readFileSync(pathJoin(getThisCodebaseRootDirPath(), "package.json"))
-                    .toString("utf8")
-            )["version"] === "0.0.0"
-        ) {
-            //NOTE: Linked version
-            break run_npm_install;
-        }
-
-        npmInstall({ packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath) });
-    }
+    npmInstall({ packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath) });
 
     copyBoilerplate({
         accountThemeType: "Single-Page",

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

@@ -1,11 +1,10 @@
 import { join as pathJoin } from "path";
-import { assert, type Equals } from "tsafe/assert";
+import { assert, type Equals, is } from "tsafe/assert";
 import type { BuildContext } from "../shared/buildContext";
 import * as fs from "fs";
 import chalk from "chalk";
 import { z } from "zod";
 import { id } from "tsafe/id";
-import { is } from "tsafe/is";
 
 export type BuildContextLike = {
     bundler: BuildContext["bundler"];

src/bin/main.ts

@@ -246,7 +246,10 @@ program
         file: string;
     }>({
         name: "eject-file",
-        description: "Take ownership over a given file"
+        description: [
+            "WARNING: Not usable yet, will be used for future features",
+            "Take ownership over a given file"
+        ].join(" ")
     })
     .option({
         key: "file",

src/bin/postinstall/getUiModuleFileSourceCodeReadyToBeCopied.ts

@@ -32,27 +32,38 @@ export async function getUiModuleFileSourceCodeReadyToBeCopied(params: {
         await fsPr.readFile(pathJoin(uiModuleDirPath, KEYCLOAK_THEME, fileRelativePath))
     ).toString("utf8");
 
-    const comment = (() => {
-        if (isForEjection) {
-            return [
-                `/*`,
-                `This file was ejected from ${uiModuleName} version ${uiModuleVersion}.`,
-                `*/`
-            ].join("\n");
-        } else {
-            return [
-                `/*`,
-                `WARNING: Before modifying this file run the following command:`,
-                ``,
-                `npx keycloakify eject-file --file ${fileRelativePath.split(pathSep).join("/")}\``,
-                ``,
-                `This file comes from ${uiModuleName} version ${uiModuleVersion}.`,
-                `*/`
-            ];
-        }
-    })();
+    const toComment = (lines: string[]) => {
+        for (const ext of [".ts", ".tsx", ".css", ".less", ".sass", ".js", ".jsx"]) {
+            if (!fileRelativePath.endsWith(ext)) {
+                continue;
+            }
 
-    sourceCode = [comment, ``, sourceCode].join("\n");
+            return [`/**`, ...lines.map(line => ` * ${line}`), ` */`].join("\n");
+        }
+
+        if (fileRelativePath.endsWith(".html")) {
+            return [`<!--`, ...lines.map(line => ` ${line}`), `-->`].join("\n");
+        }
+
+        return undefined;
+    };
+
+    const comment = toComment(
+        isForEjection
+            ? [`This file was ejected from ${uiModuleName} version ${uiModuleVersion}.`]
+            : [
+                  `WARNING: Before modifying this file run the following command:`,
+                  ``,
+                  `$ npx keycloakify eject-file --file ${fileRelativePath.split(pathSep).join("/")}`,
+                  ``,
+                  `This file comes from ${uiModuleName} version ${uiModuleVersion}.`,
+                  `This file has been copied over to your repo by your postinstall script: \`npx keycloakify postinstall\``
+              ]
+    );
+
+    if (comment !== undefined) {
+        sourceCode = [comment, ``, sourceCode].join("\n");
+    }
 
     const destFilePath = pathJoin(buildContext.themeSrcDirPath, fileRelativePath);
 

src/bin/postinstall/installUiModulesPeerDependencies.ts

@@ -1,5 +1,4 @@
-import { assert, type Equals } from "tsafe/assert";
-import { is } from "tsafe/is";
+import { assert, type Equals, is } from "tsafe/assert";
 import type { BuildContext } from "../shared/buildContext";
 import type { UiModuleMeta } from "./uiModuleMeta";
 import { z } from "zod";
@@ -9,6 +8,7 @@ import { SemVer } from "../tools/SemVer";
 import { same } from "evt/tools/inDepth/same";
 import { runPrettier, getIsPrettierAvailable } from "../tools/runPrettier";
 import { npmInstall } from "../tools/npmInstall";
+import { dirname as pathDirname } from "path";
 
 export type BuildContextLike = {
     packageJsonFilePath: string;
@@ -150,7 +150,7 @@ export async function installUiModulesPeerDependencies(params: {
     await fsPr.writeFile(buildContext.packageJsonFilePath, packageJsonContentStr);
 
     npmInstall({
-        packageJsonDirPath: buildContext.packageJsonFilePath
+        packageJsonDirPath: pathDirname(buildContext.packageJsonFilePath)
     });
 
     process.exit(0);

src/bin/postinstall/managedGitignoreFile.ts

@@ -38,9 +38,9 @@ export async function writeManagedGitignoreFile(params: {
             `# This file is managed by Keycloakify, do not edit it manually.`,
             ``,
             DELIMITER_START,
-            ...ejectedFilesRelativePaths.map(fileRelativePath =>
-                fileRelativePath.split(pathSep).join("/")
-            ),
+            ...ejectedFilesRelativePaths
+                .map(fileRelativePath => fileRelativePath.split(pathSep).join("/"))
+                .map(line => `# ${line}`),
             DELIMITER_END,
             ``,
             ...uiModuleMetas
@@ -122,6 +122,7 @@ export async function readManagedGitignoreFile(params: {
     const ejectedFilesRelativePaths = payload
         .split("\n")
         .map(line => line.trim())
+        .map(line => line.replace(/^# /, ""))
         .filter(line => line !== "")
         .map(line =>
             getAbsoluteAndInOsFormatPath({

src/bin/postinstall/postinstall.ts

@@ -9,6 +9,8 @@ import { dirname as pathDirname } from "path";
 import { join as pathJoin } from "path";
 import { existsAsync } from "../tools/fs.existsAsync";
 import * as fsPr from "fs/promises";
+import { getIsTrackedByGit } from "../tools/isTrackedByGit";
+import { untrackFromGit } from "../tools/untrackFromGit";
 
 export async function command(params: { buildContext: BuildContext }) {
     const { buildContext } = params;
@@ -45,8 +47,10 @@ export async function command(params: { buildContext: BuildContext }) {
                                 fileRelativePath
                             );
 
+                            const doesFileExist = await existsAsync(destFilePath);
+
                             skip_condition: {
-                                if (!(await existsAsync(destFilePath))) {
+                                if (!doesFileExist) {
                                     break skip_condition;
                                 }
 
@@ -61,8 +65,26 @@ export async function command(params: { buildContext: BuildContext }) {
                                 return;
                             }
 
+                            git_untrack: {
+                                if (!doesFileExist) {
+                                    break git_untrack;
+                                }
+
+                                const isTracked = await getIsTrackedByGit({
+                                    filePath: destFilePath
+                                });
+
+                                if (!isTracked) {
+                                    break git_untrack;
+                                }
+
+                                await untrackFromGit({
+                                    filePath: destFilePath
+                                });
+                            }
+
                             {
-                                const dirName = pathDirname(copyableFilePath);
+                                const dirName = pathDirname(destFilePath);
 
                                 if (!(await existsAsync(dirName))) {
                                     await fsPr.mkdir(dirName, { recursive: true });

src/bin/postinstall/uiModuleMeta.ts

@@ -1,14 +1,13 @@
-import { assert, type Equals } from "tsafe/assert";
+import { assert, type Equals, is } from "tsafe/assert";
 import { id } from "tsafe/id";
 import { z } from "zod";
 import { join as pathJoin, dirname as pathDirname } from "path";
 import * as fsPr from "fs/promises";
 import type { BuildContext } from "../shared/buildContext";
-import { is } from "tsafe/is";
 import { existsAsync } from "../tools/fs.existsAsync";
 import { listInstalledModules } from "../tools/listInstalledModules";
 import { crawlAsync } from "../tools/crawlAsync";
-import { getIsPrettierAvailable, getPrettierAndConfig } from "../tools/runPrettier";
+import { getIsPrettierAvailable, getPrettier } from "../tools/runPrettier";
 import { readThisNpmPackageVersion } from "../tools/readThisNpmPackageVersion";
 import {
     getUiModuleFileSourceCodeReadyToBeCopied,
@@ -16,6 +15,7 @@ import {
 } from "./getUiModuleFileSourceCodeReadyToBeCopied";
 import * as crypto from "crypto";
 import { KEYCLOAK_THEME } from "../shared/constants";
+import { exclude } from "tsafe/exclude";
 
 export type UiModuleMeta = {
     moduleName: string;
@@ -100,9 +100,9 @@ export async function getUiModuleMetas(params: {
             return null;
         }
 
-        const { config } = await getPrettierAndConfig();
+        const { configHash } = await getPrettier();
 
-        return crypto.createHash("sha256").update(JSON.stringify(config)).digest("hex");
+        return configHash;
     })();
 
     const installedUiModules = await (async () => {
@@ -113,11 +113,16 @@ export async function getUiModuleMetas(params: {
                 moduleName.includes("keycloakify") && moduleName !== "keycloakify"
         });
 
-        return Promise.all(
-            installedModulesWithKeycloakifyInTheName.filter(async ({ dirPath }) =>
-                existsAsync(pathJoin(dirPath, KEYCLOAK_THEME))
+        return (
+            await Promise.all(
+                installedModulesWithKeycloakifyInTheName.map(async entry => {
+                    if (!(await existsAsync(pathJoin(entry.dirPath, KEYCLOAK_THEME)))) {
+                        return undefined;
+                    }
+                    return entry;
+                })
             )
-        );
+        ).filter(exclude(undefined));
     })();
 
     const cacheContent = await (async () => {

src/bin/shared/buildContext.ts

@@ -9,7 +9,7 @@ import {
 import { getAbsoluteAndInOsFormatPath } from "../tools/getAbsoluteAndInOsFormatPath";
 import { z } from "zod";
 import * as fs from "fs";
-import { assert, type Equals } from "tsafe/assert";
+import { assert, type Equals, is } from "tsafe/assert";
 import * as child_process from "child_process";
 import {
     VITE_PLUGIN_SUB_SCRIPTS_ENV_NAMES,
@@ -23,7 +23,6 @@ import { objectEntries } from "tsafe/objectEntries";
 import { id } from "tsafe/id";
 import chalk from "chalk";
 import { getProxyFetchOptions, type FetchOptionsLike } from "../tools/fetchProxyOptions";
-import { is } from "tsafe/is";
 
 export type BuildContext = {
     themeVersion: string;

src/bin/tools/crawlAsync.ts

@@ -6,19 +6,19 @@ import { assert, type Equals } from "tsafe/assert";
 export async function crawlAsync(params: {
     dirPath: string;
     returnedPathsType: "absolute" | "relative to dirPath";
-    onFileFound: (filePath: string) => void;
+    onFileFound: (filePath: string) => Promise<void>;
 }) {
     const { dirPath, returnedPathsType, onFileFound } = params;
 
     await crawlAsyncRec({
         dirPath,
-        onFileFound: ({ filePath }) => {
+        onFileFound: async ({ filePath }) => {
             switch (returnedPathsType) {
                 case "absolute":
-                    onFileFound(filePath);
+                    await onFileFound(filePath);
                     return;
                 case "relative to dirPath":
-                    onFileFound(pathRelative(dirPath, filePath));
+                    await onFileFound(pathRelative(dirPath, filePath));
                     return;
             }
             assert<Equals<typeof returnedPathsType, never>>();
@@ -28,7 +28,7 @@ export async function crawlAsync(params: {
 
 async function crawlAsyncRec(params: {
     dirPath: string;
-    onFileFound: (params: { filePath: string }) => void;
+    onFileFound: (params: { filePath: string }) => Promise<void>;
 }) {
     const { dirPath, onFileFound } = params;
 
@@ -45,7 +45,7 @@ async function crawlAsyncRec(params: {
                 return;
             }
 
-            onFileFound({ filePath: fileOrDirPath });
+            await onFileFound({ filePath: fileOrDirPath });
         })
     );
 }

src/bin/tools/isTrackedByGit.ts

@@ -0,0 +1,29 @@
+import * as child_process from "child_process";
+import { dirname as pathDirname, basename as pathBasename } from "path";
+import { Deferred } from "evt/tools/Deferred";
+
+export function getIsTrackedByGit(params: { filePath: string }): Promise<boolean> {
+    const { filePath } = params;
+
+    const dIsTracked = new Deferred<boolean>();
+
+    child_process.exec(
+        `git ls-files --error-unmatch ${pathBasename(filePath)}`,
+        { cwd: pathDirname(filePath) },
+        error => {
+            if (error === null) {
+                dIsTracked.resolve(true);
+                return;
+            }
+
+            if (error.code === 1) {
+                dIsTracked.resolve(false);
+                return;
+            }
+
+            dIsTracked.reject(error);
+        }
+    );
+
+    return dIsTracked.pr;
+}

src/bin/tools/listInstalledModules.ts

@@ -1,9 +1,8 @@
-import { assert, type Equals } from "tsafe/assert";
+import { assert, type Equals, is } from "tsafe/assert";
 import { id } from "tsafe/id";
 import { z } from "zod";
 import { join as pathJoin, dirname as pathDirname } from "path";
 import * as fsPr from "fs/promises";
-import { is } from "tsafe/is";
 import { getInstalledModuleDirPath } from "../tools/getInstalledModuleDirPath";
 import { exclude } from "tsafe/exclude";
 

src/bin/tools/npmInstall.ts

@@ -1,7 +1,14 @@
 import * as fs from "fs";
-import { join as pathJoin } from "path";
+import { join as pathJoin, dirname as pathDirname } from "path";
 import * as child_process from "child_process";
 import chalk from "chalk";
+import { z } from "zod";
+import { assert, type Equals, is } from "tsafe/assert";
+import { id } from "tsafe/id";
+import { objectKeys } from "tsafe/objectKeys";
+import { getAbsoluteAndInOsFormatPath } from "./getAbsoluteAndInOsFormatPath";
+import { exclude } from "tsafe/exclude";
+import { rmSync } from "./fs.rmSync";
 
 export function npmInstall(params: { packageJsonDirPath: string }) {
     const { packageJsonDirPath } = params;
@@ -48,6 +55,27 @@ export function npmInstall(params: { packageJsonDirPath: string }) {
 
     console.log(`Installing the new dependencies...`);
 
+    install_without_breaking_links: {
+        if (packageManagerBinName !== "yarn") {
+            break install_without_breaking_links;
+        }
+
+        const garronejLinkInfos = getGarronejLinkInfos({ packageJsonDirPath });
+
+        if (garronejLinkInfos === undefined) {
+            break install_without_breaking_links;
+        }
+
+        console.log(chalk.green("Installing in a way that won't break the links..."));
+
+        installWithoutBreakingLinks({
+            packageJsonDirPath,
+            garronejLinkInfos
+        });
+
+        return;
+    }
+
     try {
         child_process.execSync(`${packageManagerBinName} install`, {
             cwd: packageJsonDirPath,
@@ -61,3 +89,370 @@ export function npmInstall(params: { packageJsonDirPath: string }) {
         );
     }
 }
+
+function getGarronejLinkInfos(params: {
+    packageJsonDirPath: string;
+}): { linkedModuleNames: string[]; yarnHomeDirPath: string } | undefined {
+    const { packageJsonDirPath } = params;
+
+    const nodeModuleDirPath = pathJoin(packageJsonDirPath, "node_modules");
+
+    if (!fs.existsSync(nodeModuleDirPath)) {
+        return undefined;
+    }
+
+    const linkedModuleNames: string[] = [];
+
+    let yarnHomeDirPath: string | undefined = undefined;
+
+    const getIsLinkedByGarronejScript = (path: string) => {
+        let realPath: string;
+
+        try {
+            realPath = fs.readlinkSync(path);
+        } catch {
+            return false;
+        }
+
+        const doesIncludeYarnHome = realPath.includes(".yarn_home");
+
+        if (!doesIncludeYarnHome) {
+            return false;
+        }
+
+        set_yarnHomeDirPath: {
+            if (yarnHomeDirPath !== undefined) {
+                break set_yarnHomeDirPath;
+            }
+
+            const [firstElement] = getAbsoluteAndInOsFormatPath({
+                pathIsh: realPath,
+                cwd: pathDirname(path)
+            }).split(".yarn_home");
+
+            yarnHomeDirPath = pathJoin(firstElement, ".yarn_home");
+        }
+
+        return true;
+    };
+
+    for (const basename of fs.readdirSync(nodeModuleDirPath)) {
+        const path = pathJoin(nodeModuleDirPath, basename);
+
+        if (fs.lstatSync(path).isSymbolicLink()) {
+            if (basename.startsWith("@")) {
+                return undefined;
+            }
+
+            if (!getIsLinkedByGarronejScript(path)) {
+                return undefined;
+            }
+
+            linkedModuleNames.push(basename);
+            continue;
+        }
+
+        if (!fs.lstatSync(path).isDirectory()) {
+            continue;
+        }
+
+        if (basename.startsWith("@")) {
+            for (const subBasename of fs.readdirSync(path)) {
+                const subPath = pathJoin(path, subBasename);
+
+                if (!fs.lstatSync(subPath).isSymbolicLink()) {
+                    continue;
+                }
+
+                if (!getIsLinkedByGarronejScript(subPath)) {
+                    return undefined;
+                }
+
+                linkedModuleNames.push(`${basename}/${subBasename}`);
+            }
+        }
+    }
+
+    if (yarnHomeDirPath === undefined) {
+        return undefined;
+    }
+
+    return { linkedModuleNames, yarnHomeDirPath };
+}
+
+function installWithoutBreakingLinks(params: {
+    packageJsonDirPath: string;
+    garronejLinkInfos: Exclude<ReturnType<typeof getGarronejLinkInfos>, undefined>;
+}) {
+    const {
+        packageJsonDirPath,
+        garronejLinkInfos: { linkedModuleNames, yarnHomeDirPath }
+    } = params;
+
+    const parsedPackageJson = (() => {
+        const packageJsonFilePath = pathJoin(packageJsonDirPath, "package.json");
+
+        type ParsedPackageJson = {
+            scripts?: Record<string, string>;
+        };
+
+        const zParsedPackageJson = (() => {
+            type TargetType = ParsedPackageJson;
+
+            const zTargetType = z.object({
+                scripts: z.record(z.string()).optional()
+            });
+
+            type InferredType = z.infer<typeof zTargetType>;
+
+            assert<Equals<TargetType, InferredType>>;
+
+            return id<z.ZodType<TargetType>>(zTargetType);
+        })();
+
+        const parsedPackageJson = JSON.parse(
+            fs.readFileSync(packageJsonFilePath).toString("utf8")
+        ) as unknown;
+
+        zParsedPackageJson.parse(parsedPackageJson);
+        assert(is<ParsedPackageJson>(parsedPackageJson));
+
+        return parsedPackageJson;
+    })();
+
+    const isImplementedScriptByName = {
+        postinstall: false,
+        prepare: false
+    };
+
+    delete_postinstall_script: {
+        if (parsedPackageJson.scripts === undefined) {
+            break delete_postinstall_script;
+        }
+
+        for (const scriptName of objectKeys(isImplementedScriptByName)) {
+            if (parsedPackageJson.scripts[scriptName] === undefined) {
+                continue;
+            }
+
+            isImplementedScriptByName[scriptName] = true;
+
+            delete parsedPackageJson.scripts[scriptName];
+        }
+    }
+
+    const tmpProjectDirPath = pathJoin(yarnHomeDirPath, "tmpProject");
+
+    if (fs.existsSync(tmpProjectDirPath)) {
+        rmSync(tmpProjectDirPath, { recursive: true });
+    }
+
+    fs.mkdirSync(tmpProjectDirPath, { recursive: true });
+
+    fs.writeFileSync(
+        pathJoin(tmpProjectDirPath, "package.json"),
+        JSON.stringify(parsedPackageJson, undefined, 4)
+    );
+
+    const YARN_LOCK = "yarn.lock";
+
+    fs.copyFileSync(
+        pathJoin(packageJsonDirPath, YARN_LOCK),
+        pathJoin(tmpProjectDirPath, YARN_LOCK)
+    );
+
+    child_process.execSync(`yarn install`, {
+        cwd: tmpProjectDirPath,
+        stdio: "inherit"
+    });
+
+    // NOTE: Moving the modules from the tmp project to the actual project
+    // without messing up the links.
+    {
+        const { getAreSameVersions } = (() => {
+            type ParsedPackageJson = {
+                version: string;
+            };
+
+            const zParsedPackageJson = (() => {
+                type TargetType = ParsedPackageJson;
+
+                const zTargetType = z.object({
+                    version: z.string()
+                });
+
+                type InferredType = z.infer<typeof zTargetType>;
+
+                assert<Equals<TargetType, InferredType>>;
+
+                return id<z.ZodType<TargetType>>(zTargetType);
+            })();
+
+            function readVersion(params: { moduleDirPath: string }): string {
+                const { moduleDirPath } = params;
+
+                const packageJsonFilePath = pathJoin(moduleDirPath, "package.json");
+
+                const packageJson = JSON.parse(
+                    fs.readFileSync(packageJsonFilePath).toString("utf8")
+                );
+
+                zParsedPackageJson.parse(packageJson);
+                assert(is<ParsedPackageJson>(packageJson));
+
+                return packageJson.version;
+            }
+
+            function getAreSameVersions(params: {
+                moduleDirPath_a: string;
+                moduleDirPath_b: string;
+            }): boolean {
+                const { moduleDirPath_a, moduleDirPath_b } = params;
+
+                return (
+                    readVersion({ moduleDirPath: moduleDirPath_a }) ===
+                    readVersion({ moduleDirPath: moduleDirPath_b })
+                );
+            }
+
+            return { getAreSameVersions };
+        })();
+
+        const nodeModulesDirPath_tmpProject = pathJoin(tmpProjectDirPath, "node_modules");
+        const nodeModulesDirPath = pathJoin(packageJsonDirPath, "node_modules");
+
+        const modulePaths = fs
+            .readdirSync(nodeModulesDirPath_tmpProject)
+            .map(basename => {
+                if (basename.startsWith(".")) {
+                    return undefined;
+                }
+
+                const path = pathJoin(nodeModulesDirPath_tmpProject, basename);
+
+                if (basename.startsWith("@")) {
+                    return fs
+                        .readdirSync(path)
+                        .map(subBasename => {
+                            if (subBasename.startsWith(".")) {
+                                return undefined;
+                            }
+
+                            const subPath = pathJoin(path, subBasename);
+
+                            if (!fs.lstatSync(subPath).isDirectory()) {
+                                return undefined;
+                            }
+
+                            return {
+                                moduleName: `${basename}/${subBasename}`,
+                                moduleDirPath_tmpProject: subPath,
+                                moduleDirPath: pathJoin(
+                                    nodeModulesDirPath,
+                                    basename,
+                                    subBasename
+                                )
+                            };
+                        })
+                        .filter(exclude(undefined));
+                }
+
+                if (!fs.lstatSync(path).isDirectory()) {
+                    return undefined;
+                }
+
+                return [
+                    {
+                        moduleName: basename,
+                        moduleDirPath_tmpProject: path,
+                        moduleDirPath: pathJoin(nodeModulesDirPath, basename)
+                    }
+                ];
+            })
+            .filter(exclude(undefined))
+            .flat();
+
+        for (const {
+            moduleName,
+            moduleDirPath,
+            moduleDirPath_tmpProject
+        } of modulePaths) {
+            if (linkedModuleNames.includes(moduleName)) {
+                continue;
+            }
+
+            let doesTargetModuleExist = false;
+
+            skip_condition: {
+                if (!fs.existsSync(moduleDirPath)) {
+                    break skip_condition;
+                }
+
+                doesTargetModuleExist = true;
+
+                const areSameVersions = getAreSameVersions({
+                    moduleDirPath_a: moduleDirPath,
+                    moduleDirPath_b: moduleDirPath_tmpProject
+                });
+
+                if (!areSameVersions) {
+                    break skip_condition;
+                }
+
+                continue;
+            }
+
+            if (doesTargetModuleExist) {
+                rmSync(moduleDirPath, { recursive: true });
+            }
+
+            {
+                const dirPath = pathDirname(moduleDirPath);
+
+                if (!fs.existsSync(dirPath)) {
+                    fs.mkdirSync(dirPath, { recursive: true });
+                }
+            }
+
+            fs.renameSync(moduleDirPath_tmpProject, moduleDirPath);
+        }
+
+        move_bin: {
+            const binDirPath_tmpProject = pathJoin(nodeModulesDirPath_tmpProject, ".bin");
+            const binDirPath = pathJoin(nodeModulesDirPath, ".bin");
+
+            if (!fs.existsSync(binDirPath_tmpProject)) {
+                break move_bin;
+            }
+
+            for (const basename of fs.readdirSync(binDirPath_tmpProject)) {
+                const path_tmpProject = pathJoin(binDirPath_tmpProject, basename);
+                const path = pathJoin(binDirPath, basename);
+
+                if (fs.existsSync(path)) {
+                    continue;
+                }
+
+                fs.renameSync(path_tmpProject, path);
+            }
+        }
+    }
+
+    fs.cpSync(
+        pathJoin(tmpProjectDirPath, YARN_LOCK),
+        pathJoin(packageJsonDirPath, YARN_LOCK)
+    );
+
+    rmSync(tmpProjectDirPath, { recursive: true });
+
+    for (const scriptName of objectKeys(isImplementedScriptByName)) {
+        if (!isImplementedScriptByName[scriptName]) {
+            continue;
+        }
+
+        child_process.execSync(`yarn run ${scriptName}`, {
+            cwd: packageJsonDirPath,
+            stdio: "inherit"
+        });
+    }
+}

src/bin/tools/runPrettier.ts

@@ -1,9 +1,12 @@
 import { getNodeModulesBinDirPath } from "./nodeModulesBinDirPath";
-import { join as pathJoin } from "path";
+import { join as pathJoin, resolve as pathResolve } from "path";
 import * as fsPr from "fs/promises";
 import { id } from "tsafe/id";
-import { assert } from "tsafe/assert";
+import { assert, is } from "tsafe/assert";
 import chalk from "chalk";
+import * as crypto from "crypto";
+import { symToStr } from "tsafe/symToStr";
+import { readThisNpmPackageVersion } from "./readThisNpmPackageVersion";
 
 getIsPrettierAvailable.cache = id<boolean | undefined>(undefined);
 
@@ -25,28 +28,60 @@ export async function getIsPrettierAvailable(): Promise<boolean> {
     return isPrettierAvailable;
 }
 
-type PrettierAndConfig = {
+type PrettierAndConfigHash = {
     prettier: typeof import("prettier");
-    config: import("prettier").Options | null;
+    configHash: string;
 };
 
-getPrettierAndConfig.cache = id<PrettierAndConfig | undefined>(undefined);
+getPrettier.cache = id<PrettierAndConfigHash | undefined>(undefined);
 
-export async function getPrettierAndConfig(): Promise<PrettierAndConfig> {
+export async function getPrettier(): Promise<PrettierAndConfigHash> {
     assert(getIsPrettierAvailable());
 
-    if (getPrettierAndConfig.cache !== undefined) {
-        return getPrettierAndConfig.cache;
+    if (getPrettier.cache !== undefined) {
+        return getPrettier.cache;
     }
 
-    const prettier = await import("prettier");
+    let prettier = id<typeof import("prettier") | undefined>(undefined);
 
-    const prettierAndConfig: PrettierAndConfig = {
+    import_prettier: {
+        // NOTE: When module is linked we want to make sure we import the correct version
+        // of prettier, that is the one of the project, not the one of this repo.
+        // So we do a sketchy eval to bypass ncc.
+        // We make sure to only do that when linking, otherwise we import properly.
+        if (readThisNpmPackageVersion().startsWith("0.0.0")) {
+            eval(
+                `${symToStr({ prettier })} = require("${pathResolve(pathJoin(getNodeModulesBinDirPath(), "..", "prettier"))}")`
+            );
+
+            assert(!is<undefined>(prettier));
+
+            break import_prettier;
+        }
+
+        prettier = await import("prettier");
+    }
+
+    const configHash = await (async () => {
+        const configFilePath = await prettier.resolveConfigFile(
+            pathJoin(getNodeModulesBinDirPath(), "..")
+        );
+
+        if (configFilePath === null) {
+            return "";
+        }
+
+        const data = await fsPr.readFile(configFilePath);
+
+        return crypto.createHash("sha256").update(data).digest("hex");
+    })();
+
+    const prettierAndConfig: PrettierAndConfigHash = {
         prettier,
-        config: await prettier.resolveConfig(pathJoin(getNodeModulesBinDirPath(), ".."))
+        configHash
     };
 
-    getPrettierAndConfig.cache = prettierAndConfig;
+    getPrettier.cache = prettierAndConfig;
 
     return prettierAndConfig;
 }
@@ -60,9 +95,23 @@ export async function runPrettier(params: {
     let formattedSourceCode: string;
 
     try {
-        const { prettier, config } = await getPrettierAndConfig();
+        const { prettier } = await getPrettier();
 
-        formattedSourceCode = await prettier.format(sourceCode, { ...config, filePath });
+        const { ignored, inferredParser } = await prettier.getFileInfo(filePath, {
+            resolveConfig: true
+        });
+
+        if (ignored) {
+            return sourceCode;
+        }
+
+        const config = await prettier.resolveConfig(filePath);
+
+        formattedSourceCode = await prettier.format(sourceCode, {
+            ...config,
+            filePath,
+            parser: inferredParser ?? undefined
+        });
     } catch (error) {
         console.log(
             chalk.red(

src/bin/tools/untrackFromGit.ts

@@ -0,0 +1,24 @@
+import * as child_process from "child_process";
+import { dirname as pathDirname, basename as pathBasename } from "path";
+import { Deferred } from "evt/tools/Deferred";
+
+export async function untrackFromGit(params: { filePath: string }): Promise<void> {
+    const { filePath } = params;
+
+    const dDone = new Deferred<void>();
+
+    child_process.exec(
+        `git rm --cached ${pathBasename(filePath)}`,
+        { cwd: pathDirname(filePath) },
+        error => {
+            if (error !== null) {
+                dDone.reject(error);
+                return;
+            }
+
+            dDone.resolve();
+        }
+    );
+
+    await dDone.pr;
+}

src/bin/tsconfig.json

@@ -10,5 +10,5 @@
         "rootDir": "."
     },
     "include": ["**/*.ts", "**/*.tsx"],
-    "exclude": ["initialize-account-theme/src", "initialize-admin-theme/src"]
+    "exclude": ["initialize-account-theme/src"]
 }

src/bin/update-kc-gen.ts

@@ -18,7 +18,7 @@ export async function command(params: { buildContext: BuildContext }) {
         return;
     }
 
-    const filePath = pathJoin(buildContext.themeSrcDirPath, "kc-gen.tsx");
+    const filePath = pathJoin(buildContext.themeSrcDirPath, "kc.gen.tsx");
 
     const hasLoginTheme = buildContext.implementedThemeTypes.login.isImplemented;
     const hasAccountTheme = buildContext.implementedThemeTypes.account.isImplemented;

src/lib/getKcClsx.ts

@@ -1,8 +1,7 @@
 import type { Param0 } from "tsafe";
 import { type CxArg, clsx_withTransform } from "../tools/clsx_withTransform";
 import { clsx } from "../tools/clsx";
-import { assert } from "tsafe/assert";
-import { is } from "tsafe/is";
+import { assert, is } from "tsafe/assert";
 
 export function createGetKcClsx<ClassKey extends string>(params: {
     defaultClasses: Record<ClassKey, string | undefined>;

src/login/KcContext/KcContext.ts

@@ -33,7 +33,7 @@ export type KcContext =
     | KcContext.LoginResetPassword
     | KcContext.LoginVerifyEmail
     | KcContext.Terms
-    | KcContext.LoginDeviceVerifyUserCode
+    | KcContext.LoginOauth2DeviceVerifyUserCode
     | KcContext.LoginOauthGrant
     | KcContext.LoginOtp
     | KcContext.LoginUsername
@@ -277,7 +277,7 @@ export declare namespace KcContext {
         __localizationRealmOverridesTermsText?: string;
     };
 
-    export type LoginDeviceVerifyUserCode = Common & {
+    export type LoginOauth2DeviceVerifyUserCode = Common & {
         pageId: "login-oauth2-device-verify-user-code.ftl";
         url: {
             oauth2DeviceVerificationAction: string;

src/login/KcContext/kcContextMocks.ts

@@ -290,7 +290,7 @@ export const kcContextMocks = [
         ...kcContextCommonMock,
         pageId: "terms.ftl"
     }),
-    id<KcContext.LoginDeviceVerifyUserCode>({
+    id<KcContext.LoginOauth2DeviceVerifyUserCode>({
         ...kcContextCommonMock,
         pageId: "login-oauth2-device-verify-user-code.ftl",
         url: loginUrl

src/login/TemplateProps.ts

@@ -11,7 +11,6 @@ export type TemplateProps<KcContext, I18n> = {
     displayInfo?: boolean;
     displayMessage?: boolean;
     displayRequiredFields?: boolean;
-    showAnotherWayIfPresent?: boolean;
     headerNode: ReactNode;
     socialProvidersNode?: ReactNode;
     infoNode?: ReactNode;

src/login/i18n/noJsx/getI18n.tsx

@@ -1,11 +1,11 @@
 import "keycloakify/tools/Object.fromEntries";
-import { assert } from "tsafe/assert";
+import { assert, is } from "tsafe/assert";
+import { extractLastParenthesisContent } from "keycloakify/tools/extractLastParenthesisContent";
 import messages_defaultSet_fallbackLanguage from "../messages_defaultSet/en";
 import { fetchMessages_defaultSet } from "../messages_defaultSet";
 import type { KcContext } from "../../KcContext";
 import { FALLBACK_LANGUAGE_TAG } from "keycloakify/bin/shared/constants";
 import { id } from "tsafe/id";
-import { is } from "tsafe/is";
 import { Reflect } from "tsafe/Reflect";
 import {
     type LanguageTag as LanguageTag_defaultSet,
@@ -169,12 +169,10 @@ export function createGetI18n<
                     break from_server;
                 }
 
-                // cspell: disable-next-line
-                // from "Espagnol (Español)" we want to extract "Español"
-                const match = supportedEntry.label.match(/[^(]+\(([^)]+)\)/);
+                const lastParenthesisContent = extractLastParenthesisContent(supportedEntry.label);
 
-                if (match !== null) {
-                    return match[1];
+                if (lastParenthesisContent !== undefined) {
+                    return lastParenthesisContent;
                 }
 
                 return supportedEntry.label;

src/login/pages/LoginPasskeysConditionalAuthenticate.tsx

@@ -115,62 +115,61 @@ export default function LoginPasskeysConditionalAuthenticate(
                                 </div>
                             </>
                         )}
-                        <div id="kc-form">
-                            <div id="kc-form-wrapper">
-                                {realm.password && (
-                                    <form
-                                        id="kc-form-passkey"
-                                        action={url.loginAction}
-                                        method="post"
-                                        style={{ display: "none" }}
-                                        onSubmit={event => {
-                                            try {
-                                                // @ts-expect-error
-                                                event.target.login.disabled = true;
-                                            } catch {}
-
-                                            return true;
-                                        }}
-                                    >
-                                        {!usernameHidden && (
-                                            <div className={kcClsx("kcFormGroupClass")}>
-                                                <label htmlFor="username" className={kcClsx("kcLabelClass")}>
-                                                    {msg("passkey-autofill-select")}
-                                                </label>
-                                                <input
-                                                    tabIndex={1}
-                                                    id="username"
-                                                    aria-invalid={messagesPerField.existsError("username")}
-                                                    className={kcClsx("kcInputClass")}
-                                                    name="username"
-                                                    defaultValue={login.username ?? ""}
-                                                    //autoComplete="username webauthn"
-                                                    type="text"
-                                                    autoFocus
-                                                    autoComplete="off"
-                                                />
-                                                {messagesPerField.existsError("username") && (
-                                                    <span id="input-error-username" className={kcClsx("kcInputErrorMessageClass")} aria-live="polite">
-                                                        {messagesPerField.get("username")}
-                                                    </span>
-                                                )}
-                                            </div>
-                                        )}
-                                    </form>
-                                )}
-                                <div id="kc-form-passkey-button" className={kcClsx("kcFormButtonsClass")} style={{ display: "none" }}>
-                                    <input
-                                        id={authButtonId}
-                                        type="button"
-                                        autoFocus
-                                        value={msgStr("passkey-doAuthenticate")}
-                                        className={kcClsx("kcButtonClass", "kcButtonPrimaryClass", "kcButtonBlockClass", "kcButtonLargeClass")}
-                                    />
-                                </div>
-                            </div>
-                        </div>
                     </>
                 )}
+                <div id="kc-form">
+                    <div id="kc-form-wrapper">
+                        {realm.password && (
+                            <form
+                                id="kc-form-login"
+                                action={url.loginAction}
+                                method="post"
+                                style={{ display: "none" }}
+                                onSubmit={event => {
+                                    try {
+                                        // @ts-expect-error
+                                        event.target.login.disabled = true;
+                                    } catch {}
+
+                                    return true;
+                                }}
+                            >
+                                {!usernameHidden && (
+                                    <div className={kcClsx("kcFormGroupClass")}>
+                                        <label htmlFor="username" className={kcClsx("kcLabelClass")}>
+                                            {msg("passkey-autofill-select")}
+                                        </label>
+                                        <input
+                                            tabIndex={1}
+                                            id="username"
+                                            aria-invalid={messagesPerField.existsError("username")}
+                                            className={kcClsx("kcInputClass")}
+                                            name="username"
+                                            defaultValue={login.username ?? ""}
+                                            autoComplete="username webauthn"
+                                            type="text"
+                                            autoFocus
+                                        />
+                                        {messagesPerField.existsError("username") && (
+                                            <span id="input-error-username" className={kcClsx("kcInputErrorMessageClass")} aria-live="polite">
+                                                {messagesPerField.get("username")}
+                                            </span>
+                                        )}
+                                    </div>
+                                )}
+                            </form>
+                        )}
+                        <div id="kc-form-passkey-button" className={kcClsx("kcFormButtonsClass")} style={{ display: "none" }}>
+                            <input
+                                id={authButtonId}
+                                type="button"
+                                autoFocus
+                                value={msgStr("passkey-doAuthenticate")}
+                                className={kcClsx("kcButtonClass", "kcButtonPrimaryClass", "kcButtonBlockClass", "kcButtonLargeClass")}
+                            />
+                        </div>
+                    </div>
+                </div>
             </div>
         </Template>
     );

src/tools/StatefulObservable/StatefulObservable.ts

@@ -1,5 +1,4 @@
-import { assert } from "tsafe/assert";
-import { is } from "tsafe/is";
+import { assert, is } from "tsafe/assert";
 
 export type StatefulObservable<T> = {
     current: T;

src/tools/deepAssign.ts

@@ -1,5 +1,4 @@
-import { assert } from "tsafe/assert";
-import { is } from "tsafe/is";
+import { assert, is } from "tsafe/assert";
 import { structuredCloneButFunctions } from "./structuredCloneButFunctions";
 
 /** NOTE: Array a copied over, not merged. */

src/tools/extractLastParenthesisContent.ts

@@ -0,0 +1,43 @@
+/**
+ * "Hello (world)" => "world"
+ * "Hello (world) (foo)" => "foo"
+ * "Hello (world (foo))" => "world (foo)"
+ */
+export function extractLastParenthesisContent(str: string): string | undefined {
+    const chars: string[] = [];
+
+    for (const char of str) {
+        chars.push(char);
+    }
+
+    const extractedChars: string[] = [];
+    let openingCount = 0;
+
+    loop_through_char: for (let i = chars.length - 1; i >= 0; i--) {
+        const char = chars[i];
+
+        if (i === chars.length - 1) {
+            if (char !== ")") {
+                return undefined;
+            }
+
+            continue;
+        }
+
+        switch (char) {
+            case ")":
+                openingCount++;
+                break;
+            case "(":
+                if (openingCount === 0) {
+                    return extractedChars.join("");
+                }
+                openingCount--;
+                break;
+        }
+
+        extractedChars.unshift(char);
+    }
+
+    return undefined;
+}

stories/login/pages/Info.stories.tsx

@@ -17,6 +17,7 @@ export const Default: Story = {
     render: () => (
         <KcPageStory
             kcContext={{
+                messageHeader: "Message header",
                 message: {
                     summary: "Server info message"
                 }
@@ -29,6 +30,7 @@ export const WithLinkBack: Story = {
     render: () => (
         <KcPageStory
             kcContext={{
+                messageHeader: "Message header",
                 message: {
                     summary: "Server message"
                 },
@@ -42,6 +44,7 @@ export const WithRequiredActions: Story = {
     render: () => (
         <KcPageStory
             kcContext={{
+                messageHeader: "Message header",
                 message: {
                     summary: "Required actions: "
                 },
@@ -55,42 +58,3 @@ export const WithRequiredActions: Story = {
         />
     )
 };
-export const WithPageRedirect: Story = {
-    render: () => (
-        <KcPageStory
-            kcContext={{
-                message: { summary: "You will be redirected shortly." },
-                pageRedirectUri: "https://example.com"
-            }}
-        />
-    )
-};
-export const WithoutClientBaseUrl: Story = {
-    render: () => (
-        <KcPageStory
-            kcContext={{
-                message: { summary: "No client base URL defined." },
-                client: { baseUrl: undefined }
-            }}
-        />
-    )
-};
-export const WithMessageHeader: Story = {
-    render: () => (
-        <KcPageStory
-            kcContext={{
-                messageHeader: "Important Notice",
-                message: { summary: "This is an important message." }
-            }}
-        />
-    )
-};
-export const WithAdvancedMessage: Story = {
-    render: () => (
-        <KcPageStory
-            kcContext={{
-                message: { summary: "Please take note of this <strong>important</strong> information." }
-            }}
-        />
-    )
-};

stories/login/pages/LoginDeviceVerifyUserCode.stories.tsx

@@ -1,18 +0,0 @@
-import React from "react";
-import type { Meta, StoryObj } from "@storybook/react";
-import { createKcPageStory } from "../KcPageStory";
-
-const { KcPageStory } = createKcPageStory({ pageId: "login-oauth2-device-verify-user-code.ftl" });
-
-const meta = {
-    title: "login/login-oauth2-device-verify-user-code.ftl",
-    component: KcPageStory
-} satisfies Meta<typeof KcPageStory>;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-    render: () => <KcPageStory />
-};

test/tsconfig.json

@@ -17,8 +17,5 @@
         "skipLibCheck": true
     },
     "include": ["../src", "."],
-    "exclude": [
-        "../src/bin/initialize-account-theme/src",
-        "../src/bin/initialize-admin-theme/src"
-    ]
+    "exclude": ["../src/bin/initialize-account-theme/src"]
 }

yarn.lock

@@ -6172,6 +6172,14 @@ d@1, d@^1.0.1:
     es5-ext "^0.10.50"
     type "^1.0.1"
 
+d@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/d/-/d-1.0.2.tgz#2aefd554b81981e7dccf72d6842ae725cb17e5de"
+  integrity sha512-MOqHvMWF9/9MX6nza0KgvFH4HpMU0EF5uUDXqX/BtxtU8NfB0QzRtJ8Oe/6SuS4kbhyzVJwjd97EA4PKrzJ8bw==
+  dependencies:
+    es5-ext "^0.10.64"
+    type "^2.7.2"
+
 data-urls@^5.0.0:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/data-urls/-/data-urls-5.0.0.tgz#2f76906bce1824429ffecb6920f45a0b30f00dde"
@@ -6743,7 +6751,7 @@ es-to-primitive@^1.2.1:
     is-date-object "^1.0.1"
     is-symbol "^1.0.2"
 
-es5-ext@^0.10.35, es5-ext@^0.10.46, es5-ext@^0.10.50, es5-ext@^0.10.53, es5-ext@~0.10.14, es5-ext@~0.10.2, es5-ext@~0.10.46:
+es5-ext@^0.10.35, es5-ext@^0.10.46, es5-ext@^0.10.50, es5-ext@~0.10.14, es5-ext@~0.10.2, es5-ext@~0.10.46:
   version "0.10.62"
   resolved "https://registry.yarnpkg.com/es5-ext/-/es5-ext-0.10.62.tgz#5e6adc19a6da524bf3d1e02bbc8960e5eb49a9a5"
   integrity sha512-BHLqn0klhEpnOKSrzn/Xsz2UIW8j+cGmo9JLzr8BiUapV8hPL9+FliFqjwr9ngW7jWdnxv6eO+/LqyhJVqgrjA==
@@ -6752,6 +6760,16 @@ es5-ext@^0.10.35, es5-ext@^0.10.46, es5-ext@^0.10.50, es5-ext@^0.10.53, es5-ext@
     es6-symbol "^3.1.3"
     next-tick "^1.1.0"
 
+es5-ext@^0.10.62, es5-ext@^0.10.64:
+  version "0.10.64"
+  resolved "https://registry.yarnpkg.com/es5-ext/-/es5-ext-0.10.64.tgz#12e4ffb48f1ba2ea777f1fcdd1918ef73ea21714"
+  integrity sha512-p2snDhiLaXe6dahss1LddxqEm+SkuDvV8dnIQG0MWjyHpcMNfXKPE+/Cc0y+PhxJX3A4xGNeFCj5oc0BUh6deg==
+  dependencies:
+    es6-iterator "^2.0.3"
+    es6-symbol "^3.1.3"
+    esniff "^2.0.1"
+    next-tick "^1.1.0"
+
 es5-shim@^4.5.13:
   version "4.6.7"
   resolved "https://registry.yarnpkg.com/es5-shim/-/es5-shim-4.6.7.tgz#bc67ae0fc3dd520636e0a1601cc73b450ad3e955"
@@ -6920,6 +6938,16 @@ eslint-visitor-keys@^3.3.0:
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.0.tgz#c7f0f956124ce677047ddbc192a68f999454dedc"
   integrity sha512-HPpKPUBQcAsZOsHAFwTtIKcYlCje62XB7SEAcxjtmW6TD1WVpkS6i6/hOVtTZIl4zGj/mBqpFVGvaDneik+VoQ==
 
+esniff@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/esniff/-/esniff-2.0.1.tgz#a4d4b43a5c71c7ec51c51098c1d8a29081f9b308"
+  integrity sha512-kTUIGKQ/mDPFoJ0oVfcmyJn4iBDRptjNVIzwIFR7tqWXdVI9xfA2RMwY/gbSpJG3lkdWNEjLap/NqVHZiJsdfg==
+  dependencies:
+    d "^1.0.1"
+    es5-ext "^0.10.62"
+    event-emitter "^0.3.5"
+    type "^2.7.2"
+
 esprima@^4.0.1, esprima@~4.0.0:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
@@ -6994,14 +7022,14 @@ evp_bytestokey@^1.0.0, evp_bytestokey@^1.0.3:
     md5.js "^1.3.4"
     safe-buffer "^5.1.1"
 
-evt@^2.5.7:
-  version "2.5.7"
-  resolved "https://registry.yarnpkg.com/evt/-/evt-2.5.7.tgz#55c5f8ff910f4b7531bfac91e963d4cb3231f253"
-  integrity sha512-dr7Wd16ry5F8WNU1xXLKpFpO3HsoAGg8zC48e08vDdzMzGWCP9/QFGt1PQptEEDh8SwYP3EL8M+d/Gb0kgUp6g==
+evt@^2.5.8:
+  version "2.5.8"
+  resolved "https://registry.yarnpkg.com/evt/-/evt-2.5.8.tgz#4cc4e2db92d89cc43e00a0755703317f5f9b6d4c"
+  integrity sha512-wjurRtEqepH03fZSzkCUAw2tNNtEoeoEYXf7EqG8uU52wQ3D/+ctyQE8hf+YR/5DXZlwl2jNGLMm4hAd/wyD6g==
   dependencies:
     minimal-polyfills "^2.2.3"
     run-exclusive "^2.2.19"
-    tsafe "^1.6.6"
+    tsafe "^1.8.5"
 
 execa@^5.1.1:
   version "5.1.1"
@@ -9350,13 +9378,13 @@ memfs@^3.1.2, memfs@^3.2.2:
   dependencies:
     fs-monkey "^1.0.3"
 
-memoizee@^0.4.15:
-  version "0.4.15"
-  resolved "https://registry.yarnpkg.com/memoizee/-/memoizee-0.4.15.tgz#e6f3d2da863f318d02225391829a6c5956555b72"
-  integrity sha512-UBWmJpLZd5STPm7PMUlOw/TSy972M+z8gcyQ5veOnSDRREz/0bmpyTfKt3/51DhEBqCZQn1udM/5flcSPYhkdQ==
+memoizee@^0.4.17:
+  version "0.4.17"
+  resolved "https://registry.yarnpkg.com/memoizee/-/memoizee-0.4.17.tgz#942a5f8acee281fa6fb9c620bddc57e3b7382949"
+  integrity sha512-DGqD7Hjpi/1or4F/aYAspXKNm5Yili0QDAFAY4QYvpqpgiY6+1jOfqpmByzjxbWd/T9mChbCArXAbDAsTm5oXA==
   dependencies:
-    d "^1.0.1"
-    es5-ext "^0.10.53"
+    d "^1.0.2"
+    es5-ext "^0.10.64"
     es6-weak-map "^2.0.3"
     event-emitter "^0.3.5"
     is-promise "^2.2.2"
@@ -10629,14 +10657,14 @@ postcss@^8.4.38:
     picocolors "^1.0.0"
     source-map-js "^1.2.0"
 
-powerhooks@^1.0.10:
-  version "1.0.10"
-  resolved "https://registry.yarnpkg.com/powerhooks/-/powerhooks-1.0.10.tgz#9d532b23294cba69d5872d859bdf843b91cb9c41"
-  integrity sha512-fJmKSVJk9Bkotl9rK1ryVPSqhY4xOZKxM6deyTaMbICK8jHh/CQztN2mNTxlKu6vkJBIFj1cRd/7N6slh3uM6w==
+powerhooks@^1.0.19:
+  version "1.0.19"
+  resolved "https://registry.yarnpkg.com/powerhooks/-/powerhooks-1.0.19.tgz#e93ce44f55d31ca26a4511883a49cfe5341d47af"
+  integrity sha512-kmZX0LLvJyaIphwf2FjKABAQwQFrRqsEA41N4CB8EzfDobyXle545t4teajVo/NPboy0HEaioyv55FWN7d58/Q==
   dependencies:
-    evt "^2.5.7"
-    memoizee "^0.4.15"
-    tsafe "^1.6.6"
+    evt "^2.5.8"
+    memoizee "^0.4.17"
+    tsafe "^1.8.5"
 
 prelude-ls@~1.1.2:
   version "1.1.2"
@@ -12574,15 +12602,10 @@ ts-pnp@^1.1.6:
   resolved "https://registry.yarnpkg.com/ts-pnp/-/ts-pnp-1.2.0.tgz#a500ad084b0798f1c3071af391e65912c86bca92"
   integrity sha512-csd+vJOb/gkzvcCHgTGSChYpy5f1/XKNsmvBGO4JXS+z1v2HobugDz4s1IeFXM3wZB44uczs+eazB5Q/ccdhQw==
 
-tsafe@^1.6.6:
-  version "1.6.6"
-  resolved "https://registry.yarnpkg.com/tsafe/-/tsafe-1.6.6.tgz#fd93e64d6eb13ef83ed1650669cc24bad4f5df9f"
-  integrity sha512-gzkapsdbMNwBnTIjgO758GujLCj031IgHK/PKr2mrmkCSJMhSOR5FeOuSxKLMUoYc0vAA4RGEYYbjt/v6afD3g==
-
-tsafe@^1.7.5:
-  version "1.7.5"
-  resolved "https://registry.yarnpkg.com/tsafe/-/tsafe-1.7.5.tgz#0d3a31202b5ef87c7ba997e66e03fd80801278ef"
-  integrity sha512-tbNyyBSbwfbilFfiuXkSOj82a6++ovgANwcoqBAcO9/REPoZMEQoE8kWPeO0dy5A2D/2Lajr8Ohue5T0ifIvLQ==
+tsafe@^1.8.5:
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/tsafe/-/tsafe-1.8.5.tgz#cdf9fa3111974ac480d7ee519f8241815e5d22ea"
+  integrity sha512-LFWTWQrW6rwSY+IBNFl2ridGfUzVsPwrZ26T4KUJww/py8rzaQ/SY+MIz6YROozpUCaRcuISqagmlwub9YT9kw==
 
 tsc-alias@^1.8.10:
   version "1.8.10"