@bnsights/bbsf-controls 1.0.79 → 1.0.81

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1321,7 +1321,7 @@
1321
1321
  FileUploadComponent.decorators = [
1322
1322
  { type: i0.Component, args: [{
1323
1323
  selector: 'BBSF-FileUplaod',
1324
- template: "<div class=\"form-group bbsf-control bbsf-file-upload\" [formGroup]=\"group\">\r\n <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n <!--label-->\r\n <label [hidden]=\"options.HideLabel\" class=\"bbsf-label {{options.LabelExtraClasses}}\">\r\n {{options.LabelValue}}\r\n <!--Asterisk-->\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger\">*</span>\r\n </label>\r\n <!--Allow dropZone-->\r\n <div ng2FileDrop class=\"bbsf-input-container {{options.ExtraClasses}}\"\r\n *ngIf=\"(options.IsDropZone)&&(!((options.IsMultipleFile==false)&&(uploader.queue.length)>0))\"\r\n [ngClass]=\"{'another-file-over-class': hasAnotherDropZoneOver}\" (onFileDrop)=\"onFileChange()\"\r\n (fileOver)=\"fileOverAnother($event)\" [uploader]=\"uploader\" [accept]=\"AcceptedType\"\r\n (change)=\"onFileChange()\" id=\"{{options.Name}}\" multiple=\"{{options.IsMultipleFile?'multiple':''}}\"\r\n aria-describedby=\"email-error\" aria-invalid=\"true\" type=\"file\" formControlName=\"{{options.Name}}\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n <div class=\"dropzone-label\">\r\n <div class=\"svg-and-validation\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" style=\"width: 50px; height: 50px;\">\r\n <path opacity=\"0.3\" d=\"M5 16C3.3 16 2 14.7 2 13C2 11.3 3.3 10 5 10H5.1C5 9.7 5 9.3 5 9C5 6.2 7.2 4 10 4C11.9 4 13.5 5 14.3 6.5C14.8 6.2 15.4 6 16 6C17.7 6 19 7.3 19 9C19 9.4 18.9 9.7 18.8 10C18.9 10 18.9 10 19 10C20.7 10 22 11.3 22 13C22 14.7 20.7 16 19 16H5ZM8 13.6H16L12.7 10.3C12.3 9.89999 11.7 9.89999 11.3 10.3L8 13.6Z\" fill=\"currentColor\" style=\"fill: #a1a1a1;\"></path>\r\n <path d=\"M11 13.6V19C11 19.6 11.4 20 12 20C12.6 20 13 19.6 13 19V13.6H11Z\" fill=\"currentColor\" style=\"fill: #989898;\"></path>\r\n </svg>\r\n <!--Validation text-->\r\n <div class=\"bbsf-validation-msg\">{{UtilityService.getResourceValue(\"DragAndDropHere\")}} </div>\r\n <div class=\"bbsf-validation-msg\" *ngIf=\"ValidationMessage\" [innerHTML]=\"ValidationMessage\"></div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <!--Not allowed dropZone-->\r\n <div class=\"bbsf-input-container\" *ngIf=\"(!options.IsDropZone)&&!((uploader.queue.length>0)&&(!options.IsMultipleFile))\" (click)=\"fileInput.click();\">\r\n <div class=\"dropzone-label\">\r\n <div class=\"svg-and-validation\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" style=\"width: 50px; height: 50px;\">\r\n <path opacity=\"0.3\" d=\"M5 16C3.3 16 2 14.7 2 13C2 11.3 3.3 10 5 10H5.1C5 9.7 5 9.3 5 9C5 6.2 7.2 4 10 4C11.9 4 13.5 5 14.3 6.5C14.8 6.2 15.4 6 16 6C17.7 6 19 7.3 19 9C19 9.4 18.9 9.7 18.8 10C18.9 10 18.9 10 19 10C20.7 10 22 11.3 22 13C22 14.7 20.7 16 19 16H5ZM8 13.6H16L12.7 10.3C12.3 9.89999 11.7 9.89999 11.3 10.3L8 13.6Z\" fill=\"currentColor\" style=\"fill: #a1a1a1;\"></path>\r\n <path d=\"M11 13.6V19C11 19.6 11.4 20 12 20C12.6 20 13 19.6 13 19V13.6H11Z\" fill=\"currentColor\" style=\"fill: #989898;\"></path>\r\n </svg>\r\n <!--Validation text-->\r\n <div class=\"bbsf-validation-msg\">{{UtilityService.getResourceValue(\"Upload\")}} </div>\r\n <div class=\"bbsf-validation-msg\" *ngIf=\"ValidationMessage\" [innerHTML]=\"ValidationMessage\"></div>\r\n </div>\r\n </div>\r\n <input ng2FileSelect [uploader]=\"uploader\" [accept]=\"AcceptedType\"\r\n class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\"\r\n multiple=\"{{options.IsMultipleFile?'multiple':''}}\" name=\"file\" type=\"file\" value=\"\"\r\n autocomplete=\"off\" (change)=\"onFileChange()\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\"\r\n id=\"{{options.Name}}\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n formControlName=\"{{options.Name}}\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n </div>\r\n </div>\r\n <!--items uploaded-->\r\n <div class=\"uploaded-items\">\r\n <div class=\"btn-group\" *ngFor=\"let item of uploader.queue\">\r\n <button type=\"button\" class=\"btn btn-download-file\" href=\"{{ item?._file?.url}}\" download>\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M21 22H3C2.4 22 2 21.6 2 21C2 20.4 2.4 20 3 20H21C21.6 20 22 20.4 22 21C22 21.6 21.6 22 21 22ZM13 13.4V3C13 2.4 12.6 2 12 2C11.4 2 11 2.4 11 3V13.4H13Z\" fill=\"currentColor\"></path>\r\n <path opacity=\"0.3\" d=\"M7 13.4H17L12.7 17.7C12.3 18.1 11.7 18.1 11.3 17.7L7 13.4Z\" fill=\"currentColor\"></path>\r\n </svg>\r\n <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n </button>\r\n <button class=\"btn btn-xs btn-danger\"\r\n (click)=\"item.remove();removeFromControlValue(item)\">\r\n <i class=\"fa fa-times px-0\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"subtext-container\">\r\n <!-- required text-->\r\n <div class=\"bbsf-validation\"\r\n *ngIf=\"(fileUploadFormControl.invalid && fileUploadFormControl.touched)\">\r\n {{getErrorValidation(fileUploadFormControl.errors|keyvalue)}}\r\n </div>\r\n <!-- LabelDescription-->\r\n <div class=\"bbsf-control-desc\" *ngIf=\"options.LabelDescription!=null\"> {{options.LabelDescription}}</div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n </div>\r\n\r\n</div>\r\n\r\n"
1324
+ template: "<div class=\"form-group bbsf-control bbsf-file-upload\" [formGroup]=\"group\">\r\n <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n <!--label-->\r\n <label [hidden]=\"options.HideLabel\" class=\"bbsf-label {{options.LabelExtraClasses}}\">\r\n {{options.LabelValue}}\r\n <!--Asterisk-->\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger\">*</span>\r\n </label>\r\n <!--Allow dropZone-->\r\n <div ng2FileDrop class=\"bbsf-input-container {{options.ExtraClasses}}\"\r\n *ngIf=\"(options.IsDropZone)&&(!((options.IsMultipleFile==false)&&(uploader.queue.length)>0))\"\r\n [ngClass]=\"{'another-file-over-class': hasAnotherDropZoneOver}\" (onFileDrop)=\"onFileChange()\"\r\n (fileOver)=\"fileOverAnother($event)\" [uploader]=\"uploader\" [accept]=\"AcceptedType\"\r\n (change)=\"onFileChange()\" id=\"{{options.Name}}\" multiple=\"{{options.IsMultipleFile?'multiple':''}}\"\r\n aria-describedby=\"email-error\" aria-invalid=\"true\" type=\"file\" formControlName=\"{{options.Name}}\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n <div class=\"dropzone-label\">\r\n <div class=\"svg-and-validation\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" style=\"width: 50px; height: 50px;\">\r\n <path opacity=\"0.3\" d=\"M5 16C3.3 16 2 14.7 2 13C2 11.3 3.3 10 5 10H5.1C5 9.7 5 9.3 5 9C5 6.2 7.2 4 10 4C11.9 4 13.5 5 14.3 6.5C14.8 6.2 15.4 6 16 6C17.7 6 19 7.3 19 9C19 9.4 18.9 9.7 18.8 10C18.9 10 18.9 10 19 10C20.7 10 22 11.3 22 13C22 14.7 20.7 16 19 16H5ZM8 13.6H16L12.7 10.3C12.3 9.89999 11.7 9.89999 11.3 10.3L8 13.6Z\" fill=\"currentColor\" style=\"fill: #a1a1a1;\"></path>\r\n <path d=\"M11 13.6V19C11 19.6 11.4 20 12 20C12.6 20 13 19.6 13 19V13.6H11Z\" fill=\"currentColor\" style=\"fill: #989898;\"></path>\r\n </svg>\r\n <!--Validation text-->\r\n <div class=\"bbsf-validation-msg\">{{UtilityService.getResourceValue(\"DragAndDropHere\")}} </div>\r\n <div class=\"bbsf-validation-msg\" *ngIf=\"ValidationMessage\" [innerHTML]=\"ValidationMessage\"></div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <!--Not allowed dropZone-->\r\n <div class=\"bbsf-input-container\" *ngIf=\"(!options.IsDropZone)&&!((uploader.queue.length>0)&&(!options.IsMultipleFile))\" (click)=\"fileInput.click();\">\r\n <div class=\"dropzone-label\">\r\n <div class=\"svg-and-validation\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" style=\"width: 50px; height: 50px;\">\r\n <path opacity=\"0.3\" d=\"M5 16C3.3 16 2 14.7 2 13C2 11.3 3.3 10 5 10H5.1C5 9.7 5 9.3 5 9C5 6.2 7.2 4 10 4C11.9 4 13.5 5 14.3 6.5C14.8 6.2 15.4 6 16 6C17.7 6 19 7.3 19 9C19 9.4 18.9 9.7 18.8 10C18.9 10 18.9 10 19 10C20.7 10 22 11.3 22 13C22 14.7 20.7 16 19 16H5ZM8 13.6H16L12.7 10.3C12.3 9.89999 11.7 9.89999 11.3 10.3L8 13.6Z\" fill=\"currentColor\" style=\"fill: #a1a1a1;\"></path>\r\n <path d=\"M11 13.6V19C11 19.6 11.4 20 12 20C12.6 20 13 19.6 13 19V13.6H11Z\" fill=\"currentColor\" style=\"fill: #989898;\"></path>\r\n </svg>\r\n <!--Validation text-->\r\n <div class=\"bbsf-validation-msg\">{{UtilityService.getResourceValue(\"Upload\")}} </div>\r\n <div class=\"bbsf-validation-msg\" *ngIf=\"ValidationMessage\" [innerHTML]=\"ValidationMessage\"></div>\r\n </div>\r\n </div>\r\n <input ng2FileSelect [uploader]=\"uploader\" [accept]=\"AcceptedType\"\r\n class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\"\r\n multiple=\"{{options.IsMultipleFile?'multiple':''}}\" name=\"file\" type=\"file\" value=\"\"\r\n autocomplete=\"off\" (change)=\"onFileChange()\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\"\r\n id=\"{{options.Name}}\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n formControlName=\"{{options.Name}}\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n </div>\r\n </div>\r\n <!--items uploaded-->\r\n <div class=\"uploaded-items\">\r\n <div class=\"btn-group\" *ngFor=\"let item of uploader.queue\">\r\n <button type=\"button\" class=\"btn btn-download-file btn-sm\" href=\"{{ item?._file?.url}}\" download>\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M21 22H3C2.4 22 2 21.6 2 21C2 20.4 2.4 20 3 20H21C21.6 20 22 20.4 22 21C22 21.6 21.6 22 21 22ZM13 13.4V3C13 2.4 12.6 2 12 2C11.4 2 11 2.4 11 3V13.4H13Z\" fill=\"currentColor\"></path>\r\n <path opacity=\"0.3\" d=\"M7 13.4H17L12.7 17.7C12.3 18.1 11.7 18.1 11.3 17.7L7 13.4Z\" fill=\"currentColor\"></path>\r\n </svg>\r\n <span class=\"file-name\">{{ item?.file?.name }}</span>\r\n </button>\r\n <button class=\"btn btn-download-file btn-sm btn-danger\"\r\n (click)=\"item.remove();removeFromControlValue(item)\">\r\n <i class=\"fa fa-times px-0\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"subtext-container\">\r\n <!-- required text-->\r\n <div class=\"bbsf-validation\"\r\n *ngIf=\"(fileUploadFormControl.invalid && fileUploadFormControl.touched)\">\r\n {{getErrorValidation(fileUploadFormControl.errors|keyvalue)}}\r\n </div>\r\n <!-- LabelDescription-->\r\n <div class=\"bbsf-control-desc\" *ngIf=\"options.LabelDescription!=null\"> {{options.LabelDescription}}</div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n </div>\r\n\r\n</div>\r\n\r\n"
1325
1325
  },] }
1326
1326
  ];
1327
1327
  FileUploadComponent.ctorParameters = function () { return [
@@ -2970,7 +2970,7 @@
2970
2970
  ],
2971
2971
  uploadUrl: 'v1/image',
2972
2972
  uploadWithCredentials: false,
2973
- sanitize: true,
2973
+ sanitize: false,
2974
2974
  toolbarPosition: 'top',
2975
2975
  toolbarHiddenButtons: []
2976
2976
  };
@@ -3207,7 +3207,7 @@
3207
3207
  ],
3208
3208
  uploadUrl: 'v1/image',
3209
3209
  uploadWithCredentials: false,
3210
- sanitize: true,
3210
+ sanitize: false,
3211
3211
  toolbarPosition: 'top',
3212
3212
  toolbarHiddenButtons: []
3213
3213
  };
@@ -3249,7 +3249,7 @@
3249
3249
  ],
3250
3250
  uploadUrl: 'v1/image',
3251
3251
  uploadWithCredentials: false,
3252
- sanitize: true,
3252
+ sanitize: false,
3253
3253
  toolbarPosition: 'top',
3254
3254
  toolbarHiddenButtons: []
3255
3255
  };
@@ -3368,7 +3368,6 @@
3368
3368
  MultiLingualHtmlEditorComponent.prototype.ngAfterViewChecked = function () {
3369
3369
  var dir = this.UtilityService.getCurrentLanguage() == "en" ? "ltr" : "rtl";
3370
3370
  var angularEditor = document.getElementsByClassName("angular-editor-toolbar ng-star-inserted");
3371
- console.log(angularEditor);
3372
3371
  for (var index = 0; index < angularEditor.length; index++) {
3373
3372
  var element = angularEditor[index];
3374
3373
  element.setAttribute("dir", dir);
@@ -3518,7 +3517,7 @@
3518
3517
  MultiLingualHtmlEditorComponent.decorators = [
3519
3518
  { type: i0.Component, args: [{
3520
3519
  selector: 'BBSF-MultiLingualHtmlEditor',
3521
- template: "\r\n<div [formGroup]=\"group\">\r\n <div class=\"bbsf-control form-group bbsf-multilang-htmleditor mb-0\" [[formGroup]=\"MultilingualHtmlEditorgroup\">\r\n <div class=\"row\">\r\n <!--English htmleditor-->\r\n <div [ngClass] =\"ShowArabicHtmlEditor? 'col-md-6' : 'col-md-12'\" *ngIf=\"ShowEnglishHtmlEditor\" class=\" bbsf-multilang-form-group\">\r\n <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n <!--label-->\r\n <label class=\"bbsf-label {{options.LabelExtraClasses}}\" [hidden]=\"options.IsHideEnglishLabel\">\r\n {{(options.EnglishLabelValue!=null&&options.EnglishLabelValue!=\"\")?options.EnglishLabelValue:options.LabelValue+\"in English\"}}\r\n <!--Asterisk-->\r\n <span *ngIf=\"((options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)&&IsShowAsteriskInEnglish)\" class=\"text-danger\">*</span>\r\n </label>\r\n <div class=\"bbsf-input-container\">\r\n <!--input-->\r\n <angular-editor class=\"{{options.ExtraClasses_EN}}\" (change)=\"onTextChange('en')\" [class.is-invalid]=\"EnglishHtmlEditorFormControl.invalid && EnglishHtmlEditorFormControl.touched\"\r\n formControlName=\"English\" [config]=\"editorEnglishConfig\"></angular-editor>\r\n </div>\r\n </div>\r\n <div class=\"subtext-container\">\r\n <!-- LabelDescription-->\r\n <div class=\"bbsf-control-desc\" *ngIf=\"(options.LabelDescription!=null&&options.LabelDescription!='') ||(options.EnglishLabelDescription!=null&&options.EnglishLabelDescription!='')\">\r\n {{(options.EnglishLabelDescription!=null&&options.EnglishLabelDescription!=\"\")?options.EnglishLabelDescription:options.LabelDescription}}\r\n </div>\r\n <!-- requiredText-->\r\n <div class=\"bbsf-validation\" *ngIf=\"(EnglishHtmlEditorFormControl.invalid && EnglishHtmlEditorFormControl.touched)\">\r\n {{getErrorValidation(EnglishHtmlEditorFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n\r\n <!--Arabic htmleditor-->\r\n <div *ngIf=\"ShowArabicHtmlEditor\" [ngClass] =\"ShowEnglishHtmlEditor? 'col-md-6' : 'col-md-12'\" class=\"bbsf-multilang-form-group\">\r\n <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n <!--label-->\r\n <label class=\"bbsf-label {{options.LabelExtraClasses}}\" [hidden]=\"options.IsHideArabicLabel\">\r\n {{(options.ArabicLabelValue!=null&&options.ArabicLabelValue!=\"\")?options.ArabicLabelValue:options.LabelValue+\"in Arabic\"}}\r\n <!--Asterisk-->\r\n <span *ngIf=\"((options.ShowAsterisk&&options.IsRequired)||(options.IsRequired))&&IsShowAsteriskInArabic\" class=\"text-danger\">*</span>\r\n </label>\r\n <div class=\"bbsf-input-container\">\r\n <!--input-->\r\n <angular-editor dir=\"rtl\" class=\"{{options.ExtraClasses_AR}} \" (change)=\"onTextChange('ar')\" [class.is-invalid]=\"ArabicHtmlEditorFormControl.invalid && ArabicHtmlEditorFormControl.touched\"\r\n formControlName=\"Arabic\" [config]=\"editorArabicConfig\"></angular-editor>\r\n </div>\r\n </div>\r\n <div class=\"subtext-container\">\r\n <!-- LabelDescription-->\r\n <div class=\"bbsf-control-desc\" *ngIf=\"(options.LabelDescription!=null&&options.LabelDescription!='')||(options.ArabicLabelDescription!=null&&options.ArabicLabelDescription!='')\">\r\n {{(options.ArabicLabelDescription!=null&&options.ArabicLabelDescription!=\"\")?options.ArabicLabelDescription:options.LabelDescription}}\r\n </div>\r\n <!-- requiredText-->\r\n <div class=\"bbsf-validation\" *ngIf=\"(ArabicHtmlEditorFormControl.invalid && ArabicHtmlEditorFormControl.touched)\">\r\n {{getErrorValidation(ArabicHtmlEditorFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n"
3520
+ template: "\r\n<div [formGroup]=\"group\">\r\n <div class=\"bbsf-control form-group bbsf-multilang-htmleditor mb-0\" [formGroup]=\"MultilingualHtmlEditorgroup\">\r\n <div class=\"row\">\r\n <!--English htmleditor-->\r\n <div [ngClass] =\"ShowArabicHtmlEditor? 'col-md-6' : 'col-md-12'\" *ngIf=\"ShowEnglishHtmlEditor\" class=\" bbsf-multilang-form-group\">\r\n <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n <!--label-->\r\n <label class=\"bbsf-label {{options.LabelExtraClasses}}\" [hidden]=\"options.IsHideEnglishLabel\">\r\n {{(options.EnglishLabelValue!=null&&options.EnglishLabelValue!=\"\")?options.EnglishLabelValue:options.LabelValue+\"in English\"}}\r\n <!--Asterisk-->\r\n <span *ngIf=\"((options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)&&IsShowAsteriskInEnglish)\" class=\"text-danger\">*</span>\r\n </label>\r\n <div class=\"bbsf-input-container\">\r\n <!--input-->\r\n <angular-editor class=\"{{options.ExtraClasses_EN}}\" (change)=\"onTextChange('en')\" [class.is-invalid]=\"EnglishHtmlEditorFormControl.invalid && EnglishHtmlEditorFormControl.touched\"\r\n formControlName=\"English\" [config]=\"editorEnglishConfig\"></angular-editor>\r\n </div>\r\n </div>\r\n <div class=\"subtext-container\">\r\n <!-- LabelDescription-->\r\n <div class=\"bbsf-control-desc\" *ngIf=\"(options.LabelDescription!=null&&options.LabelDescription!='') ||(options.EnglishLabelDescription!=null&&options.EnglishLabelDescription!='')\">\r\n {{(options.EnglishLabelDescription!=null&&options.EnglishLabelDescription!=\"\")?options.EnglishLabelDescription:options.LabelDescription}}\r\n </div>\r\n <!-- requiredText-->\r\n <div class=\"bbsf-validation\" *ngIf=\"(EnglishHtmlEditorFormControl.invalid && EnglishHtmlEditorFormControl.touched)\">\r\n {{getErrorValidation(EnglishHtmlEditorFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n\r\n <!--Arabic htmleditor-->\r\n <div *ngIf=\"ShowArabicHtmlEditor\" [ngClass] =\"ShowEnglishHtmlEditor? 'col-md-6' : 'col-md-12'\" class=\"bbsf-multilang-form-group\">\r\n <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n <!--label-->\r\n <label class=\"bbsf-label {{options.LabelExtraClasses}}\" [hidden]=\"options.IsHideArabicLabel\">\r\n {{(options.ArabicLabelValue!=null&&options.ArabicLabelValue!=\"\")?options.ArabicLabelValue:options.LabelValue+\"in Arabic\"}}\r\n <!--Asterisk-->\r\n <span *ngIf=\"((options.ShowAsterisk&&options.IsRequired)||(options.IsRequired))&&IsShowAsteriskInArabic\" class=\"text-danger\">*</span>\r\n </label>\r\n <div class=\"bbsf-input-container\">\r\n <!--input-->\r\n <angular-editor dir=\"rtl\" class=\"{{options.ExtraClasses_AR}} \" (change)=\"onTextChange('ar')\" [class.is-invalid]=\"ArabicHtmlEditorFormControl.invalid && ArabicHtmlEditorFormControl.touched\"\r\n formControlName=\"Arabic\" [config]=\"editorArabicConfig\"></angular-editor>\r\n </div>\r\n </div>\r\n <div class=\"subtext-container\">\r\n <!-- LabelDescription-->\r\n <div class=\"bbsf-control-desc\" *ngIf=\"(options.LabelDescription!=null&&options.LabelDescription!='')||(options.ArabicLabelDescription!=null&&options.ArabicLabelDescription!='')\">\r\n {{(options.ArabicLabelDescription!=null&&options.ArabicLabelDescription!=\"\")?options.ArabicLabelDescription:options.LabelDescription}}\r\n </div>\r\n <!-- requiredText-->\r\n <div class=\"bbsf-validation\" *ngIf=\"(ArabicHtmlEditorFormControl.invalid && ArabicHtmlEditorFormControl.touched)\">\r\n {{getErrorValidation(ArabicHtmlEditorFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n"
3522
3521
  },] }
3523
3522
  ];
3524
3523
  MultiLingualHtmlEditorComponent.ctorParameters = function () { return [
@@ -3867,7 +3866,7 @@
3867
3866
  ImageUploaderComponent.decorators = [
3868
3867
  { type: i0.Component, args: [{
3869
3868
  selector: 'BBSF-ImageUpload',
3870
- template: "<div class=\"form-group bbsf-control bbsf-image-upload\" [formGroup]=\"group\">\r\n <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n <!--label-->\r\n <label [hidden]=\"options.HideLabel\" class=\"bbsf-label {{options.LabelExtraClasses}}\">\r\n {{options.LabelValue}}\r\n <!--Asterisk-->\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger\">*</span>\r\n </label>\r\n <!--Allow dropZone-->\r\n <div *ngIf=\"options.AllowDropZone\" class=\"bbsf-input-container {{options.ExtraClasses}}\"\r\n ngx-dropzone\r\n [disabled]=\"options.IsDisabled\"\r\n [accept]=\"AcceptedType\"\r\n [multiple]=\"options.IsMultiple\"\r\n (change)=\"onFileChange($event)\"\r\n ngDefaultControl\r\n formControlName=\"{{options.Name}}\"\r\n [maxFileSize]=\"maxFileSize\"\r\n id=\"{{options.Name}}\"\r\n [class.is-invalid]=\"ImageUploadFormControl.invalid && ImageUploadFormControl.touched\">\r\n <ngx-dropzone-label class=\"dropzone-label\">\r\n <img *ngIf=\"ImageSource\" [src]=\"ImageSource\" style=\"align-items: center;border-radius: 5px;display: flex;height: 100px;justify-content: center;margin: 10px;max-width: 180px;min-height: 100px;min-width: 180px;padding: 0px 20px;position: relative;\" />\r\n <div class=\"svg-and-validation\" *ngIf=\"!ImageSource\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" style=\"width: 50px; height: 50px;\">\r\n <path opacity=\"0.3\" d=\"M5 16C3.3 16 2 14.7 2 13C2 11.3 3.3 10 5 10H5.1C5 9.7 5 9.3 5 9C5 6.2 7.2 4 10 4C11.9 4 13.5 5 14.3 6.5C14.8 6.2 15.4 6 16 6C17.7 6 19 7.3 19 9C19 9.4 18.9 9.7 18.8 10C18.9 10 18.9 10 19 10C20.7 10 22 11.3 22 13C22 14.7 20.7 16 19 16H5ZM8 13.6H16L12.7 10.3C12.3 9.89999 11.7 9.89999 11.3 10.3L8 13.6Z\" fill=\"currentColor\" style=\"fill: #a1a1a1;\"></path>\r\n <path d=\"M11 13.6V19C11 19.6 11.4 20 12 20C12.6 20 13 19.6 13 19V13.6H11Z\" fill=\"currentColor\" style=\"fill: #989898;\"></path>\r\n </svg>\r\n <!--Validation text-->\r\n <div class=\"bbsf-validation-msg\" *ngIf=\"ValidationMessage\" [innerHTML]=\"ValidationMessage\"></div>\r\n </div>\r\n </ngx-dropzone-label>\r\n <ngx-dropzone-image-preview class=\"dropzone-preview\" *ngFor=\"let f of files\" [file]=\"f\" [removable]=\"true\" (removed)=\"removeFromControlValue(f)\" ngProjectAs=\"ngx-dropzone-preview\">\r\n </ngx-dropzone-image-preview>\r\n </div>\r\n <!--Not allowed dropZone-->\r\n <div *ngIf=\"!options.AllowDropZone\">\r\n <ngx-dropzone-label *ngIf=\"files.length==0\">\r\n <div #element (click)=\"showImageUploader(element)\">\r\n <img [src]=\"ImageSource\" />\r\n </div>\r\n </ngx-dropzone-label>\r\n <div class=\"d-none {{options.ExtraClasses}}\"\r\n ngx-dropzone\r\n [disabled]=\"options.IsDisabled\"\r\n [accept]=\"AcceptedType\"\r\n [multiple]=\"options.IsMultiple\"\r\n (change)=\"onFileChange($event)\"\r\n ngDefaultControl\r\n formControlName=\"{{options.Name}}\"\r\n [maxFileSize]=\"maxFileSize\"\r\n id=\"{{options.Name}}\"\r\n [class.is-invalid]=\"ImageUploadFormControl.invalid && ImageUploadFormControl.touched\">\r\n </div>\r\n <ngx-dropzone-image-preview *ngFor=\"let f of files\" [file]=\"f\" [removable]=\"true\" (removed)=\"removeFromControlValue(f)\" ngProjectAs=\"ngx-dropzone-preview\">\r\n </ngx-dropzone-image-preview>\r\n <!--Validation text-->\r\n <div class=\"bbsf-validation-msg\" *ngIf=\"ValidationMessage\" [innerHTML]=\"ValidationMessage\"></div>\r\n </div>\r\n </div>\r\n <div class=\"subtext-container\">\r\n <!-- required text-->\r\n <div class=\"bbsf-validation\"\r\n *ngIf=\"(ImageUploadFormControl.invalid && ImageUploadFormControl.touched)\">\r\n {{getErrorValidation(ImageUploadFormControl.errors|keyvalue)}}\r\n </div>\r\n\r\n <!-- LabelDescription-->\r\n <div class=\"bbsf-control-desc\" *ngIf=\"options.LabelDescription!=null\">{{options.LabelDescription}}</div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n </div>\r\n <!-- image cropper modal-->\r\n <div id=\"mdlSample\" class=\"modal bbsf-cropper-modal\" role=\"dialog\" [ngStyle]=\"{'display': mdlSampleIsOpen ? 'block' : 'none', 'opacity': 1}\">\r\n <div class=\"modal-dialog modal-lg\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">\r\n {{UtilityService.getResourceValue(\"CropImage\")}}\r\n </h4>\r\n <button type=\"button\" class=\"btn-close\" data-dismiss=\"modal\" (click)=\"openModal(false)\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div *ngIf=\"imageUrl\">\r\n <angular-cropper #angularCropper [cropperOptions]=\"config\" [imageUrl]=\"imageUrl\">\r\n </angular-cropper>\r\n <img [src]=\"imgwUrl\" />\r\n </div>\r\n <div class=\"cropper-btns\">\r\n <div class=\"btn-group\">\r\n <button type=\"button\" (click)=\"zoomImage(0.1)\" class=\"btn btn-default\" ngbTooltip=\"Zoom in\">\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-search-plus\"></span>\r\n </span>\r\n </button>\r\n <button type=\"button\" (click)=\"zoomImage(-0.1)\" class=\"btn btn-default\" ngbTooltip=\"Zoom out\">\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-search-minus\"></span>\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"btn-group\">\r\n <button type=\"button\" (click)=\"moveImage(-10,0)\" class=\"btn btn-default\" ngbTooltip=\"Move left\">\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-arrow-left\"></span>\r\n </span>\r\n </button>\r\n <button type=\"button\" (click)=\"moveImage(10,0)\" class=\"btn btn-default\" ngbTooltip=\"Move right\">\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-arrow-right\"></span>\r\n </span>\r\n </button>\r\n <button type=\"button\" (click)=\"moveImage(0,-10)\" class=\"btn btn-default\" ngbTooltip=\"Move up\">\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-arrow-up\"></span>\r\n </span>\r\n </button>\r\n <button type=\"button\" (click)=\"moveImage(0,10)\" class=\"btn btn-default\" ngbTooltip=\"Move down\">\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-arrow-down\"></span>\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"btn-group\">\r\n <button type=\"button\" (click)=\"rotateImage(-45)\" class=\"btn btn-default\" ngbTooltip=\"Rotate left\">\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-undo-alt\"></span>\r\n </span>\r\n </button>\r\n <button type=\"button\" (click)=\"rotateImage(45)\" class=\"btn btn-default\" ngbTooltip=\"Rotate right\">\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-redo-alt\"></span>\r\n </span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\" align=\"right\">\r\n <button type=\"button\" id=\"btnClose\" class=\"btn btn-sm btn-light\" (click)=\"openModal(false)\">\r\n {{UtilityService.getResourceValue(\"CancelLabel\")}}\r\n </button>\r\n <button type=\"button\" (click)=\"cropImage()\" id=\"btnOK\" class=\"btn btn-sm btn-brand\">\r\n {{UtilityService.getResourceValue(\"Crop\")}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n"
3869
+ template: "<div class=\"form-group bbsf-control bbsf-image-upload\" [formGroup]=\"group\">\r\n <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n <!--label-->\r\n <label [hidden]=\"options.HideLabel\" class=\"bbsf-label {{options.LabelExtraClasses}}\">\r\n {{options.LabelValue}}\r\n <!--Asterisk-->\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger\">*</span>\r\n </label>\r\n <!--Allow dropZone-->\r\n <div *ngIf=\"options.AllowDropZone\" class=\"bbsf-input-container {{options.ExtraClasses}}\"\r\n ngx-dropzone\r\n [disabled]=\"options.IsDisabled\"\r\n [accept]=\"AcceptedType\"\r\n [multiple]=\"options.IsMultiple\"\r\n (change)=\"onFileChange($event)\"\r\n ngDefaultControl\r\n formControlName=\"{{options.Name}}\"\r\n [maxFileSize]=\"maxFileSize\"\r\n id=\"{{options.Name}}\"\r\n [class.is-invalid]=\"ImageUploadFormControl.invalid && ImageUploadFormControl.touched\">\r\n <ngx-dropzone-label class=\"dropzone-label\">\r\n <img *ngIf=\"ImageSource\" [src]=\"ImageSource\" style=\"align-items: center;border-radius: 5px;display: flex;height: 100px;justify-content: center;margin: 10px;max-width: 180px;min-height: 100px;min-width: 180px;padding: 0px 20px;position: relative;\" />\r\n <div class=\"svg-and-validation\" *ngIf=\"!ImageSource\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" style=\"width: 50px; height: 50px;\">\r\n <path opacity=\"0.3\" d=\"M5 16C3.3 16 2 14.7 2 13C2 11.3 3.3 10 5 10H5.1C5 9.7 5 9.3 5 9C5 6.2 7.2 4 10 4C11.9 4 13.5 5 14.3 6.5C14.8 6.2 15.4 6 16 6C17.7 6 19 7.3 19 9C19 9.4 18.9 9.7 18.8 10C18.9 10 18.9 10 19 10C20.7 10 22 11.3 22 13C22 14.7 20.7 16 19 16H5ZM8 13.6H16L12.7 10.3C12.3 9.89999 11.7 9.89999 11.3 10.3L8 13.6Z\" fill=\"currentColor\" style=\"fill: #a1a1a1;\"></path>\r\n <path d=\"M11 13.6V19C11 19.6 11.4 20 12 20C12.6 20 13 19.6 13 19V13.6H11Z\" fill=\"currentColor\" style=\"fill: #989898;\"></path>\r\n </svg>\r\n <!--Validation text-->\r\n <div class=\"bbsf-validation-msg\" *ngIf=\"ValidationMessage\" [innerHTML]=\"ValidationMessage\"></div>\r\n </div>\r\n </ngx-dropzone-label>\r\n <ngx-dropzone-image-preview class=\"dropzone-preview\" *ngFor=\"let f of files\" [file]=\"f\" [removable]=\"true\" (removed)=\"removeFromControlValue(f)\" ngProjectAs=\"ngx-dropzone-preview\">\r\n </ngx-dropzone-image-preview>\r\n </div>\r\n <!--Not allowed dropZone-->\r\n <div *ngIf=\"!options.AllowDropZone\">\r\n <ngx-dropzone-label *ngIf=\"files.length==0\">\r\n <div #element (click)=\"showImageUploader(element)\">\r\n <img [src]=\"ImageSource\" />\r\n </div>\r\n </ngx-dropzone-label>\r\n <div class=\"d-none {{options.ExtraClasses}}\"\r\n ngx-dropzone\r\n [disabled]=\"options.IsDisabled\"\r\n [accept]=\"AcceptedType\"\r\n [multiple]=\"options.IsMultiple\"\r\n (change)=\"onFileChange($event)\"\r\n ngDefaultControl\r\n formControlName=\"{{options.Name}}\"\r\n [maxFileSize]=\"maxFileSize\"\r\n id=\"{{options.Name}}\"\r\n [class.is-invalid]=\"ImageUploadFormControl.invalid && ImageUploadFormControl.touched\">\r\n </div>\r\n <ngx-dropzone-image-preview *ngFor=\"let f of files\" [file]=\"f\" [removable]=\"true\" (removed)=\"removeFromControlValue(f)\" ngProjectAs=\"ngx-dropzone-preview\">\r\n </ngx-dropzone-image-preview>\r\n <!--Validation text-->\r\n <div class=\"bbsf-validation-msg\" *ngIf=\"ValidationMessage\" [innerHTML]=\"ValidationMessage\"></div>\r\n </div>\r\n </div>\r\n <div class=\"subtext-container\">\r\n <!-- required text-->\r\n <div class=\"bbsf-validation\"\r\n *ngIf=\"(ImageUploadFormControl.invalid && ImageUploadFormControl.touched)\">\r\n {{getErrorValidation(ImageUploadFormControl.errors|keyvalue)}}\r\n </div>\r\n\r\n <!-- LabelDescription-->\r\n <div class=\"bbsf-control-desc\" *ngIf=\"options.LabelDescription!=null\">{{options.LabelDescription}}</div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n </div>\r\n <!-- image cropper modal-->\r\n <div id=\"mdlSample\" class=\"modal bbsf-cropper-modal\" role=\"dialog\" [ngStyle]=\"{'display': mdlSampleIsOpen ? 'block' : 'none', 'opacity': 1}\">\r\n <div class=\"modal-dialog modal-lg\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h4 class=\"modal-title\">\r\n {{UtilityService.getResourceValue(\"CropImage\")}}\r\n </h4>\r\n <button type=\"button\" class=\"btn-close\" data-dismiss=\"modal\" (click)=\"openModal(false)\"></button>\r\n </div>\r\n <div class=\"modal-body\">\r\n <div *ngIf=\"imageUrl\">\r\n <angular-cropper #angularCropper [cropperOptions]=\"config\" [imageUrl]=\"imageUrl\">\r\n </angular-cropper>\r\n <img [src]=\"imgwUrl\" />\r\n </div>\r\n <div class=\"cropper-btns\">\r\n <div class=\"btn-group\">\r\n <button type=\"button\" (click)=\"zoomImage(0.1)\" class=\"btn btn-default\" ngbTooltip='{{UtilityService.getResourceValue(\"ZoomIn\")}}'>\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-search-plus\"></span>\r\n </span>\r\n </button>\r\n <button type=\"button\" (click)=\"zoomImage(-0.1)\" class=\"btn btn-default\" ngbTooltip='{{UtilityService.getResourceValue(\"ZoomOut\")}}'>\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-search-minus\"></span>\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"btn-group\">\r\n <button type=\"button\" (click)=\"moveImage(-10,0)\" class=\"btn btn-default\" ngbTooltip='{{UtilityService.getResourceValue(\"MoveLeft\")}}'>\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-arrow-left\"></span>\r\n </span>\r\n </button>\r\n <button type=\"button\" (click)=\"moveImage(10,0)\" class=\"btn btn-default\" ngbTooltip='{{UtilityService.getResourceValue(\"MoveRight\")}}'>\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-arrow-right\"></span>\r\n </span>\r\n </button>\r\n <button type=\"button\" (click)=\"moveImage(0,-10)\" class=\"btn btn-default\" ngbTooltip='{{UtilityService.getResourceValue(\"MoveUp\")}}'>\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-arrow-up\"></span>\r\n </span>\r\n </button>\r\n <button type=\"button\" (click)=\"moveImage(0,10)\" class=\"btn btn-default\" ngbTooltip='{{UtilityService.getResourceValue(\"MoveDown\")}}'>\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-arrow-down\"></span>\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"btn-group\">\r\n <button type=\"button\" (click)=\"rotateImage(-45)\" class=\"btn btn-default\" ngbTooltip='{{UtilityService.getResourceValue(\"RotateLeft\")}}'>\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-undo-alt\"></span>\r\n </span>\r\n </button>\r\n <button type=\"button\" (click)=\"rotateImage(45)\" class=\"btn btn-default\" ngbTooltip='{{UtilityService.getResourceValue(\"RotateRight\")}}'>\r\n <span class=\"docs-tooltip\">\r\n <span class=\"fa fa-redo-alt\"></span>\r\n </span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-footer\" align=\"right\">\r\n <button type=\"button\" id=\"btnClose\" class=\"btn btn-sm btn-light\" (click)=\"openModal(false)\">\r\n {{UtilityService.getResourceValue(\"CancelLabel\")}}\r\n </button>\r\n <button type=\"button\" (click)=\"cropImage()\" id=\"btnOK\" class=\"btn btn-sm btn-brand\">\r\n {{UtilityService.getResourceValue(\"Crop\")}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n"
3871
3870
  },] }
3872
3871
  ];
3873
3872
  ImageUploaderComponent.ctorParameters = function () { return [
@@ -5579,7 +5578,7 @@
5579
5578
  TextboxComponent.decorators = [
5580
5579
  { type: i0.Component, args: [{
5581
5580
  selector: 'BBSF-TextBox',
5582
- template: "<div class=\"form-group bbsf-control bbsf-textbox\" [formGroup]=\"group\">\r\n <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n <!--label-->\r\n <label *ngIf=\"!options.HideLabel\" class=\"bbsf-label {{options.LabelExtraClasses}}\">\r\n {{options.LabelValue}}\r\n <!--Asterisk-->\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger\">*</span>\r\n </label>\r\n <!--MaskPattern-->\r\n <div *ngIf=\"MaskPattern!=null&&MaskPattern!=''\" class=\"bbsf-input-container\" [ngClass]=\"options.EnableCopyToClipboard? 'p-40px' : '' \">\r\n <!--Icon-->\r\n <div *ngIf=\"options.Icon!=null\" class=\"svg svg-icon-grey bbsf-icon\" [ngClass]=\"(options.IconPosition==1)?'bbsf-left-icon':'bbsf-right-icon'\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <!--input-->\r\n <input class=\"form-control {{options.ExtraClasses}}\"\r\n [mask]=\"MaskPattern\" placeHolderCharacter=\" \" [showMaskTyped]=\"true\" [validation]=\"true\"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n aria-describedby=\"email-error\" aria-invalid=\"true\" formControlName=\"{{options.Name}}\"\r\n type=\"{{getInputType(options.Type)}}\" [(ngModel)]=\"options.Value\"\r\n [class.is-invalid]=\"TextBoxFormControl.invalid && TextBoxFormControl.touched\"\r\n placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\" autocomplete=\"{{options.AutoComplete}}\"\r\n (change)=\"trimControlValue()\" (keyup)=\"onTextChange()\" [readonly]=\"options.IsReadonly\"\r\n (keydown)=\"WordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n #userinput>\r\n <!--CopyToClipboard-->\r\n <div class=\"copy-clipboard\" *ngIf=\"options.EnableCopyToClipboard\" (click)=\"copyInputMessage(userinput)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </div>\r\n </div>\r\n <!--NoMaskPattern-->\r\n <div *ngIf=\"MaskPattern==null||MaskPattern==''\" class=\"bbsf-input-container\" [ngClass]=\"options.EnableCopyToClipboard? 'p-40px' : '' \">\r\n <!--Icon-->\r\n <div class=\"svg svg-icon-grey bbsf-icon\" [ngClass]=\"(options.IconPosition==1)?'bbsf-left-icon':'bbsf-right-icon'\" *ngIf=\"options.Icon!=null\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <!--input-->\r\n <input class=\"form-control {{options.ExtraClasses}} \"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n (focus)=\"onFocus(true)\" (focusout)=\"onFocus(false)\"\r\n maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n aria-describedby=\"email-error\"\r\n aria-invalid=\"true\" formControlName=\"{{options.Name}}\" type=\"{{getInputType(options.Type)}}\"\r\n [class.is-invalid]=\"TextBoxFormControl.invalid && TextBoxFormControl.touched\"\r\n placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\" autocomplete=\"{{options.AutoComplete}}\"\r\n (change)=\"trimControlValue()\" (keyup)=\"onTextChange()\" [(ngModel)]=\"options.Value\"\r\n (keydown)=\"WordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\" [readonly]=\"options.IsReadonly\"\r\n #userinput>\r\n <!--CopyToClipboard-->\r\n <span class=\"copy-clipboard\" *ngIf=\"options.EnableCopyToClipboard\" (click)=\"copyInputMessage(userinput)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n\r\n </div>\r\n </div>\r\n <div class=\"subtext-container\">\r\n <!--wordCount-->\r\n <div class=\"bbsf-word-count\" *ngIf=\"options.MaxWordCount>0&&IsShowWordCount\">{{WordCount}}/{{options.MaxWordCount}} Words</div>\r\n <!-- CharsLimitMsg-->\r\n <div class=\"bbsf-character-count\" *ngIf=\"showCharsLimitMsg\" [ngClass]=\"{'badge-light-warning': charsLimitMsgClass === 'warning', 'badge-light-danger' : charsLimitMsgClass === 'danger' }\">\r\n {{maxLimitWarningMsg}}\r\n </div>\r\n <!-- LabelDescription-->\r\n <div class=\"bbsf-control-desc\" *ngIf=\"options.LabelDescription!=null\">{{options.LabelDescription}}</div>\r\n <!-- requiredText-->\r\n <div class=\"bbsf-validation\" dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n *ngIf=\"(TextBoxFormControl.invalid && TextBoxFormControl.touched)\">\r\n {{getErrorValidation(TextBoxFormControl.errors|keyvalue)}}\r\n </div>\r\n </div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty)\">{{resetError()}}</div>\r\n</div>\r\n"
5581
+ template: "<div class=\"form-group bbsf-control bbsf-textbox\" [formGroup]=\"group\">\r\n <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n <!--label-->\r\n <label *ngIf=\"!options.HideLabel\" class=\"bbsf-label {{options.LabelExtraClasses}}\">\r\n {{options.LabelValue}}\r\n <!--Asterisk-->\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger\">*</span>\r\n </label>\r\n <!--MaskPattern-->\r\n <div *ngIf=\"MaskPattern!=null&&MaskPattern!=''\" class=\"bbsf-input-container\" [ngClass]=\"options.EnableCopyToClipboard? 'p-40px' : '' \">\r\n <!--Icon-->\r\n <div *ngIf=\"options.Icon!=null\" class=\"svg svg-icon-grey bbsf-icon\" [ngClass]=\"(options.IconPosition==1)?'bbsf-left-icon':'bbsf-right-icon'\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <!--input-->\r\n <input class=\"form-control {{options.ExtraClasses}}\"\r\n [mask]=\"MaskPattern\" placeHolderCharacter=\" \" [showMaskTyped]=\"true\" [validation]=\"true\"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n aria-describedby=\"email-error\" aria-invalid=\"true\" formControlName=\"{{options.Name}}\"\r\n type=\"{{getInputType(options.Type)}}\" [(ngModel)]=\"options.Value\"\r\n [class.is-invalid]=\"TextBoxFormControl.invalid && TextBoxFormControl.touched\"\r\n placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\" autocomplete=\"{{options.AutoComplete}}\"\r\n (change)=\"trimControlValue()\" (keyup)=\"onTextChange()\" [readonly]=\"options.IsReadonly\"\r\n (keydown)=\"WordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n #userinput>\r\n <!--CopyToClipboard-->\r\n <span class=\"copy-clipboard\" ngbTooltip=\"Copied!\" *ngIf=\"options.EnableCopyToClipboard\" (click)=\"copyInputMessage(userinput)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n </div>\r\n <!--NoMaskPattern-->\r\n <div *ngIf=\"MaskPattern==null||MaskPattern==''\" class=\"bbsf-input-container\" [ngClass]=\"options.EnableCopyToClipboard? 'p-40px' : '' \">\r\n <!--Icon-->\r\n <div class=\"svg svg-icon-grey bbsf-icon\" [ngClass]=\"(options.IconPosition==1)?'bbsf-left-icon':'bbsf-right-icon'\" *ngIf=\"options.Icon!=null\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <!--input-->\r\n <input class=\"form-control {{options.ExtraClasses}} \"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n (focus)=\"onFocus(true)\" (focusout)=\"onFocus(false)\"\r\n maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n aria-describedby=\"email-error\"\r\n aria-invalid=\"true\" formControlName=\"{{options.Name}}\" type=\"{{getInputType(options.Type)}}\"\r\n [class.is-invalid]=\"TextBoxFormControl.invalid && TextBoxFormControl.touched\"\r\n placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\" autocomplete=\"{{options.AutoComplete}}\"\r\n (change)=\"trimControlValue()\" (keyup)=\"onTextChange()\" [(ngModel)]=\"options.Value\"\r\n (keydown)=\"WordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\" [readonly]=\"options.IsReadonly\"\r\n #userinput>\r\n <!--CopyToClipboard-->\r\n <span class=\"copy-clipboard\" ngbTooltip=\"Copied!\" triggers=\"click:blur\" *ngIf=\"options.EnableCopyToClipboard\" (click)=\"copyInputMessage(userinput)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"subtext-container\">\r\n <!--wordCount-->\r\n <div class=\"bbsf-word-count\" *ngIf=\"options.MaxWordCount>0&&IsShowWordCount\">{{WordCount}}/{{options.MaxWordCount}} Words</div>\r\n <!-- CharsLimitMsg-->\r\n <div class=\"bbsf-character-count\" *ngIf=\"showCharsLimitMsg\" [ngClass]=\"{'badge-light-warning': charsLimitMsgClass === 'warning', 'badge-light-danger' : charsLimitMsgClass === 'danger' }\">\r\n {{maxLimitWarningMsg}}\r\n </div>\r\n <!-- LabelDescription-->\r\n <div class=\"bbsf-control-desc\" *ngIf=\"options.LabelDescription!=null\">{{options.LabelDescription}}</div>\r\n <!-- requiredText-->\r\n <div class=\"bbsf-validation\" dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n *ngIf=\"(TextBoxFormControl.invalid && TextBoxFormControl.touched)\">\r\n {{getErrorValidation(TextBoxFormControl.errors|keyvalue)}}\r\n </div>\r\n </div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty)\">{{resetError()}}</div>\r\n</div>\r\n"
5583
5582
  },] }
5584
5583
  ];
5585
5584
  TextboxComponent.ctorParameters = function () { return [
@@ -7586,7 +7585,7 @@
7586
7585
  RepeaterTableComponent.decorators = [
7587
7586
  { type: i0.Component, args: [{
7588
7587
  selector: 'BBSF-repeater-table',
7589
- template: "<div class=\"form-group bbsf-control bbsf-repeater\">\r\n <!--table-->\r\n <table class=\"bbsf-repeater-table table {{options.RepeaterTableExtraClasses}}\">\r\n <thead class=\"table-head\">\r\n <tr class=\"{{options.RepeaterTableRowExtraClasses}}\">\r\n <th *ngFor=\"let item of options.RepeaterStructure\" [hidden]=\"item.IsHiddenInput\">{{item.HeaderTitle}}</th>\r\n <th *ngIf=\"!options.DisableDeleteButton\" class=\"text-center\">{{utilityService.getResourceValue(options.ActionLabelKey)}}</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"table-body\">\r\n <tr *ngFor=\"let item of items ; index as i\">\r\n <td *ngFor=\"let RepeaterField of options.RepeaterStructure ; index as r\" [hidden]=\"RepeaterField.IsHiddenInput\">\r\n <repeater-field-builder [RepeaterField]=\"RepeaterField\" [itemNumber]=\"i\"\r\n [itemsValue]=\"originalItems\" [controlNumber]=\"r\" [group]=\"repeaterGroup\">\r\n </repeater-field-builder>\r\n </td>\r\n <td *ngIf=\"!options.DisableDeleteButton\" class=\"td-delete\">\r\n <button class=\"{{options.DeleteButtonExtraClasses}} btn btn-icon btn-sm btn-danger\" type=\"button\" (click)=\"deleteItem(i)\"\r\n [disabled]=\"(items.length ==options.MinRequiredItems&&options.IsRequired)\">\r\n <span [innerHTML]=\"options.DeleteButtonText\"></span>\r\n </button>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <!--add button-->\r\n <div class=\"repeater-add-btn\" *ngIf=\"!options.DisableAddButton\">\r\n <button class=\"{{options.AddButtonExtraClasses}} btn btn-sm btn-brand\" type=\"button\" (click)=\"addItem()\">\r\n <span [innerHTML]=\"options.AddButtonText\"></span>\r\n </button>\r\n </div>\r\n</div>\r\n\r\n\r\n"
7588
+ template: "<div class=\"form-group bbsf-control bbsf-repeater\">\r\n <!--table-->\r\n <div class=\"table-responsive\">\r\n <table class=\"bbsf-repeater-table table {{options.RepeaterTableExtraClasses}}\">\r\n <thead class=\"table-head\">\r\n <tr class=\"{{options.RepeaterTableRowExtraClasses}}\">\r\n <th *ngFor=\"let item of options.RepeaterStructure\" [hidden]=\"item.IsHiddenInput\">{{item.HeaderTitle}}</th>\r\n <th *ngIf=\"!options.DisableDeleteButton\" class=\"text-center\">{{utilityService.getResourceValue(options.ActionLabelKey)}}</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"table-body\">\r\n <tr *ngFor=\"let item of items ; index as i\">\r\n <td *ngFor=\"let RepeaterField of options.RepeaterStructure ; index as r\" [hidden]=\"RepeaterField.IsHiddenInput\">\r\n <repeater-field-builder [RepeaterField]=\"RepeaterField\" [itemNumber]=\"i\"\r\n [itemsValue]=\"originalItems\" [controlNumber]=\"r\" [group]=\"repeaterGroup\">\r\n </repeater-field-builder>\r\n </td>\r\n <td *ngIf=\"!options.DisableDeleteButton\" class=\"td-delete\">\r\n <button class=\"{{options.DeleteButtonExtraClasses}} btn btn-icon btn-sm btn-danger\" type=\"button\" (click)=\"deleteItem(i)\"\r\n [disabled]=\"(items.length ==options.MinRequiredItems&&options.IsRequired)\">\r\n <span [innerHTML]=\"options.DeleteButtonText\"></span>\r\n </button>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <!--add button-->\r\n <div class=\"repeater-add-btn\" *ngIf=\"!options.DisableAddButton\">\r\n <button class=\"{{options.AddButtonExtraClasses}} btn btn-sm btn-brand\" type=\"button\" (click)=\"addItem()\">\r\n <span [innerHTML]=\"options.AddButtonText\"></span>\r\n </button>\r\n </div>\r\n</div>\r\n\r\n\r\n"
7590
7589
  },] }
7591
7590
  ];
7592
7591
  RepeaterTableComponent.ctorParameters = function () { return [
@@ -7644,7 +7643,7 @@
7644
7643
 
7645
7644
  var noop = function () { };
7646
7645
  var ɵ0$1 = noop;
7647
- var TAGS_INPUT_TEMPLATE = "\n \n<div class=\"tags-input\">\n<span class=\"tags-input__tag label label-primary badge badge-primary\" *ngFor=\"let tag of tags\">\n\n<span [ngSwitch]=\"ViewMode\">\n<span *ngSwitchCase=\"tagInputViewEnum.WithImage\">\n<img style=\"border-radius:50%; height:40px; width: 40px; float:left; margin-left:5px ; margin-top: 5px;margin-right: 5px;\"\nsrc=\"{{(tag.imageURL?tag.imageURL:defaultImageURL)}}\" />\n</span>\n\n<span *ngSwitchCase=\"tagInputViewEnum.WithInitial\">\n<div class=\"user-initials\">{{calculateInitials(tag.name)}}</div>\n</span>\n\n<span *ngSwitchDefault>\n</span>\n\n</span>\n {{tag[displayField]}}\n <span *ngIf=\"isDeleteable(tag)\" role=\"button\" class=\"tags-input__tag-remove-btn\" (click)=\"removeTag(tag)\"\n (touch)=\"removeTag(tag)\">\n <span aria-hidden=\"true\">&times;</span>\n <span class=\"sr-only\">Close</span>\n </span>\n</span>\n\n<input *ngIf=\"options === null; else withTypeahead\" class=\"tags-input__input-field\" type=\"text\"\n [placeholder]=\"getPlaceholder()\" name=\"tags\" (keyup.enter)=\"addTag(tagInput)\"\n (keydown.backspace)=\"removeLastTag(tagInput)\" [disabled]=\"!canAddTags || maximumOfTagsReached()\"\n [hidden]=\"!canAddTags || maximumOfTagsReached()\" #tagInput />\n\n<ng-template #withTypeahead>\n <span [ngSwitch]=\"ViewMode\">\n <span *ngSwitchCase=\"tagInputViewEnum.WithImage\">\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithImage\" [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n <span *ngSwitchCase=\"tagInputViewEnum.WithoutImage\">\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithoutImage\"\n [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n <span *ngSwitchCase=\"tagInputViewEnum.WithInitial\">\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithoutInitial\"\n [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n <span *ngSwitchDefault>\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithoutImage\"\n [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n </span>\n\n</ng-template>\n\n<ng-template #itemTemplateWithImage let-model=\"item\" let-index=\"index\">\n <img\n style=\"border-radius:50%; height:40px; width: 40px; float:left; margin-left:5px ; margin-top: 5px;margin-right: 5px;\"\n src=\"{{(model.imageURL?model.imageURL:defaultImageURL)}}\" />\n <div>\n <a [innerHTML]=\"model.name\"></a>\n <p *ngIf=\"showDescription\">\n {{model.description}}\n </p>\n </div>\n</ng-template>\n\n<ng-template #itemTemplateWithoutImage let-model=\"item\" let-index=\"index\">\n <div>\n <a [innerHTML]=\"model.name\"></a>\n <p *ngIf=\"showDescription\">\n {{model.description}}\n </p>\n </div>\n</ng-template>\n\n<ng-template #itemTemplateWithoutInitial let-model=\"item\" let-index=\"index\">\n <div class=\"user-image\">\n <div class=\"user-initials\">{{calculateInitials(model.name)}}</div>\n </div>\n <div>\n <a [innerHTML]=\"model.name\"></a>\n <p *ngIf=\"showDescription\">\n {{model.description}}\n </p>\n </div>\n</ng-template>\n</div>\n";
7646
+ var TAGS_INPUT_TEMPLATE = "\n\n<div class=\"tags-input\">\n<span class=\"tags-input__tag label label-primary badge badge-primary\" *ngFor=\"let tag of tags\">\n\n<span [ngSwitch]=\"ViewMode\">\n<span *ngSwitchCase=\"tagInputViewEnum.WithImage\">\n<img style=\"border-radius:50%; height:40px; width: 40px; float:left; margin-left:5px ; margin-top: 5px;margin-right: 5px;\"\nsrc=\"{{(tag.image?tag.image:defaultImageURL)}}\" />\n</span>\n\n<span *ngSwitchCase=\"tagInputViewEnum.WithInitial\">\n<div class=\"user-initials\">{{calculateInitials(tag.value)}}</div>\n</span>\n\n<span *ngSwitchDefault>\n</span>\n\n</span>\n {{tag.value}}\n <span *ngIf=\"isDeleteable(tag)\" role=\"button\" class=\"tags-input__tag-remove-btn\" (click)=\"removeTag(tag)\"\n (touch)=\"removeTag(tag)\">\n <span aria-hidden=\"true\">&times;</span>\n <span class=\"sr-only\">Close</span>\n </span>\n</span>\n\n<input *ngIf=\"options === null; else withTypeahead\" class=\"tags-input__input-field\" type=\"text\"\n [placeholder]=\"getPlaceholder()\" name=\"tags\" (keyup.enter)=\"addTag(tagInput)\"\n (keydown.backspace)=\"removeLastTag(tagInput)\" [disabled]=\"!canAddTags || maximumOfTagsReached()\"\n [hidden]=\"!canAddTags || maximumOfTagsReached()\" #tagInput />\n\n<ng-template #withTypeahead>\n <span [ngSwitch]=\"ViewMode\">\n <span *ngSwitchCase=\"tagInputViewEnum.WithImage\">\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithImage\" [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n <span *ngSwitchCase=\"tagInputViewEnum.WithoutImage\">\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithoutImage\"\n [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n <span *ngSwitchCase=\"tagInputViewEnum.WithInitial\">\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithoutInitial\"\n [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n <span *ngSwitchDefault>\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithoutImage\"\n [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n </span>\n\n</ng-template>\n\n<ng-template #itemTemplateWithImage let-model=\"item\" let-index=\"index\">\n <img\n style=\"border-radius:50%; height:40px; width: 40px; float:left; margin-left:5px ; margin-top: 5px;margin-right: 5px;\"\n src=\"{{(model.image?model.image:defaultImageURL)}}\" />\n <div>\n <a [innerHTML]=\"model.value\"></a>\n <p *ngIf=\"showDescription\">\n {{model.description}}\n </p>\n </div>\n</ng-template>\n\n<ng-template #itemTemplateWithoutImage let-model=\"item\" let-index=\"index\">\n <div>\n <a [innerHTML]=\"model.value\"></a>\n <p *ngIf=\"showDescription\">\n {{model.description}}\n </p>\n </div>\n</ng-template>\n\n<ng-template #itemTemplateWithoutInitial let-model=\"item\" let-index=\"index\">\n <div class=\"user-image\">\n <div class=\"user-initials\">{{calculateInitials(model.value)}}</div>\n </div>\n <div>\n <a [innerHTML]=\"model.value\"></a>\n <p *ngIf=\"showDescription\">\n {{model.description}}\n </p>\n </div>\n</ng-template>\n</div>\n";
7648
7647
  var TAGS_INPUT_STYLE = "\n :host {\n overflow: auto;\n white-space: nowrap;\n }\n\n .tags-input {\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n }\n\n .tags-input__tag {\n display: inline-block;\n margin-bottom: 2px;\n margin-right: 5px;\n padding-right: 0.3em;\n }\n\n .tags-input__tag-remove-btn {\n cursor: pointer;\n display: inline-block;\n font-size: 12px;\n margin: -3px 0 0 3px;\n padding: 0;\n vertical-align: top;\n }\n\n .tags-input__input-field {\n border: none;\n flex-grow: 1;\n outline: none;\n }\n";
7649
7648
  var CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR = {
7650
7649
  provide: forms.NG_VALUE_ACCESSOR,