@bnsights/bbsf-controls 1.0.49 → 1.0.52

package/bundles/bnsights-bbsf-controls.umd.js

@@ -857,6 +857,8 @@
             }
         };
         DateInputComponent.prototype.onDateSelect = function (item) {
+            if (!item)
+                return;
             var DateValue;
             var tzoffset = (new Date()).getTimezoneOffset() * 60000; //offset in milliseconds  
             if (this.options.SelectMode == 2) {
@@ -944,13 +946,13 @@
 
     exports.LanguageMode = void 0;
     (function (LanguageMode) {
-        LanguageMode[LanguageMode["Both_Languages_are_visible"] = 1] = "Both_Languages_are_visible";
-        LanguageMode[LanguageMode["English_Language_only_is_visible"] = 2] = "English_Language_only_is_visible";
-        LanguageMode[LanguageMode["Arabic_Language_only_is_visible"] = 3] = "Arabic_Language_only_is_visible";
-        LanguageMode[LanguageMode["Both_Languages_but_only_English_is_required"] = 4] = "Both_Languages_but_only_English_is_required";
-        LanguageMode[LanguageMode["Both_Languages_but_only_Arabic_is_required"] = 5] = "Both_Languages_but_only_Arabic_is_required";
-        LanguageMode[LanguageMode["Current_Language_only_is_visible_and_required"] = 6] = "Current_Language_only_is_visible_and_required";
-        LanguageMode[LanguageMode["Both_Languages_are_visible_but_only_current_language_is_required"] = 7] = "Both_Languages_are_visible_but_only_current_language_is_required";
+        LanguageMode["Both_Languages_are_visible"] = "3c6dbffe-da7f-4108-b44d-4b216a22f701";
+        LanguageMode["English_Language_only_is_visible"] = "84cc1d57-1f07-42a1-a38f-1a376c12a367";
+        LanguageMode["Arabic_Language_only_is_visible"] = "6a3e59e0-9510-4b16-9080-9313f5c9f229";
+        LanguageMode["Both_Languages_but_only_English_is_required"] = "260c38bb-c90c-4aa7-895d-31aba9311a05";
+        LanguageMode["Both_Languages_but_only_Arabic_is_required"] = "a1f2e15f-2691-4118-975f-ac21caf8ad5a";
+        LanguageMode["Current_Language_only_is_visible_and_required"] = "e2ba1f44-68f3-4035-b84f-9f1b6c2b0c05";
+        LanguageMode["Both_Languages_are_visible_but_only_current_language_is_required"] = "b26431f2-b209-4c41-ab04-2d71361847c2";
     })(exports.LanguageMode || (exports.LanguageMode = {}));
 
     var GlobalSettings = /** @class */ (function () {
@@ -1356,6 +1358,8 @@
             this.EnglishValidationRulesasync = [];
             this.IsShowArabicWordCount = false;
             this.IsShowEnglishWordCount = false;
+            this.IsShowAsteriskInArabic = false;
+            this.IsShowAsteriskInEnglish = false;
             this.markAllAsTouched = false;
             this.ArabicLetterOnly = "";
             this.EnglishLetterOnly = "";
@@ -1511,7 +1515,7 @@
                 //MaxLength should be gretaer than or equals chars limit so that minCharsLimit would be >= 0
                 if (this.options.MaxLength && this.minCharsLimit >= 0) {
                     this.englishCurrentCharsCount = this.EnglishFormControl.value.length;
-                    if (this.englishCurrentCharsCount >= this.minCharsLimit) {
+                    if (this.englishCurrentCharsCount > this.minCharsLimit) {
                         this.showEnglishCharsLimitMsg = true;
                         this.hasEnglishCharsLimitValidationError = true;
                         if (this.englishCurrentCharsCount == this.options.MaxLength)
@@ -1553,7 +1557,7 @@
                 //MaxLength should be gretaer than or equals chars limit so that minCharsLimit would be >= 0
                 if (this.options.MaxLength && this.minCharsLimit >= 0) {
                     this.arabicCurrentCharsCount = this.ArabicFormControl.value.length;
-                    if (this.arabicCurrentCharsCount >= this.minCharsLimit) {
+                    if (this.arabicCurrentCharsCount > this.minCharsLimit) {
                         this.showArabicCharsLimitMsg = true;
                         this.hasArabicCharsLimitValidationError = true;
                         if (this.arabicCurrentCharsCount == this.options.MaxLength)
@@ -1637,6 +1641,8 @@
                     if (this.options.IsRequired == true) {
                         this.EnglishValidationRules.push(forms.Validators.required);
                         this.ArabicValidationRules.push(forms.Validators.required);
+                        this.IsShowAsteriskInArabic = true;
+                        this.IsShowAsteriskInEnglish = true;
                     }
                     break;
                 case exports.LanguageMode.Arabic_Language_only_is_visible:
@@ -1651,11 +1657,13 @@
                     if (this.CurrentLanguage == 'ar') {
                         if (this.options.IsRequired == true) {
                             this.ArabicValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInArabic = true;
                         }
                     }
                     if (this.CurrentLanguage == 'en') {
                         if (this.options.IsRequired == true) {
                             this.EnglishValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInEnglish = true;
                         }
                     }
                     break;
@@ -1664,6 +1672,7 @@
                     this.ShowEnglishTextBox = true;
                     if (this.options.IsRequired == true) {
                         this.ArabicValidationRules.push(forms.Validators.required);
+                        this.IsShowAsteriskInArabic = true;
                     }
                     break;
                 case exports.LanguageMode.Both_Languages_but_only_English_is_required:
@@ -1671,6 +1680,7 @@
                     this.ShowEnglishTextBox = true;
                     if (this.options.IsRequired == true) {
                         this.EnglishValidationRules.push(forms.Validators.required);
+                        this.IsShowAsteriskInEnglish = true;
                     }
                     break;
                 case exports.LanguageMode.Current_Language_only_is_visible_and_required:
@@ -1679,6 +1689,7 @@
                         this.ShowEnglishTextBox = false;
                         if (this.options.IsRequired == true) {
                             this.ArabicValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInArabic = true;
                         }
                     }
                     if (this.CurrentLanguage == 'en') {
@@ -1686,6 +1697,7 @@
                         this.ShowEnglishTextBox = true;
                         if (this.options.IsRequired == true) {
                             this.EnglishValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInEnglish = true;
                         }
                     }
                     break;
@@ -1723,7 +1735,7 @@
     MultiLingualTextBoxComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'BBSF-MultiLingualTextBox',
-                    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",
+                    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)&&IsShowAsteriskInEnglish)\"\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))&&IsShowAsteriskInArabic\" 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",
                     styles: [".example-form{min-width:150px;max-width:500px;width:100%}.example-full-width{width:100%}\n"]
                 },] }
     ];
@@ -1879,7 +1891,7 @@
             //MaxLength should be gretaer than or equals chars limit so that minCharsLimit would be >= 0
             if (this.options.MaxLength && this.minCharsLimit >= 0) {
                 this.currentCharsCount = this.TextAreaFormControl.value.length;
-                if (this.currentCharsCount >= this.minCharsLimit) {
+                if (this.currentCharsCount > this.minCharsLimit) {
                     this.showCharsLimitMsg = true;
                     this.hasCharsLimitValidationError = true;
                     if (this.currentCharsCount == this.options.MaxLength)
@@ -2123,7 +2135,7 @@
                 //MaxLength should be gretaer than or equals chars limit so that minCharsLimit would be >= 0
                 if (this.options.MaxLength && this.minCharsLimit >= 0) {
                     this.englishCurrentCharsCount = this.EnglishTextAreaFormControl.value.length;
-                    if (this.englishCurrentCharsCount >= this.minCharsLimit) {
+                    if (this.englishCurrentCharsCount > this.minCharsLimit) {
                         this.showEnglishCharsLimitMsg = true;
                         this.hasEnglishCharsLimitValidationError = true;
                         if (this.englishCurrentCharsCount == this.options.MaxLength)
@@ -2165,7 +2177,7 @@
                 //MaxLength should be gretaer than or equals chars limit so that minCharsLimit would be >= 0
                 if (this.options.MaxLength && this.minCharsLimit >= 0) {
                     this.arabicCurrentCharsCount = this.ArabicTextAreaFormControl.value.length;
-                    if (this.arabicCurrentCharsCount >= this.minCharsLimit) {
+                    if (this.arabicCurrentCharsCount > this.minCharsLimit) {
                         this.showArabicCharsLimitMsg = true;
                         this.hasArabicCharsLimitValidationError = true;
                         if (this.arabicCurrentCharsCount == this.options.MaxLength)
@@ -2240,6 +2252,8 @@
                     if (this.options.IsRequired == true) {
                         this.EnglishValidationRules.push(forms.Validators.required);
                         this.ArabicValidationRules.push(forms.Validators.required);
+                        this.IsShowAsteriskInArabic = true;
+                        this.IsShowAsteriskInEnglish = true;
                     }
                     break;
                 case exports.LanguageMode.Arabic_Language_only_is_visible:
@@ -2254,11 +2268,13 @@
                     if (this.CurrentLanguage == 'ar') {
                         if (this.options.IsRequired == true) {
                             this.ArabicValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInArabic = true;
                         }
                     }
                     if (this.CurrentLanguage == 'en') {
                         if (this.options.IsRequired == true) {
                             this.EnglishValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInEnglish = true;
                         }
                     }
                     break;
@@ -2267,6 +2283,7 @@
                     this.ShowEngishTextArea = true;
                     if (this.options.IsRequired == true) {
                         this.ArabicValidationRules.push(forms.Validators.required);
+                        this.IsShowAsteriskInArabic = true;
                     }
                     break;
                 case exports.LanguageMode.Both_Languages_but_only_English_is_required:
@@ -2274,6 +2291,7 @@
                     this.ShowEngishTextArea = true;
                     if (this.options.IsRequired == true) {
                         this.EnglishValidationRules.push(forms.Validators.required);
+                        this.IsShowAsteriskInEnglish = true;
                     }
                     break;
                 case exports.LanguageMode.Current_Language_only_is_visible_and_required:
@@ -2282,6 +2300,7 @@
                         this.ShowEngishTextArea = false;
                         if (this.options.IsRequired == true) {
                             this.ArabicValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInArabic = true;
                         }
                     }
                     if (this.CurrentLanguage == 'en') {
@@ -2289,6 +2308,7 @@
                         this.ShowEngishTextArea = true;
                         if (this.options.IsRequired == true) {
                             this.EnglishValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInEnglish = true;
                         }
                     }
                     break;
@@ -2326,7 +2346,7 @@
     MultiLingualTextAreaComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'BBSF-MultiLingualTextArea',
-                    template: "<div class=\"b-control b-multilangual-textarea\">\r\n  <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n\r\n    <div class=\"form-group row\" [formGroup]=\"MultiLanguageTextAreagroup\">\r\n      <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n        <div class=\"row\" *ngIf=\"ShowEngishTextArea\">\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+\"in English\"}}\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\">\r\n              <textarea class=\"form-control bnsights-control\" rows=\"{{options.Rows}}\" cols=\"{{options.Cols}}\"\r\n                        (focus)=\"onEnglishFocus(true)\" (focusout)=\"onEnglishFocus(false)\"\r\n                        maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n                        aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n                        formControlName=\"English\" [hidden]=\"options.IsHideEnglishFields\"\r\n                        [class.is-invalid]=\"EnglishTextAreaFormControl.invalid && EnglishTextAreaFormControl.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                        #userinputTextAreaEnglish>\r\n                            </textarea>\r\n              <div class=\"input-group-append\" [hidden]=\"options.IsHideEnglishFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n                <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputTextAreaEnglish)\">\r\n                  <i class=\"fas fa-copy\"></i>\r\n                </span>\r\n              </div>\r\n\r\n\r\n            </div>\r\n            <div class=\"text-muted font-weight-500 float-end word-count\" *ngIf=\"options.MaxWordCount>0&&IsShowEnglishWordCount\">{{EnglishWordCount}}/{{options.MaxWordCount}}</div>\r\n            <div class=\"text-danger Required-text\"\r\n                 *ngIf=\"(EnglishTextAreaFormControl.invalid && EnglishTextAreaFormControl.touched)\">\r\n              {{getErrorValidation(EnglishTextAreaFormControl.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\r\n            <!-- <div *ngIf=\"EnglishTextAreaFormControl.valid\">{{resetError()}}</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          </div>\r\n        </div>\r\n      </div>\r\n      <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n        <div class=\"row\" *ngIf=\"ShowArabicTextArea\">\r\n\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+\"in Arabic\"}}\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          <div class=\" col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n            <div class=\"input-group\">\r\n              <textarea class=\"form-control bnsights-control\" dir=\"rtl\" rows=\"{{options.Rows}}\" cols=\"{{options.Cols}}\"\r\n                        (focus)=\"onArabicFocus(true)\" (focusout)=\"onArabicFocus(false)\"\r\n                        [hidden]=\"options.IsHideArabicFields\"\r\n                        aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n                        formControlName=\"Arabic\" rows=\"{{options.Rows}}\"\r\n                        maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n                        [class.is-invalid]=\"ArabicTextAreaFormControl.invalid && ArabicTextAreaFormControl.touched\"\r\n                        placeholder=\"{{options.ArabicPlaceholder}}\" (change)=\"trimControlValue('Ar')\"\r\n                        (keyup)=\"onTextChange()\"\r\n                        (keydown)=\"ArabicWordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n                        #userinputTextAreaArabic>\r\n                            </textarea>\r\n              <div class=\"input-group-append\" [hidden]=\"options.IsHideArabicFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n                <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputTextAreaArabic)\">\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\"\r\n                 *ngIf=\"(ArabicTextAreaFormControl.invalid && ArabicTextAreaFormControl.touched)\">\r\n              {{getErrorValidation(ArabicTextAreaFormControl.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=\"ArabicTextAreaFormControl.valid\">{{resetError()}}</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</div>\r\n",
+                    template: "<div class=\"b-control b-multilangual-textarea\">\r\n  <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n\r\n    <div class=\"form-group row\" [formGroup]=\"MultiLanguageTextAreagroup\">\r\n      <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n        <div class=\"row\" *ngIf=\"ShowEngishTextArea\">\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+\"in English\"}}\r\n            <span *ngIf=\"((options.ShowAsterisk&&options.IsRequired)||(options.IsRequired))&&IsShowAsteriskInEnglish\"\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\">\r\n              <textarea class=\"form-control bnsights-control\" rows=\"{{options.Rows}}\" cols=\"{{options.Cols}}\"\r\n                        (focus)=\"onEnglishFocus(true)\" (focusout)=\"onEnglishFocus(false)\"\r\n                        maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n                        aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n                        formControlName=\"English\" [hidden]=\"options.IsHideEnglishFields\"\r\n                        [class.is-invalid]=\"EnglishTextAreaFormControl.invalid && EnglishTextAreaFormControl.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                        #userinputTextAreaEnglish>\r\n                            </textarea>\r\n              <div class=\"input-group-append\" [hidden]=\"options.IsHideEnglishFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n                <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputTextAreaEnglish)\">\r\n                  <i class=\"fas fa-copy\"></i>\r\n                </span>\r\n              </div>\r\n\r\n\r\n            </div>\r\n            <div class=\"text-muted font-weight-500 float-end word-count\" *ngIf=\"options.MaxWordCount>0&&IsShowEnglishWordCount\">{{EnglishWordCount}}/{{options.MaxWordCount}}</div>\r\n            <div class=\"text-danger Required-text\"\r\n                 *ngIf=\"(EnglishTextAreaFormControl.invalid && EnglishTextAreaFormControl.touched)\">\r\n              {{getErrorValidation(EnglishTextAreaFormControl.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\r\n            <!-- <div *ngIf=\"EnglishTextAreaFormControl.valid\">{{resetError()}}</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          </div>\r\n        </div>\r\n      </div>\r\n      <div [ngClass]=\"(options.MultiControlPlacementType==1)?'col-md-12':'col-md-6'\">\r\n        <div class=\"row\" *ngIf=\"ShowArabicTextArea\">\r\n\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+\"in Arabic\"}}\r\n            <span *ngIf=\"((options.ShowAsterisk&&options.IsRequired)||(options.IsRequired))&&IsShowAsteriskInArabic\"\r\n                  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\">\r\n              <textarea class=\"form-control bnsights-control\" dir=\"rtl\" rows=\"{{options.Rows}}\" cols=\"{{options.Cols}}\"\r\n                        (focus)=\"onArabicFocus(true)\" (focusout)=\"onArabicFocus(false)\"\r\n                        [hidden]=\"options.IsHideArabicFields\"\r\n                        aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n                        formControlName=\"Arabic\" rows=\"{{options.Rows}}\"\r\n                        maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\"\r\n                        [class.is-invalid]=\"ArabicTextAreaFormControl.invalid && ArabicTextAreaFormControl.touched\"\r\n                        placeholder=\"{{options.ArabicPlaceholder}}\" (change)=\"trimControlValue('Ar')\"\r\n                        (keyup)=\"onTextChange()\"\r\n                        (keydown)=\"ArabicWordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\"\r\n                        #userinputTextAreaArabic>\r\n                            </textarea>\r\n              <div class=\"input-group-append\" [hidden]=\"options.IsHideArabicFields\" *ngIf=\"options.EnableCopyToClipboard\">\r\n                <span class=\"input-group-text\" (click)=\"copyInputMessage(userinputTextAreaArabic)\">\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\"\r\n                 *ngIf=\"(ArabicTextAreaFormControl.invalid && ArabicTextAreaFormControl.touched)\">\r\n              {{getErrorValidation(ArabicTextAreaFormControl.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=\"ArabicTextAreaFormControl.valid\">{{resetError()}}</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</div>\r\n",
                     styles: [".example-form{min-width:150px;max-width:500px;width:100%}.example-full-width{width:100%}\n"]
                 },] }
     ];
@@ -2614,7 +2634,7 @@
         { type: i0.Component, args: [{
                     // tslint:disable-next-line: component-selector
                     selector: 'BBSF-DropdownList',
-                    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",
+                    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]=\"options.NotFoundText\" [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",
                     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"]
                 },] }
     ];
@@ -2876,8 +2896,8 @@
             this.editorConfig = {
                 editable: !this.options.IsDisabled,
                 spellcheck: true,
-                height: this.options.Height.toString(),
-                minHeight: this.options.Height.toString(),
+                height: this.options.Height + "rem",
+                minHeight: this.options.Height + "rem",
                 maxHeight: 'auto',
                 width: 'auto',
                 minWidth: 'auto',
@@ -3376,6 +3396,8 @@
                     if (this.options.IsRequired == true) {
                         this.EnglishValidationRules.push(forms.Validators.required);
                         this.ArabicValidationRules.push(forms.Validators.required);
+                        this.IsShowAsteriskInArabic = true;
+                        this.IsShowAsteriskInEnglish = true;
                     }
                     break;
                 case exports.LanguageMode.Arabic_Language_only_is_visible:
@@ -3390,11 +3412,13 @@
                     if (this.CurrentLanguage == 'ar') {
                         if (this.options.IsRequired == true) {
                             this.ArabicValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInArabic = true;
                         }
                     }
                     if (this.CurrentLanguage == 'en') {
                         if (this.options.IsRequired == true) {
                             this.EnglishValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInEnglish = true;
                         }
                     }
                     break;
@@ -3403,6 +3427,7 @@
                     this.ShowEnglishHtmlEditor = true;
                     if (this.options.IsRequired == true) {
                         this.ArabicValidationRules.push(forms.Validators.required);
+                        this.IsShowAsteriskInArabic = true;
                     }
                     break;
                 case exports.LanguageMode.Both_Languages_but_only_English_is_required:
@@ -3410,6 +3435,7 @@
                     this.ShowEnglishHtmlEditor = true;
                     if (this.options.IsRequired == true) {
                         this.EnglishValidationRules.push(forms.Validators.required);
+                        this.IsShowAsteriskInEnglish = true;
                     }
                     break;
                 case exports.LanguageMode.Current_Language_only_is_visible_and_required:
@@ -3418,6 +3444,7 @@
                         this.ShowEnglishHtmlEditor = false;
                         if (this.options.IsRequired == true) {
                             this.ArabicValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInArabic = true;
                         }
                     }
                     if (this.CurrentLanguage == 'en') {
@@ -3425,6 +3452,7 @@
                         this.ShowEnglishHtmlEditor = true;
                         if (this.options.IsRequired == true) {
                             this.EnglishValidationRules.push(forms.Validators.required);
+                            this.IsShowAsteriskInEnglish = true;
                         }
                     }
                     break;
@@ -3442,7 +3470,7 @@
     MultiLingualHtmlEditorComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'BBSF-MultiLingualHtmlEditor',
-                    template: "<div class=\"b-control b-multilangual-html-editor\">\r\n    <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n\r\n        <div class=\"form-group row\" [formGroup]=\"MultilingualHtmlEditorgroup\">\r\n            <div class=\"col-lg-6\">\r\n                <div class=\"row\" *ngIf=\"ShowEnglishHtmlEditor\">\r\n                    <label class=\"b-label col-form-label col-sm-12 \" \r\n                        [ngClass]=\"(options.ViewType==1)?'col-md-9':'col-md-3'\"\r\n                        [hidden]=\"options.IsHideEnglishLabel\">\r\n                        {{(options.EnglishLabelValue!=null&&options.EnglishLabelValue!=\"\")?options.EnglishLabelValue:options.LabelValue+\"in English\"}}\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                      \r\n                            <angular-editor  class=\"form-control bnsights-control {{options.ExtraClasses_EN}} \" (change)=\"onTextChange('en')\"  [class.is-invalid]=\"EnglishHtmlEditorFormControl.invalid && EnglishHtmlEditorFormControl.touched\"\r\n                    formControlName=\"English\"  [config]=\"editorEnglishConfig\"></angular-editor>\r\n\r\n                            <div class=\"text-danger Required-text\"\r\n                            *ngIf=\"(EnglishHtmlEditorFormControl.invalid && EnglishHtmlEditorFormControl.touched)\">\r\n                            {{getErrorValidation(EnglishHtmlEditorFormControl.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 text-dark\">\r\n                                {{(options.EnglishLabelDescription!=null&&options.EnglishLabelDescription!=\"\")?options.EnglishLabelDescription:options.LabelDescription}}\r\n                            </div>\r\n                        </div>\r\n\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 class=\"col-lg-6\">\r\n                <div class=\"row\" *ngIf=\"ShowArabicHtmlEditor\">\r\n\r\n                    <label class=\"b-label col-form-label col-sm-12  \"\r\n                        [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n                        [hidden]=\"options.IsHideArabicLabel\">\r\n                        {{(options.ArabicLabelValue!=null&&options.ArabicLabelValue!=\"\")?options.ArabicLabelValue:options.LabelValue+\"in Arabic\"}}\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                    <div class=\" col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n                        \r\n\r\n                            <angular-editor  dir=\"rtl\"  class=\"form-control bnsights-control {{options.ExtraClasses_AR}} \" (change)=\"onTextChange('ar')\"    [class.is-invalid]=\"ArabicHtmlEditorFormControl.invalid && ArabicHtmlEditorFormControl.touched\"\r\n                              formControlName=\"Arabic\"  [config]=\"editorArabicConfig\"></angular-editor>\r\n\r\n                            <div class=\"text-danger Required-text\"\r\n                            *ngIf=\"(ArabicHtmlEditorFormControl.invalid && ArabicHtmlEditorFormControl.touched)\">\r\n                            {{getErrorValidation(ArabicHtmlEditorFormControl.errors|keyvalue)}}\r\n                        </div>\r\n\r\n                \r\n\r\n                        <div class=\"d-flex justify-content-between align-items-center\">\r\n                            <div class=\"control-desc text-dark\">\r\n                                {{(options.ArabicLabelDescription!=null&&options.ArabicLabelDescription!=\"\")?options.ArabicLabelDescription:options.LabelDescription}}\r\n                            </div>\r\n                        </div>\r\n\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\r\n\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n\r\n\r\n    </div>\r\n\r\n</div>\r\n",
+                    template: "<div class=\"b-control b-multilangual-html-editor\">\r\n    <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n\r\n        <div class=\"form-group row\" [formGroup]=\"MultilingualHtmlEditorgroup\">\r\n            <div class=\"col-lg-6\">\r\n                <div class=\"row\" *ngIf=\"ShowEnglishHtmlEditor\">\r\n                    <label class=\"b-label col-form-label col-sm-12 \" \r\n                        [ngClass]=\"(options.ViewType==1)?'col-md-9':'col-md-3'\"\r\n                        [hidden]=\"options.IsHideEnglishLabel\">\r\n                        {{(options.EnglishLabelValue!=null&&options.EnglishLabelValue!=\"\")?options.EnglishLabelValue:options.LabelValue+\"in English\"}}\r\n                        <span *ngIf=\"((options.ShowAsterisk&&options.IsRequired)||(options.IsRequired))&&IsShowAsteriskInEnglish\"\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                      \r\n                            <angular-editor  class=\"form-control bnsights-control {{options.ExtraClasses_EN}} \" (change)=\"onTextChange('en')\"  [class.is-invalid]=\"EnglishHtmlEditorFormControl.invalid && EnglishHtmlEditorFormControl.touched\"\r\n                    formControlName=\"English\"  [config]=\"editorEnglishConfig\"></angular-editor>\r\n\r\n                            <div class=\"text-danger Required-text\"\r\n                            *ngIf=\"(EnglishHtmlEditorFormControl.invalid && EnglishHtmlEditorFormControl.touched)\">\r\n                            {{getErrorValidation(EnglishHtmlEditorFormControl.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 text-dark\">\r\n                                {{(options.EnglishLabelDescription!=null&&options.EnglishLabelDescription!=\"\")?options.EnglishLabelDescription:options.LabelDescription}}\r\n                            </div>\r\n                        </div>\r\n\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 class=\"col-lg-6\">\r\n                <div class=\"row\" *ngIf=\"ShowArabicHtmlEditor\">\r\n\r\n                    <label class=\"b-label col-form-label col-sm-12  \"\r\n                        [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n                        [hidden]=\"options.IsHideArabicLabel\">\r\n                        {{(options.ArabicLabelValue!=null&&options.ArabicLabelValue!=\"\")?options.ArabicLabelValue:options.LabelValue+\"in Arabic\"}}\r\n                        <span *ngIf=\"((options.ShowAsterisk&&options.IsRequired)||(options.IsRequired))&&IsShowAsteriskInArabic\"\r\n                            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                        \r\n\r\n                            <angular-editor  dir=\"rtl\"  class=\"form-control bnsights-control {{options.ExtraClasses_AR}} \" (change)=\"onTextChange('ar')\"    [class.is-invalid]=\"ArabicHtmlEditorFormControl.invalid && ArabicHtmlEditorFormControl.touched\"\r\n                              formControlName=\"Arabic\"  [config]=\"editorArabicConfig\"></angular-editor>\r\n\r\n                            <div class=\"text-danger Required-text\"\r\n                            *ngIf=\"(ArabicHtmlEditorFormControl.invalid && ArabicHtmlEditorFormControl.touched)\">\r\n                            {{getErrorValidation(ArabicHtmlEditorFormControl.errors|keyvalue)}}\r\n                        </div>\r\n\r\n                \r\n\r\n                        <div class=\"d-flex justify-content-between align-items-center\">\r\n                            <div class=\"control-desc text-dark\">\r\n                                {{(options.ArabicLabelDescription!=null&&options.ArabicLabelDescription!=\"\")?options.ArabicLabelDescription:options.LabelDescription}}\r\n                            </div>\r\n                        </div>\r\n\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\r\n\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n\r\n\r\n    </div>\r\n\r\n</div>\r\n",
                     styles: [".example-form{min-width:150px;max-width:500px;width:100%}.example-full-width{width:100%}\n"]
                 },] }
     ];
@@ -4479,6 +4507,9 @@
             // this.group.addControl(this.options.Name, new FormControl(''));
             // this.TagInputControl = this.group.controls[this.options.Name]; //  new FormControl('',validationRules);
             this.TagsFormControl.setValue(this.options.Value);
+            if (this.options.IsRequired) {
+                this.validationRules.push(forms.Validators.required);
+            }
             if (this.options.CustomValidation.length > 0) {
                 var Validations = this.options.CustomValidation;
                 for (var index = 0; index < Validations.length; index++) {
@@ -4486,9 +4517,6 @@
                     this.validationRules.push(Validation.functionBody);
                 }
             }
-            if (this.options.IsRequired) {
-                this.validationRules.push(forms.Validators.required);
-            }
             this.TagsFormControl.setValidators(this.validationRules);
             this.TagsFormControl.setAsyncValidators(this.validationRulesasync);
             if (this.options.IsDisabled) {
@@ -4497,7 +4525,7 @@
             if (this.options.Value != undefined && this.options.Value != []) {
                 for (var index = 0; index < this.options.Value.length; index++) {
                     var element = this.options.Value[index];
-                    this.SelectedId.push(element.key);
+                    this.SelectedId.push(element.id);
                 }
                 this.tags = this.options.Value;
                 this.TagsFormControl.setValue(this.options.Value);
@@ -4531,7 +4559,7 @@
             this.controlUtility.CopyInputMessage(inputElement);
         };
         TagsInputComponent.prototype.searchFunctionFactory = function (Text) {
-            var Url = this.options.ActionURL + "?" + this.options.QueryParamName + "=" + Text + "&" + this.options.SelectedItemsParamName + "=" + this.SelectedId;
+            var Url = this.options.ActionURL + "?" + this.options.QueryParamName + "=" + encodeURIComponent(Text) + "&" + this.options.SelectedItemsParamName + "=" + this.SelectedId;
             if (this.options.ExtraFilters)
                 Url = Url + ("&" + this.options.ExtraFilters);
             var requestOptionsModel = new bbsfUtilities.RequestOptionsModel();
@@ -4541,7 +4569,7 @@
             return Model;
         };
         TagsInputComponent.prototype.AddTag = function (event, key) {
-            if (this.IsNoMatch == true && this.options.AllowNewSelection == false && (key.selected != null || key.selected != "")) {
+            if (this.IsNoMatch == true && this.options.AllowNewSelection == false && key.selected) {
                 this.TagsFormControl.setErrors({ "errorMassage": this.options.NoResultText });
                 this.TagsFormControl.markAsTouched();
                 this.TagsFormControl.invalid;
@@ -4553,28 +4581,39 @@
             }
             else if (this.IsNoMatch == true && event == "Enter" && this.options.AllowNewSelection && key.selected) {
                 if (!(this.tags.length >= this.options.MaxNumberTags)) {
-                    this.tags.push({ key: "", value: key.selected });
-                    key.selected = null;
+                    this.tags.push({ name: key.selected });
+                    this.group.get(this.options.Name).setValue(this.tags);
+                    this.group.get(this.options.Name).markAllAsTouched();
+                    this.group.updateValueAndValidity();
+                    if (this.group.get(this.options.Name).valid) {
+                        key.selected = null;
+                        return;
+                    }
+                    else
+                        this.tags.pop();
                 }
             }
         };
         TagsInputComponent.prototype.onTagsChanged = function (result) {
             //console.log(this.tags)
             if (result["change"] == "add") {
-                this.SelectedId.push(result.tag.key);
+                this.SelectedId.push(result.tag.id);
             }
             if (result["change"] == "remove") {
-                this.SelectedId = this.SelectedId.filter(function (item) { return item != result.tag.key; });
+                this.SelectedId = this.SelectedId.filter(function (item) { return item != result.tag.id; });
                 if (this.SelectedId.length == 0 && this.options.IsRequired == true) {
                     this.TagsFormControl.setErrors({ required: "" });
                     this.TagsFormControl.markAsTouched();
                     this.TagsFormControl.invalid;
                 }
             }
-            var originalValue = this.TagsFormControl.value.map(function (a) { return a.key; });
+            var originalValue = this.TagsFormControl.value.map(function (a) { return a.id; });
             if (this.options.PatchFunction && this.options.PatchPath && this.TagsFormControl.valid) {
                 this.controlUtility.patchControlValue(originalValue, this.options.PatchFunction, this.options.PatchPath);
             }
+            this.group.get(this.options.Name).setValue(this.tags);
+            this.TagsFormControl.updateValueAndValidity();
+            this.group.updateValueAndValidity();
             this.OnChange.emit(originalValue);
         };
         TagsInputComponent.prototype.onNoOptionsMatch = function (event) {
@@ -5369,7 +5408,7 @@
                 //MaxLength should be gretaer than or equals chars limit so that minCharsLimit would be >= 0
                 if (this.options.MaxLength && this.minCharsLimit >= 0) {
                     this.currentCharsCount = this.TextBoxFormControl.value.length;
-                    if (this.currentCharsCount >= this.minCharsLimit) {
+                    if (this.currentCharsCount > this.minCharsLimit) {
                         this.showCharsLimitMsg = true;
                         this.hasCharsLimitValidationError = true;
                         if (this.currentCharsCount == this.options.MaxLength)
@@ -5488,7 +5527,7 @@
                 if (_this.CurrentLanguage == 'en')
                     _this.mapsAPILoader["_config"]["localeId"] = "en-US";
                 _this.mapsAPILoader["_scriptLoadingPromise"] = null;
-                _this.mapsAPILoader["_config"]["apiKey"] = "AIzaSyA75ojhZhEhDaO3vfn3mxTY32sq5flAwlY&language=" + _this.CurrentLanguage;
+                _this.mapsAPILoader["_config"]["apiKey"] = bbsfUtilities.environment.BBSF_GoogleMapKey + "&language=" + _this.CurrentLanguage;
                 var ScriptTag = document.getElementById(_this.mapsAPILoader["_SCRIPT_ID"]);
                 if (ScriptTag)
                     ScriptTag.remove();
@@ -5499,7 +5538,7 @@
                 window.google = null;
                 _this.LazyMapsAPILoader = new core.LazyMapsAPILoader({
                     // &language=${UtilityService.CurrentLanguage}
-                    apiKey: "AIzaSyA75ojhZhEhDaO3vfn3mxTY32sq5flAwlY&language=" + _this.CurrentLanguage,
+                    apiKey: bbsfUtilities.environment.BBSF_GoogleMapKey + "&language=" + _this.CurrentLanguage,
                     libraries: ['places'],
                 }, _this.mapsAPILoader["_windowRef"], _this.mapsAPILoader["_documentRef"], _this.mapsAPILoader["_config"]["localeId"]);
                 _this.LazyMapsAPILoader.load().then(function () {
@@ -5595,18 +5634,17 @@
                     }));
                 });
             });
-            ;
             if (this.CurrentLanguage == 'ar')
                 this.mapsAPILoader["_config"]["localeId"] = "ar-EG";
             if (this.CurrentLanguage == 'en')
                 this.mapsAPILoader["_config"]["localeId"] = "en-US";
             this.mapsAPILoader["_scriptLoadingPromise"] = null;
-            this.mapsAPILoader["_config"]["apiKey"] = "AIzaSyA75ojhZhEhDaO3vfn3mxTY32sq5flAwlY&language=" + this.CurrentLanguage;
+            this.mapsAPILoader["_config"]["apiKey"] = bbsfUtilities.environment.BBSF_GoogleMapKey + "&language=" + this.CurrentLanguage;
             var leftSection = document.getElementById(this.mapsAPILoader["_SCRIPT_ID"]);
             if (leftSection)
                 leftSection.remove();
             this.LazyMapsAPILoader = new core.LazyMapsAPILoader({
-                apiKey: "AIzaSyA75ojhZhEhDaO3vfn3mxTY32sq5flAwlY&language=" + this.CurrentLanguage,
+                apiKey: bbsfUtilities.environment.BBSF_GoogleMapKey + "&language=" + this.CurrentLanguage,
                 libraries: ['places'],
             }, this.mapsAPILoader["_windowRef"], this.mapsAPILoader["_documentRef"], this.mapsAPILoader["_config"]["localeId"]);
             this.LazyMapsAPILoader.load();
@@ -5630,6 +5668,33 @@
                 this.MapAutoCompleteFormControl.disable();
             }
             if (this.options.Value != null) {
+                var germanAddress = {
+                    url: this.options.Value.GoogleMapsURL,
+                    placeID: this.options.Value.PlaceID,
+                    displayAddress: this.options.Value.Text,
+                    name: this.options.Value.Text,
+                    locality: {},
+                    state: {},
+                    country: {},
+                    geoLocation: { latitude: -1, longitude: -1 },
+                };
+                germanAddress.geoLocation.latitude = this.options.Value.Latitude;
+                germanAddress.geoLocation.longitude = this.options.Value.Longitude;
+                this.onGermanAddressMapped.emit(germanAddress);
+                this.GermanAddressMapped(germanAddress);
+                this.place = {
+                    url: this.options.Value.GoogleMapsURL,
+                    place_id: this.options.Value.PlaceID,
+                    formatted_address: this.options.Value.Text,
+                    name: this.options.Value.Text,
+                };
+                this.onAutocompleteSelected.emit(this.place);
+                this.AutocompleteSelected(this.place);
+                this.onLocationSelected.emit({
+                    latitude: this.options.Value.Latitude,
+                    longitude: this.options.Value.Longitude
+                });
+                this.group.controls[this.options.Name].setValue(this.MapAutoCompleteModel);
                 this.MapAutoCompleteFormControl.setValue(this.options.Value);
             }
             if (this.options.CustomValidation.length > 0) {
@@ -5651,6 +5716,8 @@
                     element.setAttribute(this.options.AttributeList[index].Key, this.options.AttributeList[index].value);
                 }
             }
+            var elementHTML = document.getElementById(this.options.Name);
+            elementHTML.value = this.MapAutoCompleteModel.Text;
         };
         MapAutoCompleteComponent.prototype.showGlobalError = function () {
             this.controlUtility.showGlobalError();
@@ -5695,7 +5762,7 @@
     MapAutoCompleteComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'BBSF-MapAutoComplete',
-                    template: "<div class=\"b-control b-map-auto-complete\">\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'\" [hidden]=\"options.HideLabel\">\r\n      {{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\r\n    <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n      <input class=\"form-control bnsights-control  {{options.ExtraClasses}} \"\r\n             value=\"{{MapAutoCompleteModel}}\"\r\n             aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n             \r\n             [class.is-invalid]=\"MapAutoCompleteFormControl.invalid && MapAutoCompleteFormControl.touched\"\r\n             placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\"\r\n             matGoogleMapsAutocomplete #search\r\n             (onAutocompleteSelected)=\"AutocompleteSelected($event)\"\r\n             (onLocationSelected)=\"LocationSelected($event)\"\r\n             (onGermanAddressMapped)=\"GermanAddressMapped($event)\" />\r\n\r\n    \r\n\r\n      <div class=\"text-danger Required-text\"\r\n      *ngIf=\"(MapAutoCompleteFormControl.invalid && MapAutoCompleteFormControl.touched)\">\r\n      {{getErrorValidation(MapAutoCompleteFormControl.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 text-dark\">{{options.LabelDescription}}</div>\r\n      </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    </div>\r\n  </div>\r\n</div>\r\n",
+                    template: "<div class=\"b-control b-map-auto-complete\">\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'\" [hidden]=\"options.HideLabel\">\r\n      {{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      <input class=\"form-control bnsights-control  {{options.ExtraClasses}} \"\r\n            [value]=\"MapAutoCompleteModel.Text\"\r\n            [address]=\"MapAutoCompleteModel.Text\"\r\n            value=\"{{MapAutoCompleteModel.Text}}\"\r\n             aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n             [class.is-invalid]=\"MapAutoCompleteFormControl.invalid && MapAutoCompleteFormControl.touched\"\r\n             placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\"\r\n             matGoogleMapsAutocomplete #search\r\n             (onAutocompleteSelected)=\"AutocompleteSelected($event)\"\r\n             (onLocationSelected)=\"LocationSelected($event)\"\r\n             (onGermanAddressMapped)=\"GermanAddressMapped($event)\"/>\r\n      <div class=\"text-danger Required-text\"\r\n      *ngIf=\"(MapAutoCompleteFormControl.invalid && MapAutoCompleteFormControl.touched)\">\r\n      {{getErrorValidation(MapAutoCompleteFormControl.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 text-dark\">{{options.LabelDescription}}</div>\r\n      </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    </div>\r\n  </div>\r\n</div>\r\n",
                     styles: [".example-form{min-width:150px;max-width:500px;width:100%}.example-full-width{width:100%}.flip_V{transform:scaleY(-1)}\n"]
                 },] }
     ];
@@ -6073,12 +6140,11 @@
         //Modal confirmation submit function
         ConfirmationModalComponent.prototype.submit = function () {
             var _this = this;
-            console.log("options in submit function");
-            console.log(this.options);
             var submitModel = this.options.ServiceSubmitModel;
             var submittedService = this.options.ServiceSubmitFunction.apply(null, submitModel);
             submittedService.subscribe(function (result) {
-                _this.modalService.dismissAll();
+                if (!_this.options.DisableModalDismiss)
+                    _this.modalService.dismissAll();
                 if (!_this.options.DisableSuccessNotification) {
                     if (!_this.options.SuccessNotificationMessage)
                         _this.options.SuccessNotificationMessage = _this.utilityService.getResourceValue("DeletedSuccessfully");
@@ -6364,6 +6430,7 @@
             /** Set value for item in  DropdownList  */
             _this.ItemTempletvalue = "value";
             _this.ForceDirection = exports.ForceDirection.English;
+            _this.NotFoundText = "";
             return _this;
         }
         return DropdownOptions;
@@ -6389,7 +6456,7 @@
             /** to set Direction of HtmlEditor  if HtmlEditor is Arabic or English  */
             _this.ForceDirection = exports.ForceDirection.English;
             /** Set Height For  */
-            _this.Height = 150;
+            _this.Height = 5;
             return _this;
         }
         return HtmlEditorOptions;
@@ -7634,7 +7701,7 @@
                         ngxTypeahead.NgxTypeaheadModule,
                         core.AgmCoreModule.forRoot({
                             // &language=${UtilityService.CurrentLanguage}
-                            apiKey: "AIzaSyA75ojhZhEhDaO3vfn3mxTY32sq5flAwlY",
+                            apiKey: bbsfUtilities.environment.BBSF_GoogleMapKey,
                             libraries: ['places'],
                         }),
                         googleMapsAutocomplete.MatGoogleMapsAutocompleteModule,
@@ -8111,6 +8178,8 @@
             this.DisableSuccessNotification = false;
             //If ="true" disable notification after submission error
             this.DisableErrorNotification = false;
+            //If ="true" disable prevent modal from dismiss automatically 
+            this.DisableModalDismiss = false;
         }
         return ConfirmationModalOptions;
     }());