Bump version

respect inputOptionLabels

.all-contributorsrc

@@ -269,6 +269,27 @@
         "test",
         "code"
       ]
+    },
+    {
+      "login": "kathari00",
+      "name": "Katharina Eiserfey",
+      "avatar_url": "https://avatars.githubusercontent.com/u/42547712?v=4",
+      "profile": "https://github.com/kathari00",
+      "contributions": [
+        "code",
+        "test",
+        "doc"
+      ]
+    },
+    {
+      "login": "luca-peruzzo",
+      "name": "Luca Peruzzo",
+      "avatar_url": "https://avatars.githubusercontent.com/u/69015314?v=4",
+      "profile": "https://github.com/luca-peruzzo",
+      "contributions": [
+        "code",
+        "test"
+      ]
     }
   ],
   "contributorsPerLine": 7,

.github/workflows/ci.yaml

@@ -112,7 +112,7 @@ jobs:
         registry-url: https://registry.npmjs.org/
     - uses: bahmutov/npm-install@v1
     - run: npm run build
-    - run: npx -y -p denoify@1.6.12 enable_short_npm_import_path
+    - run: npx -y -p denoify@1.6.13 enable_short_npm_import_path
       env:
         DRY_RUN: "0"
     - uses: garronej/ts-ci@v2.1.2

README.md

@@ -134,6 +134,8 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
     </tr>
     <tr>
       <td align="center" valign="top" width="14.28%"><a href="https://www.linkedin.com/in/oes-rioniz/"><img src="https://avatars.githubusercontent.com/u/5172296?v=4?s=100" width="100px;" alt="Omid"/><br /><sub><b>Omid</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=uchar" title="Tests">⚠️</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=uchar" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/kathari00"><img src="https://avatars.githubusercontent.com/u/42547712?v=4?s=100" width="100px;" alt="Katharina Eiserfey"/><br /><sub><b>Katharina Eiserfey</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=kathari00" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=kathari00" title="Tests">⚠️</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=kathari00" title="Documentation">📖</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/luca-peruzzo"><img src="https://avatars.githubusercontent.com/u/69015314?v=4?s=100" width="100px;" alt="Luca Peruzzo"/><br /><sub><b>Luca Peruzzo</b></sub></a><br /><a href="https://github.com/keycloakify/keycloakify/commits?author=luca-peruzzo" title="Code">💻</a> <a href="https://github.com/keycloakify/keycloakify/commits?author=luca-peruzzo" title="Tests">⚠️</a></td>
     </tr>
   </tbody>
 </table>

package.json

@@ -1,6 +1,6 @@
 {
     "name": "keycloakify",
-    "version": "11.2.1",
+    "version": "11.2.8",
     "description": "Framework to create custom Keycloak UIs",
     "repository": {
         "type": "git",
@@ -62,7 +62,7 @@
     ],
     "homepage": "https://www.keycloakify.dev",
     "dependencies": {
-        "tsafe": "^1.6.6"
+        "tsafe": "^1.7.5"
     },
     "devDependencies": {
         "@babel/core": "^7.24.5",

src/bin/keycloakify/generateFtl/kcContextDeclarationTemplate.ftl

@@ -166,7 +166,7 @@ function decodeHtmlEntities(htmlStr){
                     areSamePath(path, []) &&
                     ["login-idp-link-confirm.ftl", "login-idp-link-email.ftl" ]?seq_contains(xKeycloakify.pageId)
                 ) ||  (
-                    ["masterAdminClient", "delegateForUpdate", "defaultRole"]?seq_contains(key) &&
+                    ["masterAdminClient", "delegateForUpdate", "defaultRole", "smtpConfig"]?seq_contains(key) &&
                     areSamePath(path, ["realm"])
                 ) || (
                     xKeycloakify.pageId == "error.ftl" &&

src/login/KcContext/KcContext.ts

@@ -2,7 +2,7 @@ import type { ThemeType, LoginThemePageId } from "keycloakify/bin/shared/constan
 import type { ValueOf } from "keycloakify/tools/ValueOf";
 import { assert } from "tsafe/assert";
 import type { Equals } from "tsafe";
-import type { ClassKey } from "keycloakify/login/TemplateProps";
+import type { ClassKey } from "keycloakify/login/lib/kcClsx";
 
 export type ExtendKcContext<
     KcContextExtension extends { properties?: Record<string, string | undefined> },

src/login/UserProfileFormFields.tsx

@@ -434,9 +434,7 @@ function AddRemoveButtonsMultiValuedAttribute(props: {
 }
 
 function InputTagSelects(props: InputFieldByTypeProps) {
-    const { attribute, dispatchFormAction, kcClsx, valueOrValues } = props;
-
-    const { advancedMsg } = props.i18n;
+    const { attribute, dispatchFormAction, kcClsx, i18n, valueOrValues } = props;
 
     const { classDiv, classInput, classLabel, inputType } = (() => {
         const { inputType } = attribute.annotations;
@@ -533,7 +531,7 @@ function InputTagSelects(props: InputFieldByTypeProps) {
                         htmlFor={`${attribute.name}-${option}`}
                         className={`${classLabel}${attribute.readOnly ? ` ${kcClsx("kcInputClassRadioCheckboxLabelDisabled")}` : ""}`}
                     >
-                        {advancedMsg(option)}
+                        {inputLabel(i18n, attribute, option)}
                     </label>
                 </div>
             ))}
@@ -580,8 +578,6 @@ function TextareaTag(props: InputFieldByTypeProps) {
 function SelectTag(props: InputFieldByTypeProps) {
     const { attribute, dispatchFormAction, kcClsx, displayableErrors, i18n, valueOrValues } = props;
 
-    const { advancedMsgStr } = i18n;
-
     const isMultiple = attribute.annotations.inputType === "multiselect";
 
     return (
@@ -645,22 +641,26 @@ function SelectTag(props: InputFieldByTypeProps) {
 
                 return options.map(option => (
                     <option key={option} value={option}>
-                        {(() => {
-                            if (attribute.annotations.inputOptionLabels !== undefined) {
-                                const { inputOptionLabels } = attribute.annotations;
-
-                                return advancedMsgStr(inputOptionLabels[option] ?? option);
-                            }
-
-                            if (attribute.annotations.inputOptionLabelsI18nPrefix !== undefined) {
-                                return advancedMsgStr(`${attribute.annotations.inputOptionLabelsI18nPrefix}.${option}`);
-                            }
-
-                            return option;
-                        })()}
+                        {inputLabel(i18n, attribute, option)}
                     </option>
                 ));
             })()}
         </select>
     );
 }
+
+function inputLabel(i18n: I18n, attribute: Attribute, option: string) {
+    const { advancedMsg } = i18n;
+
+    if (attribute.annotations.inputOptionLabels !== undefined) {
+        const { inputOptionLabels } = attribute.annotations;
+
+        return advancedMsg(inputOptionLabels[option] ?? option);
+    }
+
+    if (attribute.annotations.inputOptionLabelsI18nPrefix !== undefined) {
+        return advancedMsg(`${attribute.annotations.inputOptionLabelsI18nPrefix}.${option}`);
+    }
+
+    return option;
+}

src/vite-plugin/vite-plugin.ts

@@ -166,7 +166,7 @@ export function keycloakify(params: keycloakify.Params) {
                 [
                     `(`,
                     `(window.kcContext === undefined || import.meta.env.MODE === "development")?`,
-                    `"${urlPathname ?? "/"}":`,
+                    `import.meta.env.BASE_URL:`,
                     `(window.kcContext["x-keycloakify"].resourcesPath + "/${WELL_KNOWN_DIRECTORY_BASE_NAME.DIST}/")`,
                     `)`
                 ].join("")

stories/login/pages/Register.stories.tsx

@@ -115,6 +115,38 @@ export const WithFavoritePet: Story = {
     )
 };
 
+
+export const WithNewsletter: Story = {
+    render: () => (
+        <KcPageStory
+            kcContext={{
+                profile: {
+                    attributesByName: {
+                        newsletter: {
+                            name: "newsletter",
+                            displayName: "Sign up to the newsletter",
+                            validators: {
+                                options: {
+                                    options: ["yes"]
+                                }
+                            },
+                            annotations: {
+                                inputOptionLabels: {
+                                    "yes": "I want my email inbox filled with spam"
+                                },
+                                inputType: "multiselect-checkboxes"
+                            },
+                            required: false,
+                            readOnly: false
+                        } satisfies Attribute
+                    }
+                },
+            }}
+        />
+    )
+};
+
+
 export const WithEmailAsUsername: Story = {
     render: () => (
         <KcPageStory

yarn.lock

@@ -12579,6 +12579,11 @@ tsafe@^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==
+
 tsc-alias@^1.8.10:
   version "1.8.10"
   resolved "https://registry.yarnpkg.com/tsc-alias/-/tsc-alias-1.8.10.tgz#279f9bf0dd8bc10fb27820393d4881db5a303938"