bromcom-ui 2.3.56 → 2.3.60

package/dist/collection/components/molecules/input/input.js

@@ -1,1114 +0,0 @@
-import { Component, Prop, State, Event, Method, h, Watch, Listen, Host } from '@stencil/core';
-import cs from 'classnames';
-let id = 0;
-const defaultIcons = {
-  email: 'mail',
-  tel: 'phone',
-  search: 'search',
-  url: 'link'
-};
-const iconSizes = {
-  'small': 14,
-  'medium': 16,
-  'large': 18
-};
-export class BcmInput {
-  constructor() {
-    this.inputId = `input-${++id}`;
-    this.type = 'text';
-    this.value = '';
-    this.size = "medium";
-    this.noCaption = false;
-    this.noMargin = false;
-    this.captionType = 'default';
-    this.fullWidth = false;
-    this.disabled = false;
-    this.readonly = false;
-    this.clearable = false;
-    this.unit = null;
-    this.unitPrefix = null;
-    this.min = null;
-    this.max = null;
-    this.step = null;
-    this.hidden = false;
-    this.required = false;
-    this.disableWatchValue = false;
-    this.maxLength = null;
-    this.inValid = false;
-    this.hasFocus = false;
-    this.isBlur = false;
-    this.isPasswordVisible = false;
-  }
-  async setFocus() {
-    this.inputElement.focus();
-  }
-  async removeFocus() {
-    this.inputElement.blur();
-  }
-  async select() {
-    return this.inputElement.select();
-  }
-  async setValue(value) {
-    this.inputElement.value = value;
-    this.value = value;
-    this.handleChange();
-    return value;
-  }
-  async setClear() {
-    this.inputElement.value = '';
-    this.value = '';
-  }
-  async resetCaption() {
-    this.caption = this.captionCache;
-    this.captionType = this.captionTypeCache;
-    this.captionError = null;
-  }
-  async getValue() {
-    return this.value;
-  }
-  handleFocus() {
-    this.hasFocus = true;
-    this.focus.emit();
-  }
-  handleBlur() {
-    this.hasFocus = false;
-    this.isBlur = true;
-    if (this.type == "email") {
-      this.isEmailValid();
-    }
-    if (this.type == "tel") {
-      this.isTelValid();
-    }
-    this.blur.emit();
-  }
-  handleChange() {
-    this.value = this.inputElement.value;
-    this.change.emit(this.value);
-  }
-  handleInput() {
-    if (this.type == "number") {
-      if (this.decimal == "false") {
-        this.inputElement.value = this.inputElement.value.replace(/[^0-9-]/g, '');
-      }
-      else {
-        this.inputElement.value = this.inputElement.value.replace(/[^0-9.,-]/g, '');
-      }
-      this.inputElement.value = this.inputElement.value.replace(/(\..*)\./g, '$1').replace(/(\-.*)\-/g, '$1');
-    }
-    this.value = this.inputElement.value;
-    this.input.emit(this.value);
-  }
-  handleClear(e) {
-    this.inputElement.value = '';
-    this.value = '';
-    this.inputElement.focus();
-    this.change.emit(this.value);
-    this.clear.emit();
-    e.stopPropagation();
-  }
-  changePasswordVisibility() {
-    this.isPasswordVisible = !this.isPasswordVisible;
-  }
-  incrementNumber() {
-    if (!this.inValid && !this.disabled && !this.readonly) {
-      let step = this.getNumberStep();
-      let val = Number(this.value) + Number(step);
-      this.value = this.numberDecimal(val);
-    }
-  }
-  decrementNumber() {
-    if (!this.inValid && !this.disabled && !this.readonly) {
-      let step = this.getNumberStep();
-      let val = Number(this.value) - Number(step);
-      this.value = this.numberDecimal(val);
-    }
-  }
-  getNumberStep(step = Number(this.step)) {
-    let returnStep = 1;
-    if (step && Number(step) == step)
-      returnStep = step;
-    return Number(returnStep);
-  }
-  connectedCallback() {
-    this.changePasswordVisibility = this.changePasswordVisibility.bind(this);
-    this.handleChange = this.handleChange.bind(this);
-    this.handleBlur = this.handleBlur.bind(this);
-    this.handleFocus = this.handleFocus.bind(this);
-    this.handleInput = this.handleInput.bind(this);
-    this.handleClear = this.handleClear.bind(this);
-    this.incrementNumber = this.incrementNumber.bind(this);
-    this.decrementNumber = this.decrementNumber.bind(this);
-    this.valueCache = this.value;
-    this.captionCache = this.caption;
-    this.captionTypeCache = this.captionType;
-  }
-  validationRange(val = JSON.stringify({
-    "value": this.value,
-    "min": this.min,
-    "max": this.max
-  })) {
-    let cap = null;
-    let capType = null;
-    let returnValidation = true;
-    let item = JSON.parse(val);
-    let { length, value, min, max } = item;
-    length = parseFloat(length);
-    value = parseFloat(value);
-    min = parseFloat(min);
-    max = parseFloat(max);
-    length !== 0 && (value && (min && max && ((value < min || value > max) && (cap = "Please enter a value between " + min + " and " + max + ".",
-      capType = "error",
-      returnValidation = false)) || min && !max && (value < min && (cap = "Please enter a value greater than or equal to " + min + ".",
-      capType = "error",
-      returnValidation = false)) || !min && max && (value > max && (cap = "Please enter a value less than or equal to " + max + ".",
-      capType = "error",
-      returnValidation = false))));
-    this.setCaption(cap, capType);
-    return returnValidation;
-  }
-  setCaption(caption = null, captionType = null) {
-    this.caption = caption ? caption : this.captionCache;
-    this.captionType = captionType ? captionType : this.captionTypeCache;
-    this.captionError = captionType == "error" ? caption : null;
-  }
-  isEmailValid() {
-    const { value } = this;
-    const regexp = new RegExp(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/);
-    let cap = null;
-    let capType = null;
-    if (value && !regexp.test(value)) {
-      cap = "Please enter a valid email address.",
-        capType = "error",
-        this.inValid = true;
-    }
-    else {
-      this.inValid = false;
-    }
-    this.setCaption(cap, capType);
-    return this.inValid;
-  }
-  isTelValid() {
-    const { value } = this;
-    const regexp = new RegExp(/^(?=.*[0-9])[- +()0-9]+$/);
-    let cap = null;
-    let capType = null;
-    if (value && !regexp.test(value)) {
-      cap = "Please enter a valid phone number.",
-        capType = "error",
-        this.inValid = true;
-    }
-    else {
-      this.inValid = false;
-    }
-    this.setCaption(cap, capType);
-    return this.inValid;
-  }
-  isNumberValid(caption = "Invalid number", captionType = "error") {
-    const { value } = this;
-    if (value && Number(value) != value) {
-      this.inValid = true;
-      this.setCaption(caption, captionType);
-      return true;
-    }
-    this.inValid = false;
-    return false;
-  }
-  setNumberUnit() {
-    const { value, unit } = this;
-    if (Number(value) == value && (unit === null || unit === void 0 ? void 0 : unit.length) > 0 && !value)
-      this.value = 0;
-  }
-  numberDecimal(val = '') {
-    let decLen = this.getDecimalLength();
-    if (val && decLen)
-      return parseFloat(val).toFixed(decLen);
-    return val;
-  }
-  numberNotDecimal(val = 0) {
-    return Math.trunc(val);
-  }
-  getDecimalLength() {
-    const { step } = this;
-    var decimalNumber = null;
-    let returnDecimalLength = 0, splitted, splitDec;
-    if (decimalNumber && Number(decimalNumber) == decimalNumber) {
-      returnDecimalLength = decimalNumber;
-    }
-    else if (!decimalNumber && step && Number(step) == step) {
-      if (String(step).includes(".")) {
-        splitted = String(step).split('.');
-        splitDec = splitted[splitted.length - 1].length;
-      }
-      else {
-        splitDec = 0;
-      }
-      returnDecimalLength = splitDec;
-    }
-    return Number(returnDecimalLength);
-  }
-  componentWillRender() {
-    const { type } = this;
-    if (type == "number" && this.value) {
-      if (!this.isNumberValid()) {
-        this.validationRange();
-      }
-    }
-    if (this.isBlur) {
-      if (type == "email" && this.value) {
-        this.isEmailValid();
-      }
-      if (type == "tel" && this.value) {
-        this.isTelValid();
-      }
-    }
-  }
-  componentWillLoad() {
-    const { type, value } = this;
-    if (type == "number" && Number(value) == value) {
-      this.value = this.numberDecimal(value);
-    }
-  }
-  numberControl(e) {
-    if (!this.disabled && !this.readonly) {
-      if (this.type == "number") {
-        var which = e.which || 0;
-        var key = e.key;
-        which == 38 && ( // up arrow
-        e.preventDefault(),
-          this.incrementNumber());
-        which == 40 && ( // down arrow
-        e.preventDefault(),
-          this.decrementNumber());
-        key == "." && String(this.value).includes(".") && ( // dot: shouldn't be more than one
-        e.preventDefault());
-        if (which == 8 || //backspace / delete
-          which == 9 || //tab
-          which == 13 || //enter
-          which == 16 || //shift
-          which == 17 || //ctrl
-          which == 18 || //alt
-          which == 46 || //delete
-          (which == 110 && (this.type == 'number' && this.decimal != false)) || //decimal point
-          // (which == 188 && key == ",") || //comma
-          (which == 190 && key == "." && (this.type == 'number' && this.decimal != false)) || //period
-          (which == 189 && this.inputElement.value.length == 0) || //-
-          (which == 109 && this.inputElement.value.length == 0) || //-
-          (which >= 35 && which <= 40) || //end, home, left arrow, up arrow, right arrow, down arrow
-          (which >= 48 && which <= 57) || //0-9
-          (which >= 96 && which <= 105) //0-9(numpad)
-        )
-          return true;
-        e.preventDefault();
-        if (this.decimal == true) {
-          this.value = this.numberDecimal(this.value);
-        }
-        else if (this.decimal == false) {
-          this.value = this.numberNotDecimal(this.value);
-        }
-      }
-    }
-  }
-  whatchHasFocus() {
-    const { type, hasFocus, value, valueCache, inValid } = this;
-    if (type == "number") {
-      this.isNumberValid();
-      let inValidState = false;
-      if (hasFocus == true) {
-        if (inValid == true) {
-          this.value = '';
-          inValidState = true;
-        }
-      }
-      else {
-        if (this.value == '' && inValid == false) {
-          this.value = valueCache;
-          inValidState = true;
-        }
-        if (value != valueCache && inValid == false && inValidState == false) {
-          this.value = value ? this.numberDecimal(value) : '';
-        }
-      }
-    }
-  }
-  watchValue() {
-    if (!this.disableWatchValue && this.type != 'number') {
-      this.handleChange();
-    }
-  }
-  render() {
-    const { value, size, label, type, captionType, caption, captionError, placeholder, fullWidth, disabled, readonly, clearable, passwordToggle, isPasswordVisible, noDefaultIcon, unit, inValid, hasFocus, unitPrefix, noCaption, required } = this;
-    const containerClasses = cs('input-container', {
-      'full-width': fullWidth,
-      'error': captionType == 'error' ? true : false
-    });
-    const baseClasses = cs('input-base', 'input-' + size, {
-      'invalid': inValid,
-      'unit': (unit === null || unit === void 0 ? void 0 : unit.length) > 0,
-      'focused': hasFocus,
-      'disabled': disabled,
-      'readonly': readonly,
-      'empty': (value === null || value === void 0 ? void 0 : value.length) < 1
-    });
-    const inputClass = size === 'large' ? 'size-3' : 'size-2';
-    const captionClasses = cs('size-1', 'input-caption', 'caption-' + captionType);
-    const hostClasses = cs(this.hidden ? 'hidden' : null, this.noMargin ? 'no-margin' : null);
-    return (h(Host, { class: hostClasses },
-      h("div", { class: containerClasses },
-        label && h("label", { htmlFor: this.inputId, class: "label size-1" },
-          " ",
-          label,
-          " ",
-          required && ('*'),
-          " "),
-        h("div", { class: baseClasses },
-          h("span", { class: "input-prefix" },
-            h("slot", { name: "prefix" }),
-            unitPrefix && h("span", { class: cs(inputClass, 'unit-prefix') }, unitPrefix)),
-          h("input", { "bcm-internal-id": this._id, id: this.inputId, class: inputClass, ref: el => (this.inputElement = el), onFocus: this.handleFocus, onBlur: this.handleBlur, onChange: this.handleChange, onInput: this.handleInput, maxLength: this.maxLength, type: type === 'password' && isPasswordVisible ? 'text' :
-              type === 'number' ? 'text' : type, placeholder: placeholder, value: type === 'number' && !this.hasFocus
-              ? value + (value && (unit === null || unit === void 0 ? void 0 : unit.length) > 0 ? ' ' + unit : '')
-              : value, disabled: this.disabled, readonly: this.readonly }),
-          clearable && !this.disabled && (h("button", { class: "input-clear-button", onClick: this.handleClear },
-            h("bcm-icon", { icon: "close-circle", type: "fill", size: iconSizes[size], color: "grey-7" }))),
-          type === 'password' && passwordToggle && (h("button", { class: "input-password-toggle", onClick: this.changePasswordVisibility },
-            h("bcm-icon", { icon: isPasswordVisible ? "eye-invisible" : "eye", type: "outlined", size: iconSizes[size], color: "grey-7" }))),
-          Object.keys(defaultIcons).includes(type) && !noDefaultIcon && (h("span", { class: "input-suffix default-icon" },
-            h("bcm-icon", { icon: defaultIcons[type], type: "outlined", size: iconSizes[size], color: "grey-7" }))),
-          type === 'number' && (h("div", { class: cs('caret-container', { 'unit': (unit === null || unit === void 0 ? void 0 : unit.length) > 0 }, { 'disabled': inValid }, { 'disabled': readonly }) },
-            h("span", { class: "caret", onClick: inValid == false && this.incrementNumber },
-              h("bcm-icon", { icon: "caret-up", type: "outlined", color: "grey-7", size: 8 })),
-            h("span", { class: "caret", onClick: inValid == false && this.decrementNumber },
-              h("bcm-icon", { icon: "caret-down", type: "outlined", color: "grey-7", size: 8 })))),
-          type !== 'number' && (h("span", { class: "input-suffix" },
-            h("slot", { name: "suffix" })))),
-        !noCaption && (h("div", { class: "caption-area" }, captionType == "error"
-          ? h("span", { class: captionClasses },
-            " ",
-            captionError,
-            " ")
-          : caption && h("span", { class: captionClasses },
-            " ",
-            caption,
-            " "))))));
-  }
-  static get is() { return "bcm-input"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["input.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["input.css"]
-  }; }
-  static get properties() { return {
-    "type": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "type",
-      "reflect": false,
-      "defaultValue": "'text'"
-    },
-    "value": {
-      "type": "any",
-      "mutable": true,
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "value",
-      "reflect": false,
-      "defaultValue": "''"
-    },
-    "size": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'small' | 'medium' | 'large'",
-        "resolved": "\"large\" | \"medium\" | \"small\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "size",
-      "reflect": false,
-      "defaultValue": "\"medium\""
-    },
-    "label": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "label",
-      "reflect": false
-    },
-    "noCaption": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "no-caption",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "noMargin": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "no-margin",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "captionError": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "caption-error",
-      "reflect": false
-    },
-    "caption": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "caption",
-      "reflect": false
-    },
-    "captionType": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'primary' | 'success' | 'warning' | 'error' | 'default'",
-        "resolved": "\"default\" | \"error\" | \"primary\" | \"success\" | \"warning\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "caption-type",
-      "reflect": false,
-      "defaultValue": "'default'"
-    },
-    "placeholder": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "placeholder",
-      "reflect": false
-    },
-    "fullWidth": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "full-width",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "disabled",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "readonly": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "readonly",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "clearable": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "clearable",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "passwordToggle": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "password-toggle",
-      "reflect": false
-    },
-    "noDefaultIcon": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "no-default-icon",
-      "reflect": false
-    },
-    "_id": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "id",
-      "reflect": true
-    },
-    "name": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "name",
-      "reflect": true
-    },
-    "unit": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "unit",
-      "reflect": false,
-      "defaultValue": "null"
-    },
-    "unitPrefix": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "unit-prefix",
-      "reflect": false,
-      "defaultValue": "null"
-    },
-    "decimal": {
-      "type": "any",
-      "mutable": false,
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "decimal",
-      "reflect": false
-    },
-    "min": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "min",
-      "reflect": false,
-      "defaultValue": "null"
-    },
-    "max": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "max",
-      "reflect": false,
-      "defaultValue": "null"
-    },
-    "step": {
-      "type": "any",
-      "mutable": false,
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "step",
-      "reflect": false,
-      "defaultValue": "null"
-    },
-    "hidden": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "hidden",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "required": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "required",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "disableWatchValue": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "disable-watch-value",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "maxLength": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "max-length",
-      "reflect": false,
-      "defaultValue": "null"
-    }
-  }; }
-  static get states() { return {
-    "inValid": {},
-    "valueCache": {},
-    "captionCache": {},
-    "captionTypeCache": {},
-    "hasFocus": {},
-    "isPasswordVisible": {}
-  }; }
-  static get events() { return [{
-      "method": "focus",
-      "name": "bcm-focus",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
-      "method": "blur",
-      "name": "bcm-blur",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
-      "method": "clear",
-      "name": "bcm-clear",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
-      "method": "change",
-      "name": "bcm-change",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
-      "method": "input",
-      "name": "bcm-input",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-  static get methods() { return {
-    "setFocus": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "removeFocus": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "select": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "setValue": {
-      "complexType": {
-        "signature": "(value: any) => Promise<any>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<any>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "setClear": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "resetCaption": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "getValue": {
-      "complexType": {
-        "signature": "() => Promise<any>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<any>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    }
-  }; }
-  static get watchers() { return [{
-      "propName": "hasFocus",
-      "methodName": "whatchHasFocus"
-    }, {
-      "propName": "value",
-      "methodName": "watchValue"
-    }]; }
-  static get listeners() { return [{
-      "name": "keydown",
-      "method": "numberControl",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }]; }
-}