@c8y/ngx-components 1021.2.1 → 1021.4.3

package/fesm2022/c8y-ngx-components-auth-configuration.mjs

@@ -1286,6 +1286,7 @@ class BasicConfigurationComponent {
         this.tenantService = tenantService;
         this.REDIRECT_TO_THE_USER_INTERFACE_APPLICATION_TOOLTIP = gettext("The redirect URL is automatically set to the application used by the user. In case of an error, it will be correctly displayed on the application's page.");
         this.flowControlledByUI = false;
+        this.redirectToPlatform = '';
     }
     shouldShow(field) {
         return field in this.templateModel;
@@ -1297,10 +1298,11 @@ class BasicConfigurationComponent {
             host: `https://${domainName}`,
             defaultRedirectUrl: `https://${domainName}/tenant/oauth`
         };
+        this.redirectToPlatform = this.templateModel.redirectToPlatform || '';
         this.flowControlledByUI = !this.templateModel.redirectToPlatform;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: BasicConfigurationComponent, deps: [{ token: i1$2.TenantService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: BasicConfigurationComponent, selector: "c8y-basic-configuration", inputs: { templateModel: "templateModel" }, usesOnChanges: true, ngImport: i0, template: "<fieldset class=\"p-24\">\n  <div class=\"row\">\n    <div class=\"col-xs-12 col-sm-3 col-md-2 m-b-xs-8\">\n      <div\n        class=\"h4 text-normal text-right text-left-xs\"\n        translate\n      >\n        Basic\n      </div>\n    </div>\n\n    <div\n      class=\"col-xs-12 col-sm-9 col-md-10 col-lg-9\"\n      *ngIf=\"templateModel\"\n    >\n      <div class=\"row\">\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('keyCloakAddress')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"keyCloakAddress\"\n              translate\n            >\n              Keycloak address\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"keyCloakAddress\"\n              name=\"keyCloakAddress\"\n              type=\"url\"\n              required\n              [(ngModel)]=\"templateModel.keyCloakAddress\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'https://example.de' }\"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('aadAddress')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"aadAddress\"\n              translate\n            >\n              Azure AD address\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"aadAddress\"\n              name=\"aadAddress\"\n              type=\"url\"\n              required\n              [(ngModel)]=\"templateModel.aadAddress\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: 'https://login.microsoftonline.de' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('tenant')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"tenant\"\n              translate\n            >\n              Tenant\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"tenant\"\n              name=\"tenant\"\n              required\n              [(ngModel)]=\"templateModel.tenant\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'c8y.onmicrosoft.de' }\"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('applicationId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"applicationId\"\n              translate\n            >\n              Application ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"applicationId\"\n              name=\"applicationId\"\n              required\n              [(ngModel)]=\"templateModel.applicationId\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('realmName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"realmName\"\n              translate\n            >\n              Realm name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"realmName\"\n              name=\"realmName\"\n              required\n              [(ngModel)]=\"templateModel.realmName\"\n            />\n          </c8y-form-group>\n        </div>\n      </div>\n\n      <div class=\"row\" *ngIf=\"shouldShow('redirectToPlatform')\">\n        <div class=\"col-sm-6\">\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"redirectToPlatform\"\n            >\n              {{ 'Redirect URL' | translate }}\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                [popover]=\"helpContent\"\n                placement=\"bottom\"\n                triggers=\"focus\"\n                type=\"button\"\n                [adaptivePosition]=\"false\"\n                *ngIf=\"\n                  !flowControlledByUI &&\n                  redirectToPlatformWarningParams &&\n                  templateModel.redirectToPlatform !=\n                    redirectToPlatformWarningParams.defaultRedirectUrl\n                \"\n              ></button>\n              <ng-template #helpContent>\n                <span\n                  ngNonBindable\n                  translate\n                  [translateParams]=\"redirectToPlatformWarningParams\"\n                >\n                  For correct application behavior you can use only \"{{ host }}\" or \"{{\n                    defaultRedirectUrl\n                  }}\", the latter one is recommended.\n                </span>\n              </ng-template>\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"redirectToPlatform\"\n              name=\"redirectToPlatform\"\n              type=\"url\"\n              [required]=\"!flowControlledByUI\"\n              [disabled]=\"flowControlledByUI\"\n              [(ngModel)]=\"templateModel.redirectToPlatform\"\n              [placeholder]=\"\n                'e.g. {{ example }}'\n                  | translate\n                    : {\n                        example:\n                          redirectToPlatformWarningParams?.defaultRedirectUrl ||\n                          'https://tenant.domain.com'\n                      }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div class=\"col-sm-6\">\n          <div\n            class=\"form-group\"\n          >\n            <label\n              class=\"c8y-switch m-t-24\"\n              title=\"{{ 'Redirect to the user interface application`SSO authentication`' | translate }}\"\n              for=\"flowControlledByUI\"\n            >\n              <input\n                type=\"checkbox\"\n                name=\"flowControlledByUI\"\n                id=\"flowControlledByUI\"\n                [(ngModel)]=\"flowControlledByUI\"\n                (change)=\"flowControlledByUI && (templateModel.redirectToPlatform = '')\"\n              />\n              <span></span>\n              <span class=\"control-label\">{{ 'Redirect to the user interface application`SSO authentication`' | translate }}</span>\n              <button\n                type=\"button\"\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{ REDIRECT_TO_THE_USER_INTERFACE_APPLICATION_TOOLTIP | translate }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n              ></button>\n            </label>\n          </div>\n        </div>\n      </div>\n\n      <div class=\"row\">\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('clientSecret')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"clientSecret\"\n              translate\n            >\n              Client secret\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"clientSecret\"\n              name=\"clientSecret\"\n              required\n              [(ngModel)]=\"templateModel.clientSecret\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('clientId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"clientId\"\n              translate\n            >\n              Client ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"clientId\"\n              name=\"clientId\"\n              required\n              [(ngModel)]=\"templateModel.clientId\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: '254234981c-78a8-4588\u2026' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('issuer')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"issuer\"\n              translate\n            >\n              Token issuer\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"issuer\"\n              name=\"issuer\"\n              required\n              [(ngModel)]=\"templateModel.issuer\"\n              [placeholder]=\"\n                'e.g. {{ example }}'\n                  | translate : { example: 'https://login.microsoftonline.de/237652-3727' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('scopeId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"scopeId\"\n              translate\n            >\n              Scope ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"scopeId\"\n              name=\"scopeId\"\n              [(ngModel)]=\"templateModel.scopeId\"\n              [placeholder]=\"'e.g. {{ example }}' | translate: { example: '237652-3727' }\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('buttonName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"buttonName\"\n              translate\n            >\n              Button name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"buttonName\"\n              name=\"buttonName\"\n              required\n              [(ngModel)]=\"templateModel.buttonName\"\n              [placeholder]=\"'e.g. Log in with Azure AD' | translate\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('providerName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"providerName\"\n              translate\n            >\n              Provider name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"providerName\"\n              name=\"providerName\"\n              required\n              [(ngModel)]=\"templateModel.providerName\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'Azure AD' }\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('audience')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"audience\"\n              translate\n            >\n              Audience\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"audience\"\n              name=\"audience\"\n              required\n              [(ngModel)]=\"templateModel.audience\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: 'https://test.example.com' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n      </div>\n\n      <div\n        class=\"row\"\n        *ngIf=\"shouldShow('visibleOnLoginPage')\"\n      >\n        <div class=\"col-sm-6\">\n          <label\n            class=\"c8y-switch\"\n            title=\"{{ 'Visible on login page' | translate }}\"\n            for=\"visibleOnLoginPage\"\n          >\n            <input\n              id=\"visibleOnLoginPage\"\n              name=\"visibleOnLoginPage\"\n              type=\"checkbox\"\n              [(ngModel)]=\"templateModel.visibleOnLoginPage\"\n            />\n            <span></span>\n            <span class=\"control-label\">{{ 'Visible on login page' | translate }}</span>\n          </label>\n        </div>\n      </div>\n    </div>\n  </div>\n</fieldset>\n", dependencies: [{ kind: "directive", type: i1$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$1.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i1$1.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i4.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: BasicConfigurationComponent, selector: "c8y-basic-configuration", inputs: { templateModel: "templateModel" }, usesOnChanges: true, ngImport: i0, template: "<fieldset class=\"p-24\">\n  <div class=\"row\">\n    <div class=\"col-xs-12 col-sm-3 col-md-2 m-b-xs-8\">\n      <div\n        class=\"h4 text-normal text-right text-left-xs\"\n        translate\n      >\n        Basic\n      </div>\n    </div>\n\n    <div\n      class=\"col-xs-12 col-sm-9 col-md-10 col-lg-9\"\n      *ngIf=\"templateModel\"\n    >\n      <div class=\"row\">\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('keyCloakAddress')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"keyCloakAddress\"\n              translate\n            >\n              Keycloak address\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"keyCloakAddress\"\n              name=\"keyCloakAddress\"\n              type=\"url\"\n              required\n              [(ngModel)]=\"templateModel.keyCloakAddress\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'https://example.de' }\"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('aadAddress')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"aadAddress\"\n              translate\n            >\n              Azure AD address\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"aadAddress\"\n              name=\"aadAddress\"\n              type=\"url\"\n              required\n              [(ngModel)]=\"templateModel.aadAddress\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: 'https://login.microsoftonline.de' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('tenant')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"tenant\"\n              translate\n            >\n              Tenant\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"tenant\"\n              name=\"tenant\"\n              required\n              [(ngModel)]=\"templateModel.tenant\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'c8y.onmicrosoft.de' }\"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('applicationId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"applicationId\"\n              translate\n            >\n              Application ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"applicationId\"\n              name=\"applicationId\"\n              required\n              [(ngModel)]=\"templateModel.applicationId\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('realmName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"realmName\"\n              translate\n            >\n              Realm name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"realmName\"\n              name=\"realmName\"\n              required\n              [(ngModel)]=\"templateModel.realmName\"\n            />\n          </c8y-form-group>\n        </div>\n      </div>\n\n      <div class=\"row\" *ngIf=\"shouldShow('redirectToPlatform')\">\n        <div class=\"col-sm-6\">\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"redirectToPlatform\"\n            >\n              {{ 'Redirect URL' | translate }}\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                [popover]=\"helpContent\"\n                placement=\"bottom\"\n                triggers=\"focus\"\n                type=\"button\"\n                [adaptivePosition]=\"false\"\n                *ngIf=\"\n                  !flowControlledByUI &&\n                  redirectToPlatformWarningParams &&\n                  templateModel.redirectToPlatform !=\n                    redirectToPlatformWarningParams.defaultRedirectUrl\n                \"\n              ></button>\n              <ng-template #helpContent>\n                <span\n                  ngNonBindable\n                  translate\n                  [translateParams]=\"redirectToPlatformWarningParams\"\n                >\n                  For correct application behavior you can use only \"{{ host }}\" or \"{{\n                    defaultRedirectUrl\n                  }}\", the latter one is recommended.\n                </span>\n              </ng-template>\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"redirectToPlatform\"\n              name=\"redirectToPlatform\"\n              type=\"url\"\n              [required]=\"!flowControlledByUI\"\n              [disabled]=\"flowControlledByUI\"\n              [(ngModel)]=\"templateModel.redirectToPlatform\"\n              [placeholder]=\"\n                'e.g. {{ example }}'\n                  | translate\n                    : {\n                        example:\n                          redirectToPlatformWarningParams?.defaultRedirectUrl ||\n                          'https://tenant.domain.com'\n                      }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div class=\"col-sm-6\">\n          <div\n            class=\"form-group\"\n          >\n            <label\n              class=\"c8y-switch m-t-24\"\n              title=\"{{ 'Redirect to the user interface application`SSO authentication`' | translate }}\"\n              for=\"flowControlledByUI\"\n            >\n              <input\n                type=\"checkbox\"\n                name=\"flowControlledByUI\"\n                id=\"flowControlledByUI\"\n                [(ngModel)]=\"flowControlledByUI\"\n                (change)=\"templateModel.redirectToPlatform = flowControlledByUI ? '' : redirectToPlatform\"\n              />\n              <span></span>\n              <span class=\"control-label\">{{ 'Redirect to the user interface application`SSO authentication`' | translate }}</span>\n              <button\n                type=\"button\"\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{ REDIRECT_TO_THE_USER_INTERFACE_APPLICATION_TOOLTIP | translate }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n              ></button>\n            </label>\n          </div>\n        </div>\n        <div class=\"col-sm-12\">\n          <div *ngIf=\"flowControlledByUI && redirectToPlatform != ''\">\n            <div class=\"alert alert-warning max-width-100 m-b-32\"\n                 ngNonBindable\n                 translate\n                 [translateParams]=\"{\n                      redirectURI: '<tenant_domain>/apps/*'\n                    }\">\n              Make sure that \"Valid Redirect URIs\" in the authorization server is set to \"{{ redirectURI }}\" or to the full URIs of the used applications if the authorization server does not support patterns.\n            </div>\n          </div>\n          <div *ngIf=\"!flowControlledByUI && redirectToPlatform === ''\">\n            <div class=\"alert alert-warning max-width-100 m-b-32\"\n                 ngNonBindable\n                 translate\n                 [translateParams]=\"{\n                      redirectURI: '<tenant_domain>/tenant/oauth'\n                    }\">\n              Make sure that \"Valid Redirect URIs\" in the authorization server is set to \"{{ redirectURI }}\".\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"row\">\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('clientSecret')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"clientSecret\"\n              translate\n            >\n              Client secret\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"clientSecret\"\n              name=\"clientSecret\"\n              required\n              [(ngModel)]=\"templateModel.clientSecret\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('clientId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"clientId\"\n              translate\n            >\n              Client ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"clientId\"\n              name=\"clientId\"\n              required\n              [(ngModel)]=\"templateModel.clientId\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: '254234981c-78a8-4588\u2026' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('issuer')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"issuer\"\n              translate\n            >\n              Token issuer\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"issuer\"\n              name=\"issuer\"\n              required\n              [(ngModel)]=\"templateModel.issuer\"\n              [placeholder]=\"\n                'e.g. {{ example }}'\n                  | translate : { example: 'https://login.microsoftonline.de/237652-3727' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('scopeId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"scopeId\"\n              translate\n            >\n              Scope ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"scopeId\"\n              name=\"scopeId\"\n              [(ngModel)]=\"templateModel.scopeId\"\n              [placeholder]=\"'e.g. {{ example }}' | translate: { example: '237652-3727' }\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('buttonName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"buttonName\"\n              translate\n            >\n              Button name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"buttonName\"\n              name=\"buttonName\"\n              required\n              [(ngModel)]=\"templateModel.buttonName\"\n              [placeholder]=\"'e.g. Log in with Azure AD' | translate\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('providerName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"providerName\"\n              translate\n            >\n              Provider name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"providerName\"\n              name=\"providerName\"\n              required\n              [(ngModel)]=\"templateModel.providerName\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'Azure AD' }\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('audience')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"audience\"\n              translate\n            >\n              Audience\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"audience\"\n              name=\"audience\"\n              required\n              [(ngModel)]=\"templateModel.audience\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: 'https://test.example.com' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n      </div>\n\n      <div\n        class=\"row\"\n        *ngIf=\"shouldShow('visibleOnLoginPage')\"\n      >\n        <div class=\"col-sm-6\">\n          <label\n            class=\"c8y-switch\"\n            title=\"{{ 'Visible on login page' | translate }}\"\n            for=\"visibleOnLoginPage\"\n          >\n            <input\n              id=\"visibleOnLoginPage\"\n              name=\"visibleOnLoginPage\"\n              type=\"checkbox\"\n              [(ngModel)]=\"templateModel.visibleOnLoginPage\"\n            />\n            <span></span>\n            <span class=\"control-label\">{{ 'Visible on login page' | translate }}</span>\n          </label>\n        </div>\n      </div>\n    </div>\n  </div>\n</fieldset>\n", dependencies: [{ kind: "directive", type: i1$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$1.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i1$1.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i4.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
 }
 __decorate([
     memoize(),
@@ -1310,7 +1312,7 @@ __decorate([
 ], BasicConfigurationComponent.prototype, "shouldShow", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: BasicConfigurationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-basic-configuration', viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], template: "<fieldset class=\"p-24\">\n  <div class=\"row\">\n    <div class=\"col-xs-12 col-sm-3 col-md-2 m-b-xs-8\">\n      <div\n        class=\"h4 text-normal text-right text-left-xs\"\n        translate\n      >\n        Basic\n      </div>\n    </div>\n\n    <div\n      class=\"col-xs-12 col-sm-9 col-md-10 col-lg-9\"\n      *ngIf=\"templateModel\"\n    >\n      <div class=\"row\">\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('keyCloakAddress')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"keyCloakAddress\"\n              translate\n            >\n              Keycloak address\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"keyCloakAddress\"\n              name=\"keyCloakAddress\"\n              type=\"url\"\n              required\n              [(ngModel)]=\"templateModel.keyCloakAddress\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'https://example.de' }\"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('aadAddress')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"aadAddress\"\n              translate\n            >\n              Azure AD address\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"aadAddress\"\n              name=\"aadAddress\"\n              type=\"url\"\n              required\n              [(ngModel)]=\"templateModel.aadAddress\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: 'https://login.microsoftonline.de' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('tenant')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"tenant\"\n              translate\n            >\n              Tenant\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"tenant\"\n              name=\"tenant\"\n              required\n              [(ngModel)]=\"templateModel.tenant\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'c8y.onmicrosoft.de' }\"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('applicationId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"applicationId\"\n              translate\n            >\n              Application ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"applicationId\"\n              name=\"applicationId\"\n              required\n              [(ngModel)]=\"templateModel.applicationId\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('realmName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"realmName\"\n              translate\n            >\n              Realm name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"realmName\"\n              name=\"realmName\"\n              required\n              [(ngModel)]=\"templateModel.realmName\"\n            />\n          </c8y-form-group>\n        </div>\n      </div>\n\n      <div class=\"row\" *ngIf=\"shouldShow('redirectToPlatform')\">\n        <div class=\"col-sm-6\">\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"redirectToPlatform\"\n            >\n              {{ 'Redirect URL' | translate }}\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                [popover]=\"helpContent\"\n                placement=\"bottom\"\n                triggers=\"focus\"\n                type=\"button\"\n                [adaptivePosition]=\"false\"\n                *ngIf=\"\n                  !flowControlledByUI &&\n                  redirectToPlatformWarningParams &&\n                  templateModel.redirectToPlatform !=\n                    redirectToPlatformWarningParams.defaultRedirectUrl\n                \"\n              ></button>\n              <ng-template #helpContent>\n                <span\n                  ngNonBindable\n                  translate\n                  [translateParams]=\"redirectToPlatformWarningParams\"\n                >\n                  For correct application behavior you can use only \"{{ host }}\" or \"{{\n                    defaultRedirectUrl\n                  }}\", the latter one is recommended.\n                </span>\n              </ng-template>\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"redirectToPlatform\"\n              name=\"redirectToPlatform\"\n              type=\"url\"\n              [required]=\"!flowControlledByUI\"\n              [disabled]=\"flowControlledByUI\"\n              [(ngModel)]=\"templateModel.redirectToPlatform\"\n              [placeholder]=\"\n                'e.g. {{ example }}'\n                  | translate\n                    : {\n                        example:\n                          redirectToPlatformWarningParams?.defaultRedirectUrl ||\n                          'https://tenant.domain.com'\n                      }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div class=\"col-sm-6\">\n          <div\n            class=\"form-group\"\n          >\n            <label\n              class=\"c8y-switch m-t-24\"\n              title=\"{{ 'Redirect to the user interface application`SSO authentication`' | translate }}\"\n              for=\"flowControlledByUI\"\n            >\n              <input\n                type=\"checkbox\"\n                name=\"flowControlledByUI\"\n                id=\"flowControlledByUI\"\n                [(ngModel)]=\"flowControlledByUI\"\n                (change)=\"flowControlledByUI && (templateModel.redirectToPlatform = '')\"\n              />\n              <span></span>\n              <span class=\"control-label\">{{ 'Redirect to the user interface application`SSO authentication`' | translate }}</span>\n              <button\n                type=\"button\"\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{ REDIRECT_TO_THE_USER_INTERFACE_APPLICATION_TOOLTIP | translate }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n              ></button>\n            </label>\n          </div>\n        </div>\n      </div>\n\n      <div class=\"row\">\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('clientSecret')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"clientSecret\"\n              translate\n            >\n              Client secret\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"clientSecret\"\n              name=\"clientSecret\"\n              required\n              [(ngModel)]=\"templateModel.clientSecret\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('clientId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"clientId\"\n              translate\n            >\n              Client ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"clientId\"\n              name=\"clientId\"\n              required\n              [(ngModel)]=\"templateModel.clientId\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: '254234981c-78a8-4588\u2026' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('issuer')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"issuer\"\n              translate\n            >\n              Token issuer\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"issuer\"\n              name=\"issuer\"\n              required\n              [(ngModel)]=\"templateModel.issuer\"\n              [placeholder]=\"\n                'e.g. {{ example }}'\n                  | translate : { example: 'https://login.microsoftonline.de/237652-3727' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('scopeId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"scopeId\"\n              translate\n            >\n              Scope ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"scopeId\"\n              name=\"scopeId\"\n              [(ngModel)]=\"templateModel.scopeId\"\n              [placeholder]=\"'e.g. {{ example }}' | translate: { example: '237652-3727' }\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('buttonName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"buttonName\"\n              translate\n            >\n              Button name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"buttonName\"\n              name=\"buttonName\"\n              required\n              [(ngModel)]=\"templateModel.buttonName\"\n              [placeholder]=\"'e.g. Log in with Azure AD' | translate\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('providerName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"providerName\"\n              translate\n            >\n              Provider name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"providerName\"\n              name=\"providerName\"\n              required\n              [(ngModel)]=\"templateModel.providerName\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'Azure AD' }\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('audience')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"audience\"\n              translate\n            >\n              Audience\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"audience\"\n              name=\"audience\"\n              required\n              [(ngModel)]=\"templateModel.audience\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: 'https://test.example.com' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n      </div>\n\n      <div\n        class=\"row\"\n        *ngIf=\"shouldShow('visibleOnLoginPage')\"\n      >\n        <div class=\"col-sm-6\">\n          <label\n            class=\"c8y-switch\"\n            title=\"{{ 'Visible on login page' | translate }}\"\n            for=\"visibleOnLoginPage\"\n          >\n            <input\n              id=\"visibleOnLoginPage\"\n              name=\"visibleOnLoginPage\"\n              type=\"checkbox\"\n              [(ngModel)]=\"templateModel.visibleOnLoginPage\"\n            />\n            <span></span>\n            <span class=\"control-label\">{{ 'Visible on login page' | translate }}</span>\n          </label>\n        </div>\n      </div>\n    </div>\n  </div>\n</fieldset>\n" }]
+            args: [{ selector: 'c8y-basic-configuration', viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], template: "<fieldset class=\"p-24\">\n  <div class=\"row\">\n    <div class=\"col-xs-12 col-sm-3 col-md-2 m-b-xs-8\">\n      <div\n        class=\"h4 text-normal text-right text-left-xs\"\n        translate\n      >\n        Basic\n      </div>\n    </div>\n\n    <div\n      class=\"col-xs-12 col-sm-9 col-md-10 col-lg-9\"\n      *ngIf=\"templateModel\"\n    >\n      <div class=\"row\">\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('keyCloakAddress')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"keyCloakAddress\"\n              translate\n            >\n              Keycloak address\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"keyCloakAddress\"\n              name=\"keyCloakAddress\"\n              type=\"url\"\n              required\n              [(ngModel)]=\"templateModel.keyCloakAddress\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'https://example.de' }\"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('aadAddress')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"aadAddress\"\n              translate\n            >\n              Azure AD address\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"aadAddress\"\n              name=\"aadAddress\"\n              type=\"url\"\n              required\n              [(ngModel)]=\"templateModel.aadAddress\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: 'https://login.microsoftonline.de' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('tenant')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"tenant\"\n              translate\n            >\n              Tenant\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"tenant\"\n              name=\"tenant\"\n              required\n              [(ngModel)]=\"templateModel.tenant\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'c8y.onmicrosoft.de' }\"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('applicationId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"applicationId\"\n              translate\n            >\n              Application ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"applicationId\"\n              name=\"applicationId\"\n              required\n              [(ngModel)]=\"templateModel.applicationId\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('realmName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"realmName\"\n              translate\n            >\n              Realm name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"realmName\"\n              name=\"realmName\"\n              required\n              [(ngModel)]=\"templateModel.realmName\"\n            />\n          </c8y-form-group>\n        </div>\n      </div>\n\n      <div class=\"row\" *ngIf=\"shouldShow('redirectToPlatform')\">\n        <div class=\"col-sm-6\">\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"redirectToPlatform\"\n            >\n              {{ 'Redirect URL' | translate }}\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                [popover]=\"helpContent\"\n                placement=\"bottom\"\n                triggers=\"focus\"\n                type=\"button\"\n                [adaptivePosition]=\"false\"\n                *ngIf=\"\n                  !flowControlledByUI &&\n                  redirectToPlatformWarningParams &&\n                  templateModel.redirectToPlatform !=\n                    redirectToPlatformWarningParams.defaultRedirectUrl\n                \"\n              ></button>\n              <ng-template #helpContent>\n                <span\n                  ngNonBindable\n                  translate\n                  [translateParams]=\"redirectToPlatformWarningParams\"\n                >\n                  For correct application behavior you can use only \"{{ host }}\" or \"{{\n                    defaultRedirectUrl\n                  }}\", the latter one is recommended.\n                </span>\n              </ng-template>\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"redirectToPlatform\"\n              name=\"redirectToPlatform\"\n              type=\"url\"\n              [required]=\"!flowControlledByUI\"\n              [disabled]=\"flowControlledByUI\"\n              [(ngModel)]=\"templateModel.redirectToPlatform\"\n              [placeholder]=\"\n                'e.g. {{ example }}'\n                  | translate\n                    : {\n                        example:\n                          redirectToPlatformWarningParams?.defaultRedirectUrl ||\n                          'https://tenant.domain.com'\n                      }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div class=\"col-sm-6\">\n          <div\n            class=\"form-group\"\n          >\n            <label\n              class=\"c8y-switch m-t-24\"\n              title=\"{{ 'Redirect to the user interface application`SSO authentication`' | translate }}\"\n              for=\"flowControlledByUI\"\n            >\n              <input\n                type=\"checkbox\"\n                name=\"flowControlledByUI\"\n                id=\"flowControlledByUI\"\n                [(ngModel)]=\"flowControlledByUI\"\n                (change)=\"templateModel.redirectToPlatform = flowControlledByUI ? '' : redirectToPlatform\"\n              />\n              <span></span>\n              <span class=\"control-label\">{{ 'Redirect to the user interface application`SSO authentication`' | translate }}</span>\n              <button\n                type=\"button\"\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{ REDIRECT_TO_THE_USER_INTERFACE_APPLICATION_TOOLTIP | translate }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n              ></button>\n            </label>\n          </div>\n        </div>\n        <div class=\"col-sm-12\">\n          <div *ngIf=\"flowControlledByUI && redirectToPlatform != ''\">\n            <div class=\"alert alert-warning max-width-100 m-b-32\"\n                 ngNonBindable\n                 translate\n                 [translateParams]=\"{\n                      redirectURI: '<tenant_domain>/apps/*'\n                    }\">\n              Make sure that \"Valid Redirect URIs\" in the authorization server is set to \"{{ redirectURI }}\" or to the full URIs of the used applications if the authorization server does not support patterns.\n            </div>\n          </div>\n          <div *ngIf=\"!flowControlledByUI && redirectToPlatform === ''\">\n            <div class=\"alert alert-warning max-width-100 m-b-32\"\n                 ngNonBindable\n                 translate\n                 [translateParams]=\"{\n                      redirectURI: '<tenant_domain>/tenant/oauth'\n                    }\">\n              Make sure that \"Valid Redirect URIs\" in the authorization server is set to \"{{ redirectURI }}\".\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"row\">\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('clientSecret')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"clientSecret\"\n              translate\n            >\n              Client secret\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"clientSecret\"\n              name=\"clientSecret\"\n              required\n              [(ngModel)]=\"templateModel.clientSecret\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('clientId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"clientId\"\n              translate\n            >\n              Client ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"clientId\"\n              name=\"clientId\"\n              required\n              [(ngModel)]=\"templateModel.clientId\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: '254234981c-78a8-4588\u2026' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('issuer')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"issuer\"\n              translate\n            >\n              Token issuer\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"issuer\"\n              name=\"issuer\"\n              required\n              [(ngModel)]=\"templateModel.issuer\"\n              [placeholder]=\"\n                'e.g. {{ example }}'\n                  | translate : { example: 'https://login.microsoftonline.de/237652-3727' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('scopeId')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"scopeId\"\n              translate\n            >\n              Scope ID\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"scopeId\"\n              name=\"scopeId\"\n              [(ngModel)]=\"templateModel.scopeId\"\n              [placeholder]=\"'e.g. {{ example }}' | translate: { example: '237652-3727' }\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('buttonName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"buttonName\"\n              translate\n            >\n              Button name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"buttonName\"\n              name=\"buttonName\"\n              required\n              [(ngModel)]=\"templateModel.buttonName\"\n              [placeholder]=\"'e.g. Log in with Azure AD' | translate\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('providerName')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"providerName\"\n              translate\n            >\n              Provider name\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"providerName\"\n              name=\"providerName\"\n              required\n              [(ngModel)]=\"templateModel.providerName\"\n              [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'Azure AD' }\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <div\n          class=\"col-sm-6\"\n          *ngIf=\"shouldShow('audience')\"\n        >\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"audience\"\n              translate\n            >\n              Audience\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"audience\"\n              name=\"audience\"\n              required\n              [(ngModel)]=\"templateModel.audience\"\n              [placeholder]=\"\n                'e.g. {{ example }}' | translate : { example: 'https://test.example.com' }\n              \"\n            />\n          </c8y-form-group>\n        </div>\n      </div>\n\n      <div\n        class=\"row\"\n        *ngIf=\"shouldShow('visibleOnLoginPage')\"\n      >\n        <div class=\"col-sm-6\">\n          <label\n            class=\"c8y-switch\"\n            title=\"{{ 'Visible on login page' | translate }}\"\n            for=\"visibleOnLoginPage\"\n          >\n            <input\n              id=\"visibleOnLoginPage\"\n              name=\"visibleOnLoginPage\"\n              type=\"checkbox\"\n              [(ngModel)]=\"templateModel.visibleOnLoginPage\"\n            />\n            <span></span>\n            <span class=\"control-label\">{{ 'Visible on login page' | translate }}</span>\n          </label>\n        </div>\n      </div>\n    </div>\n  </div>\n</fieldset>\n" }]
         }], ctorParameters: () => [{ type: i1$2.TenantService }], propDecorators: { templateModel: [{
                 type: Input
             }], shouldShow: [] } });
@@ -1555,7 +1557,7 @@ class InventoryRolesModalComponent {
         this.modal.hide();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InventoryRolesModalComponent, deps: [{ token: i1$3.BsModalRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: InventoryRolesModalComponent, selector: "c8y-sso-inventory-roles-modal", ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i c8yIcon=\"c8y-group-open\"></i>\n    <h4 id=\"modal-title\">{{ 'Select from inventory' | translate }}</h4>\n  </div>\n  <div class=\"modal-inner-scroll\">\n    <div\n      id=\"modal-body\"\n      class=\"bg-component\"\n    >\n      <c8y-asset-selector\n        class=\"d-contents\"\n        [(ngModel)]=\"selectedGroups\"\n        [config]=\"{\n          label: label,\n          showFilter: true,\n          multi: true,\n          groupsSelectable: true,\n          columnHeaders: false,\n          singleColumn: true,\n          groupsOnly: true\n        }\"\n      ></c8y-asset-selector>\n    </div>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button\n      class=\"btn btn-default\"\n      type=\"button\"\n      title=\"{{ 'Cancel' | translate }}\"\n      (click)=\"dismiss()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      type=\"button\"\n      title=\"{{ 'Select' | translate }}\"\n      (click)=\"select()\"\n    >\n      {{ 'Select' | translate }}\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$2.AssetSelectorComponent, selector: "c8y-asset-selector", inputs: ["config", "active", "index", "asset", "selectedDevice", "selected", "rootNode", "selectedItems", "container"], outputs: ["onSelected", "onClearSelected", "onRowSelected", "onLoad"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: InventoryRolesModalComponent, selector: "c8y-sso-inventory-roles-modal", ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i c8yIcon=\"c8y-group-open\"></i>\n    <h4 id=\"modal-title\">{{ 'Select from inventory' | translate }}</h4>\n  </div>\n  <div class=\"modal-inner-scroll\">\n    <div\n      id=\"modal-body\"\n      class=\"bg-component\"\n    >\n      <c8y-asset-selector\n        class=\"d-contents\"\n        [(ngModel)]=\"selectedGroups\"\n        [config]=\"{\n          label: label,\n          showFilter: true,\n          multi: true,\n          groupsSelectable: true,\n          columnHeaders: false,\n          singleColumn: true,\n          groupsOnly: true\n        }\"\n      ></c8y-asset-selector>\n    </div>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button\n      class=\"btn btn-default\"\n      type=\"button\"\n      title=\"{{ 'Cancel' | translate }}\"\n      (click)=\"dismiss()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      type=\"button\"\n      title=\"{{ 'Select' | translate }}\"\n      (click)=\"select()\"\n    >\n      {{ 'Select' | translate }}\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$2.AssetSelectorComponent, selector: "c8y-asset-selector", inputs: ["config", "active", "index", "asset", "selectedDevice", "selected", "rootNode", "selectedItems", "container", "disabled"], outputs: ["onSelected", "onClearSelected", "onRowSelected", "onLoad"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InventoryRolesModalComponent, decorators: [{
             type: Component,