@encoreskytech/ng-char-limit-hint/bundles/encoreskytech-ng-char-limit-hint.umd.js

To initialize the char limit feature on text input

(function (global, factory) {
  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/platform-browser')) :
  typeof define === 'function' && define.amd ? define('@encoreskytech/ng-char-limit-hint', ['exports', '@angular/core', '@angular/platform-browser'], factory) :
  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.encoreskytech = global.encoreskytech || {}, global.encoreskytech['ng-char-limit-hint'] = {}), global.ng.core, global.ng.platformBrowser));
}(this, (function (exports, core, platformBrowser) { 'use strict';

  var CharLimitHintComponent = /** @class */ (function () {
      function CharLimitHintComponent() {
          this.maxCharLimit = 100;
          this.format = "";
          this.parentClass = "";
          this.hintTextClass = "";
      }
      CharLimitHintComponent.prototype.ngOnInit = function () {
          this.remainingCharCount = this.maxCharLimit;
          this.getFormattedResult();
      };
      CharLimitHintComponent.prototype.ngAfterViewInit = function () {
          var _this = this;
          if (this.content.nativeElement.hasChildNodes('input')) {
              this.content.nativeElement.firstElementChild.addEventListener('paste', function (event) {
                  var clipboardText = event.clipboardData.getData('text');
                  if (clipboardText.length > _this.remainingCharCount) {
                      event.target.value += clipboardText.substring(0, event.target.value.length > 0 ? _this.remainingCharCount : _this.maxCharLimit);
                      _this.remainingCharCount = 0;
                  }
                  else {
                      event.target.value += clipboardText;
                      _this.remainingCharCount = _this.remainingCharCount - clipboardText.length;
                  }
                  _this.getFormattedResult();
                  event.preventDefault();
              });
              this.content.nativeElement.firstElementChild.addEventListener('keydown', function (event) {
                  _this.remainCount(event);
              });
          }
          else {
              throw "Valid input element not found.";
          }
      };
      CharLimitHintComponent.prototype.remainCount = function (event) {
          if (!(event.getModifierState && (event.getModifierState('Control') || event.getModifierState('Meta')))) {
              if (this.isValidKey(event.keyCode)) {
                  var text = event.target.value;
                  var charLength = parseInt(text.length);
                  var selection = event.target.selectionEnd - event.target.selectionStart;
                  if ((event.keyCode == 8 || event.keyCode == 127)) {
                      if (selection > 0) {
                          charLength = text.length - selection;
                      }
                      else if (text.length <= 0) {
                          charLength = 0;
                      }
                      else if (text.length >= 1) {
                          charLength = text.length - 1;
                      }
                  }
                  else if (selection > 0) {
                      event.target.value = text.substr(0, event.target.selectionStart) + String.fromCharCode(event.keyCode) + text.substr(event.target.selectionEnd);
                      charLength = event.target.value.length;
                      this.remainingCharCount = this.maxCharLimit - charLength;
                      this.getFormattedResult();
                      event.preventDefault();
                      event.target.setSelectionRange(event.target.selectionStart, event.target.selectionStart);
                  }
                  else if (text.length == this.maxCharLimit) {
                      event.preventDefault();
                  }
                  else if (text.length >= 0) {
                      charLength = text.length + 1;
                  }
                  this.remainingCharCount = this.maxCharLimit - charLength;
                  this.getFormattedResult();
              }
          }
      };
      CharLimitHintComponent.prototype.getFormattedResult = function () {
          var result = this.format;
          if (this.format.length) {
              result = result.replace("REMAIN", this.remainingCharCount.toString());
              result = result.replace("TOTAL", this.maxCharLimit.toString());
              this.formattedRemainCharCount = result;
          }
          else {
              this.formattedRemainCharCount = this.remainingCharCount.toString();
          }
      };
      CharLimitHintComponent.prototype.isValidKey = function (keycode) {
          var valid = (keycode > 47 && keycode < 58) || // number keys
              keycode == 32 || keycode == 13 || // spacebar & return key(s) (if you want to allow carriage returns)
              (keycode > 64 && keycode < 91) || // letter keys
              (keycode > 95 && keycode < 112) || // numpad keys
              (keycode > 185 && keycode < 193) || // ;=,-./` (in order)
              (keycode > 218 && keycode < 223) ||
              (keycode == 8) ||
              (keycode == 127); // [\]' (in order)
          return valid;
      };
      return CharLimitHintComponent;
  }());
  CharLimitHintComponent.decorators = [
      { type: core.Component, args: [{
                  selector: 'ng-char-limit-hint',
                  template: "\n    <div #content [ngClass]=\"parentClass\">\n      <ng-content></ng-content>\n      <p [ngClass]=\"hintTextClass\"> {{formattedRemainCharCount}}</p>\n    </div>\n  ",
                  encapsulation: core.ViewEncapsulation.None
              },] }
  ];
  CharLimitHintComponent.ctorParameters = function () { return []; };
  CharLimitHintComponent.propDecorators = {
      content: [{ type: core.ViewChild, args: ['content', { static: false },] }],
      maxCharLimit: [{ type: core.Input }],
      format: [{ type: core.Input }],
      parentClass: [{ type: core.Input }],
      hintTextClass: [{ type: core.Input }]
  };

  var CharLimitHintModule = /** @class */ (function () {
      function CharLimitHintModule() {
      }
      return CharLimitHintModule;
  }());
  CharLimitHintModule.decorators = [
      { type: core.NgModule, args: [{
                  declarations: [CharLimitHintComponent],
                  imports: [platformBrowser.BrowserModule],
                  exports: [CharLimitHintComponent]
              },] }
  ];

  /**
   * Generated bundle index. Do not edit.
   */

  exports.CharLimitHintComponent = CharLimitHintComponent;
  exports.CharLimitHintModule = CharLimitHintModule;

  Object.defineProperty(exports, '__esModule', { value: true });

})));
//# sourceMappingURL=encoreskytech-ng-char-limit-hint.umd.js.map