@bnsights/bbsf-controls 1.0.42 → 1.0.45

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.
Files changed (36) hide show
  1. package/README.md +13 -0
  2. package/bnsights-bbsf-controls-1.0.45.tgz +0 -0
  3. package/bnsights-bbsf-controls.metadata.json +1 -1
  4. package/bundles/bnsights-bbsf-controls.umd.js +125 -52
  5. package/bundles/bnsights-bbsf-controls.umd.js.map +1 -1
  6. package/esm2015/lib/Shared/Models/ControlOptionsBase.js +3 -1
  7. package/esm2015/lib/Shared/Models/DropdownOptions.js +1 -1
  8. package/esm2015/lib/Shared/Models/FileDTO.js +1 -1
  9. package/esm2015/lib/Shared/Models/MultilingualTextBoxOptions.js +3 -1
  10. package/esm2015/lib/Shared/Models/MultipleFileUploadModel.js +1 -1
  11. package/esm2015/lib/Shared/Models/PagingPayload.js +3 -0
  12. package/esm2015/lib/Shared/Models/TextBoxOptions.js +3 -3
  13. package/esm2015/lib/Shared/Models/datePickerOptions.js +3 -1
  14. package/esm2015/lib/Shared/services/render-component-service.service.js +13 -2
  15. package/esm2015/lib/controls/DateTimePicker/DateTimePicker.component.js +2 -2
  16. package/esm2015/lib/controls/DropdownList/DropdownList.component.js +4 -4
  17. package/esm2015/lib/controls/FileUplaod/FileUplaod.component.js +50 -33
  18. package/esm2015/lib/controls/Form/Form.component.js +10 -2
  19. package/esm2015/lib/controls/MultiLingualTextBox/MultiLingualTextBox.component.js +2 -2
  20. package/esm2015/lib/controls/Paging/Paging.component.js +41 -9
  21. package/esm2015/lib/controls/TagsInput/TagsInput.component.js +2 -2
  22. package/esm2015/lib/controls/Toggleslide/toggleslide.component.js +2 -5
  23. package/fesm2015/bnsights-bbsf-controls.js +123 -52
  24. package/fesm2015/bnsights-bbsf-controls.js.map +1 -1
  25. package/lib/Shared/Models/DropdownOptions.d.ts +1 -1
  26. package/lib/Shared/Models/FileDTO.d.ts +1 -1
  27. package/lib/Shared/Models/MultilingualTextBoxOptions.d.ts +2 -0
  28. package/lib/Shared/Models/MultipleFileUploadModel.d.ts +1 -1
  29. package/lib/Shared/Models/PagingPayload.d.ts +5 -0
  30. package/lib/Shared/Models/TextBoxOptions.d.ts +1 -1
  31. package/lib/Shared/services/render-component-service.service.d.ts +1 -1
  32. package/lib/controls/DropdownList/DropdownList.component.d.ts +2 -2
  33. package/lib/controls/FileUplaod/FileUplaod.component.d.ts +3 -0
  34. package/lib/controls/Form/Form.component.d.ts +4 -1
  35. package/lib/controls/Paging/Paging.component.d.ts +3 -0
  36. package/package.json +1 -1
@@ -556,7 +556,7 @@
556
556
  DateInputComponent.decorators = [
557
557
  { type: i0.Component, args: [{
558
558
  selector: 'BBSF-DateTimePicker',
559
- template: "<div class=\"b-control b-date-picker\">\r\n <div class=\"form-group row validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group\">\r\n <input autocomplete=\"off\" (dateTimeChange)=\"onDateSelect($event)\"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n class=\"form-control bnsights-control {{options.ExtraClasses}} \"\r\n [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n formControlName=\"{{options.Name}}\" [owlDateTime]=\"dt1\" [owlDateTimeTrigger]=\"dt1\"\r\n [class.is-invalid]=\"DatePickerFormControl.invalid && DatePickerFormControl.touched\"\r\n [min]=\"options.StartDate\" [max]=\"options.EndDate\" [selectMode]=\"getSelectMode(options.SelectMode)\"\r\n placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\" #Dateinput>\r\n\r\n <owl-date-time [pickerType]=\"getPickerType(options.PickerType)\"\r\n [startView]=\"getStartView(options.StartView)\" [firstDayOfWeek]=\"options.FirstDayOfWeek\"\r\n [hour12Timer]=\"options.Hour12Timer\" #dt1></owl-date-time>\r\n \r\n <div class=\"input-group-append\">\r\n <span class=\"input-group-text\" [owlDateTimeTrigger]=\"dt1\">\r\n <span class=\"svg-icon\">\r\n <svg id=\"Group_356\" data-name=\"Group 356\" xmlns=\"http://www.w3.org/2000/svg\" width=\"15\" height=\"15\" viewBox=\"0 0 48 48\">\r\n <path id=\"Path_6737\" data-name=\"Path 6737\" d=\"M11.583,1a1,1,0,0,0-2,0V5.7h2Z\" style=\"\"></path>\r\n <path id=\"Path_6738\" data-name=\"Path 6738\" d=\"M38.417,1a1,1,0,0,0-2,0V5.7h2Z\"></path>\r\n <path id=\"Path_6739\" data-name=\"Path 6739\" d=\"M0,43.146C0,45.822,1.826,48,4.07,48H43.928C46.174,48,48,45.822,48,43.146V17.121H0Z\" fill=\"#d5d5d5\"></path>\r\n <path id=\"Path_6740\" data-name=\"Path 6740\" d=\"M43.929,5.7H38.417v5.512a1,1,0,1,1-2,0V5.7H11.583v5.512a1,1,0,1,1-2,0V5.7H4.07C1.826,5.7,0,7.877,0,10.555v4.566H48V10.555C48,7.877,46.174,5.7,43.929,5.7Z\" fill=\"#595959\"></path>\r\n </svg>\r\n </span>\r\n </span>\r\n <!--<span class=\"input-group-text\" *ngIf=\"options.EnableCopyToClipboard\"\r\n (click)=\"copyInputMessage(Dateinput)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>-->\r\n </div>\r\n </div>\r\n\r\n <div class=\"text-danger Required-text\"\r\n *ngIf=\"(DatePickerFormControl.invalid && DatePickerFormControl.touched)\">\r\n {{getErrorValidation(DatePickerFormControl.errors|keyvalue)}}\r\n </div>\r\n\r\n <div class=\"control-desc\"*ngIf=\"options.LabelDescription!=null\">{{options.LabelDescription}}</div>\r\n \r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n\r\n\r\n\r\n </div>\r\n\r\n </div>\r\n</div>\r\n",
559
+ template: "<div class=\"b-control b-date-picker\">\r\n <div class=\"form-group row validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group\">\r\n <input autocomplete=\"off\" (dateTimeChange)=\"onDateSelect($event)\"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n class=\"form-control bnsights-control {{options.ExtraClasses}} \"\r\n [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n formControlName=\"{{options.Name}}\" [owlDateTime]=\"dt1\" [owlDateTimeTrigger]=\"dt1\"\r\n [class.is-invalid]=\"DatePickerFormControl.invalid && DatePickerFormControl.touched\"\r\n [min]=\"options.StartDate\" [max]=\"options.EndDate\" [hour12Timer]=\"options.Hour12Timer\" [selectMode]=\"getSelectMode(options.SelectMode)\"\r\n placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\" #Dateinput>\r\n\r\n <owl-date-time [pickerType]=\"getPickerType(options.PickerType)\"\r\n [startView]=\"getStartView(options.StartView)\" [firstDayOfWeek]=\"options.FirstDayOfWeek\"\r\n [hour12Timer]=\"options.Hour12Timer\" #dt1></owl-date-time>\r\n \r\n <div class=\"input-group-append\">\r\n <span class=\"input-group-text\" [owlDateTimeTrigger]=\"dt1\">\r\n <span class=\"svg-icon\">\r\n <svg id=\"Group_356\" data-name=\"Group 356\" xmlns=\"http://www.w3.org/2000/svg\" width=\"15\" height=\"15\" viewBox=\"0 0 48 48\">\r\n <path id=\"Path_6737\" data-name=\"Path 6737\" d=\"M11.583,1a1,1,0,0,0-2,0V5.7h2Z\" style=\"\"></path>\r\n <path id=\"Path_6738\" data-name=\"Path 6738\" d=\"M38.417,1a1,1,0,0,0-2,0V5.7h2Z\"></path>\r\n <path id=\"Path_6739\" data-name=\"Path 6739\" d=\"M0,43.146C0,45.822,1.826,48,4.07,48H43.928C46.174,48,48,45.822,48,43.146V17.121H0Z\" fill=\"#d5d5d5\"></path>\r\n <path id=\"Path_6740\" data-name=\"Path 6740\" d=\"M43.929,5.7H38.417v5.512a1,1,0,1,1-2,0V5.7H11.583v5.512a1,1,0,1,1-2,0V5.7H4.07C1.826,5.7,0,7.877,0,10.555v4.566H48V10.555C48,7.877,46.174,5.7,43.929,5.7Z\" fill=\"#595959\"></path>\r\n </svg>\r\n </span>\r\n </span>\r\n <!--<span class=\"input-group-text\" *ngIf=\"options.EnableCopyToClipboard\"\r\n (click)=\"copyInputMessage(Dateinput)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>-->\r\n </div>\r\n </div>\r\n\r\n <div class=\"text-danger Required-text\"\r\n *ngIf=\"(DatePickerFormControl.invalid && DatePickerFormControl.touched)\">\r\n {{getErrorValidation(DatePickerFormControl.errors|keyvalue)}}\r\n </div>\r\n\r\n <div class=\"control-desc\"*ngIf=\"options.LabelDescription!=null\">{{options.LabelDescription}}</div>\r\n \r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n\r\n\r\n\r\n </div>\r\n\r\n </div>\r\n</div>\r\n",
560
560
  styles: [".example-form{min-width:150px;max-width:500px;width:100%}.example-full-width{width:100%}\n"]
561
561
  },] }
562
562
  ];
@@ -653,6 +653,7 @@
653
653
  this.markAllAsTouched = false;
654
654
  this.validationRules = [];
655
655
  this.validationRulesasync = [];
656
+ this.deletedFiles = [];
656
657
  this.resetError = function () {
657
658
  _this.controlValidationService.RemoveGlobalError();
658
659
  };
@@ -699,33 +700,43 @@
699
700
  else {
700
701
  if (this.options.IsMultipleFile == true) {
701
702
  var files = [];
702
- this.multipleFileUploadModel = this.options.Value;
703
+ this.multipleFileUploadModel.ExistingFiles = this.options.Value.ExistingFiles;
704
+ this.multipleFileUploadModel.UploadedFiles = [];
703
705
  for (var index = 0; index < this.options.Value.ExistingFiles.length; index++) {
704
706
  var element = this.options.Value.ExistingFiles[index];
705
- // this.FileLikeObject = new FileLikeObject({
706
- // name: element.FileName,
707
- // size: element.FileSizeInMB * 1000 * 1000,
708
- // type: element.FileType,
709
- // rawFile: element.FileBase64,
710
- // })
711
- var blob = void 0;
712
- blob = new Blob(['']);
713
- blob.name = element.FileName;
714
- blob.lastModifiedDate = null;
715
- blob.webkitRelativePath = '';
716
- files.push(blob);
707
+ var bytes = new Uint8Array(element.Bytes);
708
+ var base64 = btoa(String.fromCharCode(null, bytes));
709
+ this.FileLikeObject = new ng2FileUpload.FileLikeObject({
710
+ name: element.NameWithExtension,
711
+ type: element.MimeType,
712
+ rawFile: base64,
713
+ });
714
+ // let blob: any;
715
+ // blob = new Blob(['']) as any;
716
+ // blob.name = element.FileName;
717
+ // blob.lastModifiedDate = null;
718
+ // blob.webkitRelativePath = '';
719
+ var file = this.FileLikeObject;
720
+ file.url = element.FileURL;
721
+ files.push(file);
717
722
  }
718
723
  this.uploader.addToQueue(files);
724
+ console.log(this.uploader.queue);
719
725
  }
720
726
  else {
721
- var element = this.options.Value.File;
727
+ var element = this.options.Value;
728
+ var bytes = new Uint8Array(element.Bytes);
729
+ var base64 = btoa(String.fromCharCode(null, bytes));
722
730
  this.FileLikeObject = new ng2FileUpload.FileLikeObject({
723
- name: element.FileName,
724
- size: element.FileSizeInMB * 1000 * 1000,
725
- type: element.FileType,
726
- rawFile: element.FileBase64,
731
+ name: element.NameWithExtension,
732
+ type: element.MimeType,
733
+ rawFile: base64,
727
734
  });
728
- this.uploader.addToQueue([this.FileLikeObject]);
735
+ this.file = element;
736
+ var file = this.FileLikeObject;
737
+ file.url = element.FileURL;
738
+ this.uploader.addToQueue([file]);
739
+ console.log(this.uploader.queue);
729
740
  }
730
741
  }
731
742
  if (this.options.LabelKey != null && this.options.LabelKey != "")
@@ -853,12 +864,16 @@
853
864
  var fileObject = file.rawFile;
854
865
  reader_1.readAsDataURL(fileObject);
855
866
  reader_1.onload = function () {
867
+ var existingID_GUID = null;
868
+ if (!_this.options.IsMultipleFile && _this.file)
869
+ existingID_GUID = _this.file.NameWithExtension == file.name ? _this.file.ID_GUID : null;
856
870
  var AddedFile = {
857
871
  FileName: file.name,
858
872
  FileType: file.type,
859
873
  FileBase64: reader_1.result.toString().split(',')[1],
860
874
  FileSizeInMB: ((file.size / 1000) / 1000),
861
- NameWithExtension: file.name
875
+ NameWithExtension: file.name,
876
+ ID_GUID: existingID_GUID
862
877
  };
863
878
  if (_this.options.IsMultipleFile == false) {
864
879
  _this.fileUploadModel = new FileUploadModel();
@@ -904,33 +919,35 @@
904
919
  else {
905
920
  if (this.options.Value != null && this.options.Value != undefined) {
906
921
  if (this.options.Value.CorrelationID_GUID == null) {
922
+ this.deletedFiles = [];
907
923
  this.multipleFileUploadModel.RemovedFiles = [];
908
924
  }
909
925
  else {
910
926
  if (this.multipleFileUploadModel.RemovedFiles.length == 0) {
911
927
  var FileObject_1 = item.file.rawFile;
912
- var DeletedItemId = this.options.Value.ExistingFiles.filter(function (Object) { return Object.FileName == FileObject_1.name; })[0];
913
- this.options.Value.ExistingFiles = this.options.Value.ExistingFiles.filter(function (Object) { return Object.FileName != FileObject_1.name; });
914
- this.multipleFileUploadModel.RemovedFiles.push(DeletedItemId);
928
+ var DeletedItem = this.multipleFileUploadModel.ExistingFiles.filter(function (Object) { return Object.NameWithExtension == FileObject_1.name; })[0];
929
+ this.multipleFileUploadModel.ExistingFiles = this.multipleFileUploadModel.ExistingFiles.filter(function (Object) { return Object.NameWithExtension != FileObject_1.name; });
930
+ this.deletedFiles.push(DeletedItem);
931
+ this.multipleFileUploadModel.RemovedFiles.push(DeletedItem.ID_GUID);
915
932
  }
916
933
  else {
917
934
  var FileObject_2 = item.file.rawFile;
918
- var deletedList = this.multipleFileUploadModel.RemovedFiles.filter(function (Object) { return Object.FileName == FileObject_2.name; });
935
+ var deletedList = this.deletedFiles.filter(function (Object) { return Object.NameWithExtension == FileObject_2.name; });
919
936
  if (deletedList.length == 0 || deletedList == undefined) {
920
- var DeletedItemId = this.options.Value.ExistingFiles.filter(function (Object) { return Object.FileName == FileObject_2.name; })[0];
921
- this.options.Value.ExistingFiles = this.options.Value.ExistingFiles.filter(function (Object) { return Object.FileName != FileObject_2.name; });
922
- this.multipleFileUploadModel.RemovedFiles.push(DeletedItemId);
937
+ var DeletedItem = this.multipleFileUploadModel.ExistingFiles.filter(function (Object) { return Object.NameWithExtension == FileObject_2.name; })[0];
938
+ this.multipleFileUploadModel.ExistingFiles = this.multipleFileUploadModel.ExistingFiles.filter(function (Object) { return Object.NameWithExtension != FileObject_2.name; });
939
+ this.deletedFiles.push(DeletedItem);
940
+ this.multipleFileUploadModel.RemovedFiles.push(DeletedItem.ID_GUID);
923
941
  }
924
942
  }
925
943
  }
926
944
  }
927
945
  else {
946
+ this.deletedFiles = [];
928
947
  this.multipleFileUploadModel.RemovedFiles = [];
929
948
  }
930
- var ItemList = this.group.get(this.options.Name).value.UploadedFiles;
931
- ItemList = ItemList.filter(function (Object) { return Object.FileName != item._file.name; });
932
- this.multipleFileUploadModel.UploadedFiles = ItemList;
933
- if ((ItemList == null || ItemList == []) && this.options.IsRequired) {
949
+ this.multipleFileUploadModel.UploadedFiles = this.multipleFileUploadModel.UploadedFiles.filter(function (Object) { return Object.NameWithExtension != item._file.name; });
950
+ if ((this.multipleFileUploadModel.UploadedFiles == null || this.multipleFileUploadModel.UploadedFiles == []) && this.options.IsRequired) {
934
951
  this.fileUploadFormControl.markAsTouched();
935
952
  this.fileUploadFormControl.invalid;
936
953
  }
@@ -944,7 +961,7 @@
944
961
  FileUploadComponent.decorators = [
945
962
  { type: i0.Component, args: [{
946
963
  selector: 'BBSF-FileUplaod',
947
- template: "\r\n<div class=\"b-control b-fileupload\">\r\n <div class=\"form-group row validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"col-form-label col-sm-12 mb-2\" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n \r\n <ejs-tooltip id=\"tooltip\" content='{{ValidationMessage}}' tipPointerPosition='Middle'\r\n *ngIf=\"(ValidationMessage!=null&&ValidationMessage!='')\">\r\n <i class=\"fa fa-info-circle\" data-plugin=\"tooltip\" data-html=\"true\">\r\n </i>\r\n </ejs-tooltip>\r\n \r\n \r\n </label>\r\n \r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n \r\n <div>\r\n \r\n <div ng2FileDrop *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 class=\"well my-drop-zoneform-control bnsights-control {{options.ExtraClasses}}\"\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}}\"\r\n id=\"options.Name\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n \r\n \r\n <div class=\"dragndrop text-center\">\r\n <p class=\"drag-icon mb-3\">\r\n <i class=\"fas fa-cloud-download-alt\"></i> \r\n </p>\r\n <p>Drag and Drop File Here </p>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"(!options.IsDropZone)&&!((uploader.queue.length>0)&&(!options.IsMultipleFile))\">\r\n <button type=\"button\" class=\"btn btn-light btn-sm file-fake-input mb-3\" (click)=\"fileInput.click();\">\r\n <i class=\"icon fa fa-cloud-upload-alt\"></i>\r\n {{UtilityService.getResourceValue(\"Upload\")}}\r\n </button>\r\n <input ng2FileSelect [uploader]=\"uploader\" [accept]=\"AcceptedType\"\r\n class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\" id=\"file\"\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\" type=\"file\"\r\n formControlName=\"{{options.Name}}\" id=\"options.Name\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n </div>\r\n \r\n </div>\r\n \r\n <div *ngFor=\"let item of uploader.queue\">\r\n <div class=\"fileInfoContainer ui-file btn-group mb-3\" >\r\n <button type=\"button\"class=\"download-link btn btn-light btn-sm\">\r\n <span>\r\n <i class=\"icon fa fa-download\"></i>\r\n <span class=\"upload-file-info\">{{ item?.file?.name }}</span>\r\n </span>\r\n </button>\r\n <span class=\"removeUIFile remove-link btn btn-xs btn-danger d-flex align-items-center justify-content-center\"\r\n (click)=\"item.remove();removeFromControlValue(item)\">\r\n <i class=\"fa fa-times px-0\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n \r\n \r\n <div class=\"text-danger Required-text\" *ngIf=\"(fileUploadFormControl.invalid && fileUploadFormControl.touched)\">\r\n {{getErrorValidation(fileUploadFormControl.errors|keyvalue)}}\r\n </div>\r\n \r\n \r\n \r\n <div class=\"col-md-9 col-sm-9\">\r\n \r\n <div><label>{{options.LabelDescription}}\r\n </label></div>\r\n \r\n \r\n </div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n \r\n \r\n \r\n </div>\r\n \r\n </div>\r\n</div>\r\n",
964
+ template: "\r\n<div class=\"b-control b-fileupload\">\r\n <div class=\"form-group row validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"col-form-label col-sm-12 mb-2\" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n\r\n <ejs-tooltip id=\"tooltip\" content='{{ValidationMessage}}' tipPointerPosition='Middle'\r\n *ngIf=\"(ValidationMessage!=null&&ValidationMessage!='')\">\r\n <i class=\"fa fa-info-circle\" data-plugin=\"tooltip\" data-html=\"true\">\r\n </i>\r\n </ejs-tooltip>\r\n\r\n\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n\r\n <div>\r\n\r\n <div ng2FileDrop *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 class=\"well my-drop-zoneform-control bnsights-control {{options.ExtraClasses}}\"\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}}\"\r\n id=\"options.Name\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n\r\n\r\n <div class=\"dragndrop text-center\">\r\n <p class=\"drag-icon mb-3\">\r\n <i class=\"fas fa-cloud-download-alt\"></i>\r\n </p>\r\n <p>\r\n {{UtilityService.getResourceValue(\"DragAndDropHere\")}}\r\n </p>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"(!options.IsDropZone)&&!((uploader.queue.length>0)&&(!options.IsMultipleFile))\">\r\n <button type=\"button\" class=\"btn btn-light btn-sm file-fake-input mb-3\" (click)=\"fileInput.click();\">\r\n <i class=\"icon fa fa-cloud-upload-alt\"></i>\r\n {{UtilityService.getResourceValue(\"Upload\")}}\r\n </button>\r\n <input ng2FileSelect [uploader]=\"uploader\" [accept]=\"AcceptedType\"\r\n class=\"fileSelector customFileUploadPlacment hidden v-required-multiplefiles d-none\" id=\"file\"\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\" type=\"file\"\r\n formControlName=\"{{options.Name}}\" id=\"options.Name\" #fileInput\r\n [class.is-invalid]=\"fileUploadFormControl.invalid && fileUploadFormControl.touched\">\r\n </div>\r\n\r\n </div>\r\n\r\n <div *ngFor=\"let item of uploader.queue\">\r\n <div class=\"fileInfoContainer ui-file btn-group mb-3\">\r\n <a href=\"{{ item?._file?.url}}\" download>\r\n <button type=\"button\" class=\"download-link btn btn-light btn-sm\">\r\n <span>\r\n <i class=\"icon fa fa-download\"></i>\r\n <span class=\"upload-file-info\">{{ item?.file?.name }}</span>\r\n </span>\r\n </button>\r\n </a>\r\n <span class=\"removeUIFile remove-link btn btn-xs btn-danger d-flex align-items-center justify-content-center\"\r\n (click)=\"item.remove();removeFromControlValue(item)\">\r\n <i class=\"fa fa-times px-0\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n\r\n\r\n <div class=\"text-danger Required-text\" *ngIf=\"(fileUploadFormControl.invalid && fileUploadFormControl.touched)\">\r\n {{getErrorValidation(fileUploadFormControl.errors|keyvalue)}}\r\n </div>\r\n\r\n\r\n\r\n <div class=\"col-md-9 col-sm-9\">\r\n\r\n <div>\r\n <label>\r\n {{options.LabelDescription}}\r\n </label>\r\n </div>\r\n\r\n\r\n </div>\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">{{resetError()}}</div>\r\n\r\n\r\n\r\n </div>\r\n\r\n </div>\r\n</div>\r\n",
948
965
  styles: [".e-tip-content{background-color:#afafaf;color:#fff;padding-left:10px;padding-right:10px;padding-top:2px}.my-drop-zone{border:dotted 3px lightgray}.nv-file-over{border:dotted 3px red}.another-file-over-class{border:dotted 3px green}html,body{height:100%}\n"]
949
966
  },] }
950
967
  ];
@@ -1682,7 +1699,7 @@
1682
1699
  MultiLingualTextBoxComponent.decorators = [
1683
1700
  { type: i0.Component, args: [{
1684
1701
  selector: 'BBSF-MultiLingualTextBox',
1685
- template: "<div class=\"b-control b-multilangual-textbox\">\r\n <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n\r\n <div class=\"form-group row\" [formGroup]=\"MultiLanguagegroup\">\r\n <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n <div class=\"row\" *ngIf=\"ShowEnglishTextBox\">\r\n <label class=\"b-label col-form-label col-sm-12\"\r\n [ngClass]=\"(options.ViewType==1)?'col-md-9':'col-md-3'\" [hidden]=\"options.IsHideEnglishLabel\">\r\n {{(options.EnglishLabelValue!=null&&options.EnglishLabelValue!=\"\")?options.EnglishLabelValue:options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\"\r\n class=\"text-danger Required-text\" aria-required=\"true\">*</span>\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group align-items-center\">\r\n <div class=\"svg svg-icon-grey\" [ngClass]=\"(options.IconPositionEN==1)?'left-icon':'right-icon'\" *ngIf=\"options.Icon!=null\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <input class=\"form-control bnsights-control\"\r\n (focus)=\"onEnglishFocus(true)\" (focusout)=\"onEnglishFocus(false)\"\r\n aria-describedby=\"email-error\" aria-invalid=\"true\" formControlName=\"English\"\r\n [hidden]=\"options.IsHideEnglishFields\" maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n [class.is-invalid]=\"EnglishFormControl.invalid && EnglishFormControl.touched\"\r\n placeholder=\"{{options.EnglishPlaceholder}}\" (change)=\"trimControlValue('En')\"\r\n (keyup)=\"onTextChange()\"\r\n (keydown)=\"EnglishWordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n #userinputEnglish>\r\n <div class=\"input-group-append\" [hidden]=\"options.IsHideEnglishFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputEnglish)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"text-muted font-weight-500 word-count float-end\" *ngIf=\"options.MaxWordCount>0&&IsShowEnglishWordCount\">{{EnglishWordCount}}/{{options.MaxWordCount}}</div>\r\n <div class=\"text-danger Required-text\" *ngIf=\"(EnglishFormControl.invalid && EnglishFormControl.touched)\">\r\n {{getErrorValidation(EnglishFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"showEnglishCharsLimitMsg\">\r\n <span class=\"badge b-character-warning float-end\" [ngClass]=\"{'badge-light-warning': englishCharsLimitMsgClass === 'warning', 'badge-light-danger' : englishCharsLimitMsgClass === 'danger' }\">\r\n {{englishMaxLimitWarningMsg}}\r\n </span>\r\n </div>\r\n <div class=\"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 <!-- <div *ngIf=\"EnglishFormControl.valid\">{{resetError()}}</div> -->\r\n <div *ngIf=\"group.valid\">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n <div class=\"row\" *ngIf=\"ShowArabicTextBox\">\r\n <label class=\"b-label col-form-label col-sm-12\"\r\n [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\" [hidden]=\"options.IsHideArabicLabel\">\r\n {{(options.ArabicLabelValue!=null&&options.ArabicLabelValue!=\"\")?options.ArabicLabelValue:options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\" aria-required=\"true\">*</span>\r\n </label>\r\n <div class=\" col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group align-items-center\">\r\n <div class=\"svg svg-icon-grey\" [ngClass]=\"(options.IconPositionEN==1)?'right-icon':'left-icon'\" *ngIf=\"options.Icon!=null\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <input class=\"form-control bnsights-control\" dir=\"rtl\"\r\n (focus)=\"onArabicFocus(true)\" (focusout)=\"onArabicFocus(false)\"\r\n [hidden]=\"options.IsHideArabicFields\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n formControlName=\"Arabic\" maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n [class.is-invalid]=\"ArabicFormControl.invalid && ArabicFormControl.touched\"\r\n placeholder=\"{{options.ArabicPlaceholder}}\" (keyup)=\"onTextChange()\"\r\n (keydown)=\"ArabicWordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n (change)=\"trimControlValue('Ar')\" #userinputArabic>\r\n\r\n <div class=\"input-group-append\" [hidden]=\"options.IsHideArabicFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputArabic)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"text-muted font-weight-500 float-end word-count\" *ngIf=\"options.MaxWordCount>0&&IsShowArabicWordCount\">{{ArabicWordCount}}/{{options.MaxWordCount}}</div>\r\n <div class=\"text-danger Required-text\" *ngIf=\"(ArabicFormControl.invalid && ArabicFormControl.touched)\">\r\n {{getErrorValidation(ArabicFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"showArabicCharsLimitMsg\">\r\n <span class=\"badge b-character-warning float-end\" [ngClass]=\"{'badge-light-warning': arabicCharsLimitMsgClass === 'warning', 'badge-light-danger' : arabicCharsLimitMsgClass === 'danger' }\">\r\n {{arabicMaxLimitWarningMsg}}\r\n </span>\r\n </div>\r\n <div class=\"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 <!-- <div *ngIf=\"ArabicFormControl.valid\">{{resetError()}}</div> -->\r\n <div *ngIf=\"group.valid\">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n",
1702
+ template: "<div class=\"b-control b-multilangual-textbox\">\r\n <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n\r\n <div class=\"form-group row\" [formGroup]=\"MultiLanguagegroup\">\r\n <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n <div class=\"row\" *ngIf=\"ShowEnglishTextBox\">\r\n <label class=\"b-label col-form-label col-sm-12\"\r\n [ngClass]=\"(options.ViewType==1)?'col-md-9':'col-md-3'\" [hidden]=\"options.IsHideEnglishLabel\">\r\n {{(options.EnglishLabelValue!=null&&options.EnglishLabelValue!=\"\")?options.EnglishLabelValue:options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\"\r\n class=\"text-danger Required-text\" aria-required=\"true\">*</span>\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group align-items-center\">\r\n <div class=\"svg svg-icon-grey\" [ngClass]=\"(options.IconPositionEN==1)?'left-icon':'right-icon'\" *ngIf=\"options.Icon!=null\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <input class=\"form-control bnsights-control\"\r\n (focus)=\"onEnglishFocus(true)\" (focusout)=\"onEnglishFocus(false)\"\r\n aria-describedby=\"email-error\" aria-invalid=\"true\" formControlName=\"English\"\r\n [hidden]=\"options.IsHideEnglishFields\" maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n [class.is-invalid]=\"EnglishFormControl.invalid && EnglishFormControl.touched\"\r\n placeholder=\"{{options.EnglishPlaceholder}}\" (change)=\"trimControlValue('En')\"\r\n (keyup)=\"onTextChange()\"\r\n (keydown)=\"EnglishWordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n autocomplete=\"{{options.AutoComplete}}\"\r\n id=\"{{options.Name}}.English\"\r\n #userinputEnglish>\r\n <div class=\"input-group-append\" [hidden]=\"options.IsHideEnglishFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputEnglish)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"text-muted font-weight-500 word-count float-end\" *ngIf=\"options.MaxWordCount>0&&IsShowEnglishWordCount\">{{EnglishWordCount}}/{{options.MaxWordCount}}</div>\r\n <div class=\"text-danger Required-text\" *ngIf=\"(EnglishFormControl.invalid && EnglishFormControl.touched)\">\r\n {{getErrorValidation(EnglishFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"showEnglishCharsLimitMsg\">\r\n <span class=\"badge b-character-warning float-end\" [ngClass]=\"{'badge-light-warning': englishCharsLimitMsgClass === 'warning', 'badge-light-danger' : englishCharsLimitMsgClass === 'danger' }\">\r\n {{englishMaxLimitWarningMsg}}\r\n </span>\r\n </div>\r\n <div class=\"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 <!-- <div *ngIf=\"EnglishFormControl.valid\">{{resetError()}}</div> -->\r\n <div *ngIf=\"group.valid\">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n <div class=\"row\" *ngIf=\"ShowArabicTextBox\">\r\n <label class=\"b-label col-form-label col-sm-12\"\r\n [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\" [hidden]=\"options.IsHideArabicLabel\">\r\n {{(options.ArabicLabelValue!=null&&options.ArabicLabelValue!=\"\")?options.ArabicLabelValue:options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\" aria-required=\"true\">*</span>\r\n </label>\r\n <div class=\" col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <div class=\"input-group align-items-center\">\r\n <div class=\"svg svg-icon-grey\" [ngClass]=\"(options.IconPositionEN==1)?'right-icon':'left-icon'\" *ngIf=\"options.Icon!=null\">\r\n <span [inlineSVG]=\"options.Icon\"></span>\r\n </div>\r\n <input class=\"form-control bnsights-control\" dir=\"rtl\"\r\n (focus)=\"onArabicFocus(true)\" (focusout)=\"onArabicFocus(false)\"\r\n [hidden]=\"options.IsHideArabicFields\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n formControlName=\"Arabic\" maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n [class.is-invalid]=\"ArabicFormControl.invalid && ArabicFormControl.touched\"\r\n placeholder=\"{{options.ArabicPlaceholder}}\" (keyup)=\"onTextChange()\"\r\n (keydown)=\"ArabicWordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n autocomplete=\"{{options.AutoComplete}}\"\r\n id=\"{{options.Name}}.Arabic\"\r\n (change)=\"trimControlValue('Ar')\" #userinputArabic>\r\n\r\n <div class=\"input-group-append\" [hidden]=\"options.IsHideArabicFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputArabic)\">\r\n <i class=\"fas fa-copy\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"text-muted font-weight-500 float-end word-count\" *ngIf=\"options.MaxWordCount>0&&IsShowArabicWordCount\">{{ArabicWordCount}}/{{options.MaxWordCount}}</div>\r\n <div class=\"text-danger Required-text\" *ngIf=\"(ArabicFormControl.invalid && ArabicFormControl.touched)\">\r\n {{getErrorValidation(ArabicFormControl.errors|keyvalue)}}\r\n </div>\r\n <div *ngIf=\"showArabicCharsLimitMsg\">\r\n <span class=\"badge b-character-warning float-end\" [ngClass]=\"{'badge-light-warning': arabicCharsLimitMsgClass === 'warning', 'badge-light-danger' : arabicCharsLimitMsgClass === 'danger' }\">\r\n {{arabicMaxLimitWarningMsg}}\r\n </span>\r\n </div>\r\n <div class=\"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 <!-- <div *ngIf=\"ArabicFormControl.valid\">{{resetError()}}</div> -->\r\n <div *ngIf=\"group.valid\">{{resetError()}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n",
1686
1703
  styles: [".example-form{min-width:150px;max-width:500px;width:100%}.example-full-width{width:100%}\n"]
1687
1704
  },] }
1688
1705
  ];
@@ -2527,9 +2544,9 @@
2527
2544
  }
2528
2545
  return this.controlUtility.getErrorValidationMassage(ErrorList, this.group, this.options);
2529
2546
  };
2530
- DropdownListComponent.prototype.onItemSelect = function (item) {
2547
+ DropdownListComponent.prototype.onItemSelect = function () {
2531
2548
  this.onChangeService.ChangeValue(this.options.Name);
2532
- var originalValue = item;
2549
+ var originalValue = this.options.SelectedItems;
2533
2550
  if (this.options.PatchFunction && this.options.PatchPath && this.group.get(this.options.Name).valid) {
2534
2551
  this.controlUtility.patchControlValue(originalValue, this.options.PatchFunction, this.options.PatchPath);
2535
2552
  }
@@ -2573,7 +2590,7 @@
2573
2590
  { type: i0.Component, args: [{
2574
2591
  // tslint:disable-next-line: component-selector
2575
2592
  selector: 'BBSF-DropdownList',
2576
- template: "<div class=\"b-control b-dropdown-list\">\r\n <div class=\"form-group row validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <ng-select *ngIf=\"options.DisableBootstrapSelect==false\" dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n [bindValue]=\"options.ItemTempletkey\" [bindLabel]=\"options.ItemTempletvalue\" [items]=\"options.DataSource\"\r\n [notFoundText]=\"'No data found.'\" [maxSelectedItems]=\"options.LimitSelection\"\r\n [searchable]=\"options.AllowSearchFilter\" [multiple]=\"!options.SingleSelection\" [readonly]=\"options.IsDisabled\"\r\n [clearable]=\"true\" placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\"\r\n [selectableGroup]=\"true\" [selectableGroupAsModel]=\"false\" formControlName=\"{{options.Name}}\"\r\n [(ngModel)]=\"options.SelectedItems\" (change)=\"onItemSelect($event[options.ItemTempletkey])\" (clear)=\"Clear()\"\r\n [class.is-invalid]=\"DropdownListFormControl.invalid && DropdownListFormControl.touched\"\r\n [closeOnSelect]=\"options.SingleSelection ? true : false\">\r\n\r\n <ng-template *ngIf=\"options.ShowCheckbox\" ng-option-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\">\r\n <div class=\"ks-cboxtags\">\r\n <input id=\"item-{{index}}\" type=\"checkbox\" [ngModelOptions]=\"{standalone: true}\" [ngModel]=\"item$.selected\"\r\n class=\" \" /> <label class=\"ng-option-label mb-0\" id={{item.key}}>{{item.value}}</label>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"!options.ShowCheckbox\" ng-option-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\">\r\n <label class=\"ng-option-label mb-0\" id={{item.key}}>{{item.value}}</label>\r\n </ng-template>\r\n\r\n </ng-select>\r\n\r\n <select *ngIf=\"options.DisableBootstrapSelect\" class=\"form-control bnsights-control\"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\" (change)=\"onItemSelect($event.target.value)\"\r\n [disabled]=\"options.IsDisabled\" formControlName=\"{{options.Name}}\">\r\n <option value=\"\" disabled>--select--</option>\r\n <option *ngFor=\"let item of options.DataSource\" value=\"{{item.key}}\" [ngValue]=\"item.key\">\r\n {{item.value}}\r\n </option>\r\n </select>\r\n\r\n <div class=\"text-danger Required-text\"\r\n *ngIf=\"(DropdownListFormControl.invalid && DropdownListFormControl.touched)\">\r\n {{getErrorValidation(DropdownListFormControl.errors|keyvalue)}}\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <div class=\"control-desc\">{{options.LabelDescription}}</div>\r\n </div>\r\n\r\n <!-- <div *ngIf=\"DropdownListFormControl.valid\">{{resetError()}}</div> -->\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">\r\n {{resetError()}}</div>\r\n\r\n\r\n </div>\r\n </div>\r\n</div>\r\n",
2593
+ template: "<div class=\"b-control b-dropdown-list\">\r\n <div class=\"form-group row validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n </label>\r\n\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <ng-select *ngIf=\"options.DisableBootstrapSelect==false\" dir=\"{{options.ForceDirection==2?'rtl':''}}\"\r\n [bindValue]=\"options.ItemTempletkey\" [bindLabel]=\"options.ItemTempletvalue\" [items]=\"options.DataSource\"\r\n [notFoundText]=\"'No data found.'\" [maxSelectedItems]=\"options.LimitSelection\"\r\n [searchable]=\"options.AllowSearchFilter\" [multiple]=\"!options.SingleSelection\" [readonly]=\"options.IsDisabled\"\r\n [clearable]=\"true\" placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\"\r\n [selectableGroup]=\"true\" [selectableGroupAsModel]=\"false\" formControlName=\"{{options.Name}}\"\r\n [(ngModel)]=\"options.SelectedItems\" (change)=\"onItemSelect()\" (clear)=\"Clear()\"\r\n [class.is-invalid]=\"DropdownListFormControl.invalid && DropdownListFormControl.touched\"\r\n [closeOnSelect]=\"options.SingleSelection ? true : false\">\r\n\r\n <ng-template *ngIf=\"options.ShowCheckbox\" ng-option-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\">\r\n <div class=\"ks-cboxtags\">\r\n <input id=\"item-{{index}}\" type=\"checkbox\" [ngModelOptions]=\"{standalone: true}\" [ngModel]=\"item$.selected\"\r\n class=\" \" /> <label class=\"ng-option-label mb-0\" id={{item.key}}>{{item.value}}</label>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"!options.ShowCheckbox\" ng-option-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\">\r\n <label class=\"ng-option-label mb-0\" id={{item.key}}>{{item.value}}</label>\r\n </ng-template>\r\n\r\n </ng-select>\r\n\r\n <select *ngIf=\"options.DisableBootstrapSelect\" class=\"form-control bnsights-control\"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\" (change)=\"onItemSelect()\" [(ngModel)]=\"options.SelectedItems\" [disabled]=\"options.IsDisabled\" formControlName=\"{{options.Name}}\">\r\n <option value=\"\" disabled>--{{UtilityService.getResourceValue(\"select\")}}--</option>\r\n <option *ngFor=\"let item of options.DataSource\" value=\"{{item.key}}\" [ngValue]=\"item.key\">\r\n {{item.value}}\r\n </option>\r\n </select>\r\n\r\n <div class=\"text-danger Required-text\"\r\n *ngIf=\"(DropdownListFormControl.invalid && DropdownListFormControl.touched)\">\r\n {{getErrorValidation(DropdownListFormControl.errors|keyvalue)}}\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <div class=\"control-desc\">{{options.LabelDescription}}</div>\r\n </div>\r\n\r\n <!-- <div *ngIf=\"DropdownListFormControl.valid\">{{resetError()}}</div> -->\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">\r\n {{resetError()}}</div>\r\n\r\n\r\n </div>\r\n </div>\r\n</div>\r\n",
2577
2594
  styles: [".cuppa-dropdown{background-color:#fff}.arrow-up,.arrow-down{border-left:none!important;border-right:none!important}.dropdown-list{padding-top:0!important}.c-token{background-color:#6495ed}.pure-checkbox .selected-item{background-color:#6495ed;color:#fff}\n"]
2578
2595
  },] }
2579
2596
  ];
@@ -2733,9 +2750,6 @@
2733
2750
  this.SlideValue = this.options.Value == undefined ? false : this.options.Value;
2734
2751
  if (!this.options.ViewType)
2735
2752
  this.options.ViewType = this.globalSettings.ViewType;
2736
- if (this.options.IsDisabled) {
2737
- this.ToggleslideFormControl.disable();
2738
- }
2739
2753
  if (this.options.LabelKey != null && this.options.LabelKey != "")
2740
2754
  this.options.LabelValue = this.UtilityService.getResourceValue(this.options.LabelKey);
2741
2755
  };
@@ -2773,7 +2787,7 @@
2773
2787
  ToggleslideComponent.decorators = [
2774
2788
  { type: i0.Component, args: [{
2775
2789
  selector: 'BBSF-Toggleslide',
2776
- template: "<div class=\"b-control b-toggle-slide\">\r\n <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n </label>\r\n <mat-slide-toggle [(ngModel)]=\"SlideValue\" dir=\"{{options.ForceDirection==2?'rtl':''}}\" [cssClass]=\"(options.ViewType==1)?'':'col-md-9'\"\r\n formControlName=\"{{options.Name}}\" disableRipple=\"true\"\r\n (change)=\"changeValueToggle()\">\r\n </mat-slide-toggle>\r\n \r\n </div>\r\n</div>\r\n",
2790
+ template: "<div class=\"b-control b-toggle-slide\">\r\n <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n </label>\r\n <mat-slide-toggle [(ngModel)]=\"SlideValue\" dir=\"{{options.ForceDirection==2?'rtl':''}}\" [cssClass]=\"(options.ViewType==1)?'':'col-md-9'\"\r\n formControlName=\"{{options.Name}}\" disableRipple=\"true\" disabled=\"{{options.IsDisabled}}\" (change)=\"changeValueToggle()\">\r\n </mat-slide-toggle>\r\n \r\n </div>\r\n</div>\r\n",
2777
2791
  styles: [".mat-slide-toggle{padding-left:10px}.mat-slide-toggle.mat-checked .mat-slide-toggle-bar{background-color:#e3f4fe}.mat-slide-toggle-thumb-container{width:25px;height:25px;top:1px;left:-2px}.mat-slide-toggle.mat-checked .mat-slide-toggle-thumb{background-color:#009ef7}.mat-slide-toggle-thumb{height:25px;width:25px;border-radius:50%}.mat-slide-toggle.mat-checked .mat-ripple-element{background-color:#009ef7}.mat-slide-toggle-bar{width:55px;height:30px;border-radius:3.25rem}\n"]
2778
2792
  },] }
2779
2793
  ];
@@ -4531,7 +4545,7 @@
4531
4545
  this.TagsFormControl.invalid;
4532
4546
  }
4533
4547
  }
4534
- var originalValue = this.TagsFormControl.value;
4548
+ var originalValue = this.TagsFormControl.value.map(function (a) { return a.key; });
4535
4549
  if (this.options.PatchFunction && this.options.PatchPath && this.TagsFormControl.valid) {
4536
4550
  this.controlUtility.patchControlValue(originalValue, this.options.PatchFunction, this.options.PatchPath);
4537
4551
  }
@@ -4741,7 +4755,7 @@
4741
4755
  pagingDTO.CurrentPageNumber = page;
4742
4756
  pagingDTO.TotalCount = this.totalRow;
4743
4757
  pagingDTO.IsFilterUpdated = IsFilterUpdated;
4744
- var params = new http$1.HttpParams();
4758
+ var filters = {};
4745
4759
  if (this.options.Filters != null && this.options.Filters != []) {
4746
4760
  for (var index = 0; index < this.options.Filters.length; index++) {
4747
4761
  if (this.options.Filters[index].FormControlName != null && this.options.Filters[index].FormControlName != "") {
@@ -4752,11 +4766,11 @@
4752
4766
  if (Array.isArray(ControlValue)) {
4753
4767
  for (var element = 0; element < ControlValue.length; element++) {
4754
4768
  var value = ControlValue[element];
4755
- params = params.append(this.options.Filters[index].ActionParameterName, value);
4769
+ filters[this.options.Filters[index].ActionParameterName] = value;
4756
4770
  }
4757
4771
  }
4758
4772
  else {
4759
- params = params.append(this.options.Filters[index].ActionParameterName, ControlValue);
4773
+ filters[this.options.Filters[index].ActionParameterName] = ControlValue;
4760
4774
  }
4761
4775
  }
4762
4776
  else {
@@ -4764,7 +4778,7 @@
4764
4778
  ControlValue = JSON.stringify(ControlValue);
4765
4779
  if (this.options.Filters[index].FilterType == exports.FilterType.TagInput)
4766
4780
  ControlValue = JSON.stringify(ControlValue);
4767
- params = params.append(this.options.Filters[index].ActionParameterName, ControlValue);
4781
+ filters[this.options.Filters[index].ActionParameterName] = ControlValue;
4768
4782
  }
4769
4783
  }
4770
4784
  }
@@ -4772,11 +4786,16 @@
4772
4786
  var ElementjQuerySelector = this.options.Filters[index].jQuerySelector;
4773
4787
  var ElementValue = document.querySelector(ElementjQuerySelector).value;
4774
4788
  if (ElementValue != undefined && ElementValue != null)
4775
- params = params.append(this.options.Filters[index].ActionParameterName, ElementValue);
4789
+ filters[this.options.Filters[index].ActionParameterName] = ElementValue;
4776
4790
  }
4777
4791
  }
4778
4792
  }
4779
- this.requestHandlerService.post(this.options.ActionPostURL, pagingDTO, null, params, null)
4793
+ //Set Filters object that sent to action URL
4794
+ var filtersDTO = {
4795
+ PagingDTO: pagingDTO,
4796
+ Filters: filters
4797
+ };
4798
+ this.requestHandlerService.post(this.options.ActionPostURL, this.options.Filters && this.options.Filters.length > 0 ? filtersDTO : pagingDTO)
4780
4799
  .subscribe(function (responseData) {
4781
4800
  _this.result = responseData.items; //this.castItems(responseData.items);
4782
4801
  var castedResult = classTransformer.plainToClass(_this.options.TypeOfResponse, _this.result, { excludeExtraneousValues: true });
@@ -4786,6 +4805,7 @@
4786
4805
  _this.items = [];
4787
4806
  _this.Pages = Math.ceil((_this.totalRow / _this.options.PageSize));
4788
4807
  _this.items = Array(_this.totalRow);
4808
+ _this.setText(_this.Pages, _this.totalRow);
4789
4809
  }
4790
4810
  }, function (error) {
4791
4811
  if (error.status == 401)
@@ -4809,12 +4829,38 @@
4809
4829
  }
4810
4830
  return originalArray;
4811
4831
  };
4832
+ PagingComponent.prototype.setText = function (pagesNumber, itemsNumber) {
4833
+ if (this.utilityService.isCurrentLanguageArabic()) {
4834
+ //Set pages text
4835
+ if (pagesNumber < 3 || pagesNumber > 10)
4836
+ this.pagesText = this.utilityService.getResourceValue("Page");
4837
+ else
4838
+ this.pagesText = this.utilityService.getResourceValue("Pages");
4839
+ //Set items text
4840
+ if (itemsNumber < 3 || itemsNumber > 10)
4841
+ this.itemsText = this.utilityService.getResourceValue("Item");
4842
+ else
4843
+ this.itemsText = this.utilityService.getResourceValue("Items");
4844
+ }
4845
+ else {
4846
+ //Set pages text
4847
+ if (pagesNumber > 1)
4848
+ this.pagesText = this.utilityService.getResourceValue("Pages");
4849
+ else
4850
+ this.pagesText = this.utilityService.getResourceValue("Page");
4851
+ //Set items text
4852
+ if (itemsNumber > 1)
4853
+ this.itemsText = this.utilityService.getResourceValue("Items");
4854
+ else
4855
+ this.itemsText = this.utilityService.getResourceValue("Item");
4856
+ }
4857
+ };
4812
4858
  return PagingComponent;
4813
4859
  }());
4814
4860
  PagingComponent.decorators = [
4815
4861
  { type: i0.Component, args: [{
4816
4862
  selector: 'BBSF-Paging',
4817
- template: "<div class=\"b-control b-paging\" *ngIf=\"(result.length > 0)\">\r\n <div class=\"d-flex justify-content-between align-items-center\" *ngIf=\"!options.IsLoadMoreControl\">\r\n <div class=\"b-pagination\">\r\n <jw-pagination [items]=\"items\" *ngIf=\"!((Pages==1)&&options.HidePaginationWhenPageSizeEqualOne)\"\r\n (changePage)=\"onChangePage($event)\" [pageSize]=\"options.PageSize\" [ShowFirstAndLast]=\"options.ShowFirstAndLast\"\r\n [initialPage]=\"1\" [maxPages]=\"10\"></jw-pagination>\r\n </div>\r\n <div class=\"b-pages d-flex\" *ngIf=\"!((Pages==1)&&options.HidePaginationWhenPageSizeEqualOne)\" >\r\n <select (change)=\"changePageSize($event)\" *ngIf=\"options.ShowPageSizeOption\">\r\n <option>10</option>\r\n <option>20</option>\r\n <option>50</option>\r\n <option>100</option>\r\n <option>200</option>\r\n </select>\r\n <div class=\"b-items ml-3\">\r\n <strong>{{totalRow}}</strong> {{utilityService.getResourceValue(\"ItemsIn\")}} <strong> {{Pages}}</strong> {{utilityService.getResourceValue(\"Pages\")}}\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"row\" style=\"align-self:center; align-items: center; text-align: center;\" *ngIf=\"options.IsLoadMoreControl\">\r\n <div class=\"search-results\" infinite-scroll [infiniteScrollDistance]=\"ScrollDistance\"\r\n [infiniteScrollUpDistance]=\"ScrollUpDistance\" [infiniteScrollThrottle]=\"Throttle\" (scrolled)=\"options.IsInfiniteScroll==true?onScrollDown():null\"\r\n [scrollWindow]=\"options.ScrollWindow\" [infiniteScrollContainer]=\"options.InfiniteScrollContainer\">\r\n </div>\r\n <button class=\"btn btn-info\" (click)=\"onScrollDown()\" *ngIf=\"!(result.length==totalRow)\">{{utilityService.getResourceValue(\"LoadMore\")}}</button>\r\n </div>\r\n</div>\r\n",
4863
+ template: "<div class=\"b-control b-paging\" *ngIf=\"(result.length > 0)\">\r\n <div class=\"d-flex justify-content-between align-items-center\" *ngIf=\"!options.IsLoadMoreControl\">\r\n <div class=\"b-pagination\">\r\n <jw-pagination [items]=\"items\" *ngIf=\"!((Pages==1)&&options.HidePaginationWhenPageSizeEqualOne)\"\r\n (changePage)=\"onChangePage($event)\" [pageSize]=\"options.PageSize\" [ShowFirstAndLast]=\"options.ShowFirstAndLast\"\r\n [initialPage]=\"1\" [maxPages]=\"10\"></jw-pagination>\r\n </div>\r\n <div class=\"b-pages d-flex\" *ngIf=\"!((Pages==1)&&options.HidePaginationWhenPageSizeEqualOne)\" >\r\n <select (change)=\"changePageSize($event)\" *ngIf=\"options.ShowPageSizeOption\">\r\n <option>10</option>\r\n <option>20</option>\r\n <option>50</option>\r\n <option>100</option>\r\n <option>200</option>\r\n </select>\r\n <div class=\"b-items ml-3\">\r\n <strong>{{totalRow}}</strong> {{itemsText}} {{utilityService.getResourceValue(\"In\")}} <strong> {{Pages}}</strong> {{pagesText}}\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"row\" style=\"align-self:center; align-items: center; text-align: center;\" *ngIf=\"options.IsLoadMoreControl\">\r\n <div class=\"search-results\" infinite-scroll [infiniteScrollDistance]=\"ScrollDistance\"\r\n [infiniteScrollUpDistance]=\"ScrollUpDistance\" [infiniteScrollThrottle]=\"Throttle\" (scrolled)=\"options.IsInfiniteScroll==true?onScrollDown():null\"\r\n [scrollWindow]=\"options.ScrollWindow\" [infiniteScrollContainer]=\"options.InfiniteScrollContainer\">\r\n </div>\r\n <button class=\"btn btn-info\" (click)=\"onScrollDown()\" *ngIf=\"!(result.length==totalRow)\">{{utilityService.getResourceValue(\"LoadMore\")}}</button>\r\n </div>\r\n</div>\r\n",
4818
4864
  styles: [".ngx-pager-container{text-align:center;padding:25px 0 0}.ngx-pager-container li{display:inline-block;margin:0 4px}.ngx-pager-container li a{display:block;width:26px;height:26px;border:1px solid #707070;text-align:center;color:#3e4e59;font-size:14px;line-height:24px;border-radius:5px;text-decoration:none}.ngx-pager-container li a:hover{color:#fff;background:#0a0e03}.ngx-pager-container li.invisible{display:none}.ngx-pager-container li.active{background:#0a0e03;border-radius:5px}.ngx-pager-container li.active a{border:none;color:#fff}\n"]
4819
4865
  },] }
4820
4866
  ];
@@ -5801,10 +5847,18 @@
5801
5847
  this.modalService = modalService;
5802
5848
  this.ngbActiveModal = ngbActiveModal;
5803
5849
  this.router = router;
5850
+ this.isChange = null;
5851
+ this.OnChange = new i0.EventEmitter();
5804
5852
  }
5805
5853
  FormComponent.prototype.ngOnInit = function () {
5806
5854
  this.fromName = this.randomString(5);
5807
5855
  };
5856
+ FormComponent.prototype.ngAfterViewInit = function () {
5857
+ var _this = this;
5858
+ this.options.FormGroup.valueChanges.subscribe(function (es) {
5859
+ _this.OnChange.emit(true);
5860
+ });
5861
+ };
5808
5862
  FormComponent.prototype.submit = function () {
5809
5863
  var _this = this;
5810
5864
  this.options.FormGroup.markAllAsTouched();
@@ -5881,6 +5935,7 @@
5881
5935
  { type: router.Router }
5882
5936
  ]; };
5883
5937
  FormComponent.propDecorators = {
5938
+ OnChange: [{ type: i0.Output }],
5884
5939
  options: [{ type: i0.Input }]
5885
5940
  };
5886
5941
 
@@ -6201,6 +6256,8 @@
6201
6256
 
6202
6257
  var ControlOptionsBase = /** @class */ (function () {
6203
6258
  function ControlOptionsBase() {
6259
+ /** Sets an attribute disable="disabled" */
6260
+ this.IsDisabled = false;
6204
6261
  /** to set type of view if Control is Vertical or Horizontal */
6205
6262
  this.ViewType = null;
6206
6263
  /** Allow to Pass Object With Body of Function which represent CustomValidation and massage for error massage */
@@ -6215,6 +6272,8 @@
6215
6272
  var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
6216
6273
  /**To set First Day Of Week to DatePicker */
6217
6274
  _this.FirstDayOfWeek = 1;
6275
+ /**To set Hour12Timer to DatePicker is 12 Hour or 24 Hour*/
6276
+ _this.Hour12Timer = true;
6218
6277
  /**To set PickerType to DatePicker is Calendar or Timer Or Both */
6219
6278
  _this.PickerType = exports.PickerType.Calendar;
6220
6279
  /**To set StartView to DatePicker is Year or Month Or Multi-Year */
@@ -6345,8 +6404,8 @@
6345
6404
  var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
6346
6405
  /** set Range Number to Textbox with type number with From-Value and To-value*/
6347
6406
  _this.NumberRange = new RangeNumber();
6348
- /**Prevent AutoComplete of textbox*/
6349
- _this.AutoComplete = "off";
6407
+ /**Prevent AutoComplete of textbox default value is "on" available values "on" and "off"*/
6408
+ _this.AutoComplete = "on";
6350
6409
  /** to set Direction of textbox if textbox is Arabic or English */
6351
6410
  _this.ForceDirection = null;
6352
6411
  /** to set Language of textbox if textbox language is Arabic or English */
@@ -6375,11 +6434,23 @@
6375
6434
  function RenderComponentService(componentFactoryResolver) {
6376
6435
  this.componentFactoryResolver = componentFactoryResolver;
6377
6436
  }
6378
- RenderComponentService.prototype.renderDynamicComponent = function (viewContainerRef, component, group, options) {
6437
+ RenderComponentService.prototype.renderDynamicComponent = function (viewContainerRef, component, group, options, size) {
6438
+ if (size === void 0) { size = 0; }
6379
6439
  var factory = this.componentFactoryResolver.resolveComponentFactory(component);
6380
6440
  var componentRef = viewContainerRef.createComponent(factory);
6381
6441
  componentRef.instance.group = group;
6382
6442
  componentRef.instance.options = options;
6443
+ if (size > 0) {
6444
+ var htmlElement = componentRef.hostView.rootNodes[0];
6445
+ // `element` is the element you want to wrap
6446
+ var parent = htmlElement.parentNode;
6447
+ var wrapper = document.createElement('div');
6448
+ wrapper.className = "col-md-" + size;
6449
+ // set the wrapper as child (instead of the element)
6450
+ parent.replaceChild(wrapper, htmlElement);
6451
+ // set element as child of wrapper
6452
+ wrapper.appendChild(htmlElement);
6453
+ }
6383
6454
  };
6384
6455
  return RenderComponentService;
6385
6456
  }());
@@ -7488,6 +7559,8 @@
7488
7559
  _this.IconPositionAR = exports.IconPosition.right;
7489
7560
  /*multi control placement type*/
7490
7561
  _this.MultiControlPlacementType = null;
7562
+ /**Prevent AutoComplete of inputs default value is "on" available values "on" and "off"*/
7563
+ _this.AutoComplete = "on";
7491
7564
  return _this;
7492
7565
  }
7493
7566
  return MultiLingualTextBoxOptions;