@bnsights/bbsf-controls 1.0.103 → 1.0.104

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

@@ -5526,6 +5526,7 @@
             this.controlValidationService = controlValidationService;
             this.globalSettings = globalSettings;
             this.OnChange = new i0.EventEmitter();
+            this.OnBlur = new i0.EventEmitter();
             this.inputType = exports.InputType;
             this.MaskPattern = '';
             this.WordCount = 0;
@@ -5792,13 +5793,16 @@
             else
                 this.showCharsLimitMsg = false;
         };
+        TextboxComponent.prototype.onTextBlur = function () {
+            this.OnBlur.emit(this.TextBoxFormControl.value);
+        };
         return TextboxComponent;
     }());
     TextboxComponent.controlContainerstatic = null;
     TextboxComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'BBSF-TextBox',
-                    template: "<div class=\"form-group bbsf-control bbsf-textbox\" [formGroup]=\"group\">\r\n  <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n    <!--label-->\r\n    <label *ngIf=\"!options.HideLabel\" class=\"bbsf-label {{options.LabelExtraClasses}}\">\r\n      {{options.LabelValue}}\r\n      <!--Asterisk-->\r\n      <span *ngIf=\"((options.ShowAsterisk&&options.IsRequired)||(options.IsRequired))&&!options.IsReadonly\" class=\"text-danger\">*</span>\r\n    </label>\r\n    <!--MaskPattern-->\r\n    <div *ngIf=\"MaskPattern!=null&&MaskPattern!=''&&!options.IsReadonly\" class=\"bbsf-input-container\"\r\n      [ngClass]=\"options.EnableCopyToClipboard? 'p-40px' : '' \">\r\n      <!--Icon-->\r\n      <div *ngIf=\"options.Icon!=null\" class=\"svg svg-icon-grey bbsf-icon\" [ngClass]=\"(options.IconPosition==1)?'bbsf-left-icon':'bbsf-right-icon'\">\r\n        <span [inlineSVG]=\"options.Icon\"></span>\r\n      </div>\r\n      <!--input-->\r\n      <input class=\"form-control {{options.ExtraClasses}}\" [mask]=\"MaskPattern\" placeHolderCharacter=\" \" [showMaskTyped]=\"true\" [validation]=\"true\"\r\n        [dir]=\"textDir\" aria-describedby=\"email-error\" aria-invalid=\"true\" formControlName=\"{{options.Name}}\" type=\"{{getInputType(options.Type)}}\"\r\n        [(ngModel)]=\"options.Value\" [class.is-invalid]=\"TextBoxFormControl.invalid && TextBoxFormControl.touched\"\r\n        placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\" autocomplete=\"{{options.AutoComplete}}\" (change)=\"trimControlValue()\"\r\n        (keyup)=\"onTextChange()\" [readonly]=\"options.IsReadonly\"\r\n        (keydown)=\"WordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\" #userinput>\r\n      <!--CopyToClipboard-->\r\n      <span class=\"copy-clipboard\" ngbTooltip=\"Copied!\" *ngIf=\"options.EnableCopyToClipboard\" (click)=\"copyInputMessage(userinput)\">\r\n        <i class=\"fas fa-copy\"></i>\r\n      </span>\r\n    </div>\r\n    <!--NoMaskPattern-->\r\n    <div *ngIf=\"MaskPattern==null||MaskPattern==''&&!options.IsReadonly\" class=\"bbsf-input-container\"\r\n      [ngClass]=\"options.EnableCopyToClipboard? 'p-40px' : '' \">\r\n      <!--Icon-->\r\n      <div class=\"svg svg-icon-grey bbsf-icon\" [ngClass]=\"(options.IconPosition==1)?'bbsf-left-icon':'bbsf-right-icon'\" *ngIf=\"options.Icon!=null\">\r\n        <span [inlineSVG]=\"options.Icon\"></span>\r\n      </div>\r\n      <!--input-->\r\n      <input class=\"form-control {{options.ExtraClasses}} \" [dir]=\"textDir\" (focus)=\"onFocus(true)\" (focusout)=\"onFocus(false)\"\r\n        maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n        formControlName=\"{{options.Name}}\" type=\"{{getInputType(options.Type)}}\"\r\n        [class.is-invalid]=\"TextBoxFormControl.invalid && TextBoxFormControl.touched\" placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\"\r\n        autocomplete=\"{{options.AutoComplete}}\" (change)=\"trimControlValue()\" (keyup)=\"onTextChange()\" [(ngModel)]=\"options.Value\"\r\n        (keydown)=\"WordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\" [readonly]=\"options.IsReadonly\" #userinput>\r\n      <!--CopyToClipboard-->\r\n      <span class=\"copy-clipboard\" ngbTooltip=\"Copied!\" triggers=\"click:blur\" *ngIf=\"options.EnableCopyToClipboard\"\r\n        (click)=\"copyInputMessage(userinput)\">\r\n        <i class=\"fas fa-copy\"></i>\r\n      </span>\r\n    </div>\r\n    <!-- readonly -->\r\n    <div *ngIf=\"options.IsReadonly\">\r\n      <a *ngIf=\"options.Type==inputType.Email\" href=\"mailto: {{options.Value}}\">{{options.Value}}</a>\r\n      <a *ngIf=\"options.Type==inputType.URL\" href=\"{{options.Value}}\" target=\"_blank\">{{options.Value}}</a>\r\n      <span *ngIf=\"options.Type!=inputType.URL&&options.Type!=inputType.Email\" class=\"readonly-view\">{{options.Value}}</span>\r\n    </div>\r\n  </div>\r\n  <div class=\"subtext-container\">\r\n    <!--wordCount-->\r\n    <div class=\"bbsf-word-count\" *ngIf=\"options.MaxWordCount>0&&IsShowWordCount\">{{WordCount}}/{{options.MaxWordCount}}\r\n      Words</div>\r\n    <!-- CharsLimitMsg-->\r\n    <div class=\"bbsf-character-count\" *ngIf=\"showCharsLimitMsg\"\r\n      [ngClass]=\"{'badge-light-warning': charsLimitMsgClass === 'warning', 'badge-light-danger' : charsLimitMsgClass === 'danger' }\">\r\n      {{maxLimitWarningMsg}}\r\n    </div>\r\n    <!-- LabelDescription-->\r\n    <div class=\"bbsf-control-desc\" *ngIf=\"options.LabelDescription!=null\">{{options.LabelDescription}}</div>\r\n    <!-- requiredText-->\r\n    <div class=\"bbsf-validation\" [dir]=\"textDir\" *ngIf=\"(TextBoxFormControl.invalid && TextBoxFormControl.touched)\">\r\n      {{getErrorValidation(TextBoxFormControl.errors|keyvalue)}}\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty)\">{{resetError()}}</div>\r\n</div>"
+                    template: "<div class=\"form-group bbsf-control bbsf-textbox\" [formGroup]=\"group\">\r\n  <div [ngClass]=\"(options.ViewType==1)?'bbsf-vertical':'bbsf-horizontal'\">\r\n    <!--label-->\r\n    <label *ngIf=\"!options.HideLabel\" class=\"bbsf-label {{options.LabelExtraClasses}}\">\r\n      {{options.LabelValue}}\r\n      <!--Asterisk-->\r\n      <span *ngIf=\"((options.ShowAsterisk&&options.IsRequired)||(options.IsRequired))&&!options.IsReadonly\" class=\"text-danger\">*</span>\r\n    </label>\r\n    <!--MaskPattern-->\r\n    <div *ngIf=\"MaskPattern!=null&&MaskPattern!=''&&!options.IsReadonly\" class=\"bbsf-input-container\"\r\n      [ngClass]=\"options.EnableCopyToClipboard? 'p-40px' : '' \">\r\n      <!--Icon-->\r\n      <div *ngIf=\"options.Icon!=null\" class=\"svg svg-icon-grey bbsf-icon\" [ngClass]=\"(options.IconPosition==1)?'bbsf-left-icon':'bbsf-right-icon'\">\r\n        <span [inlineSVG]=\"options.Icon\"></span>\r\n      </div>\r\n      <!--input-->\r\n      <input class=\"form-control {{options.ExtraClasses}}\" [mask]=\"MaskPattern\" placeHolderCharacter=\" \" [showMaskTyped]=\"true\" [validation]=\"true\"\r\n        [dir]=\"textDir\" aria-describedby=\"email-error\" aria-invalid=\"true\" formControlName=\"{{options.Name}}\" type=\"{{getInputType(options.Type)}}\"\r\n        [(ngModel)]=\"options.Value\" [class.is-invalid]=\"TextBoxFormControl.invalid && TextBoxFormControl.touched\"\r\n        placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\" autocomplete=\"{{options.AutoComplete}}\" (change)=\"trimControlValue()\"\r\n        (keyup)=\"onTextChange()\" [readonly]=\"options.IsReadonly\"\r\n        (keydown)=\"WordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\" #userinput (blur)=\"onTextBlur()\">\r\n      <!--CopyToClipboard-->\r\n      <span class=\"copy-clipboard\" ngbTooltip=\"Copied!\" *ngIf=\"options.EnableCopyToClipboard\" (click)=\"copyInputMessage(userinput)\">\r\n        <i class=\"fas fa-copy\"></i>\r\n      </span>\r\n    </div>\r\n    <!--NoMaskPattern-->\r\n    <div *ngIf=\"MaskPattern==null||MaskPattern==''&&!options.IsReadonly\" class=\"bbsf-input-container\"\r\n      [ngClass]=\"options.EnableCopyToClipboard? 'p-40px' : '' \">\r\n      <!--Icon-->\r\n      <div class=\"svg svg-icon-grey bbsf-icon\" [ngClass]=\"(options.IconPosition==1)?'bbsf-left-icon':'bbsf-right-icon'\" *ngIf=\"options.Icon!=null\">\r\n        <span [inlineSVG]=\"options.Icon\"></span>\r\n      </div>\r\n      <!--input-->\r\n      <input class=\"form-control {{options.ExtraClasses}} \" [dir]=\"textDir\" (focus)=\"onFocus(true)\" (focusout)=\"onFocus(false)\"\r\n        maxlength=\"{{options.MaxLength}}\" minlength=\"{{options.MinLength}}\" aria-describedby=\"email-error\" aria-invalid=\"true\"\r\n        formControlName=\"{{options.Name}}\" type=\"{{getInputType(options.Type)}}\"\r\n        [class.is-invalid]=\"TextBoxFormControl.invalid && TextBoxFormControl.touched\" placeholder=\"{{options.Placeholder}}\" id=\"{{options.Name}}\"\r\n        autocomplete=\"{{options.AutoComplete}}\" (change)=\"trimControlValue()\" (keyup)=\"onTextChange()\" [(ngModel)]=\"options.Value\"\r\n        (keydown)=\"WordCountArray>options.MaxWordCount&&$event.keyCode !=8?$event.preventDefault():null\" [readonly]=\"options.IsReadonly\" #userinput\r\n        (blur)=\"onTextBlur()\">\r\n      <!--CopyToClipboard-->\r\n      <span class=\"copy-clipboard\" ngbTooltip=\"Copied!\" triggers=\"click:blur\" *ngIf=\"options.EnableCopyToClipboard\"\r\n        (click)=\"copyInputMessage(userinput)\">\r\n        <i class=\"fas fa-copy\"></i>\r\n      </span>\r\n    </div>\r\n    <!-- readonly -->\r\n    <div *ngIf=\"options.IsReadonly\">\r\n      <a *ngIf=\"options.Type==inputType.Email\" href=\"mailto: {{options.Value}}\">{{options.Value}}</a>\r\n      <a *ngIf=\"options.Type==inputType.URL\" href=\"{{options.Value}}\" target=\"_blank\">{{options.Value}}</a>\r\n      <span *ngIf=\"options.Type!=inputType.URL&&options.Type!=inputType.Email\" class=\"readonly-view\">{{options.Value}}</span>\r\n    </div>\r\n  </div>\r\n  <div class=\"subtext-container\">\r\n    <!--wordCount-->\r\n    <div class=\"bbsf-word-count\" *ngIf=\"options.MaxWordCount>0&&IsShowWordCount\">{{WordCount}}/{{options.MaxWordCount}}\r\n      Words</div>\r\n    <!-- CharsLimitMsg-->\r\n    <div class=\"bbsf-character-count\" *ngIf=\"showCharsLimitMsg\"\r\n      [ngClass]=\"{'badge-light-warning': charsLimitMsgClass === 'warning', 'badge-light-danger' : charsLimitMsgClass === 'danger' }\">\r\n      {{maxLimitWarningMsg}}\r\n    </div>\r\n    <!-- LabelDescription-->\r\n    <div class=\"bbsf-control-desc\" *ngIf=\"options.LabelDescription!=null\">{{options.LabelDescription}}</div>\r\n    <!-- requiredText-->\r\n    <div class=\"bbsf-validation\" [dir]=\"textDir\" *ngIf=\"(TextBoxFormControl.invalid && TextBoxFormControl.touched)\">\r\n      {{getErrorValidation(TextBoxFormControl.errors|keyvalue)}}\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty)\">{{resetError()}}</div>\r\n</div>"
                 },] }
     ];
     TextboxComponent.ctorParameters = function () { return [
@@ -5812,7 +5816,8 @@
     TextboxComponent.propDecorators = {
         group: [{ type: i0.Input }],
         options: [{ type: i0.Input }],
-        OnChange: [{ type: i0.Output }]
+        OnChange: [{ type: i0.Output }],
+        OnBlur: [{ type: i0.Output }]
     };
 
     var MapAutocompleteDTO = /** @class */ (function () {