@progress/kendo-vue-inputs 5.3.0-dev.202409130647 → 5.3.0-develop.1

package/dist/npm/maskedtextbox/MaskedTextBox.js

@@ -1,531 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.MaskedTextBoxVue2 = exports.MaskedTextBox = void 0;
-// @ts-ignore
-var Vue = require("vue");
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-var ref = allVue.ref;
-var masking_service_1 = require("./masking.service");
-var utils_1 = require("./utils");
-var kendo_vue_common_1 = require("@progress/kendo-vue-common");
-var package_metadata_1 = require("../package-metadata");
-var kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
-/**
- * @hidden
- */
-var MaskedTextBoxVue2 = {
-  model: {
-    event: 'changemodel'
-  },
-  // @ts-ignore
-  emits: ['change', 'focus', 'blur', 'update:modelValue', 'update:modelRawValue', 'changemodel'],
-  props: {
-    type: {
-      type: String,
-      default: 'text'
-    },
-    modelValue: String,
-    modelRawValue: String,
-    value: String,
-    defaultValue: String,
-    placeholder: String,
-    title: String,
-    dir: String,
-    id: String,
-    ariaLabelledBy: String,
-    ariaDescribedBy: String,
-    tabIndex: Number,
-    accessKey: String,
-    disabled: Boolean,
-    readonly: Boolean,
-    size: {
-      type: String,
-      default: 'medium',
-      validator: function validator(value) {
-        return [null, 'small', 'medium', 'large'].includes(value);
-      }
-    },
-    rounded: {
-      type: String,
-      default: 'medium',
-      validator: function validator(value) {
-        return [null, 'small', 'medium', 'large', 'full'].includes(value);
-      }
-    },
-    fillMode: {
-      type: String,
-      default: 'solid',
-      validator: function validator(value) {
-        return [null, 'solid', 'flat', 'outline'].includes(value);
-      }
-    },
-    prompt: {
-      type: String,
-      default: '_'
-    },
-    promptPlaceholder: {
-      type: String,
-      default: ' '
-    },
-    includeLiterals: {
-      type: Boolean,
-      default: false
-    },
-    maskValidation: {
-      type: Boolean,
-      default: true
-    },
-    mask: String,
-    rules: {
-      type: Object,
-      default: function _default() {
-        return utils_1.defaultRules;
-      }
-    },
-    selection: Object,
-    name: String,
-    label: String,
-    validationMessage: String,
-    required: {
-      type: Boolean,
-      default: false
-    },
-    valid: {
-      type: Boolean,
-      default: undefined
-    },
-    validityStyles: {
-      type: Boolean,
-      default: true
-    },
-    iconName: String,
-    inputPrefix: kendo_vue_common_1.templateDefinition,
-    inputSuffix: kendo_vue_common_1.templateDefinition,
-    showValidationIcon: Boolean,
-    showLoadingIcon: Boolean,
-    showClearButton: Boolean,
-    inputClass: String,
-    wrapperClass: String
-  },
-  data: function data() {
-    return {
-      currentValue: undefined,
-      currentFocused: false,
-      inputValue: undefined,
-      currentSelection: [null, null]
-    };
-  },
-  created: function created() {
-    (0, kendo_vue_common_1.validatePackage)(package_metadata_1.packageMetadata);
-    this.hasMounted = false;
-    this.valueDuringOnChange = undefined;
-    this.inputId = "k-".concat((0, kendo_vue_common_1.guid)());
-    this.service = new masking_service_1.MaskingService();
-    this.isPasted = false;
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    var inputRef = ref(null);
-    return {
-      v3: v3,
-      inputRef: inputRef
-    };
-  },
-  mounted: function mounted() {
-    this.hasMounted = true;
-    // @ts-ignore
-    this.element = this.input = this.v3 ? this.inputRef : this.$refs.input;
-    this.updateService();
-    this.setValidity();
-  },
-  watch: {
-    currentFocused: function currentFocused(_, oldValue) {
-      this.prevCurrentFocused = oldValue;
-    },
-    selection: function selection(_, oldValue) {
-      this.prevSelection = oldValue;
-    },
-    includeLiterals: function includeLiterals(_, oldValue) {
-      this.prevIncludeLiterals = oldValue;
-    },
-    mask: function mask(_, oldValue) {
-      this.prevMask = oldValue;
-    },
-    prompt: function prompt(_, oldValue) {
-      this.prevPrompt = oldValue;
-    },
-    promptPlaceholder: function promptPlaceholder(_, oldValue) {
-      this.prevPromptPlaceholder = oldValue;
-    },
-    rules: function rules(_, oldValue) {
-      this.prevRules = oldValue;
-    }
-  },
-  updated: function updated() {
-    if (this.element && this.currentFocused) {
-      // && this.prevCurrentFocused
-      var _a = this.currentSelection,
-        start = _a[0],
-        end = _a[1];
-      var prevSelection = this.prevSelection;
-      var nextSelection = this.$props.selection;
-      if (!prevSelection && nextSelection || prevSelection && nextSelection && (prevSelection.start !== nextSelection.start || prevSelection.end !== nextSelection.end)) {
-        start = nextSelection.start;
-        end = nextSelection.end;
-      }
-      if (start !== null && end !== null) {
-        this.element.setSelectionRange(start, end);
-      }
-    }
-    var prevProps = {
-      includeLiterals: this.prevIncludeLiterals,
-      mask: this.prevMask,
-      prompt: this.prevPrompt,
-      promptPlaceholder: this.prevPromptPlaceholder,
-      rules: this.prevRules
-    };
-    if ((0, utils_1.maskingChanged)(prevProps, this.$props)) {
-      this.updateService();
-    }
-    this.setValidity();
-  },
-  computed: {
-    computedRules: {
-      get: function get() {
-        return Object.assign({}, utils_1.defaultRules, this.$props.rules);
-      }
-    },
-    spanClassNames: {
-      get: function get() {
-        var _a;
-        var isValid = !this.hasMounted || !this.$props.validityStyles || this.validity().valid;
-        return _a = {
-          'k-floating-label-container': true,
-          'k-focus': this.currentFocused,
-          'k-empty': !this.computedValue(),
-          'k-invalid': !isValid && isValid !== undefined,
-          'k-rtl': this.$props.dir === 'rtl',
-          'k-loading': this.showLoadingIcon
-        }, _a[this.wrapperClass] = this.wrapperClass, _a;
-      }
-    },
-    wrapperSpanClass: function wrapperSpanClass() {
-      var _a;
-      var _b = this.$props,
-        size = _b.size,
-        fillMode = _b.fillMode,
-        rounded = _b.rounded;
-      var isValid = !this.$props.validityStyles || this.validity().valid;
-      return _a = {
-        'k-maskedtextbox': true,
-        'k-input': true
-      }, _a["k-input-".concat(kendo_vue_common_1.kendoThemeMaps.sizeMap[size] || size)] = size, _a["k-input-".concat(fillMode)] = fillMode, _a["k-rounded-".concat(kendo_vue_common_1.kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded, _a['k-invalid'] = !isValid, _a['k-required'] = this.required, _a['k-disabled'] = this.$props.disabled, _a['k-loading'] = this.showLoadingIcon, _a[this.wrapperClass] = this.wrapperClass, _a;
-    },
-    inputInnerClass: function inputInnerClass() {
-      var _a;
-      return _a = {
-        'k-input-inner': true
-      }, _a[this.inputClass] = this.inputClass, _a;
-    }
-  },
-  methods: {
-    focus: function focus() {
-      if (this.input) {
-        this.input.focus();
-      }
-    },
-    computedValue: function computedValue() {
-      var value;
-      if (this.valueDuringOnChange !== undefined) {
-        value = this.valueDuringOnChange;
-      } else if (this.$props.value !== undefined) {
-        value = this.$props.value;
-      } else if (this.$props.modelValue !== undefined) {
-        value = this.$props.modelValue;
-      } else if (this.currentValue !== undefined) {
-        value = this.currentValue;
-      } else if (this.$props.defaultValue !== undefined) {
-        value = this.$props.defaultValue;
-      }
-      return value || '';
-    },
-    rawValue: function rawValue() {
-      return this.service.rawValue(this.computedValue());
-    },
-    validity: function validity() {
-      var maskedValue = this.computedValue();
-      var value = this.service.validationValue(maskedValue);
-      var customError = this.$props.validationMessage !== undefined;
-      var valid = this.$props.valid !== undefined ? this.$props.valid : (!this.$props.required || !!value) && (!this.$props.maskValidation || !this.$props.prompt || maskedValue.indexOf(this.$props.prompt) === -1);
-      return {
-        customError: customError,
-        valid: valid,
-        valueMissing: !value
-      };
-    },
-    pasteHandler: function pasteHandler(event) {
-      var _a = event.target,
-        selectionStart = _a.selectionStart,
-        selectionEnd = _a.selectionEnd;
-      if (selectionEnd === selectionStart) {
-        return;
-      }
-      this.isPasted = true;
-      this.currentSelection = [selectionStart || 0, selectionEnd || 0];
-    },
-    clearClick: function clearClick(event) {
-      this.triggerOnChange('', event);
-    },
-    onChangeHandler: function onChangeHandler(event) {
-      var input = event.currentTarget;
-      var value = this.inputValue = input.value;
-      var start = this.currentSelection[0] || 0;
-      var end = this.currentSelection[1] || 0;
-      if (!this.$props.mask) {
-        this.isPasted = false;
-        this.currentSelection = [null, null];
-        this.triggerOnChange(value, event);
-        return;
-      }
-      var maskedValue = this.computedValue();
-      var result;
-      if (this.isPasted) {
-        this.isPasted = false;
-        var rightPart = maskedValue.length - end;
-        var to = value.length - rightPart;
-        result = this.service.maskInRange(value.slice(start, to), maskedValue, start, end);
-      } else {
-        result = this.service.maskInput(value, maskedValue, input.selectionStart || 0);
-      }
-      this.currentSelection = [result.selection, result.selection];
-      this.triggerOnChange(result.value, event);
-      this.inputValue = undefined;
-    },
-    focusHandler: function focusHandler(event) {
-      if (!this.currentFocused) {
-        this.currentFocused = true;
-        this.$emit('focus', {
-          target: this,
-          event: event
-        });
-      }
-    },
-    blurHandler: function blurHandler(event) {
-      if (this.currentFocused) {
-        this.currentFocused = false;
-        this.$emit('blur', {
-          target: this,
-          event: event
-        });
-      }
-    },
-    triggerOnChange: function triggerOnChange(maskedValue, event) {
-      this.currentValue = maskedValue;
-      this.valueDuringOnChange = maskedValue;
-      this.$emit('change', {
-        event: event,
-        selectionStart: this.currentSelection[0],
-        selectionEnd: this.currentSelection[1],
-        value: this.computedValue(),
-        component: this,
-        target: {
-          name: this.$props.name,
-          value: this.computedValue(),
-          rawValue: this.rawValue()
-        },
-        validity: this.validity()
-      });
-      this.$emit('update:modelValue', this.computedValue());
-      this.$emit('update:modelRawValue', this.rawValue());
-      this.$emit('changemodel', this.computedValue());
-      this.valueDuringOnChange = undefined;
-    },
-    updateService: function updateService(extra) {
-      var config = Object.assign({
-        includeLiterals: this.$props.includeLiterals,
-        mask: this.$props.mask,
-        prompt: this.$props.prompt,
-        promptPlaceholder: this.$props.promptPlaceholder,
-        rules: this.$props.rules
-      }, extra); // tslint:disable-line:align
-      this.service.update(config);
-    },
-    setValidity: function setValidity() {
-      if (this.element) {
-        this.element.setCustomValidity(this.validity().valid ? '' : this.$props.validationMessage || '');
-      }
-    }
-  },
-  // @ts-ignore
-  render: function render(createElement) {
-    var h = gh || createElement;
-    var inputId = this.$props.id || this.inputId;
-    var _a = this.$props,
-      iconName = _a.iconName,
-      showValidationIcon = _a.showValidationIcon,
-      showLoadingIcon = _a.showLoadingIcon,
-      showClearButton = _a.showClearButton;
-    var isValid = !this.$props.validityStyles || this.validity().valid;
-    var newValue = this.computedValue();
-    var inputValue = this.inputValue;
-    var inputPrefixTemplate = kendo_vue_common_1.templateRendering.call(this, this.$props.inputPrefix, kendo_vue_common_1.getListeners.call(this));
-    var inputSuffixTemplate = kendo_vue_common_1.templateRendering.call(this, this.$props.inputSuffix, kendo_vue_common_1.getListeners.call(this));
-    var inputPrefix = kendo_vue_common_1.getTemplate.call(this, {
-      h: h,
-      template: inputPrefixTemplate,
-      additionalProps: {
-        value: newValue,
-        valid: isValid
-      }
-    });
-    var inputSuffix = kendo_vue_common_1.getTemplate.call(this, {
-      h: h,
-      template: inputSuffixTemplate,
-      additionalProps: {
-        value: newValue,
-        valid: isValid
-      }
-    });
-    var wrapper = h("span", {
-      dir: this.$props.dir,
-      attrs: this.v3 ? undefined : {
-        dir: this.$props.dir
-      },
-      "class": this.wrapperSpanClass,
-      style: !this.$props.label ? {
-        width: this.$props.width
-      } : undefined
-    }, [iconName && h(kendo_vue_common_1.Icon, {
-      name: iconName,
-      attrs: this.v3 ? undefined : {
-        name: iconName
-      },
-      "class": 'k-input-icon'
-    }), this.$props.inputPrefix && h("span", {
-      "class": "k-input-prefix"
-    }, [inputPrefix]), h("input", {
-      type: this.$props.type,
-      attrs: this.v3 ? undefined : {
-        type: this.$props.type,
-        autocomplete: "off",
-        autocorrect: "off",
-        autocapitalize: "off",
-        spellcheck: false,
-        id: inputId,
-        "aria-labelledby": this.$props.ariaLabelledBy,
-        "aria-describedby": this.$props.ariaDescribedBy,
-        "aria-disabled": this.$props.disabled,
-        name: this.$props.name,
-        tabindex: (0, kendo_vue_common_1.getTabIndex)(this.$props.tabIndex, this.$props.disabled, true),
-        accesskey: this.$props.accessKey,
-        title: this.$props.title,
-        disabled: this.$props.disabled || undefined,
-        readonly: this.$props.readonly || undefined,
-        placeholder: this.$props.placeholder,
-        "aria-placeholder": this.$props.placeholder,
-        required: this.$props.required
-      },
-      autocomplete: "off",
-      autocorrect: "off",
-      autocapitalize: "off",
-      spellcheck: false,
-      "class": this.inputInnerClass,
-      value: this.v3 ? newValue : null,
-      domProps: this.v3 ? undefined : {
-        "value": newValue
-      },
-      id: inputId,
-      "aria-labelledby": this.$props.ariaLabelledBy,
-      "aria-describedby": this.$props.ariaDescribedBy,
-      "aria-disabled": this.$props.disabled,
-      name: this.$props.name,
-      tabindex: (0, kendo_vue_common_1.getTabIndex)(this.$props.tabIndex, this.$props.disabled, true),
-      accesskey: this.$props.accessKey,
-      title: this.$props.title,
-      disabled: this.$props.disabled || undefined,
-      readonly: this.$props.readonly || undefined,
-      placeholder: this.$props.placeholder,
-      "aria-placeholder": this.$props.placeholder,
-      required: this.$props.required,
-      ref: (0, kendo_vue_common_1.setRef)(this, 'input'),
-      onInput: this.onChangeHandler,
-      on: this.v3 ? undefined : {
-        "input": this.onChangeHandler,
-        "paste": this.pasteHandler,
-        "focus": this.focusHandler,
-        "blur": this.blurHandler,
-        "dragstart": utils_1.returnFalse,
-        "drop": utils_1.returnFalse
-      },
-      onPaste: this.pasteHandler,
-      onFocus: this.focusHandler,
-      onBlur: this.blurHandler,
-      onDragstart: utils_1.returnFalse,
-      onDrop: utils_1.returnFalse
-    }), this.$props.inputSuffix && h("span", {
-      "class": "k-input-suffix"
-    }, [inputSuffix]), showValidationIcon && isValid && h(kendo_vue_common_1.Icon, {
-      name: 'check',
-      attrs: this.v3 ? undefined : {
-        name: 'check',
-        icon: kendo_svg_icons_1.checkIcon
-      },
-      icon: kendo_svg_icons_1.checkIcon,
-      "class": "k-input-validation-icon"
-    }), showValidationIcon && !isValid && h(kendo_vue_common_1.Icon, {
-      name: 'exclamation-circle',
-      attrs: this.v3 ? undefined : {
-        name: 'exclamation-circle',
-        icon: kendo_svg_icons_1.exclamationCircleIcon
-      },
-      icon: kendo_svg_icons_1.exclamationCircleIcon,
-      "class": "k-input-validation-icon"
-    }), showLoadingIcon && h(kendo_vue_common_1.Icon, {
-      name: 'loading',
-      attrs: this.v3 ? undefined : {
-        name: 'loading'
-      },
-      "class": 'k-input-loading-icon'
-    }), showClearButton && newValue && h("span", {
-      onClick: this.clearClick,
-      on: this.v3 ? undefined : {
-        "click": this.clearClick
-      },
-      "class": "k-clear-value"
-    }, [h(kendo_vue_common_1.Icon, {
-      name: 'x',
-      attrs: this.v3 ? undefined : {
-        name: 'x',
-        icon: kendo_svg_icons_1.xIcon
-      },
-      icon: kendo_svg_icons_1.xIcon
-    })])]);
-    return this.$props.label ? h("span", {
-      "class": this.spanClassNames,
-      dir: this.$props.dir,
-      attrs: this.v3 ? undefined : {
-        dir: this.$props.dir
-      }
-    }, [wrapper, this.$props.label ? inputId ? h("label", {
-      "for": inputId,
-      attrs: this.v3 ? undefined : {
-        "for": inputId
-      },
-      "class": "k-floating-label"
-    }, [this.$props.label]) : h("span", {
-      "class": "k-label"
-    }, [this.$props.label]) : null]) : wrapper;
-  }
-};
-exports.MaskedTextBoxVue2 = MaskedTextBoxVue2;
-/**
- * @hidden
- */
-var MaskedTextBox = MaskedTextBoxVue2;
-exports.MaskedTextBox = MaskedTextBox;