@keycloakify/angular 0.0.1-rc.17 → 0.0.1-rc.19

package/fesm2022/keycloakify-angular-account-pages-log.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"keycloakify-angular-account-pages-log.mjs","sources":["../../src/account/pages/log/log.component.ts","../../src/account/pages/log/log.component.html","../../src/account/pages/log/keycloakify-angular-account-pages-log.ts"],"sourcesContent":["import { DatePipe, NgClass } from '@angular/common';\nimport { Component, forwardRef, inject } from '@angular/core';\nimport { ComponentReference } from '@keycloakify/angular/account/classes/component-reference';\nimport { TemplateComponent } from '@keycloakify/angular/account/containers/template';\nimport { KcClassDirective } from '@keycloakify/angular/account/directives/kc-class';\nimport { ACCOUNT_CLASSES } from '@keycloakify/angular/account/tokens/classes';\nimport { ACCOUNT_I18N } from '@keycloakify/angular/account/tokens/i18n';\nimport { KC_ACCOUNT_CONTEXT } from '@keycloakify/angular/account/tokens/kc-context';\nimport { USE_DEFAULT_CSS } from '@keycloakify/angular/lib/tokens/use-default-css';\nimport type { ClassKey } from 'keycloakify/account';\nimport type { I18n } from '@keycloakify/angular/account/i18n';\nimport type { KcContext } from '@keycloakify/angular/account/KcContext';\n\n@Component({\n    standalone: true,\n    imports: [KcClassDirective, TemplateComponent, NgClass, DatePipe],\n    selector: 'kc-root',\n    templateUrl: 'log.component.html',\n    providers: [\n        {\n            provide: ComponentReference,\n            useExisting: forwardRef(() => LogComponent)\n        }\n    ]\n})\nexport class LogComponent extends ComponentReference {\n    i18n = inject<I18n>(ACCOUNT_I18N);\n    kcContext = inject<Extract<KcContext, { pageId: 'log.ftl' }>>(KC_ACCOUNT_CONTEXT);\n    override doUseDefaultCss = inject<boolean>(USE_DEFAULT_CSS);\n    override classes = inject<Partial<Record<ClassKey, string>>>(ACCOUNT_CLASSES);\n}\n","@let log = kcContext.log;\n\n<kc-account-template [active]=\"'log'\">\n    <ng-container content>\n        <div [kcClass]=\"'kcContentWrapperClass'\">\n            <div class=\"col-md-10\">\n                <h2>{{ i18n.msgStr('accountLogHtmlTitle') }}</h2>\n            </div>\n\n            <table class=\"table table-striped table-bordered\">\n                <thead>\n                    <tr>\n                        <td>{{ i18n.msgStr('date') }}</td>\n                        <td>{{ i18n.msgStr('event') }}</td>\n                        <td>{{ i18n.msgStr('ip') }}</td>\n                        <td>{{ i18n.msgStr('client') }}</td>\n                        <td>{{ i18n.msgStr('details') }}</td>\n                    </tr>\n                </thead>\n\n                <tbody>\n                    @for (event of log.events; track event) {\n                        <tr>\n                            <td>{{ event.date ? (event.date | date) : '' }}</td>\n                            <td>{{ event.event }}</td>\n                            <td>{{ event.ipAddress }}</td>\n                            <td>{{ event.client || '' }}</td>\n                            <td>\n                                @for (detail of event.details; track detail; let last = $last) {\n                                    <span>\n                                        {{ detail.key }} = {{ detail.value }}\n                                        @if (!last) {\n                                            ,&nbsp;\n                                        }\n                                    </span>\n                                }\n                            </td>\n                        </tr>\n                    }\n                </tbody>\n            </table>\n        </div>\n    </ng-container>\n</kc-account-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;AAyBM,MAAO,YAAa,SAAQ,kBAAkB,CAAA;AAZpD,IAAA,WAAA,GAAA;;AAaI,QAAA,IAAA,CAAA,IAAI,GAAG,MAAM,CAAO,YAAY,CAAC,CAAC;AAClC,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAA4C,kBAAkB,CAAC,CAAC;AACzE,QAAA,IAAA,CAAA,eAAe,GAAG,MAAM,CAAU,eAAe,CAAC,CAAC;AACnD,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAoC,eAAe,CAAC,CAAC;AACjF,KAAA;8GALY,YAAY,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAZ,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,EAPV,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA;AACP,YAAA;AACI,gBAAA,OAAO,EAAE,kBAAkB;AAC3B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,YAAY,CAAC;AAC9C,aAAA;AACJ,SAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECvBL,6xDA4CA,ED7Bc,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,gBAAgB,EAAE,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,iBAAiB,+EAAW,QAAQ,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAUvD,YAAY,EAAA,UAAA,EAAA,CAAA;kBAZxB,SAAS;AACM,YAAA,IAAA,EAAA,CAAA,EAAA,UAAA,EAAA,IAAI,EACP,OAAA,EAAA,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,OAAO,EAAE,QAAQ,CAAC,EACvD,QAAA,EAAA,SAAS,EAER,SAAA,EAAA;AACP,wBAAA;AACI,4BAAA,OAAO,EAAE,kBAAkB;AAC3B,4BAAA,WAAW,EAAE,UAAU,CAAC,kBAAkB,CAAC;AAC9C,yBAAA;AACJ,qBAAA,EAAA,QAAA,EAAA,6xDAAA,EAAA,CAAA;;;AEvBL;;AAEG;;;;"}
+{"version":3,"file":"keycloakify-angular-account-pages-log.mjs","sources":["../../src/account/pages/log/log.component.ts","../../src/account/pages/log/log.component.html","../../src/account/pages/log/keycloakify-angular-account-pages-log.ts"],"sourcesContent":["import { DatePipe, NgClass } from '@angular/common';\nimport { Component, forwardRef, inject } from '@angular/core';\nimport { ComponentReference } from '@keycloakify/angular/account/classes/component-reference';\nimport { TemplateComponent } from '@keycloakify/angular/account/containers/template';\nimport { KcClassDirective } from '@keycloakify/angular/account/directives/kc-class';\nimport type { I18n } from '@keycloakify/angular/account/i18n';\nimport type { KcContext } from '@keycloakify/angular/account/KcContext';\nimport { ACCOUNT_CLASSES } from '@keycloakify/angular/account/tokens/classes';\nimport { ACCOUNT_I18N } from '@keycloakify/angular/account/tokens/i18n';\nimport { KC_ACCOUNT_CONTEXT } from '@keycloakify/angular/account/tokens/kc-context';\nimport { USE_DEFAULT_CSS } from '@keycloakify/angular/lib/tokens/use-default-css';\nimport type { ClassKey } from 'keycloakify/account';\n\n@Component({\n    standalone: true,\n    imports: [KcClassDirective, TemplateComponent, NgClass, DatePipe],\n    selector: 'kc-log',\n    templateUrl: 'log.component.html',\n    providers: [\n        {\n            provide: ComponentReference,\n            useExisting: forwardRef(() => LogComponent)\n        }\n    ]\n})\nexport class LogComponent extends ComponentReference {\n    i18n = inject<I18n>(ACCOUNT_I18N);\n    kcContext = inject<Extract<KcContext, { pageId: 'log.ftl' }>>(KC_ACCOUNT_CONTEXT);\n    override doUseDefaultCss = inject<boolean>(USE_DEFAULT_CSS);\n    override classes = inject<Partial<Record<ClassKey, string>>>(ACCOUNT_CLASSES);\n    active = 'log';\n}\n","@let log = kcContext.log;\n\n<div [kcClass]=\"'kcContentWrapperClass'\">\n    <div class=\"col-md-10\">\n        <h2>{{ i18n.msgStr('accountLogHtmlTitle') }}</h2>\n    </div>\n\n    <table class=\"table table-striped table-bordered\">\n        <thead>\n            <tr>\n                <td>{{ i18n.msgStr('date') }}</td>\n                <td>{{ i18n.msgStr('event') }}</td>\n                <td>{{ i18n.msgStr('ip') }}</td>\n                <td>{{ i18n.msgStr('client') }}</td>\n                <td>{{ i18n.msgStr('details') }}</td>\n            </tr>\n        </thead>\n\n        <tbody>\n            @for (event of log.events; track event) {\n                <tr>\n                    <td>{{ event.date ? (event.date | date) : '' }}</td>\n                    <td>{{ event.event }}</td>\n                    <td>{{ event.ipAddress }}</td>\n                    <td>{{ event.client || '' }}</td>\n                    <td>\n                        @for (detail of event.details; track detail; let last = $last) {\n                            <span>\n                                {{ detail.key }} = {{ detail.value }}\n                                @if (!last) {\n                                    ,&nbsp;\n                                }\n                            </span>\n                        }\n                    </td>\n                </tr>\n            }\n        </tbody>\n    </table>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;AAyBM,MAAO,YAAa,SAAQ,kBAAkB,CAAA;AAZpD,IAAA,WAAA,GAAA;;AAaI,QAAA,IAAA,CAAA,IAAI,GAAG,MAAM,CAAO,YAAY,CAAC,CAAC;AAClC,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAA4C,kBAAkB,CAAC,CAAC;AACzE,QAAA,IAAA,CAAA,eAAe,GAAG,MAAM,CAAU,eAAe,CAAC,CAAC;AACnD,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAoC,eAAe,CAAC,CAAC;QAC9E,IAAM,CAAA,MAAA,GAAG,KAAK,CAAC;AAClB,KAAA;8GANY,YAAY,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAZ,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,EAPV,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,SAAA,EAAA;AACP,YAAA;AACI,gBAAA,OAAO,EAAE,kBAAkB;AAC3B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,YAAY,CAAC;AAC9C,aAAA;AACJ,SAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECvBL,04CAwCA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDzBc,gBAAgB,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAA8B,QAAQ,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAUvD,YAAY,EAAA,UAAA,EAAA,CAAA;kBAZxB,SAAS;AACM,YAAA,IAAA,EAAA,CAAA,EAAA,UAAA,EAAA,IAAI,EACP,OAAA,EAAA,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,OAAO,EAAE,QAAQ,CAAC,EACvD,QAAA,EAAA,QAAQ,EAEP,SAAA,EAAA;AACP,wBAAA;AACI,4BAAA,OAAO,EAAE,kBAAkB;AAC3B,4BAAA,WAAW,EAAE,UAAU,CAAC,kBAAkB,CAAC;AAC9C,yBAAA;AACJ,qBAAA,EAAA,QAAA,EAAA,04CAAA,EAAA,CAAA;;;AEvBL;;AAEG;;;;"}

package/fesm2022/keycloakify-angular-account-pages-password.mjs

@@ -19,6 +19,7 @@ class PasswordComponent extends ComponentReference {
         this.additionalClasses = {
             kcBodyClass: `${this.classes?.kcBodyClass} password`
         };
+        this.active = 'password';
         this.currentPassword = signal('');
         this.newPassword = signal('');
         this.newPasswordConfirm = signal('');
@@ -26,6 +27,7 @@ class PasswordComponent extends ComponentReference {
         this.newPasswordConfirmError = signal('');
         this.hasNewPasswordBlurred = signal(false);
         this.hasNewPasswordConfirmBlurred = signal(false);
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
         // @ts-ignore
         window.kcContext = {
             ...this.kcContext,
@@ -88,22 +90,22 @@ class PasswordComponent extends ComponentReference {
         this.hasNewPasswordConfirmBlurred.set(true);
         this.checkNewPasswordConfirm(this.newPasswordConfirm());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: PasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.6", type: PasswordComponent, isStandalone: true, selector: "kc-root", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.7", ngImport: i0, type: PasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.7", type: PasswordComponent, isStandalone: true, selector: "kc-password", providers: [
             {
                 provide: ComponentReference,
                 useExisting: forwardRef(() => PasswordComponent)
             }
-        ], usesInheritance: true, ngImport: i0, template: "@let url = kcContext.url;\n@let password = kcContext.password;\n@let account = kcContext.account;\n@let stateChecker = kcContext.stateChecker;\n\n<kc-account-template [active]=\"'password'\">\n    <ng-container content>\n        <div class=\"row\">\n            <div class=\"col-md-10\">\n                <h2>{{ i18n.msgStr('changePasswordHtmlTitle') }}</h2>\n            </div>\n            <div class=\"col-md-2 subtitle\">\n                <span class=\"subtitle\">{{ i18n.msgStr('allFieldsRequired') }}</span>\n            </div>\n        </div>\n\n        <form\n            [action]=\"url.passwordUrl\"\n            class=\"form-horizontal\"\n            method=\"post\"\n        >\n            <input\n                type=\"text\"\n                id=\"username\"\n                name=\"username\"\n                [value]=\"account.username ?? ''\"\n                autoComplete=\"username\"\n                readOnly\n                [style.display]=\"'none'\"\n            />\n\n            @if (password.passwordSet) {\n                <div class=\"form-group\">\n                    <div class=\"col-sm-2 col-md-2\">\n                        <label\n                            for=\"password\"\n                            class=\"control-label\"\n                        >\n                            {{ i18n.msgStr('password') }}\n                        </label>\n                    </div>\n                    <div class=\"col-sm-10 col-md-10\">\n                        <input\n                            type=\"password\"\n                            class=\"form-control\"\n                            id=\"password\"\n                            name=\"password\"\n                            autoFocus\n                            autoComplete=\"current-password\"\n                            [value]=\"currentPassword()\"\n                            (change)=\"currentPassword.set($any($event.target).value)\"\n                        />\n                    </div>\n                </div>\n            }\n\n            <input\n                type=\"hidden\"\n                id=\"stateChecker\"\n                name=\"stateChecker\"\n                [value]=\"stateChecker\"\n            />\n\n            <div class=\"form-group\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"password-new\"\n                        class=\"control-label\"\n                    >\n                        {{ i18n.msgStr('passwordNew') }}\n                    </label>\n                </div>\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"password\"\n                        class=\"form-control\"\n                        id=\"password-new\"\n                        name=\"password-new\"\n                        autoComplete=\"new-password\"\n                        [value]=\"newPassword()\"\n                        (change)=\"onNewPasswordChange($any($event.target).value)\"\n                        (blur)=\"onNewPasswordBlur()\"\n                    />\n                </div>\n            </div>\n\n            <div class=\"form-group\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"password-confirm\"\n                        class=\"control-label two-lines\"\n                    >\n                        {{ i18n.msgStr('passwordConfirm') }}\n                    </label>\n                </div>\n\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"password\"\n                        class=\"form-control\"\n                        id=\"password-confirm\"\n                        name=\"password-confirm\"\n                        autoComplete=\"new-password\"\n                        [value]=\"newPasswordConfirm()\"\n                        (change)=\"onNewPasswordConfirmChange($any($event.target).value)\"\n                        (blur)=\"onNewPasswordConfirmBlur()\"\n                    />\n                </div>\n            </div>\n\n            <div class=\"form-group\">\n                <div\n                    id=\"kc-form-buttons\"\n                    class=\"col-md-offset-2 col-md-10 submit\"\n                >\n                    <div>\n                        <button\n                            [disabled]=\"newPasswordError() !== '' || newPasswordConfirmError() !== ''\"\n                            type=\"submit\"\n                            [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                            name=\"submitAction\"\n                            value=\"Save\"\n                        >\n                            {{ i18n.msgStr('doSave') }}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </form>\n    </ng-container>\n</kc-account-template>\n", dependencies: [{ kind: "directive", type: KcClassDirective, selector: "[kcClass]", inputs: ["class", "ngClass", "kcClass"] }, { kind: "component", type: TemplateComponent, selector: "kc-account-template", inputs: ["active"] }] }); }
+        ], usesInheritance: true, ngImport: i0, template: "@let url = kcContext.url;\n@let password = kcContext.password;\n@let account = kcContext.account;\n@let stateChecker = kcContext.stateChecker;\n\n<div class=\"row\">\n    <div class=\"col-md-10\">\n        <h2>{{ i18n.msgStr('changePasswordHtmlTitle') }}</h2>\n    </div>\n    <div class=\"col-md-2 subtitle\">\n        <span class=\"subtitle\">{{ i18n.msgStr('allFieldsRequired') }}</span>\n    </div>\n</div>\n\n<form\n    class=\"form-horizontal\"\n    method=\"post\"\n    [action]=\"url.passwordUrl\"\n>\n    <input\n        type=\"text\"\n        id=\"username\"\n        name=\"username\"\n        autoComplete=\"username\"\n        readOnly\n        [value]=\"account.username ?? ''\"\n        [style.display]=\"'none'\"\n    />\n\n    @if (password.passwordSet) {\n        <div class=\"form-group\">\n            <div class=\"col-sm-2 col-md-2\">\n                <label\n                    for=\"password\"\n                    class=\"control-label\"\n                >\n                    {{ i18n.msgStr('password') }}\n                </label>\n            </div>\n            <div class=\"col-sm-10 col-md-10\">\n                <input\n                    type=\"password\"\n                    class=\"form-control\"\n                    id=\"password\"\n                    name=\"password\"\n                    autoFocus\n                    autoComplete=\"current-password\"\n                    [value]=\"currentPassword()\"\n                    (change)=\"currentPassword.set($any($event.target).value)\"\n                />\n            </div>\n        </div>\n    }\n\n    <input\n        type=\"hidden\"\n        id=\"stateChecker\"\n        name=\"stateChecker\"\n        [value]=\"stateChecker\"\n    />\n\n    <div class=\"form-group\">\n        <div class=\"col-sm-2 col-md-2\">\n            <label\n                for=\"password-new\"\n                class=\"control-label\"\n            >\n                {{ i18n.msgStr('passwordNew') }}\n            </label>\n        </div>\n        <div class=\"col-sm-10 col-md-10\">\n            <input\n                type=\"password\"\n                class=\"form-control\"\n                id=\"password-new\"\n                name=\"password-new\"\n                autoComplete=\"new-password\"\n                [value]=\"newPassword()\"\n                (change)=\"onNewPasswordChange($any($event.target).value)\"\n                (blur)=\"onNewPasswordBlur()\"\n            />\n        </div>\n    </div>\n\n    <div class=\"form-group\">\n        <div class=\"col-sm-2 col-md-2\">\n            <label\n                for=\"password-confirm\"\n                class=\"control-label two-lines\"\n            >\n                {{ i18n.msgStr('passwordConfirm') }}\n            </label>\n        </div>\n\n        <div class=\"col-sm-10 col-md-10\">\n            <input\n                type=\"password\"\n                class=\"form-control\"\n                id=\"password-confirm\"\n                name=\"password-confirm\"\n                autoComplete=\"new-password\"\n                [value]=\"newPasswordConfirm()\"\n                (change)=\"onNewPasswordConfirmChange($any($event.target).value)\"\n                (blur)=\"onNewPasswordConfirmBlur()\"\n            />\n        </div>\n    </div>\n\n    <div class=\"form-group\">\n        <div\n            id=\"kc-form-buttons\"\n            class=\"col-md-offset-2 col-md-10 submit\"\n        >\n            <div>\n                <button\n                    type=\"submit\"\n                    name=\"submitAction\"\n                    value=\"Save\"\n                    [disabled]=\"newPasswordError() !== '' || newPasswordConfirmError() !== ''\"\n                    [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                >\n                    {{ i18n.msgStr('doSave') }}\n                </button>\n            </div>\n        </div>\n    </div>\n</form>\n", dependencies: [{ kind: "directive", type: KcClassDirective, selector: "[kcClass]", inputs: ["class", "ngClass", "kcClass"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: PasswordComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.7", ngImport: i0, type: PasswordComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, imports: [KcClassDirective, TemplateComponent, NgClass], selector: 'kc-root', providers: [
+            args: [{ standalone: true, imports: [KcClassDirective, TemplateComponent, NgClass], selector: 'kc-password', providers: [
                         {
                             provide: ComponentReference,
                             useExisting: forwardRef(() => PasswordComponent)
                         }
-                    ], template: "@let url = kcContext.url;\n@let password = kcContext.password;\n@let account = kcContext.account;\n@let stateChecker = kcContext.stateChecker;\n\n<kc-account-template [active]=\"'password'\">\n    <ng-container content>\n        <div class=\"row\">\n            <div class=\"col-md-10\">\n                <h2>{{ i18n.msgStr('changePasswordHtmlTitle') }}</h2>\n            </div>\n            <div class=\"col-md-2 subtitle\">\n                <span class=\"subtitle\">{{ i18n.msgStr('allFieldsRequired') }}</span>\n            </div>\n        </div>\n\n        <form\n            [action]=\"url.passwordUrl\"\n            class=\"form-horizontal\"\n            method=\"post\"\n        >\n            <input\n                type=\"text\"\n                id=\"username\"\n                name=\"username\"\n                [value]=\"account.username ?? ''\"\n                autoComplete=\"username\"\n                readOnly\n                [style.display]=\"'none'\"\n            />\n\n            @if (password.passwordSet) {\n                <div class=\"form-group\">\n                    <div class=\"col-sm-2 col-md-2\">\n                        <label\n                            for=\"password\"\n                            class=\"control-label\"\n                        >\n                            {{ i18n.msgStr('password') }}\n                        </label>\n                    </div>\n                    <div class=\"col-sm-10 col-md-10\">\n                        <input\n                            type=\"password\"\n                            class=\"form-control\"\n                            id=\"password\"\n                            name=\"password\"\n                            autoFocus\n                            autoComplete=\"current-password\"\n                            [value]=\"currentPassword()\"\n                            (change)=\"currentPassword.set($any($event.target).value)\"\n                        />\n                    </div>\n                </div>\n            }\n\n            <input\n                type=\"hidden\"\n                id=\"stateChecker\"\n                name=\"stateChecker\"\n                [value]=\"stateChecker\"\n            />\n\n            <div class=\"form-group\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"password-new\"\n                        class=\"control-label\"\n                    >\n                        {{ i18n.msgStr('passwordNew') }}\n                    </label>\n                </div>\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"password\"\n                        class=\"form-control\"\n                        id=\"password-new\"\n                        name=\"password-new\"\n                        autoComplete=\"new-password\"\n                        [value]=\"newPassword()\"\n                        (change)=\"onNewPasswordChange($any($event.target).value)\"\n                        (blur)=\"onNewPasswordBlur()\"\n                    />\n                </div>\n            </div>\n\n            <div class=\"form-group\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"password-confirm\"\n                        class=\"control-label two-lines\"\n                    >\n                        {{ i18n.msgStr('passwordConfirm') }}\n                    </label>\n                </div>\n\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"password\"\n                        class=\"form-control\"\n                        id=\"password-confirm\"\n                        name=\"password-confirm\"\n                        autoComplete=\"new-password\"\n                        [value]=\"newPasswordConfirm()\"\n                        (change)=\"onNewPasswordConfirmChange($any($event.target).value)\"\n                        (blur)=\"onNewPasswordConfirmBlur()\"\n                    />\n                </div>\n            </div>\n\n            <div class=\"form-group\">\n                <div\n                    id=\"kc-form-buttons\"\n                    class=\"col-md-offset-2 col-md-10 submit\"\n                >\n                    <div>\n                        <button\n                            [disabled]=\"newPasswordError() !== '' || newPasswordConfirmError() !== ''\"\n                            type=\"submit\"\n                            [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                            name=\"submitAction\"\n                            value=\"Save\"\n                        >\n                            {{ i18n.msgStr('doSave') }}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </form>\n    </ng-container>\n</kc-account-template>\n" }]
+                    ], template: "@let url = kcContext.url;\n@let password = kcContext.password;\n@let account = kcContext.account;\n@let stateChecker = kcContext.stateChecker;\n\n<div class=\"row\">\n    <div class=\"col-md-10\">\n        <h2>{{ i18n.msgStr('changePasswordHtmlTitle') }}</h2>\n    </div>\n    <div class=\"col-md-2 subtitle\">\n        <span class=\"subtitle\">{{ i18n.msgStr('allFieldsRequired') }}</span>\n    </div>\n</div>\n\n<form\n    class=\"form-horizontal\"\n    method=\"post\"\n    [action]=\"url.passwordUrl\"\n>\n    <input\n        type=\"text\"\n        id=\"username\"\n        name=\"username\"\n        autoComplete=\"username\"\n        readOnly\n        [value]=\"account.username ?? ''\"\n        [style.display]=\"'none'\"\n    />\n\n    @if (password.passwordSet) {\n        <div class=\"form-group\">\n            <div class=\"col-sm-2 col-md-2\">\n                <label\n                    for=\"password\"\n                    class=\"control-label\"\n                >\n                    {{ i18n.msgStr('password') }}\n                </label>\n            </div>\n            <div class=\"col-sm-10 col-md-10\">\n                <input\n                    type=\"password\"\n                    class=\"form-control\"\n                    id=\"password\"\n                    name=\"password\"\n                    autoFocus\n                    autoComplete=\"current-password\"\n                    [value]=\"currentPassword()\"\n                    (change)=\"currentPassword.set($any($event.target).value)\"\n                />\n            </div>\n        </div>\n    }\n\n    <input\n        type=\"hidden\"\n        id=\"stateChecker\"\n        name=\"stateChecker\"\n        [value]=\"stateChecker\"\n    />\n\n    <div class=\"form-group\">\n        <div class=\"col-sm-2 col-md-2\">\n            <label\n                for=\"password-new\"\n                class=\"control-label\"\n            >\n                {{ i18n.msgStr('passwordNew') }}\n            </label>\n        </div>\n        <div class=\"col-sm-10 col-md-10\">\n            <input\n                type=\"password\"\n                class=\"form-control\"\n                id=\"password-new\"\n                name=\"password-new\"\n                autoComplete=\"new-password\"\n                [value]=\"newPassword()\"\n                (change)=\"onNewPasswordChange($any($event.target).value)\"\n                (blur)=\"onNewPasswordBlur()\"\n            />\n        </div>\n    </div>\n\n    <div class=\"form-group\">\n        <div class=\"col-sm-2 col-md-2\">\n            <label\n                for=\"password-confirm\"\n                class=\"control-label two-lines\"\n            >\n                {{ i18n.msgStr('passwordConfirm') }}\n            </label>\n        </div>\n\n        <div class=\"col-sm-10 col-md-10\">\n            <input\n                type=\"password\"\n                class=\"form-control\"\n                id=\"password-confirm\"\n                name=\"password-confirm\"\n                autoComplete=\"new-password\"\n                [value]=\"newPasswordConfirm()\"\n                (change)=\"onNewPasswordConfirmChange($any($event.target).value)\"\n                (blur)=\"onNewPasswordConfirmBlur()\"\n            />\n        </div>\n    </div>\n\n    <div class=\"form-group\">\n        <div\n            id=\"kc-form-buttons\"\n            class=\"col-md-offset-2 col-md-10 submit\"\n        >\n            <div>\n                <button\n                    type=\"submit\"\n                    name=\"submitAction\"\n                    value=\"Save\"\n                    [disabled]=\"newPasswordError() !== '' || newPasswordConfirmError() !== ''\"\n                    [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                >\n                    {{ i18n.msgStr('doSave') }}\n                </button>\n            </div>\n        </div>\n    </div>\n</form>\n" }]
         }], ctorParameters: () => [] });
 
 /**

package/fesm2022/keycloakify-angular-account-pages-password.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"keycloakify-angular-account-pages-password.mjs","sources":["../../src/account/pages/password/password.component.ts","../../src/account/pages/password/password.component.html","../../src/account/pages/password/keycloakify-angular-account-pages-password.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport { Component, forwardRef, inject, signal } from '@angular/core';\nimport { ComponentReference } from '@keycloakify/angular/account/classes/component-reference';\nimport { TemplateComponent } from '@keycloakify/angular/account/containers/template';\nimport { KcClassDirective } from '@keycloakify/angular/account/directives/kc-class';\nimport { ACCOUNT_CLASSES } from '@keycloakify/angular/account/tokens/classes';\nimport { ACCOUNT_I18N } from '@keycloakify/angular/account/tokens/i18n';\nimport { KC_ACCOUNT_CONTEXT } from '@keycloakify/angular/account/tokens/kc-context';\nimport { USE_DEFAULT_CSS } from '@keycloakify/angular/lib/tokens/use-default-css';\nimport type { ClassKey } from 'keycloakify/account';\nimport type { I18n } from '@keycloakify/angular/account/i18n';\nimport type { KcContext } from '@keycloakify/angular/account/KcContext';\n\n@Component({\n    standalone: true,\n    imports: [KcClassDirective, TemplateComponent, NgClass],\n    selector: 'kc-root',\n    templateUrl: 'password.component.html',\n    providers: [\n        {\n            provide: ComponentReference,\n            useExisting: forwardRef(() => PasswordComponent)\n        }\n    ]\n})\nexport class PasswordComponent extends ComponentReference {\n    i18n = inject<I18n>(ACCOUNT_I18N);\n    kcContext = inject<Extract<KcContext, { pageId: 'password.ftl' }>>(KC_ACCOUNT_CONTEXT);\n    override doUseDefaultCss = inject<boolean>(USE_DEFAULT_CSS);\n    override classes = inject<Partial<Record<ClassKey, string>>>(ACCOUNT_CLASSES);\n    override additionalClasses: Partial<Record<ClassKey, string>> = {\n        kcBodyClass: `${this.classes?.kcBodyClass} password`\n    };\n\n    currentPassword = signal('');\n    newPassword = signal('');\n    newPasswordConfirm = signal('');\n    newPasswordError = signal('');\n    newPasswordConfirmError = signal('');\n    hasNewPasswordBlurred = signal(false);\n    hasNewPasswordConfirmBlurred = signal(false);\n\n    constructor() {\n        super();\n        // @ts-ignore\n        window.kcContext = {\n            ...this.kcContext,\n            message: (() => {\n                if (this.newPasswordError() !== '') {\n                    return {\n                        type: 'error',\n                        summary: this.newPasswordError()\n                    };\n                }\n                if (this.newPasswordConfirmError() !== '') {\n                    return {\n                        type: 'error',\n                        summary: this.newPasswordConfirmError()\n                    };\n                }\n                return this.kcContext.message;\n            })()\n        };\n    }\n\n    checkNewPassword(newPassword: string) {\n        if (!this.kcContext.password.passwordSet) return;\n        if (newPassword === this.currentPassword()) {\n            this.newPasswordError.set('newPasswordSameAsOld');\n        } else {\n            this.newPasswordError.set('');\n        }\n    }\n    checkNewPasswordConfirm(newPasswordConfirm: string) {\n        if (newPasswordConfirm === '') return;\n        if (newPasswordConfirm !== this.newPassword()) {\n            this.newPasswordConfirmError.set('passwordConfirmNotMatch');\n        } else {\n            this.newPasswordConfirmError.set('');\n        }\n    }\n\n    onNewPasswordChange(value: string) {\n        const newPassword = value;\n\n        this.newPassword.set(newPassword);\n        if (this.hasNewPasswordBlurred()) {\n            this.checkNewPassword(newPassword);\n        }\n    }\n\n    onNewPasswordBlur() {\n        this.hasNewPasswordBlurred.set(true);\n        this.checkNewPassword(this.newPassword());\n    }\n\n    onNewPasswordConfirmChange(value: string) {\n        const newPasswordConfirm = value;\n\n        this.newPasswordConfirm.set(newPasswordConfirm);\n        if (this.hasNewPasswordConfirmBlurred()) {\n            this.checkNewPasswordConfirm(newPasswordConfirm);\n        }\n    }\n\n    onNewPasswordConfirmBlur() {\n        this.hasNewPasswordConfirmBlurred.set(true);\n        this.checkNewPasswordConfirm(this.newPasswordConfirm());\n    }\n}\n","@let url = kcContext.url;\n@let password = kcContext.password;\n@let account = kcContext.account;\n@let stateChecker = kcContext.stateChecker;\n\n<kc-account-template [active]=\"'password'\">\n    <ng-container content>\n        <div class=\"row\">\n            <div class=\"col-md-10\">\n                <h2>{{ i18n.msgStr('changePasswordHtmlTitle') }}</h2>\n            </div>\n            <div class=\"col-md-2 subtitle\">\n                <span class=\"subtitle\">{{ i18n.msgStr('allFieldsRequired') }}</span>\n            </div>\n        </div>\n\n        <form\n            [action]=\"url.passwordUrl\"\n            class=\"form-horizontal\"\n            method=\"post\"\n        >\n            <input\n                type=\"text\"\n                id=\"username\"\n                name=\"username\"\n                [value]=\"account.username ?? ''\"\n                autoComplete=\"username\"\n                readOnly\n                [style.display]=\"'none'\"\n            />\n\n            @if (password.passwordSet) {\n                <div class=\"form-group\">\n                    <div class=\"col-sm-2 col-md-2\">\n                        <label\n                            for=\"password\"\n                            class=\"control-label\"\n                        >\n                            {{ i18n.msgStr('password') }}\n                        </label>\n                    </div>\n                    <div class=\"col-sm-10 col-md-10\">\n                        <input\n                            type=\"password\"\n                            class=\"form-control\"\n                            id=\"password\"\n                            name=\"password\"\n                            autoFocus\n                            autoComplete=\"current-password\"\n                            [value]=\"currentPassword()\"\n                            (change)=\"currentPassword.set($any($event.target).value)\"\n                        />\n                    </div>\n                </div>\n            }\n\n            <input\n                type=\"hidden\"\n                id=\"stateChecker\"\n                name=\"stateChecker\"\n                [value]=\"stateChecker\"\n            />\n\n            <div class=\"form-group\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"password-new\"\n                        class=\"control-label\"\n                    >\n                        {{ i18n.msgStr('passwordNew') }}\n                    </label>\n                </div>\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"password\"\n                        class=\"form-control\"\n                        id=\"password-new\"\n                        name=\"password-new\"\n                        autoComplete=\"new-password\"\n                        [value]=\"newPassword()\"\n                        (change)=\"onNewPasswordChange($any($event.target).value)\"\n                        (blur)=\"onNewPasswordBlur()\"\n                    />\n                </div>\n            </div>\n\n            <div class=\"form-group\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"password-confirm\"\n                        class=\"control-label two-lines\"\n                    >\n                        {{ i18n.msgStr('passwordConfirm') }}\n                    </label>\n                </div>\n\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"password\"\n                        class=\"form-control\"\n                        id=\"password-confirm\"\n                        name=\"password-confirm\"\n                        autoComplete=\"new-password\"\n                        [value]=\"newPasswordConfirm()\"\n                        (change)=\"onNewPasswordConfirmChange($any($event.target).value)\"\n                        (blur)=\"onNewPasswordConfirmBlur()\"\n                    />\n                </div>\n            </div>\n\n            <div class=\"form-group\">\n                <div\n                    id=\"kc-form-buttons\"\n                    class=\"col-md-offset-2 col-md-10 submit\"\n                >\n                    <div>\n                        <button\n                            [disabled]=\"newPasswordError() !== '' || newPasswordConfirmError() !== ''\"\n                            type=\"submit\"\n                            [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                            name=\"submitAction\"\n                            value=\"Save\"\n                        >\n                            {{ i18n.msgStr('doSave') }}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </form>\n    </ng-container>\n</kc-account-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"keycloakify-angular-account-pages-password.mjs","sources":["../../src/account/pages/password/password.component.ts","../../src/account/pages/password/password.component.html","../../src/account/pages/password/keycloakify-angular-account-pages-password.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport { Component, forwardRef, inject, signal } from '@angular/core';\nimport { ComponentReference } from '@keycloakify/angular/account/classes/component-reference';\nimport { TemplateComponent } from '@keycloakify/angular/account/containers/template';\nimport { KcClassDirective } from '@keycloakify/angular/account/directives/kc-class';\nimport type { I18n } from '@keycloakify/angular/account/i18n';\nimport type { KcContext } from '@keycloakify/angular/account/KcContext';\nimport { ACCOUNT_CLASSES } from '@keycloakify/angular/account/tokens/classes';\nimport { ACCOUNT_I18N } from '@keycloakify/angular/account/tokens/i18n';\nimport { KC_ACCOUNT_CONTEXT } from '@keycloakify/angular/account/tokens/kc-context';\nimport { USE_DEFAULT_CSS } from '@keycloakify/angular/lib/tokens/use-default-css';\nimport type { ClassKey } from 'keycloakify/account';\n\n@Component({\n    standalone: true,\n    imports: [KcClassDirective, TemplateComponent, NgClass],\n    selector: 'kc-password',\n    templateUrl: 'password.component.html',\n    providers: [\n        {\n            provide: ComponentReference,\n            useExisting: forwardRef(() => PasswordComponent)\n        }\n    ]\n})\nexport class PasswordComponent extends ComponentReference {\n    i18n = inject<I18n>(ACCOUNT_I18N);\n    kcContext = inject<Extract<KcContext, { pageId: 'password.ftl' }>>(KC_ACCOUNT_CONTEXT);\n    override doUseDefaultCss = inject<boolean>(USE_DEFAULT_CSS);\n    override classes = inject<Partial<Record<ClassKey, string>>>(ACCOUNT_CLASSES);\n    override additionalClasses: Partial<Record<ClassKey, string>> = {\n        kcBodyClass: `${this.classes?.kcBodyClass} password`\n    };\n\n    active = 'password';\n\n    currentPassword = signal('');\n    newPassword = signal('');\n    newPasswordConfirm = signal('');\n    newPasswordError = signal('');\n    newPasswordConfirmError = signal('');\n    hasNewPasswordBlurred = signal(false);\n    hasNewPasswordConfirmBlurred = signal(false);\n\n    constructor() {\n        super();\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        window.kcContext = {\n            ...this.kcContext,\n            message: (() => {\n                if (this.newPasswordError() !== '') {\n                    return {\n                        type: 'error',\n                        summary: this.newPasswordError()\n                    };\n                }\n                if (this.newPasswordConfirmError() !== '') {\n                    return {\n                        type: 'error',\n                        summary: this.newPasswordConfirmError()\n                    };\n                }\n                return this.kcContext.message;\n            })()\n        };\n    }\n\n    checkNewPassword(newPassword: string) {\n        if (!this.kcContext.password.passwordSet) return;\n        if (newPassword === this.currentPassword()) {\n            this.newPasswordError.set('newPasswordSameAsOld');\n        } else {\n            this.newPasswordError.set('');\n        }\n    }\n    checkNewPasswordConfirm(newPasswordConfirm: string) {\n        if (newPasswordConfirm === '') return;\n        if (newPasswordConfirm !== this.newPassword()) {\n            this.newPasswordConfirmError.set('passwordConfirmNotMatch');\n        } else {\n            this.newPasswordConfirmError.set('');\n        }\n    }\n\n    onNewPasswordChange(value: string) {\n        const newPassword = value;\n\n        this.newPassword.set(newPassword);\n        if (this.hasNewPasswordBlurred()) {\n            this.checkNewPassword(newPassword);\n        }\n    }\n\n    onNewPasswordBlur() {\n        this.hasNewPasswordBlurred.set(true);\n        this.checkNewPassword(this.newPassword());\n    }\n\n    onNewPasswordConfirmChange(value: string) {\n        const newPasswordConfirm = value;\n\n        this.newPasswordConfirm.set(newPasswordConfirm);\n        if (this.hasNewPasswordConfirmBlurred()) {\n            this.checkNewPasswordConfirm(newPasswordConfirm);\n        }\n    }\n\n    onNewPasswordConfirmBlur() {\n        this.hasNewPasswordConfirmBlurred.set(true);\n        this.checkNewPasswordConfirm(this.newPasswordConfirm());\n    }\n}\n","@let url = kcContext.url;\n@let password = kcContext.password;\n@let account = kcContext.account;\n@let stateChecker = kcContext.stateChecker;\n\n<div class=\"row\">\n    <div class=\"col-md-10\">\n        <h2>{{ i18n.msgStr('changePasswordHtmlTitle') }}</h2>\n    </div>\n    <div class=\"col-md-2 subtitle\">\n        <span class=\"subtitle\">{{ i18n.msgStr('allFieldsRequired') }}</span>\n    </div>\n</div>\n\n<form\n    class=\"form-horizontal\"\n    method=\"post\"\n    [action]=\"url.passwordUrl\"\n>\n    <input\n        type=\"text\"\n        id=\"username\"\n        name=\"username\"\n        autoComplete=\"username\"\n        readOnly\n        [value]=\"account.username ?? ''\"\n        [style.display]=\"'none'\"\n    />\n\n    @if (password.passwordSet) {\n        <div class=\"form-group\">\n            <div class=\"col-sm-2 col-md-2\">\n                <label\n                    for=\"password\"\n                    class=\"control-label\"\n                >\n                    {{ i18n.msgStr('password') }}\n                </label>\n            </div>\n            <div class=\"col-sm-10 col-md-10\">\n                <input\n                    type=\"password\"\n                    class=\"form-control\"\n                    id=\"password\"\n                    name=\"password\"\n                    autoFocus\n                    autoComplete=\"current-password\"\n                    [value]=\"currentPassword()\"\n                    (change)=\"currentPassword.set($any($event.target).value)\"\n                />\n            </div>\n        </div>\n    }\n\n    <input\n        type=\"hidden\"\n        id=\"stateChecker\"\n        name=\"stateChecker\"\n        [value]=\"stateChecker\"\n    />\n\n    <div class=\"form-group\">\n        <div class=\"col-sm-2 col-md-2\">\n            <label\n                for=\"password-new\"\n                class=\"control-label\"\n            >\n                {{ i18n.msgStr('passwordNew') }}\n            </label>\n        </div>\n        <div class=\"col-sm-10 col-md-10\">\n            <input\n                type=\"password\"\n                class=\"form-control\"\n                id=\"password-new\"\n                name=\"password-new\"\n                autoComplete=\"new-password\"\n                [value]=\"newPassword()\"\n                (change)=\"onNewPasswordChange($any($event.target).value)\"\n                (blur)=\"onNewPasswordBlur()\"\n            />\n        </div>\n    </div>\n\n    <div class=\"form-group\">\n        <div class=\"col-sm-2 col-md-2\">\n            <label\n                for=\"password-confirm\"\n                class=\"control-label two-lines\"\n            >\n                {{ i18n.msgStr('passwordConfirm') }}\n            </label>\n        </div>\n\n        <div class=\"col-sm-10 col-md-10\">\n            <input\n                type=\"password\"\n                class=\"form-control\"\n                id=\"password-confirm\"\n                name=\"password-confirm\"\n                autoComplete=\"new-password\"\n                [value]=\"newPasswordConfirm()\"\n                (change)=\"onNewPasswordConfirmChange($any($event.target).value)\"\n                (blur)=\"onNewPasswordConfirmBlur()\"\n            />\n        </div>\n    </div>\n\n    <div class=\"form-group\">\n        <div\n            id=\"kc-form-buttons\"\n            class=\"col-md-offset-2 col-md-10 submit\"\n        >\n            <div>\n                <button\n                    type=\"submit\"\n                    name=\"submitAction\"\n                    value=\"Save\"\n                    [disabled]=\"newPasswordError() !== '' || newPasswordConfirmError() !== ''\"\n                    [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                >\n                    {{ i18n.msgStr('doSave') }}\n                </button>\n            </div>\n        </div>\n    </div>\n</form>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/keycloakify-angular-account-pages-sessions.mjs

@@ -16,23 +16,24 @@ class SessionsComponent extends ComponentReference {
         this.kcContext = inject(KC_ACCOUNT_CONTEXT);
         this.doUseDefaultCss = inject(USE_DEFAULT_CSS);
         this.classes = inject(ACCOUNT_CLASSES);
+        this.active = 'sessions';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: SessionsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.6", type: SessionsComponent, isStandalone: true, selector: "kc-root", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.7", ngImport: i0, type: SessionsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.7", type: SessionsComponent, isStandalone: true, selector: "kc-sessions", providers: [
             {
                 provide: ComponentReference,
                 useExisting: forwardRef(() => SessionsComponent)
             }
-        ], usesInheritance: true, ngImport: i0, template: "@let url = kcContext.url;\n@let sessions = kcContext.sessions;\n@let stateChecker = kcContext.stateChecker;\n\n<kc-account-template [active]=\"'sessions'\">\n    <ng-container content>\n        <div [kcClass]=\"'kcContentWrapperClass'\">\n            <div class=\"col-md-10\">\n                <h2>{{ i18n.msgStr('sessionsHtmlTitle') }}</h2>\n            </div>\n        </div>\n\n        <table class=\"table table-striped table-bordered\">\n            <thead>\n                <tr>\n                    <th>{{ i18n.msgStr('ip') }}</th>\n                    <th>{{ i18n.msgStr('started') }}</th>\n                    <th>{{ i18n.msgStr('lastAccess') }}</th>\n                    <th>{{ i18n.msgStr('expires') }}</th>\n                    <th>{{ i18n.msgStr('clients') }}</th>\n                </tr>\n            </thead>\n\n            <tbody role=\"rowgroup\">\n                @for (session of sessions.sessions; track session) {\n                    <tr>\n                        <td>{{ session.ipAddress }}</td>\n                        <td>{{ session?.started }}</td>\n                        <td>{{ session?.lastAccess }}</td>\n                        <td>{{ session?.expires }}</td>\n                        <td>\n                            @for (client of session.clients; track client) {\n                                <div>\n                                    {{ client }}\n                                    <br />\n                                </div>\n                            }\n                        </td>\n                    </tr>\n                }\n            </tbody>\n        </table>\n\n        <form\n            [action]=\"url.sessionsUrl\"\n            method=\"post\"\n        >\n            <input\n                type=\"hidden\"\n                id=\"stateChecker\"\n                name=\"stateChecker\"\n                [value]=\"stateChecker\"\n            />\n            <button\n                id=\"logout-all-sessions\"\n                type=\"submit\"\n                [kcClass]=\"['kcButtonDefaultClass', 'kcButtonClass']\"\n            >\n                {{ i18n.msgStr('doLogOutAllSessions') }}\n            </button>\n        </form>\n    </ng-container>\n</kc-account-template>\n", dependencies: [{ kind: "directive", type: KcClassDirective, selector: "[kcClass]", inputs: ["class", "ngClass", "kcClass"] }, { kind: "component", type: TemplateComponent, selector: "kc-account-template", inputs: ["active"] }] }); }
+        ], usesInheritance: true, ngImport: i0, template: "@let url = kcContext.url;\n@let sessions = kcContext.sessions;\n@let stateChecker = kcContext.stateChecker;\n\n<div [kcClass]=\"'kcContentWrapperClass'\">\n    <div class=\"col-md-10\">\n        <h2>{{ i18n.msgStr('sessionsHtmlTitle') }}</h2>\n    </div>\n</div>\n\n<table class=\"table table-striped table-bordered\">\n    <thead>\n        <tr>\n            <th>{{ i18n.msgStr('ip') }}</th>\n            <th>{{ i18n.msgStr('started') }}</th>\n            <th>{{ i18n.msgStr('lastAccess') }}</th>\n            <th>{{ i18n.msgStr('expires') }}</th>\n            <th>{{ i18n.msgStr('clients') }}</th>\n        </tr>\n    </thead>\n\n    <tbody role=\"rowgroup\">\n        @for (session of sessions.sessions; track session) {\n            <tr>\n                <td>{{ session.ipAddress }}</td>\n                <td>{{ session?.started }}</td>\n                <td>{{ session?.lastAccess }}</td>\n                <td>{{ session?.expires }}</td>\n                <td>\n                    @for (client of session.clients; track client) {\n                        <div>\n                            {{ client }}\n                            <br />\n                        </div>\n                    }\n                </td>\n            </tr>\n        }\n    </tbody>\n</table>\n\n<form\n    method=\"post\"\n    [action]=\"url.sessionsUrl\"\n>\n    <input\n        type=\"hidden\"\n        id=\"stateChecker\"\n        name=\"stateChecker\"\n        [value]=\"stateChecker\"\n    />\n    <button\n        id=\"logout-all-sessions\"\n        type=\"submit\"\n        [kcClass]=\"['kcButtonDefaultClass', 'kcButtonClass']\"\n    >\n        {{ i18n.msgStr('doLogOutAllSessions') }}\n    </button>\n</form>\n", dependencies: [{ kind: "directive", type: KcClassDirective, selector: "[kcClass]", inputs: ["class", "ngClass", "kcClass"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: SessionsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.7", ngImport: i0, type: SessionsComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, imports: [KcClassDirective, TemplateComponent, NgClass], selector: 'kc-root', providers: [
+            args: [{ standalone: true, imports: [KcClassDirective, TemplateComponent, NgClass], selector: 'kc-sessions', providers: [
                         {
                             provide: ComponentReference,
                             useExisting: forwardRef(() => SessionsComponent)
                         }
-                    ], template: "@let url = kcContext.url;\n@let sessions = kcContext.sessions;\n@let stateChecker = kcContext.stateChecker;\n\n<kc-account-template [active]=\"'sessions'\">\n    <ng-container content>\n        <div [kcClass]=\"'kcContentWrapperClass'\">\n            <div class=\"col-md-10\">\n                <h2>{{ i18n.msgStr('sessionsHtmlTitle') }}</h2>\n            </div>\n        </div>\n\n        <table class=\"table table-striped table-bordered\">\n            <thead>\n                <tr>\n                    <th>{{ i18n.msgStr('ip') }}</th>\n                    <th>{{ i18n.msgStr('started') }}</th>\n                    <th>{{ i18n.msgStr('lastAccess') }}</th>\n                    <th>{{ i18n.msgStr('expires') }}</th>\n                    <th>{{ i18n.msgStr('clients') }}</th>\n                </tr>\n            </thead>\n\n            <tbody role=\"rowgroup\">\n                @for (session of sessions.sessions; track session) {\n                    <tr>\n                        <td>{{ session.ipAddress }}</td>\n                        <td>{{ session?.started }}</td>\n                        <td>{{ session?.lastAccess }}</td>\n                        <td>{{ session?.expires }}</td>\n                        <td>\n                            @for (client of session.clients; track client) {\n                                <div>\n                                    {{ client }}\n                                    <br />\n                                </div>\n                            }\n                        </td>\n                    </tr>\n                }\n            </tbody>\n        </table>\n\n        <form\n            [action]=\"url.sessionsUrl\"\n            method=\"post\"\n        >\n            <input\n                type=\"hidden\"\n                id=\"stateChecker\"\n                name=\"stateChecker\"\n                [value]=\"stateChecker\"\n            />\n            <button\n                id=\"logout-all-sessions\"\n                type=\"submit\"\n                [kcClass]=\"['kcButtonDefaultClass', 'kcButtonClass']\"\n            >\n                {{ i18n.msgStr('doLogOutAllSessions') }}\n            </button>\n        </form>\n    </ng-container>\n</kc-account-template>\n" }]
+                    ], template: "@let url = kcContext.url;\n@let sessions = kcContext.sessions;\n@let stateChecker = kcContext.stateChecker;\n\n<div [kcClass]=\"'kcContentWrapperClass'\">\n    <div class=\"col-md-10\">\n        <h2>{{ i18n.msgStr('sessionsHtmlTitle') }}</h2>\n    </div>\n</div>\n\n<table class=\"table table-striped table-bordered\">\n    <thead>\n        <tr>\n            <th>{{ i18n.msgStr('ip') }}</th>\n            <th>{{ i18n.msgStr('started') }}</th>\n            <th>{{ i18n.msgStr('lastAccess') }}</th>\n            <th>{{ i18n.msgStr('expires') }}</th>\n            <th>{{ i18n.msgStr('clients') }}</th>\n        </tr>\n    </thead>\n\n    <tbody role=\"rowgroup\">\n        @for (session of sessions.sessions; track session) {\n            <tr>\n                <td>{{ session.ipAddress }}</td>\n                <td>{{ session?.started }}</td>\n                <td>{{ session?.lastAccess }}</td>\n                <td>{{ session?.expires }}</td>\n                <td>\n                    @for (client of session.clients; track client) {\n                        <div>\n                            {{ client }}\n                            <br />\n                        </div>\n                    }\n                </td>\n            </tr>\n        }\n    </tbody>\n</table>\n\n<form\n    method=\"post\"\n    [action]=\"url.sessionsUrl\"\n>\n    <input\n        type=\"hidden\"\n        id=\"stateChecker\"\n        name=\"stateChecker\"\n        [value]=\"stateChecker\"\n    />\n    <button\n        id=\"logout-all-sessions\"\n        type=\"submit\"\n        [kcClass]=\"['kcButtonDefaultClass', 'kcButtonClass']\"\n    >\n        {{ i18n.msgStr('doLogOutAllSessions') }}\n    </button>\n</form>\n" }]
         }] });
 
 /**

package/fesm2022/keycloakify-angular-account-pages-sessions.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"keycloakify-angular-account-pages-sessions.mjs","sources":["../../src/account/pages/sessions/sessions.component.ts","../../src/account/pages/sessions/sessions.component.html","../../src/account/pages/sessions/keycloakify-angular-account-pages-sessions.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport { Component, forwardRef, inject } from '@angular/core';\nimport { ComponentReference } from '@keycloakify/angular/account/classes/component-reference';\nimport { TemplateComponent } from '@keycloakify/angular/account/containers/template';\nimport { KcClassDirective } from '@keycloakify/angular/account/directives/kc-class';\nimport { ACCOUNT_CLASSES } from '@keycloakify/angular/account/tokens/classes';\nimport { ACCOUNT_I18N } from '@keycloakify/angular/account/tokens/i18n';\nimport { KC_ACCOUNT_CONTEXT } from '@keycloakify/angular/account/tokens/kc-context';\nimport { USE_DEFAULT_CSS } from '@keycloakify/angular/lib/tokens/use-default-css';\nimport type { ClassKey } from 'keycloakify/account';\nimport type { I18n } from '@keycloakify/angular/account/i18n';\nimport type { KcContext } from '@keycloakify/angular/account/KcContext';\n\n@Component({\n    standalone: true,\n    imports: [KcClassDirective, TemplateComponent, NgClass],\n    selector: 'kc-root',\n    templateUrl: 'sessions.component.html',\n    providers: [\n        {\n            provide: ComponentReference,\n            useExisting: forwardRef(() => SessionsComponent)\n        }\n    ]\n})\nexport class SessionsComponent extends ComponentReference {\n    i18n = inject<I18n>(ACCOUNT_I18N);\n    kcContext = inject<Extract<KcContext, { pageId: 'sessions.ftl' }>>(KC_ACCOUNT_CONTEXT);\n    override doUseDefaultCss = inject<boolean>(USE_DEFAULT_CSS);\n    override classes = inject<Partial<Record<ClassKey, string>>>(ACCOUNT_CLASSES);\n}\n","@let url = kcContext.url;\n@let sessions = kcContext.sessions;\n@let stateChecker = kcContext.stateChecker;\n\n<kc-account-template [active]=\"'sessions'\">\n    <ng-container content>\n        <div [kcClass]=\"'kcContentWrapperClass'\">\n            <div class=\"col-md-10\">\n                <h2>{{ i18n.msgStr('sessionsHtmlTitle') }}</h2>\n            </div>\n        </div>\n\n        <table class=\"table table-striped table-bordered\">\n            <thead>\n                <tr>\n                    <th>{{ i18n.msgStr('ip') }}</th>\n                    <th>{{ i18n.msgStr('started') }}</th>\n                    <th>{{ i18n.msgStr('lastAccess') }}</th>\n                    <th>{{ i18n.msgStr('expires') }}</th>\n                    <th>{{ i18n.msgStr('clients') }}</th>\n                </tr>\n            </thead>\n\n            <tbody role=\"rowgroup\">\n                @for (session of sessions.sessions; track session) {\n                    <tr>\n                        <td>{{ session.ipAddress }}</td>\n                        <td>{{ session?.started }}</td>\n                        <td>{{ session?.lastAccess }}</td>\n                        <td>{{ session?.expires }}</td>\n                        <td>\n                            @for (client of session.clients; track client) {\n                                <div>\n                                    {{ client }}\n                                    <br />\n                                </div>\n                            }\n                        </td>\n                    </tr>\n                }\n            </tbody>\n        </table>\n\n        <form\n            [action]=\"url.sessionsUrl\"\n            method=\"post\"\n        >\n            <input\n                type=\"hidden\"\n                id=\"stateChecker\"\n                name=\"stateChecker\"\n                [value]=\"stateChecker\"\n            />\n            <button\n                id=\"logout-all-sessions\"\n                type=\"submit\"\n                [kcClass]=\"['kcButtonDefaultClass', 'kcButtonClass']\"\n            >\n                {{ i18n.msgStr('doLogOutAllSessions') }}\n            </button>\n        </form>\n    </ng-container>\n</kc-account-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;AAyBM,MAAO,iBAAkB,SAAQ,kBAAkB,CAAA;AAZzD,IAAA,WAAA,GAAA;;AAaI,QAAA,IAAA,CAAA,IAAI,GAAG,MAAM,CAAO,YAAY,CAAC,CAAC;AAClC,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAiD,kBAAkB,CAAC,CAAC;AAC9E,QAAA,IAAA,CAAA,eAAe,GAAG,MAAM,CAAU,eAAe,CAAC,CAAC;AACnD,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAoC,eAAe,CAAC,CAAC;AACjF,KAAA;8GALY,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,EAPf,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA;AACP,YAAA;AACI,gBAAA,OAAO,EAAE,kBAAkB;AAC3B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,iBAAiB,CAAC;AACnD,aAAA;AACJ,SAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECvBL,+rEA+DA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDhDc,gBAAgB,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,iBAAiB,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,QAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAUpC,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAZ7B,SAAS;iCACM,IAAI,EAAA,OAAA,EACP,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,OAAO,CAAC,EAC7C,QAAA,EAAA,SAAS,EAER,SAAA,EAAA;AACP,wBAAA;AACI,4BAAA,OAAO,EAAE,kBAAkB;AAC3B,4BAAA,WAAW,EAAE,UAAU,CAAC,uBAAuB,CAAC;AACnD,yBAAA;AACJ,qBAAA,EAAA,QAAA,EAAA,+rEAAA,EAAA,CAAA;;;AEvBL;;AAEG;;;;"}
+{"version":3,"file":"keycloakify-angular-account-pages-sessions.mjs","sources":["../../src/account/pages/sessions/sessions.component.ts","../../src/account/pages/sessions/sessions.component.html","../../src/account/pages/sessions/keycloakify-angular-account-pages-sessions.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport { Component, forwardRef, inject } from '@angular/core';\nimport { ComponentReference } from '@keycloakify/angular/account/classes/component-reference';\nimport { TemplateComponent } from '@keycloakify/angular/account/containers/template';\nimport { KcClassDirective } from '@keycloakify/angular/account/directives/kc-class';\nimport type { I18n } from '@keycloakify/angular/account/i18n';\nimport type { KcContext } from '@keycloakify/angular/account/KcContext';\nimport { ACCOUNT_CLASSES } from '@keycloakify/angular/account/tokens/classes';\nimport { ACCOUNT_I18N } from '@keycloakify/angular/account/tokens/i18n';\nimport { KC_ACCOUNT_CONTEXT } from '@keycloakify/angular/account/tokens/kc-context';\nimport { USE_DEFAULT_CSS } from '@keycloakify/angular/lib/tokens/use-default-css';\nimport type { ClassKey } from 'keycloakify/account';\n\n@Component({\n    standalone: true,\n    imports: [KcClassDirective, TemplateComponent, NgClass],\n    selector: 'kc-sessions',\n    templateUrl: 'sessions.component.html',\n    providers: [\n        {\n            provide: ComponentReference,\n            useExisting: forwardRef(() => SessionsComponent)\n        }\n    ]\n})\nexport class SessionsComponent extends ComponentReference {\n    i18n = inject<I18n>(ACCOUNT_I18N);\n    kcContext = inject<Extract<KcContext, { pageId: 'sessions.ftl' }>>(KC_ACCOUNT_CONTEXT);\n    override doUseDefaultCss = inject<boolean>(USE_DEFAULT_CSS);\n    override classes = inject<Partial<Record<ClassKey, string>>>(ACCOUNT_CLASSES);\n    active = 'sessions';\n}\n","@let url = kcContext.url;\n@let sessions = kcContext.sessions;\n@let stateChecker = kcContext.stateChecker;\n\n<div [kcClass]=\"'kcContentWrapperClass'\">\n    <div class=\"col-md-10\">\n        <h2>{{ i18n.msgStr('sessionsHtmlTitle') }}</h2>\n    </div>\n</div>\n\n<table class=\"table table-striped table-bordered\">\n    <thead>\n        <tr>\n            <th>{{ i18n.msgStr('ip') }}</th>\n            <th>{{ i18n.msgStr('started') }}</th>\n            <th>{{ i18n.msgStr('lastAccess') }}</th>\n            <th>{{ i18n.msgStr('expires') }}</th>\n            <th>{{ i18n.msgStr('clients') }}</th>\n        </tr>\n    </thead>\n\n    <tbody role=\"rowgroup\">\n        @for (session of sessions.sessions; track session) {\n            <tr>\n                <td>{{ session.ipAddress }}</td>\n                <td>{{ session?.started }}</td>\n                <td>{{ session?.lastAccess }}</td>\n                <td>{{ session?.expires }}</td>\n                <td>\n                    @for (client of session.clients; track client) {\n                        <div>\n                            {{ client }}\n                            <br />\n                        </div>\n                    }\n                </td>\n            </tr>\n        }\n    </tbody>\n</table>\n\n<form\n    method=\"post\"\n    [action]=\"url.sessionsUrl\"\n>\n    <input\n        type=\"hidden\"\n        id=\"stateChecker\"\n        name=\"stateChecker\"\n        [value]=\"stateChecker\"\n    />\n    <button\n        id=\"logout-all-sessions\"\n        type=\"submit\"\n        [kcClass]=\"['kcButtonDefaultClass', 'kcButtonClass']\"\n    >\n        {{ i18n.msgStr('doLogOutAllSessions') }}\n    </button>\n</form>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;AAyBM,MAAO,iBAAkB,SAAQ,kBAAkB,CAAA;AAZzD,IAAA,WAAA,GAAA;;AAaI,QAAA,IAAA,CAAA,IAAI,GAAG,MAAM,CAAO,YAAY,CAAC,CAAC;AAClC,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAiD,kBAAkB,CAAC,CAAC;AAC9E,QAAA,IAAA,CAAA,eAAe,GAAG,MAAM,CAAU,eAAe,CAAC,CAAC;AACnD,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAoC,eAAe,CAAC,CAAC;QAC9E,IAAM,CAAA,MAAA,GAAG,UAAU,CAAC;AACvB,KAAA;8GANY,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,EAPf,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,SAAA,EAAA;AACP,YAAA;AACI,gBAAA,OAAO,EAAE,kBAAkB;AAC3B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,iBAAiB,CAAC;AACnD,aAAA;SACJ,ECvBL,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,uqDA2DA,4CD5Cc,gBAAgB,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAUjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAZ7B,SAAS;iCACM,IAAI,EAAA,OAAA,EACP,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,OAAO,CAAC,EAC7C,QAAA,EAAA,aAAa,EAEZ,SAAA,EAAA;AACP,wBAAA;AACI,4BAAA,OAAO,EAAE,kBAAkB;AAC3B,4BAAA,WAAW,EAAE,UAAU,CAAC,uBAAuB,CAAC;AACnD,yBAAA;AACJ,qBAAA,EAAA,QAAA,EAAA,uqDAAA,EAAA,CAAA;;;AEvBL;;AAEG;;;;"}

package/fesm2022/keycloakify-angular-account-pages-totp.mjs

@@ -17,23 +17,24 @@ class TotpComponent extends ComponentReference {
         this.kcContext = inject(KC_ACCOUNT_CONTEXT);
         this.doUseDefaultCss = inject(USE_DEFAULT_CSS);
         this.classes = inject(ACCOUNT_CLASSES);
+        this.active = 'totp';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: TotpComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.6", type: TotpComponent, isStandalone: true, selector: "kc-root", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.7", ngImport: i0, type: TotpComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.7", type: TotpComponent, isStandalone: true, selector: "kc-totp", providers: [
             {
                 provide: ComponentReference,
                 useExisting: forwardRef(() => TotpComponent)
             }
-        ], usesInheritance: true, ngImport: i0, template: "@let url = kcContext.url;\n@let mode = kcContext.mode;\n@let messagesPerField = kcContext.messagesPerField;\n@let stateChecker = kcContext.stateChecker;\n@let totp = kcContext.totp;\n\n<kc-account-template [active]=\"'totp'\">\n    <ng-container content>\n        <div class=\"row\">\n            <div class=\"col-md-10\">\n                <h2>{{ i18n.msgStr('authenticatorTitle') }}</h2>\n            </div>\n            @if (totp.otpCredentials.length) {\n                <div class=\"subtitle col-md-2\">\n                    <span class=\"required\">*</span>\n                    {{ i18n.msgStr('requiredFields') }}\n                </div>\n            }\n        </div>\n        @if (totp.enabled) {\n            <table class=\"table table-bordered table-striped\">\n                <thead>\n                    @if (totp.otpCredentials.length > 1) {\n                        <tr>\n                            <th [colSpan]=\"4\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                        </tr>\n                    } @else {\n                        <tr>\n                            <th [colSpan]=\"3\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                        </tr>\n                    }\n                </thead>\n                <tbody>\n                    @for (credential of totp.otpCredentials; track credential; let index = $index) {\n                        <tr>\n                            <td class=\"provider\">{{ i18n.msgStr('mobile') }}</td>\n                            @if (totp.otpCredentials.length > 1) {\n                                <td class=\"provider\">{{ credential.id }}</td>\n                            }\n                            <td class=\"provider\">{{ credential.userLabel || '' }}</td>\n                            <td class=\"action\">\n                                <form\n                                    [action]=\"url.totpUrl\"\n                                    method=\"post\"\n                                    class=\"form-inline\"\n                                >\n                                    <input\n                                        type=\"hidden\"\n                                        id=\"stateChecker\"\n                                        name=\"stateChecker\"\n                                        [value]=\"stateChecker\"\n                                    />\n                                    <input\n                                        type=\"hidden\"\n                                        id=\"submitAction\"\n                                        name=\"submitAction\"\n                                        value=\"Delete\"\n                                    />\n                                    <input\n                                        type=\"hidden\"\n                                        id=\"credentialId\"\n                                        name=\"credentialId\"\n                                        [value]=\"credential.id\"\n                                    />\n                                    <button\n                                        [id]=\"'remove-mobile-' + index\"\n                                        class=\"btn btn-default\"\n                                    >\n                                        <i class=\"pficon pficon-delete\"></i>\n                                    </button>\n                                </form>\n                            </td>\n                        </tr>\n                    }\n                </tbody>\n            </table>\n        } @else {\n            <div>\n                <hr />\n                <ol id=\"kc-totp-settings\">\n                    <li>\n                        <p>{{ i18n.msgStr('totpStep1') }}</p>\n\n                        <ul id=\"kc-totp-supported-apps\">\n                            @for (app of totp.supportedApplications; track app) {\n                                <li>{{ i18n.advancedMsgStr(app) }}</li>\n                            }\n                        </ul>\n                    </li>\n                    @if (mode && mode === 'manual') {\n                        <li>\n                            <p>{{ i18n.msgStr('totpManualStep2') }}</p>\n                            <p>\n                                <span id=\"kc-totp-secret-key\">{{ totp.totpSecretEncoded }}</span>\n                            </p>\n                            <p>\n                                <a\n                                    [href]=\"totp.qrUrl\"\n                                    id=\"mode-barcode\"\n                                >\n                                    {{ i18n.msgStr('totpScanBarcode') }}\n                                </a>\n                            </p>\n                        </li>\n                        <li>\n                            <p>{{ i18n.msgStr('totpManualStep3') }}</p>\n                            <ul>\n                                <li id=\"kc-totp-type\">{{ i18n.msgStr('totpType') }}: {{ i18n.msgStr($any('totp.' + totp.policy.type)) }}</li>\n                                <li id=\"kc-totp-algorithm\">{{ i18n.msgStr('totpAlgorithm') }}: {{ totp.policy.getAlgorithmKey() }}</li>\n                                <li id=\"kc-totp-digits\">{{ i18n.msgStr('totpDigits') }}: {{ totp.policy.digits }}</li>\n                                @if (totp.policy.type === 'totp') {\n                                    <li id=\"kc-totp-period\">{{ i18n.msgStr('totpInterval') }}: {{ totp.policy.period }}</li>\n                                } @else {\n                                    <li id=\"kc-totp-counter\">{{ i18n.msgStr('totpCounter') }}: {{ totp.policy.initialCounter }}</li>\n                                }\n                            </ul>\n                        </li>\n                    } @else {\n                        <li>\n                            <p>{{ i18n.msgStr('totpStep2') }}</p>\n                            <p>\n                                <img\n                                    id=\"kc-totp-secret-qr-code\"\n                                    [src]=\"'data:image/png;base64, ' + totp.totpSecretQrCode\"\n                                    alt=\"Figure: Barcode\"\n                                />\n                            </p>\n                            <p>\n                                <a\n                                    [href]=\"totp.manualUrl\"\n                                    id=\"mode-manual\"\n                                >\n                                    {{ i18n.msgStr('totpUnableToScan') }}\n                                </a>\n                            </p>\n                        </li>\n                    }\n                    <li>\n                        <p>{{ i18n.msgStr('totpStep3') }}</p>\n                        <p>{{ i18n.msgStr('totpStep3DeviceName') }}</p>\n                    </li>\n                </ol>\n                <hr />\n                <form\n                    [action]=\"url.totpUrl\"\n                    [kcClass]=\"'kcFormClass'\"\n                    id=\"kc-totp-settings-form\"\n                    method=\"post\"\n                >\n                    <input\n                        type=\"hidden\"\n                        id=\"stateChecker\"\n                        name=\"stateChecker\"\n                        [value]=\"stateChecker\"\n                    />\n                    <div [kcClass]=\"'kcFormGroupClass'\">\n                        <div class=\"col-sm-2 col-md-2\">\n                            <label\n                                for=\"totp\"\n                                class=\"control-label\"\n                            >\n                                {{ i18n.msgStr('authenticatorCode') }}\n                            </label>\n                            <span class=\"required\">*</span>\n                        </div>\n                        <div class=\"col-sm-10 col-md-10\">\n                            <input\n                                type=\"text\"\n                                id=\"totp\"\n                                name=\"totp\"\n                                autoComplete=\"off\"\n                                [kcClass]=\"'kcInputClass'\"\n                                [attr.aria-invalid]=\"messagesPerField.existsError('totp')\"\n                            />\n                            @if (messagesPerField.existsError('totp')) {\n                                <span\n                                    id=\"input-error-otp-code\"\n                                    [kcClass]=\"'kcInputErrorMessageClass'\"\n                                    aria-live=\"polite\"\n                                    [innerHTML]=\"messagesPerField.get('totp') | kcSanitize: 'html'\"\n                                ></span>\n                            }\n                        </div>\n                        <input\n                            type=\"hidden\"\n                            id=\"totpSecret\"\n                            name=\"totpSecret\"\n                            [value]=\"totp.totpSecret\"\n                        />\n                        @if (mode) {\n                            <input\n                                type=\"hidden\"\n                                id=\"mode\"\n                                [value]=\"mode\"\n                            />\n                        }\n                    </div>\n\n                    <div [kcClass]=\"'kcFormGroupClass'\">\n                        <div class=\"col-sm-2 col-md-2\">\n                            <label\n                                for=\"userLabel\"\n                                [kcClass]=\"'kcLabelClass'\"\n                            >\n                                {{ i18n.msgStr('totpDeviceName') }}\n                            </label>\n                            @if (totp.otpCredentials.length >= 1) {\n                                <span class=\"required\">*</span>\n                            }\n                        </div>\n                        <div class=\"col-sm-10 col-md-10\">\n                            <input\n                                type=\"text\"\n                                id=\"userLabel\"\n                                name=\"userLabel\"\n                                autoComplete=\"off\"\n                                [kcClass]=\"'kcInputClass'\"\n                                [attr.aria-invalid]=\"messagesPerField.existsError('userLabel')\"\n                            />\n                            @if (messagesPerField.existsError('userLabel')) {\n                                <span\n                                    id=\"input-error-otp-label\"\n                                    [kcClass]=\"'kcInputErrorMessageClass'\"\n                                    aria-live=\"polite\"\n                                    [innerHTML]=\"messagesPerField.get('userLabel') | kcSanitize: 'html'\"\n                                ></span>\n                            }\n                        </div>\n                    </div>\n\n                    <div\n                        id=\"kc-form-buttons\"\n                        class=\"text-right\"\n                        [kcClass]=\"'kcFormGroupClass'\"\n                    >\n                        <div [kcClass]=\"'kcInputWrapperClass'\">\n                            <input\n                                type=\"submit\"\n                                [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                                id=\"saveTOTPBtn\"\n                                [value]=\"i18n.msgStr('doSave')\"\n                            />\n                            <button\n                                type=\"submit\"\n                                [kcClass]=\"['kcButtonClass', 'kcButtonDefaultClass', 'kcButtonLargeClass']\"\n                                id=\"cancelTOTPBtn\"\n                                name=\"submitAction\"\n                                value=\"Cancel\"\n                            >\n                                {{ i18n.msgStr('doCancel') }}\n                            </button>\n                        </div>\n                    </div>\n                </form>\n            </div>\n        }\n    </ng-container>\n</kc-account-template>\n", dependencies: [{ kind: "directive", type: KcClassDirective, selector: "[kcClass]", inputs: ["class", "ngClass", "kcClass"] }, { kind: "component", type: TemplateComponent, selector: "kc-account-template", inputs: ["active"] }, { kind: "pipe", type: KcSanitizePipe, name: "kcSanitize" }] }); }
+        ], usesInheritance: true, ngImport: i0, template: "@let url = kcContext.url;\n@let mode = kcContext.mode;\n@let messagesPerField = kcContext.messagesPerField;\n@let stateChecker = kcContext.stateChecker;\n@let totp = kcContext.totp;\n\n<div class=\"row\">\n    <div class=\"col-md-10\">\n        <h2>{{ i18n.msgStr('authenticatorTitle') }}</h2>\n    </div>\n    @if (totp.otpCredentials.length) {\n        <div class=\"subtitle col-md-2\">\n            <span class=\"required\">*</span>\n            {{ i18n.msgStr('requiredFields') }}\n        </div>\n    }\n</div>\n@if (totp.enabled) {\n    <table class=\"table table-bordered table-striped\">\n        <thead>\n            @if (totp.otpCredentials.length > 1) {\n                <tr>\n                    <th [colSpan]=\"4\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                </tr>\n            } @else {\n                <tr>\n                    <th [colSpan]=\"3\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                </tr>\n            }\n        </thead>\n        <tbody>\n            @for (credential of totp.otpCredentials; track credential; let index = $index) {\n                <tr>\n                    <td class=\"provider\">{{ i18n.msgStr('mobile') }}</td>\n                    @if (totp.otpCredentials.length > 1) {\n                        <td class=\"provider\">{{ credential.id }}</td>\n                    }\n                    <td class=\"provider\">{{ credential.userLabel || '' }}</td>\n                    <td class=\"action\">\n                        <form\n                            method=\"post\"\n                            class=\"form-inline\"\n                            [action]=\"url.totpUrl\"\n                        >\n                            <input\n                                type=\"hidden\"\n                                id=\"stateChecker\"\n                                name=\"stateChecker\"\n                                [value]=\"stateChecker\"\n                            />\n                            <input\n                                type=\"hidden\"\n                                id=\"submitAction\"\n                                name=\"submitAction\"\n                                value=\"Delete\"\n                            />\n                            <input\n                                type=\"hidden\"\n                                id=\"credentialId\"\n                                name=\"credentialId\"\n                                [value]=\"credential.id\"\n                            />\n                            <button\n                                class=\"btn btn-default\"\n                                [id]=\"'remove-mobile-' + index\"\n                            >\n                                <i class=\"pficon pficon-delete\"></i>\n                            </button>\n                        </form>\n                    </td>\n                </tr>\n            }\n        </tbody>\n    </table>\n} @else {\n    <div>\n        <hr />\n        <ol id=\"kc-totp-settings\">\n            <li>\n                <p>{{ i18n.msgStr('totpStep1') }}</p>\n\n                <ul id=\"kc-totp-supported-apps\">\n                    @for (app of totp.supportedApplications; track app) {\n                        <li>{{ i18n.advancedMsgStr(app) }}</li>\n                    }\n                </ul>\n            </li>\n            @if (mode && mode === 'manual') {\n                <li>\n                    <p>{{ i18n.msgStr('totpManualStep2') }}</p>\n                    <p>\n                        <span id=\"kc-totp-secret-key\">{{ totp.totpSecretEncoded }}</span>\n                    </p>\n                    <p>\n                        <a\n                            id=\"mode-barcode\"\n                            [href]=\"totp.qrUrl\"\n                        >\n                            {{ i18n.msgStr('totpScanBarcode') }}\n                        </a>\n                    </p>\n                </li>\n                <li>\n                    <p>{{ i18n.msgStr('totpManualStep3') }}</p>\n                    <ul>\n                        <li id=\"kc-totp-type\">{{ i18n.msgStr('totpType') }}: {{ i18n.msgStr($any('totp.' + totp.policy.type)) }}</li>\n                        <li id=\"kc-totp-algorithm\">{{ i18n.msgStr('totpAlgorithm') }}: {{ totp.policy.getAlgorithmKey() }}</li>\n                        <li id=\"kc-totp-digits\">{{ i18n.msgStr('totpDigits') }}: {{ totp.policy.digits }}</li>\n                        @if (totp.policy.type === 'totp') {\n                            <li id=\"kc-totp-period\">{{ i18n.msgStr('totpInterval') }}: {{ totp.policy.period }}</li>\n                        } @else {\n                            <li id=\"kc-totp-counter\">{{ i18n.msgStr('totpCounter') }}: {{ totp.policy.initialCounter }}</li>\n                        }\n                    </ul>\n                </li>\n            } @else {\n                <li>\n                    <p>{{ i18n.msgStr('totpStep2') }}</p>\n                    <p>\n                        <img\n                            id=\"kc-totp-secret-qr-code\"\n                            alt=\"Figure: Barcode\"\n                            [src]=\"'data:image/png;base64, ' + totp.totpSecretQrCode\"\n                        />\n                    </p>\n                    <p>\n                        <a\n                            id=\"mode-manual\"\n                            [href]=\"totp.manualUrl\"\n                        >\n                            {{ i18n.msgStr('totpUnableToScan') }}\n                        </a>\n                    </p>\n                </li>\n            }\n            <li>\n                <p>{{ i18n.msgStr('totpStep3') }}</p>\n                <p>{{ i18n.msgStr('totpStep3DeviceName') }}</p>\n            </li>\n        </ol>\n        <hr />\n        <form\n            id=\"kc-totp-settings-form\"\n            method=\"post\"\n            [action]=\"url.totpUrl\"\n            [kcClass]=\"'kcFormClass'\"\n        >\n            <input\n                type=\"hidden\"\n                id=\"stateChecker\"\n                name=\"stateChecker\"\n                [value]=\"stateChecker\"\n            />\n            <div [kcClass]=\"'kcFormGroupClass'\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"totp\"\n                        class=\"control-label\"\n                    >\n                        {{ i18n.msgStr('authenticatorCode') }}\n                    </label>\n                    <span class=\"required\">*</span>\n                </div>\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"text\"\n                        id=\"totp\"\n                        name=\"totp\"\n                        autoComplete=\"off\"\n                        [kcClass]=\"'kcInputClass'\"\n                        [attr.aria-invalid]=\"messagesPerField.existsError('totp')\"\n                    />\n                    @if (messagesPerField.existsError('totp')) {\n                        <span\n                            id=\"input-error-otp-code\"\n                            aria-live=\"polite\"\n                            [kcClass]=\"'kcInputErrorMessageClass'\"\n                            [innerHTML]=\"messagesPerField.get('totp') | kcSanitize: 'html'\"\n                        ></span>\n                    }\n                </div>\n                <input\n                    type=\"hidden\"\n                    id=\"totpSecret\"\n                    name=\"totpSecret\"\n                    [value]=\"totp.totpSecret\"\n                />\n                @if (mode) {\n                    <input\n                        type=\"hidden\"\n                        id=\"mode\"\n                        [value]=\"mode\"\n                    />\n                }\n            </div>\n\n            <div [kcClass]=\"'kcFormGroupClass'\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"userLabel\"\n                        [kcClass]=\"'kcLabelClass'\"\n                    >\n                        {{ i18n.msgStr('totpDeviceName') }}\n                    </label>\n                    @if (totp.otpCredentials.length >= 1) {\n                        <span class=\"required\">*</span>\n                    }\n                </div>\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"text\"\n                        id=\"userLabel\"\n                        name=\"userLabel\"\n                        autoComplete=\"off\"\n                        [kcClass]=\"'kcInputClass'\"\n                        [attr.aria-invalid]=\"messagesPerField.existsError('userLabel')\"\n                    />\n                    @if (messagesPerField.existsError('userLabel')) {\n                        <span\n                            id=\"input-error-otp-label\"\n                            aria-live=\"polite\"\n                            [kcClass]=\"'kcInputErrorMessageClass'\"\n                            [innerHTML]=\"messagesPerField.get('userLabel') | kcSanitize: 'html'\"\n                        ></span>\n                    }\n                </div>\n            </div>\n\n            <div\n                id=\"kc-form-buttons\"\n                class=\"text-right\"\n                [kcClass]=\"'kcFormGroupClass'\"\n            >\n                <div [kcClass]=\"'kcInputWrapperClass'\">\n                    <input\n                        type=\"submit\"\n                        id=\"saveTOTPBtn\"\n                        [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                        [value]=\"i18n.msgStr('doSave')\"\n                    />\n                    <button\n                        type=\"submit\"\n                        id=\"cancelTOTPBtn\"\n                        name=\"submitAction\"\n                        value=\"Cancel\"\n                        [kcClass]=\"['kcButtonClass', 'kcButtonDefaultClass', 'kcButtonLargeClass']\"\n                    >\n                        {{ i18n.msgStr('doCancel') }}\n                    </button>\n                </div>\n            </div>\n        </form>\n    </div>\n}\n", dependencies: [{ kind: "directive", type: KcClassDirective, selector: "[kcClass]", inputs: ["class", "ngClass", "kcClass"] }, { kind: "pipe", type: KcSanitizePipe, name: "kcSanitize" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: TotpComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.7", ngImport: i0, type: TotpComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, imports: [KcClassDirective, TemplateComponent, KcSanitizePipe, NgClass], selector: 'kc-root', providers: [
+            args: [{ standalone: true, imports: [KcClassDirective, TemplateComponent, KcSanitizePipe, NgClass], selector: 'kc-totp', providers: [
                         {
                             provide: ComponentReference,
                             useExisting: forwardRef(() => TotpComponent)
                         }
-                    ], template: "@let url = kcContext.url;\n@let mode = kcContext.mode;\n@let messagesPerField = kcContext.messagesPerField;\n@let stateChecker = kcContext.stateChecker;\n@let totp = kcContext.totp;\n\n<kc-account-template [active]=\"'totp'\">\n    <ng-container content>\n        <div class=\"row\">\n            <div class=\"col-md-10\">\n                <h2>{{ i18n.msgStr('authenticatorTitle') }}</h2>\n            </div>\n            @if (totp.otpCredentials.length) {\n                <div class=\"subtitle col-md-2\">\n                    <span class=\"required\">*</span>\n                    {{ i18n.msgStr('requiredFields') }}\n                </div>\n            }\n        </div>\n        @if (totp.enabled) {\n            <table class=\"table table-bordered table-striped\">\n                <thead>\n                    @if (totp.otpCredentials.length > 1) {\n                        <tr>\n                            <th [colSpan]=\"4\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                        </tr>\n                    } @else {\n                        <tr>\n                            <th [colSpan]=\"3\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                        </tr>\n                    }\n                </thead>\n                <tbody>\n                    @for (credential of totp.otpCredentials; track credential; let index = $index) {\n                        <tr>\n                            <td class=\"provider\">{{ i18n.msgStr('mobile') }}</td>\n                            @if (totp.otpCredentials.length > 1) {\n                                <td class=\"provider\">{{ credential.id }}</td>\n                            }\n                            <td class=\"provider\">{{ credential.userLabel || '' }}</td>\n                            <td class=\"action\">\n                                <form\n                                    [action]=\"url.totpUrl\"\n                                    method=\"post\"\n                                    class=\"form-inline\"\n                                >\n                                    <input\n                                        type=\"hidden\"\n                                        id=\"stateChecker\"\n                                        name=\"stateChecker\"\n                                        [value]=\"stateChecker\"\n                                    />\n                                    <input\n                                        type=\"hidden\"\n                                        id=\"submitAction\"\n                                        name=\"submitAction\"\n                                        value=\"Delete\"\n                                    />\n                                    <input\n                                        type=\"hidden\"\n                                        id=\"credentialId\"\n                                        name=\"credentialId\"\n                                        [value]=\"credential.id\"\n                                    />\n                                    <button\n                                        [id]=\"'remove-mobile-' + index\"\n                                        class=\"btn btn-default\"\n                                    >\n                                        <i class=\"pficon pficon-delete\"></i>\n                                    </button>\n                                </form>\n                            </td>\n                        </tr>\n                    }\n                </tbody>\n            </table>\n        } @else {\n            <div>\n                <hr />\n                <ol id=\"kc-totp-settings\">\n                    <li>\n                        <p>{{ i18n.msgStr('totpStep1') }}</p>\n\n                        <ul id=\"kc-totp-supported-apps\">\n                            @for (app of totp.supportedApplications; track app) {\n                                <li>{{ i18n.advancedMsgStr(app) }}</li>\n                            }\n                        </ul>\n                    </li>\n                    @if (mode && mode === 'manual') {\n                        <li>\n                            <p>{{ i18n.msgStr('totpManualStep2') }}</p>\n                            <p>\n                                <span id=\"kc-totp-secret-key\">{{ totp.totpSecretEncoded }}</span>\n                            </p>\n                            <p>\n                                <a\n                                    [href]=\"totp.qrUrl\"\n                                    id=\"mode-barcode\"\n                                >\n                                    {{ i18n.msgStr('totpScanBarcode') }}\n                                </a>\n                            </p>\n                        </li>\n                        <li>\n                            <p>{{ i18n.msgStr('totpManualStep3') }}</p>\n                            <ul>\n                                <li id=\"kc-totp-type\">{{ i18n.msgStr('totpType') }}: {{ i18n.msgStr($any('totp.' + totp.policy.type)) }}</li>\n                                <li id=\"kc-totp-algorithm\">{{ i18n.msgStr('totpAlgorithm') }}: {{ totp.policy.getAlgorithmKey() }}</li>\n                                <li id=\"kc-totp-digits\">{{ i18n.msgStr('totpDigits') }}: {{ totp.policy.digits }}</li>\n                                @if (totp.policy.type === 'totp') {\n                                    <li id=\"kc-totp-period\">{{ i18n.msgStr('totpInterval') }}: {{ totp.policy.period }}</li>\n                                } @else {\n                                    <li id=\"kc-totp-counter\">{{ i18n.msgStr('totpCounter') }}: {{ totp.policy.initialCounter }}</li>\n                                }\n                            </ul>\n                        </li>\n                    } @else {\n                        <li>\n                            <p>{{ i18n.msgStr('totpStep2') }}</p>\n                            <p>\n                                <img\n                                    id=\"kc-totp-secret-qr-code\"\n                                    [src]=\"'data:image/png;base64, ' + totp.totpSecretQrCode\"\n                                    alt=\"Figure: Barcode\"\n                                />\n                            </p>\n                            <p>\n                                <a\n                                    [href]=\"totp.manualUrl\"\n                                    id=\"mode-manual\"\n                                >\n                                    {{ i18n.msgStr('totpUnableToScan') }}\n                                </a>\n                            </p>\n                        </li>\n                    }\n                    <li>\n                        <p>{{ i18n.msgStr('totpStep3') }}</p>\n                        <p>{{ i18n.msgStr('totpStep3DeviceName') }}</p>\n                    </li>\n                </ol>\n                <hr />\n                <form\n                    [action]=\"url.totpUrl\"\n                    [kcClass]=\"'kcFormClass'\"\n                    id=\"kc-totp-settings-form\"\n                    method=\"post\"\n                >\n                    <input\n                        type=\"hidden\"\n                        id=\"stateChecker\"\n                        name=\"stateChecker\"\n                        [value]=\"stateChecker\"\n                    />\n                    <div [kcClass]=\"'kcFormGroupClass'\">\n                        <div class=\"col-sm-2 col-md-2\">\n                            <label\n                                for=\"totp\"\n                                class=\"control-label\"\n                            >\n                                {{ i18n.msgStr('authenticatorCode') }}\n                            </label>\n                            <span class=\"required\">*</span>\n                        </div>\n                        <div class=\"col-sm-10 col-md-10\">\n                            <input\n                                type=\"text\"\n                                id=\"totp\"\n                                name=\"totp\"\n                                autoComplete=\"off\"\n                                [kcClass]=\"'kcInputClass'\"\n                                [attr.aria-invalid]=\"messagesPerField.existsError('totp')\"\n                            />\n                            @if (messagesPerField.existsError('totp')) {\n                                <span\n                                    id=\"input-error-otp-code\"\n                                    [kcClass]=\"'kcInputErrorMessageClass'\"\n                                    aria-live=\"polite\"\n                                    [innerHTML]=\"messagesPerField.get('totp') | kcSanitize: 'html'\"\n                                ></span>\n                            }\n                        </div>\n                        <input\n                            type=\"hidden\"\n                            id=\"totpSecret\"\n                            name=\"totpSecret\"\n                            [value]=\"totp.totpSecret\"\n                        />\n                        @if (mode) {\n                            <input\n                                type=\"hidden\"\n                                id=\"mode\"\n                                [value]=\"mode\"\n                            />\n                        }\n                    </div>\n\n                    <div [kcClass]=\"'kcFormGroupClass'\">\n                        <div class=\"col-sm-2 col-md-2\">\n                            <label\n                                for=\"userLabel\"\n                                [kcClass]=\"'kcLabelClass'\"\n                            >\n                                {{ i18n.msgStr('totpDeviceName') }}\n                            </label>\n                            @if (totp.otpCredentials.length >= 1) {\n                                <span class=\"required\">*</span>\n                            }\n                        </div>\n                        <div class=\"col-sm-10 col-md-10\">\n                            <input\n                                type=\"text\"\n                                id=\"userLabel\"\n                                name=\"userLabel\"\n                                autoComplete=\"off\"\n                                [kcClass]=\"'kcInputClass'\"\n                                [attr.aria-invalid]=\"messagesPerField.existsError('userLabel')\"\n                            />\n                            @if (messagesPerField.existsError('userLabel')) {\n                                <span\n                                    id=\"input-error-otp-label\"\n                                    [kcClass]=\"'kcInputErrorMessageClass'\"\n                                    aria-live=\"polite\"\n                                    [innerHTML]=\"messagesPerField.get('userLabel') | kcSanitize: 'html'\"\n                                ></span>\n                            }\n                        </div>\n                    </div>\n\n                    <div\n                        id=\"kc-form-buttons\"\n                        class=\"text-right\"\n                        [kcClass]=\"'kcFormGroupClass'\"\n                    >\n                        <div [kcClass]=\"'kcInputWrapperClass'\">\n                            <input\n                                type=\"submit\"\n                                [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                                id=\"saveTOTPBtn\"\n                                [value]=\"i18n.msgStr('doSave')\"\n                            />\n                            <button\n                                type=\"submit\"\n                                [kcClass]=\"['kcButtonClass', 'kcButtonDefaultClass', 'kcButtonLargeClass']\"\n                                id=\"cancelTOTPBtn\"\n                                name=\"submitAction\"\n                                value=\"Cancel\"\n                            >\n                                {{ i18n.msgStr('doCancel') }}\n                            </button>\n                        </div>\n                    </div>\n                </form>\n            </div>\n        }\n    </ng-container>\n</kc-account-template>\n" }]
+                    ], template: "@let url = kcContext.url;\n@let mode = kcContext.mode;\n@let messagesPerField = kcContext.messagesPerField;\n@let stateChecker = kcContext.stateChecker;\n@let totp = kcContext.totp;\n\n<div class=\"row\">\n    <div class=\"col-md-10\">\n        <h2>{{ i18n.msgStr('authenticatorTitle') }}</h2>\n    </div>\n    @if (totp.otpCredentials.length) {\n        <div class=\"subtitle col-md-2\">\n            <span class=\"required\">*</span>\n            {{ i18n.msgStr('requiredFields') }}\n        </div>\n    }\n</div>\n@if (totp.enabled) {\n    <table class=\"table table-bordered table-striped\">\n        <thead>\n            @if (totp.otpCredentials.length > 1) {\n                <tr>\n                    <th [colSpan]=\"4\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                </tr>\n            } @else {\n                <tr>\n                    <th [colSpan]=\"3\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                </tr>\n            }\n        </thead>\n        <tbody>\n            @for (credential of totp.otpCredentials; track credential; let index = $index) {\n                <tr>\n                    <td class=\"provider\">{{ i18n.msgStr('mobile') }}</td>\n                    @if (totp.otpCredentials.length > 1) {\n                        <td class=\"provider\">{{ credential.id }}</td>\n                    }\n                    <td class=\"provider\">{{ credential.userLabel || '' }}</td>\n                    <td class=\"action\">\n                        <form\n                            method=\"post\"\n                            class=\"form-inline\"\n                            [action]=\"url.totpUrl\"\n                        >\n                            <input\n                                type=\"hidden\"\n                                id=\"stateChecker\"\n                                name=\"stateChecker\"\n                                [value]=\"stateChecker\"\n                            />\n                            <input\n                                type=\"hidden\"\n                                id=\"submitAction\"\n                                name=\"submitAction\"\n                                value=\"Delete\"\n                            />\n                            <input\n                                type=\"hidden\"\n                                id=\"credentialId\"\n                                name=\"credentialId\"\n                                [value]=\"credential.id\"\n                            />\n                            <button\n                                class=\"btn btn-default\"\n                                [id]=\"'remove-mobile-' + index\"\n                            >\n                                <i class=\"pficon pficon-delete\"></i>\n                            </button>\n                        </form>\n                    </td>\n                </tr>\n            }\n        </tbody>\n    </table>\n} @else {\n    <div>\n        <hr />\n        <ol id=\"kc-totp-settings\">\n            <li>\n                <p>{{ i18n.msgStr('totpStep1') }}</p>\n\n                <ul id=\"kc-totp-supported-apps\">\n                    @for (app of totp.supportedApplications; track app) {\n                        <li>{{ i18n.advancedMsgStr(app) }}</li>\n                    }\n                </ul>\n            </li>\n            @if (mode && mode === 'manual') {\n                <li>\n                    <p>{{ i18n.msgStr('totpManualStep2') }}</p>\n                    <p>\n                        <span id=\"kc-totp-secret-key\">{{ totp.totpSecretEncoded }}</span>\n                    </p>\n                    <p>\n                        <a\n                            id=\"mode-barcode\"\n                            [href]=\"totp.qrUrl\"\n                        >\n                            {{ i18n.msgStr('totpScanBarcode') }}\n                        </a>\n                    </p>\n                </li>\n                <li>\n                    <p>{{ i18n.msgStr('totpManualStep3') }}</p>\n                    <ul>\n                        <li id=\"kc-totp-type\">{{ i18n.msgStr('totpType') }}: {{ i18n.msgStr($any('totp.' + totp.policy.type)) }}</li>\n                        <li id=\"kc-totp-algorithm\">{{ i18n.msgStr('totpAlgorithm') }}: {{ totp.policy.getAlgorithmKey() }}</li>\n                        <li id=\"kc-totp-digits\">{{ i18n.msgStr('totpDigits') }}: {{ totp.policy.digits }}</li>\n                        @if (totp.policy.type === 'totp') {\n                            <li id=\"kc-totp-period\">{{ i18n.msgStr('totpInterval') }}: {{ totp.policy.period }}</li>\n                        } @else {\n                            <li id=\"kc-totp-counter\">{{ i18n.msgStr('totpCounter') }}: {{ totp.policy.initialCounter }}</li>\n                        }\n                    </ul>\n                </li>\n            } @else {\n                <li>\n                    <p>{{ i18n.msgStr('totpStep2') }}</p>\n                    <p>\n                        <img\n                            id=\"kc-totp-secret-qr-code\"\n                            alt=\"Figure: Barcode\"\n                            [src]=\"'data:image/png;base64, ' + totp.totpSecretQrCode\"\n                        />\n                    </p>\n                    <p>\n                        <a\n                            id=\"mode-manual\"\n                            [href]=\"totp.manualUrl\"\n                        >\n                            {{ i18n.msgStr('totpUnableToScan') }}\n                        </a>\n                    </p>\n                </li>\n            }\n            <li>\n                <p>{{ i18n.msgStr('totpStep3') }}</p>\n                <p>{{ i18n.msgStr('totpStep3DeviceName') }}</p>\n            </li>\n        </ol>\n        <hr />\n        <form\n            id=\"kc-totp-settings-form\"\n            method=\"post\"\n            [action]=\"url.totpUrl\"\n            [kcClass]=\"'kcFormClass'\"\n        >\n            <input\n                type=\"hidden\"\n                id=\"stateChecker\"\n                name=\"stateChecker\"\n                [value]=\"stateChecker\"\n            />\n            <div [kcClass]=\"'kcFormGroupClass'\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"totp\"\n                        class=\"control-label\"\n                    >\n                        {{ i18n.msgStr('authenticatorCode') }}\n                    </label>\n                    <span class=\"required\">*</span>\n                </div>\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"text\"\n                        id=\"totp\"\n                        name=\"totp\"\n                        autoComplete=\"off\"\n                        [kcClass]=\"'kcInputClass'\"\n                        [attr.aria-invalid]=\"messagesPerField.existsError('totp')\"\n                    />\n                    @if (messagesPerField.existsError('totp')) {\n                        <span\n                            id=\"input-error-otp-code\"\n                            aria-live=\"polite\"\n                            [kcClass]=\"'kcInputErrorMessageClass'\"\n                            [innerHTML]=\"messagesPerField.get('totp') | kcSanitize: 'html'\"\n                        ></span>\n                    }\n                </div>\n                <input\n                    type=\"hidden\"\n                    id=\"totpSecret\"\n                    name=\"totpSecret\"\n                    [value]=\"totp.totpSecret\"\n                />\n                @if (mode) {\n                    <input\n                        type=\"hidden\"\n                        id=\"mode\"\n                        [value]=\"mode\"\n                    />\n                }\n            </div>\n\n            <div [kcClass]=\"'kcFormGroupClass'\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"userLabel\"\n                        [kcClass]=\"'kcLabelClass'\"\n                    >\n                        {{ i18n.msgStr('totpDeviceName') }}\n                    </label>\n                    @if (totp.otpCredentials.length >= 1) {\n                        <span class=\"required\">*</span>\n                    }\n                </div>\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"text\"\n                        id=\"userLabel\"\n                        name=\"userLabel\"\n                        autoComplete=\"off\"\n                        [kcClass]=\"'kcInputClass'\"\n                        [attr.aria-invalid]=\"messagesPerField.existsError('userLabel')\"\n                    />\n                    @if (messagesPerField.existsError('userLabel')) {\n                        <span\n                            id=\"input-error-otp-label\"\n                            aria-live=\"polite\"\n                            [kcClass]=\"'kcInputErrorMessageClass'\"\n                            [innerHTML]=\"messagesPerField.get('userLabel') | kcSanitize: 'html'\"\n                        ></span>\n                    }\n                </div>\n            </div>\n\n            <div\n                id=\"kc-form-buttons\"\n                class=\"text-right\"\n                [kcClass]=\"'kcFormGroupClass'\"\n            >\n                <div [kcClass]=\"'kcInputWrapperClass'\">\n                    <input\n                        type=\"submit\"\n                        id=\"saveTOTPBtn\"\n                        [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                        [value]=\"i18n.msgStr('doSave')\"\n                    />\n                    <button\n                        type=\"submit\"\n                        id=\"cancelTOTPBtn\"\n                        name=\"submitAction\"\n                        value=\"Cancel\"\n                        [kcClass]=\"['kcButtonClass', 'kcButtonDefaultClass', 'kcButtonLargeClass']\"\n                    >\n                        {{ i18n.msgStr('doCancel') }}\n                    </button>\n                </div>\n            </div>\n        </form>\n    </div>\n}\n" }]
         }] });
 
 /**

package/fesm2022/keycloakify-angular-account-pages-totp.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"keycloakify-angular-account-pages-totp.mjs","sources":["../../src/account/pages/totp/totp.component.ts","../../src/account/pages/totp/totp.component.html","../../src/account/pages/totp/keycloakify-angular-account-pages-totp.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport { Component, forwardRef, inject } from '@angular/core';\nimport { ComponentReference } from '@keycloakify/angular/account/classes/component-reference';\nimport { TemplateComponent } from '@keycloakify/angular/account/containers/template';\nimport { KcClassDirective } from '@keycloakify/angular/account/directives/kc-class';\nimport { ACCOUNT_CLASSES } from '@keycloakify/angular/account/tokens/classes';\nimport { ACCOUNT_I18N } from '@keycloakify/angular/account/tokens/i18n';\nimport { KC_ACCOUNT_CONTEXT } from '@keycloakify/angular/account/tokens/kc-context';\nimport { KcSanitizePipe } from '@keycloakify/angular/lib/pipes/kc-sanitize';\nimport { USE_DEFAULT_CSS } from '@keycloakify/angular/lib/tokens/use-default-css';\nimport type { ClassKey } from 'keycloakify/account';\nimport type { I18n } from '@keycloakify/angular/account/i18n';\nimport type { KcContext } from '@keycloakify/angular/account/KcContext';\n\n@Component({\n    standalone: true,\n    imports: [KcClassDirective, TemplateComponent, KcSanitizePipe, NgClass],\n    selector: 'kc-root',\n    templateUrl: 'totp.component.html',\n    providers: [\n        {\n            provide: ComponentReference,\n            useExisting: forwardRef(() => TotpComponent)\n        }\n    ]\n})\nexport class TotpComponent extends ComponentReference {\n    i18n = inject<I18n>(ACCOUNT_I18N);\n    kcContext = inject<Extract<KcContext, { pageId: 'totp.ftl' }>>(KC_ACCOUNT_CONTEXT);\n    override doUseDefaultCss = inject<boolean>(USE_DEFAULT_CSS);\n    override classes = inject<Partial<Record<ClassKey, string>>>(ACCOUNT_CLASSES);\n}\n","@let url = kcContext.url;\n@let mode = kcContext.mode;\n@let messagesPerField = kcContext.messagesPerField;\n@let stateChecker = kcContext.stateChecker;\n@let totp = kcContext.totp;\n\n<kc-account-template [active]=\"'totp'\">\n    <ng-container content>\n        <div class=\"row\">\n            <div class=\"col-md-10\">\n                <h2>{{ i18n.msgStr('authenticatorTitle') }}</h2>\n            </div>\n            @if (totp.otpCredentials.length) {\n                <div class=\"subtitle col-md-2\">\n                    <span class=\"required\">*</span>\n                    {{ i18n.msgStr('requiredFields') }}\n                </div>\n            }\n        </div>\n        @if (totp.enabled) {\n            <table class=\"table table-bordered table-striped\">\n                <thead>\n                    @if (totp.otpCredentials.length > 1) {\n                        <tr>\n                            <th [colSpan]=\"4\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                        </tr>\n                    } @else {\n                        <tr>\n                            <th [colSpan]=\"3\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                        </tr>\n                    }\n                </thead>\n                <tbody>\n                    @for (credential of totp.otpCredentials; track credential; let index = $index) {\n                        <tr>\n                            <td class=\"provider\">{{ i18n.msgStr('mobile') }}</td>\n                            @if (totp.otpCredentials.length > 1) {\n                                <td class=\"provider\">{{ credential.id }}</td>\n                            }\n                            <td class=\"provider\">{{ credential.userLabel || '' }}</td>\n                            <td class=\"action\">\n                                <form\n                                    [action]=\"url.totpUrl\"\n                                    method=\"post\"\n                                    class=\"form-inline\"\n                                >\n                                    <input\n                                        type=\"hidden\"\n                                        id=\"stateChecker\"\n                                        name=\"stateChecker\"\n                                        [value]=\"stateChecker\"\n                                    />\n                                    <input\n                                        type=\"hidden\"\n                                        id=\"submitAction\"\n                                        name=\"submitAction\"\n                                        value=\"Delete\"\n                                    />\n                                    <input\n                                        type=\"hidden\"\n                                        id=\"credentialId\"\n                                        name=\"credentialId\"\n                                        [value]=\"credential.id\"\n                                    />\n                                    <button\n                                        [id]=\"'remove-mobile-' + index\"\n                                        class=\"btn btn-default\"\n                                    >\n                                        <i class=\"pficon pficon-delete\"></i>\n                                    </button>\n                                </form>\n                            </td>\n                        </tr>\n                    }\n                </tbody>\n            </table>\n        } @else {\n            <div>\n                <hr />\n                <ol id=\"kc-totp-settings\">\n                    <li>\n                        <p>{{ i18n.msgStr('totpStep1') }}</p>\n\n                        <ul id=\"kc-totp-supported-apps\">\n                            @for (app of totp.supportedApplications; track app) {\n                                <li>{{ i18n.advancedMsgStr(app) }}</li>\n                            }\n                        </ul>\n                    </li>\n                    @if (mode && mode === 'manual') {\n                        <li>\n                            <p>{{ i18n.msgStr('totpManualStep2') }}</p>\n                            <p>\n                                <span id=\"kc-totp-secret-key\">{{ totp.totpSecretEncoded }}</span>\n                            </p>\n                            <p>\n                                <a\n                                    [href]=\"totp.qrUrl\"\n                                    id=\"mode-barcode\"\n                                >\n                                    {{ i18n.msgStr('totpScanBarcode') }}\n                                </a>\n                            </p>\n                        </li>\n                        <li>\n                            <p>{{ i18n.msgStr('totpManualStep3') }}</p>\n                            <ul>\n                                <li id=\"kc-totp-type\">{{ i18n.msgStr('totpType') }}: {{ i18n.msgStr($any('totp.' + totp.policy.type)) }}</li>\n                                <li id=\"kc-totp-algorithm\">{{ i18n.msgStr('totpAlgorithm') }}: {{ totp.policy.getAlgorithmKey() }}</li>\n                                <li id=\"kc-totp-digits\">{{ i18n.msgStr('totpDigits') }}: {{ totp.policy.digits }}</li>\n                                @if (totp.policy.type === 'totp') {\n                                    <li id=\"kc-totp-period\">{{ i18n.msgStr('totpInterval') }}: {{ totp.policy.period }}</li>\n                                } @else {\n                                    <li id=\"kc-totp-counter\">{{ i18n.msgStr('totpCounter') }}: {{ totp.policy.initialCounter }}</li>\n                                }\n                            </ul>\n                        </li>\n                    } @else {\n                        <li>\n                            <p>{{ i18n.msgStr('totpStep2') }}</p>\n                            <p>\n                                <img\n                                    id=\"kc-totp-secret-qr-code\"\n                                    [src]=\"'data:image/png;base64, ' + totp.totpSecretQrCode\"\n                                    alt=\"Figure: Barcode\"\n                                />\n                            </p>\n                            <p>\n                                <a\n                                    [href]=\"totp.manualUrl\"\n                                    id=\"mode-manual\"\n                                >\n                                    {{ i18n.msgStr('totpUnableToScan') }}\n                                </a>\n                            </p>\n                        </li>\n                    }\n                    <li>\n                        <p>{{ i18n.msgStr('totpStep3') }}</p>\n                        <p>{{ i18n.msgStr('totpStep3DeviceName') }}</p>\n                    </li>\n                </ol>\n                <hr />\n                <form\n                    [action]=\"url.totpUrl\"\n                    [kcClass]=\"'kcFormClass'\"\n                    id=\"kc-totp-settings-form\"\n                    method=\"post\"\n                >\n                    <input\n                        type=\"hidden\"\n                        id=\"stateChecker\"\n                        name=\"stateChecker\"\n                        [value]=\"stateChecker\"\n                    />\n                    <div [kcClass]=\"'kcFormGroupClass'\">\n                        <div class=\"col-sm-2 col-md-2\">\n                            <label\n                                for=\"totp\"\n                                class=\"control-label\"\n                            >\n                                {{ i18n.msgStr('authenticatorCode') }}\n                            </label>\n                            <span class=\"required\">*</span>\n                        </div>\n                        <div class=\"col-sm-10 col-md-10\">\n                            <input\n                                type=\"text\"\n                                id=\"totp\"\n                                name=\"totp\"\n                                autoComplete=\"off\"\n                                [kcClass]=\"'kcInputClass'\"\n                                [attr.aria-invalid]=\"messagesPerField.existsError('totp')\"\n                            />\n                            @if (messagesPerField.existsError('totp')) {\n                                <span\n                                    id=\"input-error-otp-code\"\n                                    [kcClass]=\"'kcInputErrorMessageClass'\"\n                                    aria-live=\"polite\"\n                                    [innerHTML]=\"messagesPerField.get('totp') | kcSanitize: 'html'\"\n                                ></span>\n                            }\n                        </div>\n                        <input\n                            type=\"hidden\"\n                            id=\"totpSecret\"\n                            name=\"totpSecret\"\n                            [value]=\"totp.totpSecret\"\n                        />\n                        @if (mode) {\n                            <input\n                                type=\"hidden\"\n                                id=\"mode\"\n                                [value]=\"mode\"\n                            />\n                        }\n                    </div>\n\n                    <div [kcClass]=\"'kcFormGroupClass'\">\n                        <div class=\"col-sm-2 col-md-2\">\n                            <label\n                                for=\"userLabel\"\n                                [kcClass]=\"'kcLabelClass'\"\n                            >\n                                {{ i18n.msgStr('totpDeviceName') }}\n                            </label>\n                            @if (totp.otpCredentials.length >= 1) {\n                                <span class=\"required\">*</span>\n                            }\n                        </div>\n                        <div class=\"col-sm-10 col-md-10\">\n                            <input\n                                type=\"text\"\n                                id=\"userLabel\"\n                                name=\"userLabel\"\n                                autoComplete=\"off\"\n                                [kcClass]=\"'kcInputClass'\"\n                                [attr.aria-invalid]=\"messagesPerField.existsError('userLabel')\"\n                            />\n                            @if (messagesPerField.existsError('userLabel')) {\n                                <span\n                                    id=\"input-error-otp-label\"\n                                    [kcClass]=\"'kcInputErrorMessageClass'\"\n                                    aria-live=\"polite\"\n                                    [innerHTML]=\"messagesPerField.get('userLabel') | kcSanitize: 'html'\"\n                                ></span>\n                            }\n                        </div>\n                    </div>\n\n                    <div\n                        id=\"kc-form-buttons\"\n                        class=\"text-right\"\n                        [kcClass]=\"'kcFormGroupClass'\"\n                    >\n                        <div [kcClass]=\"'kcInputWrapperClass'\">\n                            <input\n                                type=\"submit\"\n                                [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                                id=\"saveTOTPBtn\"\n                                [value]=\"i18n.msgStr('doSave')\"\n                            />\n                            <button\n                                type=\"submit\"\n                                [kcClass]=\"['kcButtonClass', 'kcButtonDefaultClass', 'kcButtonLargeClass']\"\n                                id=\"cancelTOTPBtn\"\n                                name=\"submitAction\"\n                                value=\"Cancel\"\n                            >\n                                {{ i18n.msgStr('doCancel') }}\n                            </button>\n                        </div>\n                    </div>\n                </form>\n            </div>\n        }\n    </ng-container>\n</kc-account-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;AA0BM,MAAO,aAAc,SAAQ,kBAAkB,CAAA;AAZrD,IAAA,WAAA,GAAA;;AAaI,QAAA,IAAA,CAAA,IAAI,GAAG,MAAM,CAAO,YAAY,CAAC,CAAC;AAClC,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAA6C,kBAAkB,CAAC,CAAC;AAC1E,QAAA,IAAA,CAAA,eAAe,GAAG,MAAM,CAAU,eAAe,CAAC,CAAC;AACnD,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAoC,eAAe,CAAC,CAAC;AACjF,KAAA;8GALY,aAAa,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAb,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,aAAa,EAPX,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA;AACP,YAAA;AACI,gBAAA,OAAO,EAAE,kBAAkB;AAC3B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,aAAa,CAAC;AAC/C,aAAA;AACJ,SAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECxBL,gpYAkQA,EDlPc,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,gBAAgB,EAAE,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,iBAAiB,+EAAE,cAAc,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAUpD,aAAa,EAAA,UAAA,EAAA,CAAA;kBAZzB,SAAS;AACM,YAAA,IAAA,EAAA,CAAA,EAAA,UAAA,EAAA,IAAI,EACP,OAAA,EAAA,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,cAAc,EAAE,OAAO,CAAC,EAC7D,QAAA,EAAA,SAAS,EAER,SAAA,EAAA;AACP,wBAAA;AACI,4BAAA,OAAO,EAAE,kBAAkB;AAC3B,4BAAA,WAAW,EAAE,UAAU,CAAC,mBAAmB,CAAC;AAC/C,yBAAA;AACJ,qBAAA,EAAA,QAAA,EAAA,gpYAAA,EAAA,CAAA;;;AExBL;;AAEG;;;;"}
+{"version":3,"file":"keycloakify-angular-account-pages-totp.mjs","sources":["../../src/account/pages/totp/totp.component.ts","../../src/account/pages/totp/totp.component.html","../../src/account/pages/totp/keycloakify-angular-account-pages-totp.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport { Component, forwardRef, inject } from '@angular/core';\nimport { ComponentReference } from '@keycloakify/angular/account/classes/component-reference';\nimport { TemplateComponent } from '@keycloakify/angular/account/containers/template';\nimport { KcClassDirective } from '@keycloakify/angular/account/directives/kc-class';\nimport type { I18n } from '@keycloakify/angular/account/i18n';\nimport type { KcContext } from '@keycloakify/angular/account/KcContext';\nimport { ACCOUNT_CLASSES } from '@keycloakify/angular/account/tokens/classes';\nimport { ACCOUNT_I18N } from '@keycloakify/angular/account/tokens/i18n';\nimport { KC_ACCOUNT_CONTEXT } from '@keycloakify/angular/account/tokens/kc-context';\nimport { KcSanitizePipe } from '@keycloakify/angular/lib/pipes/kc-sanitize';\nimport { USE_DEFAULT_CSS } from '@keycloakify/angular/lib/tokens/use-default-css';\nimport type { ClassKey } from 'keycloakify/account';\n\n@Component({\n    standalone: true,\n    imports: [KcClassDirective, TemplateComponent, KcSanitizePipe, NgClass],\n    selector: 'kc-totp',\n    templateUrl: 'totp.component.html',\n    providers: [\n        {\n            provide: ComponentReference,\n            useExisting: forwardRef(() => TotpComponent)\n        }\n    ]\n})\nexport class TotpComponent extends ComponentReference {\n    i18n = inject<I18n>(ACCOUNT_I18N);\n    kcContext = inject<Extract<KcContext, { pageId: 'totp.ftl' }>>(KC_ACCOUNT_CONTEXT);\n    override doUseDefaultCss = inject<boolean>(USE_DEFAULT_CSS);\n    override classes = inject<Partial<Record<ClassKey, string>>>(ACCOUNT_CLASSES);\n    active = 'totp';\n}\n","@let url = kcContext.url;\n@let mode = kcContext.mode;\n@let messagesPerField = kcContext.messagesPerField;\n@let stateChecker = kcContext.stateChecker;\n@let totp = kcContext.totp;\n\n<div class=\"row\">\n    <div class=\"col-md-10\">\n        <h2>{{ i18n.msgStr('authenticatorTitle') }}</h2>\n    </div>\n    @if (totp.otpCredentials.length) {\n        <div class=\"subtitle col-md-2\">\n            <span class=\"required\">*</span>\n            {{ i18n.msgStr('requiredFields') }}\n        </div>\n    }\n</div>\n@if (totp.enabled) {\n    <table class=\"table table-bordered table-striped\">\n        <thead>\n            @if (totp.otpCredentials.length > 1) {\n                <tr>\n                    <th [colSpan]=\"4\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                </tr>\n            } @else {\n                <tr>\n                    <th [colSpan]=\"3\">{{ i18n.msgStr('configureAuthenticators') }}</th>\n                </tr>\n            }\n        </thead>\n        <tbody>\n            @for (credential of totp.otpCredentials; track credential; let index = $index) {\n                <tr>\n                    <td class=\"provider\">{{ i18n.msgStr('mobile') }}</td>\n                    @if (totp.otpCredentials.length > 1) {\n                        <td class=\"provider\">{{ credential.id }}</td>\n                    }\n                    <td class=\"provider\">{{ credential.userLabel || '' }}</td>\n                    <td class=\"action\">\n                        <form\n                            method=\"post\"\n                            class=\"form-inline\"\n                            [action]=\"url.totpUrl\"\n                        >\n                            <input\n                                type=\"hidden\"\n                                id=\"stateChecker\"\n                                name=\"stateChecker\"\n                                [value]=\"stateChecker\"\n                            />\n                            <input\n                                type=\"hidden\"\n                                id=\"submitAction\"\n                                name=\"submitAction\"\n                                value=\"Delete\"\n                            />\n                            <input\n                                type=\"hidden\"\n                                id=\"credentialId\"\n                                name=\"credentialId\"\n                                [value]=\"credential.id\"\n                            />\n                            <button\n                                class=\"btn btn-default\"\n                                [id]=\"'remove-mobile-' + index\"\n                            >\n                                <i class=\"pficon pficon-delete\"></i>\n                            </button>\n                        </form>\n                    </td>\n                </tr>\n            }\n        </tbody>\n    </table>\n} @else {\n    <div>\n        <hr />\n        <ol id=\"kc-totp-settings\">\n            <li>\n                <p>{{ i18n.msgStr('totpStep1') }}</p>\n\n                <ul id=\"kc-totp-supported-apps\">\n                    @for (app of totp.supportedApplications; track app) {\n                        <li>{{ i18n.advancedMsgStr(app) }}</li>\n                    }\n                </ul>\n            </li>\n            @if (mode && mode === 'manual') {\n                <li>\n                    <p>{{ i18n.msgStr('totpManualStep2') }}</p>\n                    <p>\n                        <span id=\"kc-totp-secret-key\">{{ totp.totpSecretEncoded }}</span>\n                    </p>\n                    <p>\n                        <a\n                            id=\"mode-barcode\"\n                            [href]=\"totp.qrUrl\"\n                        >\n                            {{ i18n.msgStr('totpScanBarcode') }}\n                        </a>\n                    </p>\n                </li>\n                <li>\n                    <p>{{ i18n.msgStr('totpManualStep3') }}</p>\n                    <ul>\n                        <li id=\"kc-totp-type\">{{ i18n.msgStr('totpType') }}: {{ i18n.msgStr($any('totp.' + totp.policy.type)) }}</li>\n                        <li id=\"kc-totp-algorithm\">{{ i18n.msgStr('totpAlgorithm') }}: {{ totp.policy.getAlgorithmKey() }}</li>\n                        <li id=\"kc-totp-digits\">{{ i18n.msgStr('totpDigits') }}: {{ totp.policy.digits }}</li>\n                        @if (totp.policy.type === 'totp') {\n                            <li id=\"kc-totp-period\">{{ i18n.msgStr('totpInterval') }}: {{ totp.policy.period }}</li>\n                        } @else {\n                            <li id=\"kc-totp-counter\">{{ i18n.msgStr('totpCounter') }}: {{ totp.policy.initialCounter }}</li>\n                        }\n                    </ul>\n                </li>\n            } @else {\n                <li>\n                    <p>{{ i18n.msgStr('totpStep2') }}</p>\n                    <p>\n                        <img\n                            id=\"kc-totp-secret-qr-code\"\n                            alt=\"Figure: Barcode\"\n                            [src]=\"'data:image/png;base64, ' + totp.totpSecretQrCode\"\n                        />\n                    </p>\n                    <p>\n                        <a\n                            id=\"mode-manual\"\n                            [href]=\"totp.manualUrl\"\n                        >\n                            {{ i18n.msgStr('totpUnableToScan') }}\n                        </a>\n                    </p>\n                </li>\n            }\n            <li>\n                <p>{{ i18n.msgStr('totpStep3') }}</p>\n                <p>{{ i18n.msgStr('totpStep3DeviceName') }}</p>\n            </li>\n        </ol>\n        <hr />\n        <form\n            id=\"kc-totp-settings-form\"\n            method=\"post\"\n            [action]=\"url.totpUrl\"\n            [kcClass]=\"'kcFormClass'\"\n        >\n            <input\n                type=\"hidden\"\n                id=\"stateChecker\"\n                name=\"stateChecker\"\n                [value]=\"stateChecker\"\n            />\n            <div [kcClass]=\"'kcFormGroupClass'\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"totp\"\n                        class=\"control-label\"\n                    >\n                        {{ i18n.msgStr('authenticatorCode') }}\n                    </label>\n                    <span class=\"required\">*</span>\n                </div>\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"text\"\n                        id=\"totp\"\n                        name=\"totp\"\n                        autoComplete=\"off\"\n                        [kcClass]=\"'kcInputClass'\"\n                        [attr.aria-invalid]=\"messagesPerField.existsError('totp')\"\n                    />\n                    @if (messagesPerField.existsError('totp')) {\n                        <span\n                            id=\"input-error-otp-code\"\n                            aria-live=\"polite\"\n                            [kcClass]=\"'kcInputErrorMessageClass'\"\n                            [innerHTML]=\"messagesPerField.get('totp') | kcSanitize: 'html'\"\n                        ></span>\n                    }\n                </div>\n                <input\n                    type=\"hidden\"\n                    id=\"totpSecret\"\n                    name=\"totpSecret\"\n                    [value]=\"totp.totpSecret\"\n                />\n                @if (mode) {\n                    <input\n                        type=\"hidden\"\n                        id=\"mode\"\n                        [value]=\"mode\"\n                    />\n                }\n            </div>\n\n            <div [kcClass]=\"'kcFormGroupClass'\">\n                <div class=\"col-sm-2 col-md-2\">\n                    <label\n                        for=\"userLabel\"\n                        [kcClass]=\"'kcLabelClass'\"\n                    >\n                        {{ i18n.msgStr('totpDeviceName') }}\n                    </label>\n                    @if (totp.otpCredentials.length >= 1) {\n                        <span class=\"required\">*</span>\n                    }\n                </div>\n                <div class=\"col-sm-10 col-md-10\">\n                    <input\n                        type=\"text\"\n                        id=\"userLabel\"\n                        name=\"userLabel\"\n                        autoComplete=\"off\"\n                        [kcClass]=\"'kcInputClass'\"\n                        [attr.aria-invalid]=\"messagesPerField.existsError('userLabel')\"\n                    />\n                    @if (messagesPerField.existsError('userLabel')) {\n                        <span\n                            id=\"input-error-otp-label\"\n                            aria-live=\"polite\"\n                            [kcClass]=\"'kcInputErrorMessageClass'\"\n                            [innerHTML]=\"messagesPerField.get('userLabel') | kcSanitize: 'html'\"\n                        ></span>\n                    }\n                </div>\n            </div>\n\n            <div\n                id=\"kc-form-buttons\"\n                class=\"text-right\"\n                [kcClass]=\"'kcFormGroupClass'\"\n            >\n                <div [kcClass]=\"'kcInputWrapperClass'\">\n                    <input\n                        type=\"submit\"\n                        id=\"saveTOTPBtn\"\n                        [kcClass]=\"['kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonLargeClass']\"\n                        [value]=\"i18n.msgStr('doSave')\"\n                    />\n                    <button\n                        type=\"submit\"\n                        id=\"cancelTOTPBtn\"\n                        name=\"submitAction\"\n                        value=\"Cancel\"\n                        [kcClass]=\"['kcButtonClass', 'kcButtonDefaultClass', 'kcButtonLargeClass']\"\n                    >\n                        {{ i18n.msgStr('doCancel') }}\n                    </button>\n                </div>\n            </div>\n        </form>\n    </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;AA0BM,MAAO,aAAc,SAAQ,kBAAkB,CAAA;AAZrD,IAAA,WAAA,GAAA;;AAaI,QAAA,IAAA,CAAA,IAAI,GAAG,MAAM,CAAO,YAAY,CAAC,CAAC;AAClC,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAA6C,kBAAkB,CAAC,CAAC;AAC1E,QAAA,IAAA,CAAA,eAAe,GAAG,MAAM,CAAU,eAAe,CAAC,CAAC;AACnD,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAoC,eAAe,CAAC,CAAC;QAC9E,IAAM,CAAA,MAAA,GAAG,MAAM,CAAC;AACnB,KAAA;8GANY,aAAa,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAb,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,aAAa,EAPX,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA;AACP,YAAA;AACI,gBAAA,OAAO,EAAE,kBAAkB;AAC3B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,aAAa,CAAC;AAC/C,aAAA;AACJ,SAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECxBL,onUA8PA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,ED9Oc,gBAAgB,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAqB,cAAc,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAUpD,aAAa,EAAA,UAAA,EAAA,CAAA;kBAZzB,SAAS;AACM,YAAA,IAAA,EAAA,CAAA,EAAA,UAAA,EAAA,IAAI,EACP,OAAA,EAAA,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,cAAc,EAAE,OAAO,CAAC,EAC7D,QAAA,EAAA,SAAS,EAER,SAAA,EAAA;AACP,wBAAA;AACI,4BAAA,OAAO,EAAE,kBAAkB;AAC3B,4BAAA,WAAW,EAAE,UAAU,CAAC,mBAAmB,CAAC;AAC/C,yBAAA;AACJ,qBAAA,EAAA,QAAA,EAAA,onUAAA,EAAA,CAAA;;;AExBL;;AAEG;;;;"}

package/fesm2022/keycloakify-angular-account-providers-keycloakify-angular.mjs

@@ -9,6 +9,7 @@ import { USE_DEFAULT_CSS } from '@keycloakify/angular/lib/tokens/use-default-css
 const provideKeycloakifyAngularAccount = (config) => makeEnvironmentProviders([
     {
         provide: KC_ACCOUNT_CONTEXT,
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
         // @ts-ignore
         useValue: window.kcContext
     },