@c8y/ngx-components 1021.38.1 → 1021.49.4

package/fesm2022/c8y-ngx-components-branding-shared-lazy.mjs

@@ -689,7 +689,7 @@ class BrandingFormComponent {
         this.messageBannerService.showBanner();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: BrandingFormComponent, deps: [{ token: i2.FormBuilder }, { token: i3.MessageBannerService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: BrandingFormComponent, isStandalone: true, selector: "c8y-branding-form", host: { classAttribute: "d-contents" }, ngImport: i0, template: "<div\n  class=\"inner-scroll\"\n  [formGroup]=\"formGroup\"\n>\n  <!--  Title & Favicon-->\n  <div class=\"card-block\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4 class=\"text-normal text-right text-left-xs m-b-16\">\n          {{ 'Title & favicon' | translate }}\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <div\n          class=\"row p-t-16 p-b-16\"\n          [formGroupName]=\"'genericApplicationOptions'\"\n        >\n          <div class=\"col-md-6\">\n            <c8y-form-group class=\"m-b-32\">\n              <label\n                for=\"globalTitle\"\n                translate\n              >\n                Title\n              </label>\n              <input\n                class=\"form-control\"\n                id=\"globalTitle\"\n                name=\"globalTitle\"\n                type=\"text\"\n                formControlName=\"globalTitle\"\n              />\n              <c8y-messages\n                [helpMessage]=\"'Title to display in the browser tab' | translate\"\n              ></c8y-messages>\n            </c8y-form-group>\n          </div>\n          <div class=\"col-md-6\">\n            <c8y-form-group>\n              <label translate>Favicon</label>\n              <c8y-static-assets-file-picker\n                name=\"faviconUrl\"\n                [supportedFileExtensions]=\"['ico']\"\n                [isCSSURL]=\"false\"\n                formControlName=\"faviconUrl\"\n              ></c8y-static-assets-file-picker>\n              <c8y-messages [helpMessage]=\"'Supported files: *.ico'\"></c8y-messages>\n            </c8y-form-group>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"card-block separator-top\">\n    <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n      <h4\n        class=\"text-normal text-right text-left-xs m-b-16\"\n        translate\n      >\n        Dark theme\n      </h4>\n    </div>\n    <div class=\"col-xs-12 col-sm-9 col-md-10\">\n      <c8y-form-group class=\"m-b-32 p-t-8 m-t-4\">\n        <label class=\"c8y-switch\">\n          <input\n            class=\"form-control\"\n            name=\"darkThemeAvailable\"\n            type=\"checkbox\"\n            formControlName=\"darkThemeAvailable\"\n          />\n          <span></span>\n          <span translate>Enable dark theme support</span>\n        </label>\n      </c8y-form-group>\n    </div>\n  </div>\n  <!-- Typography -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Typography\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <div class=\"row\">\n          <div class=\"col-md-6\">\n            <fieldset\n              class=\"c8y-fieldset p-24\"\n              [formGroupName]=\"'baseTypography'\"\n            >\n              <legend translate>Base typography</legend>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  for=\"font-url\"\n                  translate\n                >\n                  Fonts URL\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-url\"\n                  placeholder=\"{{\n                    'e.g. {{ example }}' | translate : { example: 'https://fonts.googleapis.com/css?family=Roboto:400,500,700' }\n                  }}\"\n                  type=\"text\"\n                  formControlName=\"font-url\"\n                />\n                <c8y-messages [helpMessage]=\"'The Google fonts URL' | translate\"></c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"font-family-base\"\n                  for=\"font-family-base\"\n                  translate\n                >\n                  Base font stack\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-family-base\"\n                  placeholder=\"{{ 'e.g. {{ example }}' | translate : {example: '&quot;Roboto&quot;, Arial, sans-serif'} }}\"\n                  name=\"font-family-base\"\n                  type=\"text\"\n                  formControlName=\"font-family-base\"\n                />\n                <c8y-messages></c8y-messages>\n              </c8y-form-group>\n            </fieldset>\n          </div>\n          <div class=\"col-md-6\">\n            <fieldset\n              class=\"c8y-fieldset p-24\"\n              [formGroupName]=\"'headingsAndNavigatorTypography'\"\n            >\n              <legend>{{ 'Headings & navigator' | translate }}</legend>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"font-family-headings\"\n                  for=\"font-family-headings\"\n                  translate\n                >\n                  Headings font stack\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-family-headings\"\n                  placeholder=\"{{ 'e.g. {{ example }}' | translate : {example: '&quot;Roboto&quot;, Arial, sans-serif'} }}\"\n                  type=\"text\"\n                  formControlName=\"font-family-headings\"\n                />\n                <c8y-messages\n                  [helpMessage]=\"\n                    'Leave empty to use the same font as the base font stack' | translate\n                  \"\n                ></c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"navigator-font-family\"\n                  translate\n                >\n                  Navigator font stack\n                </label>\n                <div class=\"form-control-static\">\n                  <label class=\"c8y-radio radio-inline\">\n                    <input\n                      name=\"navigator-font-family\"\n                      type=\"radio\"\n                      formControlName=\"navigator-font-family\"\n                      [value]=\"'var(--font-family-base)'\"\n                    />\n                    <span></span>\n                    <span translate>Match base font stack</span>\n                  </label>\n                  <label\n                    class=\"c8y-radio radio-inline\"\n                    title=\"Radio Two\"\n                  >\n                    <input\n                      name=\"navigator-font-family\"\n                      type=\"radio\"\n                      formControlName=\"navigator-font-family\"\n                      [value]=\"'var(--font-family-headings)'\"\n                    />\n                    <span></span>\n                    <span translate>Match headings font stack</span>\n                  </label>\n                </div>\n              </c8y-form-group>\n            </fieldset>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <!-- Cookie banner -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Cookie banner\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <fieldset\n          class=\"c8y-fieldset p-24\"\n          [formGroupName]=\"'cookieBanner'\"\n        >\n          <legend translate>Cookie banner</legend>\n          <label class=\"c8y-switch\">\n            <input\n              class=\"form-control\"\n              name=\"cookieBannerEnabled\"\n              type=\"checkbox\"\n              [ngModelOptions]=\"{ standalone: true }\"\n              [ngModel]=\"!formGroup.value.cookieBanner.cookieBannerDisabled\"\n              (ngModelChange)=\"cockieBannerChange($event)\"\n            />\n            <span></span>\n            <span translate>Enable cookie banner</span>\n          </label>\n\n          <div\n            class=\"collapse\"\n            [collapse]=\"formGroup.value.cookieBanner.cookieBannerDisabled\"\n            [isAnimated]=\"true\"\n          >\n            <div\n              class=\"row\"\n              style=\"min-height: 227px\"\n            >\n              <ng-container *ngIf=\"formGroup.value.cookieBanner.cookieBannerDisabled !== true\">\n                <div class=\"col-md-6\">\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"cookieBannerTitle\"\n                      translate\n                    >\n                      Title\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"cookieBannerTitle\"\n                      name=\"cookieBannerTitle\"\n                      type=\"text\"\n                      formControlName=\"cookieBannerTitle\"\n                    />\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"policyUrl\"\n                      translate\n                    >\n                      Link to privacy policy\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"policyUrl\"\n                      name=\"policyUrl\"\n                      type=\"text\"\n                      formControlName=\"policyUrl\"\n                    />\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"policyVersion\"\n                      translate\n                    >\n                      Version of privacy policy\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"policyVersion\"\n                      name=\"policyVersion\"\n                      type=\"text\"\n                      formControlName=\"policyVersion\"\n                    />\n                    <c8y-messages\n                      [helpMessage]=\"\n                        'Changing the version of the privacy policy invalidates already existing cookie consents.'\n                          | translate\n                      \"\n                    ></c8y-messages>\n                  </c8y-form-group>\n                </div>\n\n                <div class=\"col-md-6\">\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"cookieBannerText\"\n                      translate\n                    >\n                      Text\n                    </label>\n                    <textarea\n                      class=\"form-control\"\n                      id=\"cookieBannerText\"\n                      name=\"cookieBannerText\"\n                      rows=\"8\"\n                      formControlName=\"cookieBannerText\"\n                    ></textarea>\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                </div>\n              </ng-container>\n            </div>\n          </div>\n        </fieldset>\n      </div>\n    </div>\n  </div>\n  <!-- Message banner -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Message banner\n        </h4>\n      </div>\n\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <fieldset\n          class=\"c8y-fieldset p-24\"\n          [formGroupName]=\"'messageBanner'\"\n        >\n          <legend translate>Message banner</legend>\n\n          <label class=\"c8y-switch\">\n            <input\n              class=\"form-control\"\n              name=\"messageBannerEnabled\"\n              type=\"checkbox\"\n              formControlName=\"messageBannerEnabled\"\n            />\n            <span></span>\n            <span translate>Enable message banner</span>\n          </label>\n          <div\n            class=\"collapse\"\n            [collapse]=\"!formGroup.value.messageBanner.messageBannerEnabled\"\n            [isAnimated]=\"true\"\n          >\n            <div class=\"d-flex a-i-center gap-8 p-t-16 p-b-16\">\n              <fieldset class=\"c8y-fieldset p-16\">\n                <legend>{{ 'Message type' | translate }}</legend>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Info' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"info\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-info icon-16 m-r-4\"\n                      c8yIcon=\"info-circle\"\n                    ></i>\n                    Info\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Warning' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"warning\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-warning icon-16 m-r-4\"\n                      c8yIcon=\"warning\"\n                    ></i>\n                    {{ 'Warning' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Danger' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"danger\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-danger icon-16 m-r-4\"\n                      c8yIcon=\"exclamation-circle\"\n                    ></i>\n                    {{ 'Danger' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Success' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"success\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-success icon-16 m-r-4\"\n                      c8yIcon=\"check-circle\"\n                    ></i>\n                    {{ 'Success' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'System' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"system\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span>\n                    <i\n                      class=\"text-primary icon-16 m-r4\"\n                      c8yIcon=\"wrench\"\n                    ></i>\n                    {{ 'System' | translate }}\n                  </span>\n                </label>\n              </fieldset>\n            </div>\n\n            <c8y-form-group\n              class=\"m-b-32 p-b-32\"\n              [style]=\"{ height: '300px' }\"\n              *ngIf=\"formGroup.value.messageBanner.messageBannerEnabled\"\n            >\n              <label\n                for=\"messageBannerContent\"\n                translate\n              >\n                Message content\n              </label>\n              <c8y-editor\n                class=\"flex-grow form-control\"\n                style=\"height: 100%\"\n                formControlName=\"messageBannerContent\"\n                monacoEditorMarkerValidator\n              ></c8y-editor>\n              <c8y-messages\n                [helpMessage]=\"messageBannerHelp | translate: messageBannerHelpParams\"\n              ></c8y-messages>\n              <c8y-messages></c8y-messages>\n            </c8y-form-group>\n\n            <button\n              class=\"btn btn-default\"\n              type=\"button\"\n              (click)=\"previewBanner()\"\n            >\n              <i\n                class=\"m-r-4\"\n                c8yIcon=\"eye\"\n              ></i>\n              <span translate>Preview banner</span>\n            </button>\n          </div>\n        </fieldset>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i3.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: i3.C8yTranslatePipe, name: "translate" }, { kind: "directive", type: i3.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i3.MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: i3.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CollapseModule }, { kind: "directive", type: i4$1.CollapseDirective, selector: "[collapse]", inputs: ["display", "isAnimated", "collapse"], outputs: ["collapsed", "collapses", "expanded", "expands"], exportAs: ["bs-collapse"] }, { kind: "component", type: StaticAssetsFilePickerComponent, selector: "c8y-static-assets-file-picker", inputs: ["isCSSURL", "staticAssetType", "supportedFileExtensions", "layout", "size"] }, { kind: "component", type: EditorComponent, selector: "c8y-editor", inputs: ["editorOptions"], outputs: ["editorInit"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: BrandingFormComponent, isStandalone: true, selector: "c8y-branding-form", host: { classAttribute: "d-contents" }, ngImport: i0, template: "<div\n  class=\"inner-scroll\"\n  [formGroup]=\"formGroup\"\n>\n  <!--  Title & Favicon-->\n  <div class=\"card-block\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4 class=\"text-normal text-right text-left-xs m-b-16\">\n          {{ 'Title & favicon' | translate }}\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <div\n          class=\"row p-t-16 p-b-16\"\n          [formGroupName]=\"'genericApplicationOptions'\"\n        >\n          <div class=\"col-md-6\">\n            <c8y-form-group class=\"m-b-32\">\n              <label\n                for=\"globalTitle\"\n                translate\n              >\n                Title\n              </label>\n              <input\n                class=\"form-control\"\n                id=\"globalTitle\"\n                name=\"globalTitle\"\n                type=\"text\"\n                formControlName=\"globalTitle\"\n              />\n              <c8y-messages\n                [helpMessage]=\"'Title to display in the browser tab' | translate\"\n              ></c8y-messages>\n            </c8y-form-group>\n          </div>\n          <div class=\"col-md-6\">\n            <c8y-form-group>\n              <label translate>Favicon</label>\n              <c8y-static-assets-file-picker\n                name=\"faviconUrl\"\n                [supportedFileExtensions]=\"['ico']\"\n                [isCSSURL]=\"false\"\n                formControlName=\"faviconUrl\"\n              ></c8y-static-assets-file-picker>\n              <c8y-messages [helpMessage]=\"'Supported files: *.ico'\"></c8y-messages>\n            </c8y-form-group>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"card-block separator-top\">\n    <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n      <h4\n        class=\"text-normal text-right text-left-xs m-b-16\"\n        translate\n      >\n        Dark theme\n      </h4>\n    </div>\n    <div class=\"col-xs-12 col-sm-9 col-md-10\">\n      <c8y-form-group class=\"m-b-32 p-t-8 m-t-4\">\n        <label class=\"c8y-switch\">\n          <input\n            class=\"form-control\"\n            name=\"darkThemeAvailable\"\n            type=\"checkbox\"\n            formControlName=\"darkThemeAvailable\"\n          />\n          <span></span>\n          <span translate>Enable dark theme support</span>\n        </label>\n      </c8y-form-group>\n    </div>\n  </div>\n  <!-- Typography -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Typography\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <div class=\"row\">\n          <div class=\"col-md-6\">\n            <fieldset\n              class=\"c8y-fieldset p-24\"\n              [formGroupName]=\"'baseTypography'\"\n            >\n              <legend translate>Base typography</legend>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  for=\"font-url\"\n                  translate\n                >\n                  Fonts URL\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-url\"\n                  placeholder=\"{{\n                    'e.g. {{ example }}' | translate : { example: 'https://fonts.googleapis.com/css?family=Roboto:400,500,700' }\n                  }}\"\n                  type=\"text\"\n                  formControlName=\"font-url\"\n                />\n                <c8y-messages [helpMessage]=\"'The Google fonts URL' | translate\"></c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"font-family-base\"\n                  for=\"font-family-base\"\n                  translate\n                >\n                  Base font stack\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-family-base\"\n                  placeholder=\"{{ 'e.g. {{ example }}' | translate : {example: '&quot;Roboto&quot;, Arial, sans-serif'} }}\"\n                  name=\"font-family-base\"\n                  type=\"text\"\n                  formControlName=\"font-family-base\"\n                />\n                <c8y-messages></c8y-messages>\n              </c8y-form-group>\n            </fieldset>\n          </div>\n          <div class=\"col-md-6\">\n            <fieldset\n              class=\"c8y-fieldset p-24\"\n              [formGroupName]=\"'headingsAndNavigatorTypography'\"\n            >\n              <legend>{{ 'Headings & navigator' | translate }}</legend>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"font-family-headings\"\n                  for=\"font-family-headings\"\n                  translate\n                >\n                  Headings font stack\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-family-headings\"\n                  placeholder=\"{{ 'e.g. {{ example }}' | translate : {example: '&quot;Roboto&quot;, Arial, sans-serif'} }}\"\n                  type=\"text\"\n                  formControlName=\"font-family-headings\"\n                />\n                <c8y-messages\n                  [helpMessage]=\"\n                    'Leave empty to use the same font as the base font stack' | translate\n                  \"\n                ></c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"navigator-font-family\"\n                  translate\n                >\n                  Navigator font stack\n                </label>\n                <div class=\"form-control-static\">\n                  <label class=\"c8y-radio radio-inline\">\n                    <input\n                      name=\"navigator-font-family\"\n                      type=\"radio\"\n                      formControlName=\"navigator-font-family\"\n                      [value]=\"'var(--font-family-base)'\"\n                    />\n                    <span></span>\n                    <span translate>Match base font stack</span>\n                  </label>\n                  <label\n                    class=\"c8y-radio radio-inline\"\n                    title=\"Radio Two\"\n                  >\n                    <input\n                      name=\"navigator-font-family\"\n                      type=\"radio\"\n                      formControlName=\"navigator-font-family\"\n                      [value]=\"'var(--font-family-headings)'\"\n                    />\n                    <span></span>\n                    <span translate>Match headings font stack</span>\n                  </label>\n                </div>\n              </c8y-form-group>\n            </fieldset>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <!-- Cookie banner -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Cookie banner\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <fieldset\n          class=\"c8y-fieldset p-24\"\n          [formGroupName]=\"'cookieBanner'\"\n        >\n          <legend translate>Cookie banner</legend>\n          <label class=\"c8y-switch\">\n            <input\n              class=\"form-control\"\n              name=\"cookieBannerEnabled\"\n              type=\"checkbox\"\n              [ngModelOptions]=\"{ standalone: true }\"\n              [ngModel]=\"!formGroup.value.cookieBanner.cookieBannerDisabled\"\n              (ngModelChange)=\"cockieBannerChange($event)\"\n            />\n            <span></span>\n            <span translate>Enable cookie banner</span>\n          </label>\n\n          <div\n            class=\"collapse\"\n            [collapse]=\"formGroup.value.cookieBanner.cookieBannerDisabled\"\n            [isAnimated]=\"true\"\n          >\n            <div\n              class=\"row\"\n              style=\"min-height: 227px\"\n            >\n              <ng-container *ngIf=\"formGroup.value.cookieBanner.cookieBannerDisabled !== true\">\n                <div class=\"col-md-6\">\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"cookieBannerTitle\"\n                      translate\n                    >\n                      Title\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"cookieBannerTitle\"\n                      name=\"cookieBannerTitle\"\n                      type=\"text\"\n                      formControlName=\"cookieBannerTitle\"\n                    />\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"policyUrl\"\n                      translate\n                    >\n                      Link to privacy policy\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"policyUrl\"\n                      name=\"policyUrl\"\n                      type=\"text\"\n                      formControlName=\"policyUrl\"\n                    />\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"policyVersion\"\n                      translate\n                    >\n                      Version of privacy policy\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"policyVersion\"\n                      name=\"policyVersion\"\n                      type=\"text\"\n                      formControlName=\"policyVersion\"\n                    />\n                    <c8y-messages\n                      [helpMessage]=\"\n                        'Changing the version of the privacy policy invalidates already existing cookie consents.'\n                          | translate\n                      \"\n                    ></c8y-messages>\n                  </c8y-form-group>\n                </div>\n\n                <div class=\"col-md-6\">\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"cookieBannerText\"\n                      translate\n                    >\n                      Text\n                    </label>\n                    <textarea\n                      class=\"form-control\"\n                      id=\"cookieBannerText\"\n                      name=\"cookieBannerText\"\n                      rows=\"8\"\n                      formControlName=\"cookieBannerText\"\n                    ></textarea>\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                </div>\n              </ng-container>\n            </div>\n          </div>\n        </fieldset>\n      </div>\n    </div>\n  </div>\n  <!-- Message banner -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Message banner\n        </h4>\n      </div>\n\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <fieldset\n          class=\"c8y-fieldset p-24\"\n          [formGroupName]=\"'messageBanner'\"\n        >\n          <legend translate>Message banner</legend>\n\n          <label class=\"c8y-switch\">\n            <input\n              class=\"form-control\"\n              name=\"messageBannerEnabled\"\n              type=\"checkbox\"\n              formControlName=\"messageBannerEnabled\"\n            />\n            <span></span>\n            <span translate>Enable message banner</span>\n          </label>\n          <div\n            class=\"collapse\"\n            [collapse]=\"!formGroup.value.messageBanner.messageBannerEnabled\"\n            [isAnimated]=\"true\"\n          >\n            <div class=\"d-flex a-i-center gap-8 p-t-16 p-b-16\">\n              <fieldset class=\"c8y-fieldset p-16\">\n                <legend>{{ 'Message type' | translate }}</legend>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Info' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"info\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-info icon-16 m-r-4\"\n                      c8yIcon=\"info-circle\"\n                    ></i>\n                    Info\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Warning' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"warning\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-warning icon-16 m-r-4\"\n                      c8yIcon=\"warning\"\n                    ></i>\n                    {{ 'Warning' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Danger' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"danger\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-danger icon-16 m-r-4\"\n                      c8yIcon=\"exclamation-circle\"\n                    ></i>\n                    {{ 'Danger' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Success' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"success\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-success icon-16 m-r-4\"\n                      c8yIcon=\"check-circle\"\n                    ></i>\n                    {{ 'Success' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'System' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"system\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span>\n                    <i\n                      class=\"text-primary icon-16 m-r4\"\n                      c8yIcon=\"wrench\"\n                    ></i>\n                    {{ 'System' | translate }}\n                  </span>\n                </label>\n              </fieldset>\n            </div>\n\n            <c8y-form-group\n              class=\"m-b-32 p-b-32\"\n              [style]=\"{ height: '300px' }\"\n              *ngIf=\"formGroup.value.messageBanner.messageBannerEnabled\"\n            >\n              <label\n                for=\"messageBannerContent\"\n                translate\n              >\n                Message content\n              </label>\n              <c8y-editor\n                class=\"flex-grow form-control\"\n                style=\"height: 100%\"\n                formControlName=\"messageBannerContent\"\n                [editorOptions]=\"{language: 'markdown'}\"\n                monacoEditorMarkerValidator\n              ></c8y-editor>\n              <c8y-messages\n                [helpMessage]=\"messageBannerHelp | translate: messageBannerHelpParams\"\n              ></c8y-messages>\n              <c8y-messages></c8y-messages>\n            </c8y-form-group>\n\n            <button\n              class=\"btn btn-default\"\n              type=\"button\"\n              (click)=\"previewBanner()\"\n            >\n              <i\n                class=\"m-r-4\"\n                c8yIcon=\"eye\"\n              ></i>\n              <span translate>Preview banner</span>\n            </button>\n          </div>\n        </fieldset>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i3.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: i3.C8yTranslatePipe, name: "translate" }, { kind: "directive", type: i3.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i3.MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: i3.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CollapseModule }, { kind: "directive", type: i4$1.CollapseDirective, selector: "[collapse]", inputs: ["display", "isAnimated", "collapse"], outputs: ["collapsed", "collapses", "expanded", "expands"], exportAs: ["bs-collapse"] }, { kind: "component", type: StaticAssetsFilePickerComponent, selector: "c8y-static-assets-file-picker", inputs: ["isCSSURL", "staticAssetType", "supportedFileExtensions", "layout", "size"] }, { kind: "component", type: EditorComponent, selector: "c8y-editor", inputs: ["editorOptions"], outputs: ["editorInit"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: BrandingFormComponent, decorators: [{
             type: Component,
@@ -699,7 +699,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
                         CollapseModule,
                         StaticAssetsFilePickerComponent,
                         EditorComponent
-                    ], template: "<div\n  class=\"inner-scroll\"\n  [formGroup]=\"formGroup\"\n>\n  <!--  Title & Favicon-->\n  <div class=\"card-block\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4 class=\"text-normal text-right text-left-xs m-b-16\">\n          {{ 'Title & favicon' | translate }}\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <div\n          class=\"row p-t-16 p-b-16\"\n          [formGroupName]=\"'genericApplicationOptions'\"\n        >\n          <div class=\"col-md-6\">\n            <c8y-form-group class=\"m-b-32\">\n              <label\n                for=\"globalTitle\"\n                translate\n              >\n                Title\n              </label>\n              <input\n                class=\"form-control\"\n                id=\"globalTitle\"\n                name=\"globalTitle\"\n                type=\"text\"\n                formControlName=\"globalTitle\"\n              />\n              <c8y-messages\n                [helpMessage]=\"'Title to display in the browser tab' | translate\"\n              ></c8y-messages>\n            </c8y-form-group>\n          </div>\n          <div class=\"col-md-6\">\n            <c8y-form-group>\n              <label translate>Favicon</label>\n              <c8y-static-assets-file-picker\n                name=\"faviconUrl\"\n                [supportedFileExtensions]=\"['ico']\"\n                [isCSSURL]=\"false\"\n                formControlName=\"faviconUrl\"\n              ></c8y-static-assets-file-picker>\n              <c8y-messages [helpMessage]=\"'Supported files: *.ico'\"></c8y-messages>\n            </c8y-form-group>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"card-block separator-top\">\n    <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n      <h4\n        class=\"text-normal text-right text-left-xs m-b-16\"\n        translate\n      >\n        Dark theme\n      </h4>\n    </div>\n    <div class=\"col-xs-12 col-sm-9 col-md-10\">\n      <c8y-form-group class=\"m-b-32 p-t-8 m-t-4\">\n        <label class=\"c8y-switch\">\n          <input\n            class=\"form-control\"\n            name=\"darkThemeAvailable\"\n            type=\"checkbox\"\n            formControlName=\"darkThemeAvailable\"\n          />\n          <span></span>\n          <span translate>Enable dark theme support</span>\n        </label>\n      </c8y-form-group>\n    </div>\n  </div>\n  <!-- Typography -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Typography\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <div class=\"row\">\n          <div class=\"col-md-6\">\n            <fieldset\n              class=\"c8y-fieldset p-24\"\n              [formGroupName]=\"'baseTypography'\"\n            >\n              <legend translate>Base typography</legend>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  for=\"font-url\"\n                  translate\n                >\n                  Fonts URL\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-url\"\n                  placeholder=\"{{\n                    'e.g. {{ example }}' | translate : { example: 'https://fonts.googleapis.com/css?family=Roboto:400,500,700' }\n                  }}\"\n                  type=\"text\"\n                  formControlName=\"font-url\"\n                />\n                <c8y-messages [helpMessage]=\"'The Google fonts URL' | translate\"></c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"font-family-base\"\n                  for=\"font-family-base\"\n                  translate\n                >\n                  Base font stack\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-family-base\"\n                  placeholder=\"{{ 'e.g. {{ example }}' | translate : {example: '&quot;Roboto&quot;, Arial, sans-serif'} }}\"\n                  name=\"font-family-base\"\n                  type=\"text\"\n                  formControlName=\"font-family-base\"\n                />\n                <c8y-messages></c8y-messages>\n              </c8y-form-group>\n            </fieldset>\n          </div>\n          <div class=\"col-md-6\">\n            <fieldset\n              class=\"c8y-fieldset p-24\"\n              [formGroupName]=\"'headingsAndNavigatorTypography'\"\n            >\n              <legend>{{ 'Headings & navigator' | translate }}</legend>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"font-family-headings\"\n                  for=\"font-family-headings\"\n                  translate\n                >\n                  Headings font stack\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-family-headings\"\n                  placeholder=\"{{ 'e.g. {{ example }}' | translate : {example: '&quot;Roboto&quot;, Arial, sans-serif'} }}\"\n                  type=\"text\"\n                  formControlName=\"font-family-headings\"\n                />\n                <c8y-messages\n                  [helpMessage]=\"\n                    'Leave empty to use the same font as the base font stack' | translate\n                  \"\n                ></c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"navigator-font-family\"\n                  translate\n                >\n                  Navigator font stack\n                </label>\n                <div class=\"form-control-static\">\n                  <label class=\"c8y-radio radio-inline\">\n                    <input\n                      name=\"navigator-font-family\"\n                      type=\"radio\"\n                      formControlName=\"navigator-font-family\"\n                      [value]=\"'var(--font-family-base)'\"\n                    />\n                    <span></span>\n                    <span translate>Match base font stack</span>\n                  </label>\n                  <label\n                    class=\"c8y-radio radio-inline\"\n                    title=\"Radio Two\"\n                  >\n                    <input\n                      name=\"navigator-font-family\"\n                      type=\"radio\"\n                      formControlName=\"navigator-font-family\"\n                      [value]=\"'var(--font-family-headings)'\"\n                    />\n                    <span></span>\n                    <span translate>Match headings font stack</span>\n                  </label>\n                </div>\n              </c8y-form-group>\n            </fieldset>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <!-- Cookie banner -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Cookie banner\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <fieldset\n          class=\"c8y-fieldset p-24\"\n          [formGroupName]=\"'cookieBanner'\"\n        >\n          <legend translate>Cookie banner</legend>\n          <label class=\"c8y-switch\">\n            <input\n              class=\"form-control\"\n              name=\"cookieBannerEnabled\"\n              type=\"checkbox\"\n              [ngModelOptions]=\"{ standalone: true }\"\n              [ngModel]=\"!formGroup.value.cookieBanner.cookieBannerDisabled\"\n              (ngModelChange)=\"cockieBannerChange($event)\"\n            />\n            <span></span>\n            <span translate>Enable cookie banner</span>\n          </label>\n\n          <div\n            class=\"collapse\"\n            [collapse]=\"formGroup.value.cookieBanner.cookieBannerDisabled\"\n            [isAnimated]=\"true\"\n          >\n            <div\n              class=\"row\"\n              style=\"min-height: 227px\"\n            >\n              <ng-container *ngIf=\"formGroup.value.cookieBanner.cookieBannerDisabled !== true\">\n                <div class=\"col-md-6\">\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"cookieBannerTitle\"\n                      translate\n                    >\n                      Title\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"cookieBannerTitle\"\n                      name=\"cookieBannerTitle\"\n                      type=\"text\"\n                      formControlName=\"cookieBannerTitle\"\n                    />\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"policyUrl\"\n                      translate\n                    >\n                      Link to privacy policy\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"policyUrl\"\n                      name=\"policyUrl\"\n                      type=\"text\"\n                      formControlName=\"policyUrl\"\n                    />\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"policyVersion\"\n                      translate\n                    >\n                      Version of privacy policy\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"policyVersion\"\n                      name=\"policyVersion\"\n                      type=\"text\"\n                      formControlName=\"policyVersion\"\n                    />\n                    <c8y-messages\n                      [helpMessage]=\"\n                        'Changing the version of the privacy policy invalidates already existing cookie consents.'\n                          | translate\n                      \"\n                    ></c8y-messages>\n                  </c8y-form-group>\n                </div>\n\n                <div class=\"col-md-6\">\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"cookieBannerText\"\n                      translate\n                    >\n                      Text\n                    </label>\n                    <textarea\n                      class=\"form-control\"\n                      id=\"cookieBannerText\"\n                      name=\"cookieBannerText\"\n                      rows=\"8\"\n                      formControlName=\"cookieBannerText\"\n                    ></textarea>\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                </div>\n              </ng-container>\n            </div>\n          </div>\n        </fieldset>\n      </div>\n    </div>\n  </div>\n  <!-- Message banner -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Message banner\n        </h4>\n      </div>\n\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <fieldset\n          class=\"c8y-fieldset p-24\"\n          [formGroupName]=\"'messageBanner'\"\n        >\n          <legend translate>Message banner</legend>\n\n          <label class=\"c8y-switch\">\n            <input\n              class=\"form-control\"\n              name=\"messageBannerEnabled\"\n              type=\"checkbox\"\n              formControlName=\"messageBannerEnabled\"\n            />\n            <span></span>\n            <span translate>Enable message banner</span>\n          </label>\n          <div\n            class=\"collapse\"\n            [collapse]=\"!formGroup.value.messageBanner.messageBannerEnabled\"\n            [isAnimated]=\"true\"\n          >\n            <div class=\"d-flex a-i-center gap-8 p-t-16 p-b-16\">\n              <fieldset class=\"c8y-fieldset p-16\">\n                <legend>{{ 'Message type' | translate }}</legend>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Info' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"info\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-info icon-16 m-r-4\"\n                      c8yIcon=\"info-circle\"\n                    ></i>\n                    Info\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Warning' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"warning\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-warning icon-16 m-r-4\"\n                      c8yIcon=\"warning\"\n                    ></i>\n                    {{ 'Warning' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Danger' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"danger\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-danger icon-16 m-r-4\"\n                      c8yIcon=\"exclamation-circle\"\n                    ></i>\n                    {{ 'Danger' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Success' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"success\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-success icon-16 m-r-4\"\n                      c8yIcon=\"check-circle\"\n                    ></i>\n                    {{ 'Success' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'System' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"system\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span>\n                    <i\n                      class=\"text-primary icon-16 m-r4\"\n                      c8yIcon=\"wrench\"\n                    ></i>\n                    {{ 'System' | translate }}\n                  </span>\n                </label>\n              </fieldset>\n            </div>\n\n            <c8y-form-group\n              class=\"m-b-32 p-b-32\"\n              [style]=\"{ height: '300px' }\"\n              *ngIf=\"formGroup.value.messageBanner.messageBannerEnabled\"\n            >\n              <label\n                for=\"messageBannerContent\"\n                translate\n              >\n                Message content\n              </label>\n              <c8y-editor\n                class=\"flex-grow form-control\"\n                style=\"height: 100%\"\n                formControlName=\"messageBannerContent\"\n                monacoEditorMarkerValidator\n              ></c8y-editor>\n              <c8y-messages\n                [helpMessage]=\"messageBannerHelp | translate: messageBannerHelpParams\"\n              ></c8y-messages>\n              <c8y-messages></c8y-messages>\n            </c8y-form-group>\n\n            <button\n              class=\"btn btn-default\"\n              type=\"button\"\n              (click)=\"previewBanner()\"\n            >\n              <i\n                class=\"m-r-4\"\n                c8yIcon=\"eye\"\n              ></i>\n              <span translate>Preview banner</span>\n            </button>\n          </div>\n        </fieldset>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
+                    ], template: "<div\n  class=\"inner-scroll\"\n  [formGroup]=\"formGroup\"\n>\n  <!--  Title & Favicon-->\n  <div class=\"card-block\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4 class=\"text-normal text-right text-left-xs m-b-16\">\n          {{ 'Title & favicon' | translate }}\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <div\n          class=\"row p-t-16 p-b-16\"\n          [formGroupName]=\"'genericApplicationOptions'\"\n        >\n          <div class=\"col-md-6\">\n            <c8y-form-group class=\"m-b-32\">\n              <label\n                for=\"globalTitle\"\n                translate\n              >\n                Title\n              </label>\n              <input\n                class=\"form-control\"\n                id=\"globalTitle\"\n                name=\"globalTitle\"\n                type=\"text\"\n                formControlName=\"globalTitle\"\n              />\n              <c8y-messages\n                [helpMessage]=\"'Title to display in the browser tab' | translate\"\n              ></c8y-messages>\n            </c8y-form-group>\n          </div>\n          <div class=\"col-md-6\">\n            <c8y-form-group>\n              <label translate>Favicon</label>\n              <c8y-static-assets-file-picker\n                name=\"faviconUrl\"\n                [supportedFileExtensions]=\"['ico']\"\n                [isCSSURL]=\"false\"\n                formControlName=\"faviconUrl\"\n              ></c8y-static-assets-file-picker>\n              <c8y-messages [helpMessage]=\"'Supported files: *.ico'\"></c8y-messages>\n            </c8y-form-group>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"card-block separator-top\">\n    <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n      <h4\n        class=\"text-normal text-right text-left-xs m-b-16\"\n        translate\n      >\n        Dark theme\n      </h4>\n    </div>\n    <div class=\"col-xs-12 col-sm-9 col-md-10\">\n      <c8y-form-group class=\"m-b-32 p-t-8 m-t-4\">\n        <label class=\"c8y-switch\">\n          <input\n            class=\"form-control\"\n            name=\"darkThemeAvailable\"\n            type=\"checkbox\"\n            formControlName=\"darkThemeAvailable\"\n          />\n          <span></span>\n          <span translate>Enable dark theme support</span>\n        </label>\n      </c8y-form-group>\n    </div>\n  </div>\n  <!-- Typography -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Typography\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <div class=\"row\">\n          <div class=\"col-md-6\">\n            <fieldset\n              class=\"c8y-fieldset p-24\"\n              [formGroupName]=\"'baseTypography'\"\n            >\n              <legend translate>Base typography</legend>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  for=\"font-url\"\n                  translate\n                >\n                  Fonts URL\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-url\"\n                  placeholder=\"{{\n                    'e.g. {{ example }}' | translate : { example: 'https://fonts.googleapis.com/css?family=Roboto:400,500,700' }\n                  }}\"\n                  type=\"text\"\n                  formControlName=\"font-url\"\n                />\n                <c8y-messages [helpMessage]=\"'The Google fonts URL' | translate\"></c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"font-family-base\"\n                  for=\"font-family-base\"\n                  translate\n                >\n                  Base font stack\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-family-base\"\n                  placeholder=\"{{ 'e.g. {{ example }}' | translate : {example: '&quot;Roboto&quot;, Arial, sans-serif'} }}\"\n                  name=\"font-family-base\"\n                  type=\"text\"\n                  formControlName=\"font-family-base\"\n                />\n                <c8y-messages></c8y-messages>\n              </c8y-form-group>\n            </fieldset>\n          </div>\n          <div class=\"col-md-6\">\n            <fieldset\n              class=\"c8y-fieldset p-24\"\n              [formGroupName]=\"'headingsAndNavigatorTypography'\"\n            >\n              <legend>{{ 'Headings & navigator' | translate }}</legend>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"font-family-headings\"\n                  for=\"font-family-headings\"\n                  translate\n                >\n                  Headings font stack\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"font-family-headings\"\n                  placeholder=\"{{ 'e.g. {{ example }}' | translate : {example: '&quot;Roboto&quot;, Arial, sans-serif'} }}\"\n                  type=\"text\"\n                  formControlName=\"font-family-headings\"\n                />\n                <c8y-messages\n                  [helpMessage]=\"\n                    'Leave empty to use the same font as the base font stack' | translate\n                  \"\n                ></c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group class=\"m-b-32\">\n                <label\n                  title=\"navigator-font-family\"\n                  translate\n                >\n                  Navigator font stack\n                </label>\n                <div class=\"form-control-static\">\n                  <label class=\"c8y-radio radio-inline\">\n                    <input\n                      name=\"navigator-font-family\"\n                      type=\"radio\"\n                      formControlName=\"navigator-font-family\"\n                      [value]=\"'var(--font-family-base)'\"\n                    />\n                    <span></span>\n                    <span translate>Match base font stack</span>\n                  </label>\n                  <label\n                    class=\"c8y-radio radio-inline\"\n                    title=\"Radio Two\"\n                  >\n                    <input\n                      name=\"navigator-font-family\"\n                      type=\"radio\"\n                      formControlName=\"navigator-font-family\"\n                      [value]=\"'var(--font-family-headings)'\"\n                    />\n                    <span></span>\n                    <span translate>Match headings font stack</span>\n                  </label>\n                </div>\n              </c8y-form-group>\n            </fieldset>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <!-- Cookie banner -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Cookie banner\n        </h4>\n      </div>\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <fieldset\n          class=\"c8y-fieldset p-24\"\n          [formGroupName]=\"'cookieBanner'\"\n        >\n          <legend translate>Cookie banner</legend>\n          <label class=\"c8y-switch\">\n            <input\n              class=\"form-control\"\n              name=\"cookieBannerEnabled\"\n              type=\"checkbox\"\n              [ngModelOptions]=\"{ standalone: true }\"\n              [ngModel]=\"!formGroup.value.cookieBanner.cookieBannerDisabled\"\n              (ngModelChange)=\"cockieBannerChange($event)\"\n            />\n            <span></span>\n            <span translate>Enable cookie banner</span>\n          </label>\n\n          <div\n            class=\"collapse\"\n            [collapse]=\"formGroup.value.cookieBanner.cookieBannerDisabled\"\n            [isAnimated]=\"true\"\n          >\n            <div\n              class=\"row\"\n              style=\"min-height: 227px\"\n            >\n              <ng-container *ngIf=\"formGroup.value.cookieBanner.cookieBannerDisabled !== true\">\n                <div class=\"col-md-6\">\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"cookieBannerTitle\"\n                      translate\n                    >\n                      Title\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"cookieBannerTitle\"\n                      name=\"cookieBannerTitle\"\n                      type=\"text\"\n                      formControlName=\"cookieBannerTitle\"\n                    />\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"policyUrl\"\n                      translate\n                    >\n                      Link to privacy policy\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"policyUrl\"\n                      name=\"policyUrl\"\n                      type=\"text\"\n                      formControlName=\"policyUrl\"\n                    />\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"policyVersion\"\n                      translate\n                    >\n                      Version of privacy policy\n                    </label>\n                    <input\n                      class=\"form-control\"\n                      id=\"policyVersion\"\n                      name=\"policyVersion\"\n                      type=\"text\"\n                      formControlName=\"policyVersion\"\n                    />\n                    <c8y-messages\n                      [helpMessage]=\"\n                        'Changing the version of the privacy policy invalidates already existing cookie consents.'\n                          | translate\n                      \"\n                    ></c8y-messages>\n                  </c8y-form-group>\n                </div>\n\n                <div class=\"col-md-6\">\n                  <c8y-form-group class=\"m-b-32\">\n                    <label\n                      for=\"cookieBannerText\"\n                      translate\n                    >\n                      Text\n                    </label>\n                    <textarea\n                      class=\"form-control\"\n                      id=\"cookieBannerText\"\n                      name=\"cookieBannerText\"\n                      rows=\"8\"\n                      formControlName=\"cookieBannerText\"\n                    ></textarea>\n                    <c8y-messages></c8y-messages>\n                  </c8y-form-group>\n                </div>\n              </ng-container>\n            </div>\n          </div>\n        </fieldset>\n      </div>\n    </div>\n  </div>\n  <!-- Message banner -->\n  <div class=\"card-block separator-top\">\n    <div class=\"row\">\n      <div class=\"col-xs-12 col-sm-3 col-md-2 p-t-16\">\n        <h4\n          class=\"text-normal text-right text-left-xs m-b-16\"\n          translate\n        >\n          Message banner\n        </h4>\n      </div>\n\n      <div class=\"col-xs-12 col-sm-9 col-md-10\">\n        <fieldset\n          class=\"c8y-fieldset p-24\"\n          [formGroupName]=\"'messageBanner'\"\n        >\n          <legend translate>Message banner</legend>\n\n          <label class=\"c8y-switch\">\n            <input\n              class=\"form-control\"\n              name=\"messageBannerEnabled\"\n              type=\"checkbox\"\n              formControlName=\"messageBannerEnabled\"\n            />\n            <span></span>\n            <span translate>Enable message banner</span>\n          </label>\n          <div\n            class=\"collapse\"\n            [collapse]=\"!formGroup.value.messageBanner.messageBannerEnabled\"\n            [isAnimated]=\"true\"\n          >\n            <div class=\"d-flex a-i-center gap-8 p-t-16 p-b-16\">\n              <fieldset class=\"c8y-fieldset p-16\">\n                <legend>{{ 'Message type' | translate }}</legend>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Info' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"info\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-info icon-16 m-r-4\"\n                      c8yIcon=\"info-circle\"\n                    ></i>\n                    Info\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Warning' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"warning\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-warning icon-16 m-r-4\"\n                      c8yIcon=\"warning\"\n                    ></i>\n                    {{ 'Warning' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Danger' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"danger\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-danger icon-16 m-r-4\"\n                      c8yIcon=\"exclamation-circle\"\n                    ></i>\n                    {{ 'Danger' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'Success' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"success\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span class=\"d-flex a-i-center\">\n                    <i\n                      class=\"text-success icon-16 m-r-4\"\n                      c8yIcon=\"check-circle\"\n                    ></i>\n                    {{ 'Success' | translate }}\n                  </span>\n                </label>\n                <label\n                  class=\"c8y-radio radio-inline\"\n                  title=\"{{ 'System' | translate }}\"\n                >\n                  <input\n                    type=\"radio\"\n                    value=\"system\"\n                    formControlName=\"messageBannerType\"\n                  />\n                  <span></span>\n                  <span>\n                    <i\n                      class=\"text-primary icon-16 m-r4\"\n                      c8yIcon=\"wrench\"\n                    ></i>\n                    {{ 'System' | translate }}\n                  </span>\n                </label>\n              </fieldset>\n            </div>\n\n            <c8y-form-group\n              class=\"m-b-32 p-b-32\"\n              [style]=\"{ height: '300px' }\"\n              *ngIf=\"formGroup.value.messageBanner.messageBannerEnabled\"\n            >\n              <label\n                for=\"messageBannerContent\"\n                translate\n              >\n                Message content\n              </label>\n              <c8y-editor\n                class=\"flex-grow form-control\"\n                style=\"height: 100%\"\n                formControlName=\"messageBannerContent\"\n                [editorOptions]=\"{language: 'markdown'}\"\n                monacoEditorMarkerValidator\n              ></c8y-editor>\n              <c8y-messages\n                [helpMessage]=\"messageBannerHelp | translate: messageBannerHelpParams\"\n              ></c8y-messages>\n              <c8y-messages></c8y-messages>\n            </c8y-form-group>\n\n            <button\n              class=\"btn btn-default\"\n              type=\"button\"\n              (click)=\"previewBanner()\"\n            >\n              <i\n                class=\"m-r-4\"\n                c8yIcon=\"eye\"\n              ></i>\n              <span translate>Preview banner</span>\n            </button>\n          </div>\n        </fieldset>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i2.FormBuilder }, { type: i3.MessageBannerService }] });
 
 const formStructure = {