kdutify 2.6.0 → 2.7.2

package/lib/components/KOtpInput/KOtpInput.js

@@ -1,19 +1,18 @@
 // Styles
 import "..\\..\\..\\src\\components\\KTextField\\KTextField.sass";
-import "..\\..\\..\\src\\components\\KOtpInput\\KOtpInput.sass"; // Extensions
-
+import "..\\..\\..\\src\\components\\KOtpInput\\KOtpInput.sass";
+// Extensions
 import KInput from '../KInput';
-import KTextField from '../KTextField/KTextField'; // Directives
-
-import ripple from '../../directives/ripple'; // Utilities
-
+import KTextField from '../KTextField/KTextField';
+// Directives
+import ripple from '../../directives/ripple';
+// Utilities
 import { convertToUnit, keyCodes } from '../../util/helpers';
-import { breaking } from '../../util/console'; // Types
-
+import { breaking } from '../../util/console';
+// Types
 import mixins from '../../util/mixins';
 const baseMixins = mixins(KInput);
 /* @kdujs/component */
-
 export default baseMixins.extend().extend({
   name: 'k-otp-input',
   directives: {
@@ -32,7 +31,6 @@ export default baseMixins.extend().extend({
     plain: Boolean
   },
   data: () => ({
-    badInput: false,
     initialValue: null,
     isBooted: false,
     otp: []
@@ -41,49 +39,37 @@ export default baseMixins.extend().extend({
     outlined() {
       return !this.plain;
     },
-
     classes() {
-      return { ...KInput.options.computed.classes.call(this),
+      return {
+        ...KInput.options.computed.classes.call(this),
         ...KTextField.options.computed.classes.call(this),
         'k-otp-input--plain': this.plain
       };
-    },
-
-    isDirty() {
-      return KInput.options.computed.isDirty.call(this) || this.badInput;
     }
-
   },
   watch: {
     isFocused: 'updateValue',
-
     value(val) {
       this.lazyValue = val;
+      this.otp = (val === null || val === void 0 ? void 0 : val.split('')) || [];
     }
-
   },
-
   created() {
-    var _this$internalValue;
-
+    var _a;
     /* istanbul ignore next */
     if (this.$attrs.hasOwnProperty('browser-autocomplete')) {
       breaking('browser-autocomplete', 'autocomplete', this);
     }
-
-    this.otp = ((_this$internalValue = this.internalValue) == null ? void 0 : _this$internalValue.split('')) || [];
+    this.otp = ((_a = this.internalValue) === null || _a === void 0 ? void 0 : _a.split('')) || [];
   },
-
   mounted() {
     requestAnimationFrame(() => this.isBooted = true);
   },
-
   methods: {
     /** @public */
     focus(e, otpIdx) {
       this.onFocus(e, otpIdx || 0);
     },
-
     genInputSlot(otpIdx) {
       return this.$createElement('div', this.setBackgroundColor(this.backgroundColor, {
         staticClass: 'k-input__slot',
@@ -97,17 +83,14 @@ export default baseMixins.extend().extend({
         }
       }), [this.genDefaultSlot(otpIdx)]);
     },
-
     genControl(otpIdx) {
       return this.$createElement('div', {
         staticClass: 'k-input__control'
       }, [this.genInputSlot(otpIdx)]);
     },
-
     genDefaultSlot(otpIdx) {
       return [this.genFieldset(), this.genTextFieldSlot(otpIdx)];
     },
-
     genContent() {
       return Array.from({
         length: +this.length
@@ -118,7 +101,6 @@ export default baseMixins.extend().extend({
         }), [this.genControl(i)]);
       });
     },
-
     genFieldset() {
       return this.$createElement('fieldset', {
         attrs: {
@@ -126,7 +108,6 @@ export default baseMixins.extend().extend({
         }
       }, [this.genLegend()]);
     },
-
     genLegend() {
       const span = this.$createElement('span', {
         domProps: {
@@ -139,30 +120,28 @@ export default baseMixins.extend().extend({
         }
       }, [span]);
     },
-
     genInput(otpIdx) {
       const listeners = Object.assign({}, this.listeners$);
       delete listeners.change; // Change should not be bound externally
-
       return this.$createElement('input', {
         style: {},
         domProps: {
           value: this.otp[otpIdx],
           min: this.type === 'number' ? 0 : null
         },
-        attrs: { ...this.attrs$,
+        attrs: {
+          ...this.attrs$,
+          autocomplete: 'one-time-code',
           disabled: this.isDisabled,
           readonly: this.isReadonly,
           type: this.type,
           id: `${this.computedId}--${otpIdx}`,
-          class: `otp-field-box--${otpIdx}`,
-          maxlength: 1
+          class: `otp-field-box--${otpIdx}`
         },
         on: Object.assign(listeners, {
           blur: this.onBlur,
           input: e => this.onInput(e, otpIdx),
           focus: e => this.onFocus(e, otpIdx),
-          paste: e => this.onPaste(e, otpIdx),
           keydown: this.onKeyDown,
           keyup: e => this.onKeyUp(e, otpIdx)
         }),
@@ -170,173 +149,120 @@ export default baseMixins.extend().extend({
         refInFor: true
       });
     },
-
     genTextFieldSlot(otpIdx) {
       return this.$createElement('div', {
         staticClass: 'k-text-field__slot'
       }, [this.genInput(otpIdx)]);
     },
-
     onBlur(e) {
       this.isFocused = false;
       e && this.$nextTick(() => this.$emit('blur', e));
     },
-
     onClick(otpIdx) {
       if (this.isFocused || this.isDisabled || !this.$refs.input[otpIdx]) return;
       this.onFocus(undefined, otpIdx);
     },
-
     onFocus(e, otpIdx) {
-      e == null ? void 0 : e.preventDefault();
-      e == null ? void 0 : e.stopPropagation();
+      e === null || e === void 0 ? void 0 : e.preventDefault();
+      e === null || e === void 0 ? void 0 : e.stopPropagation();
       const elements = this.$refs.input;
       const ref = this.$refs.input && elements[otpIdx || 0];
       if (!ref) return;
-
       if (document.activeElement !== ref) {
         ref.focus();
         return ref.select();
       }
-
       if (!this.isFocused) {
         this.isFocused = true;
         ref.select();
         e && this.$emit('focus', e);
       }
     },
-
-    onInput(e, otpIdx) {
+    onInput(e, index) {
+      const maxCursor = +this.length - 1;
       const target = e.target;
       const value = target.value;
-      this.applyValue(otpIdx, target.value, () => {
-        this.internalValue = this.otp.join('');
-      });
-      this.badInput = target.validity && target.validity.badInput;
-      const nextIndex = otpIdx + 1;
-
-      if (value) {
-        if (nextIndex < +this.length) {
-          this.changeFocus(nextIndex);
-        } else {
-          this.clearFocus(otpIdx);
-          this.onCompleted();
-        }
+      const inputDataArray = (value === null || value === void 0 ? void 0 : value.split('')) || [];
+      const newOtp = [...this.otp];
+      for (let i = 0; i < inputDataArray.length; i++) {
+        const appIdx = index + i;
+        if (appIdx > maxCursor) break;
+        newOtp[appIdx] = inputDataArray[i].toString();
+      }
+      if (!inputDataArray.length) {
+        newOtp.splice(index, 1);
+      }
+      this.otp = newOtp;
+      this.internalValue = this.otp.join('');
+      if (index + inputDataArray.length >= +this.length) {
+        this.onCompleted();
+        this.clearFocus(index);
+      } else if (inputDataArray.length) {
+        this.changeFocus(index + inputDataArray.length);
       }
     },
-
     clearFocus(index) {
       const input = this.$refs.input[index];
       input.blur();
     },
-
     onKeyDown(e) {
       if (e.keyCode === keyCodes.enter) {
         this.$emit('change', this.internalValue);
       }
-
       this.$emit('keydown', e);
     },
-
     onMouseDown(e, otpIdx) {
       // Prevent input from being blurred
       if (e.target !== this.$refs.input[otpIdx]) {
         e.preventDefault();
         e.stopPropagation();
       }
-
       KInput.options.methods.onMouseDown.call(this, e);
     },
-
     onMouseUp(e, otpIdx) {
       if (this.hasMouseDown) this.focus(e, otpIdx);
       KInput.options.methods.onMouseUp.call(this, e);
     },
-
-    onPaste(event, index) {
-      var _event$clipboardData;
-
-      const maxCursor = +this.length - 1;
-      const inputVal = event == null ? void 0 : (_event$clipboardData = event.clipboardData) == null ? void 0 : _event$clipboardData.getData('Text');
-      const inputDataArray = (inputVal == null ? void 0 : inputVal.split('')) || [];
-      event.preventDefault();
-      const newOtp = [...this.otp];
-
-      for (let i = 0; i < inputDataArray.length; i++) {
-        const appIdx = index + i;
-        if (appIdx > maxCursor) break;
-        newOtp[appIdx] = inputDataArray[i].toString();
-      }
-
-      this.otp = newOtp;
-      const targetFocus = Math.min(index + inputDataArray.length, maxCursor);
-      this.changeFocus(targetFocus);
-
-      if (newOtp.length === +this.length) {
-        this.onCompleted();
-        this.clearFocus(targetFocus);
-      }
-    },
-
-    applyValue(index, inputVal, next) {
-      const newOtp = [...this.otp];
-      newOtp[index] = inputVal;
-      this.otp = newOtp;
-      next();
-    },
-
     changeFocus(index) {
       this.onFocus(undefined, index || 0);
     },
-
     updateValue(val) {
       // Sets validationState from validatable
       this.hasColor = val;
-
       if (val) {
         this.initialValue = this.lazyValue;
       } else if (this.initialValue !== this.lazyValue) {
         this.$emit('change', this.lazyValue);
       }
     },
-
     onKeyUp(event, index) {
       event.preventDefault();
       const eventKey = event.key;
-
       if (['Tab', 'Shift', 'Meta', 'Control', 'Alt'].includes(eventKey)) {
         return;
       }
-
       if (['Delete'].includes(eventKey)) {
         return;
       }
-
       if (eventKey === 'ArrowLeft' || eventKey === 'Backspace' && !this.otp[index]) {
         return index > 0 && this.changeFocus(index - 1);
       }
-
       if (eventKey === 'ArrowRight') {
         return index + 1 < +this.length && this.changeFocus(index + 1);
       }
     },
-
     onCompleted() {
       const rsp = this.otp.join('');
-
       if (rsp.length === +this.length) {
         this.$emit('finish', rsp);
       }
     }
-
   },
-
   render(h) {
     return h('div', {
       staticClass: 'k-otp-input',
       class: this.themeClasses
     }, this.genContent());
   }
-
 });
 //# sourceMappingURL=KOtpInput.js.map

package/lib/components/KOtpInput/KOtpInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/KOtpInput/KOtpInput.ts"],"names":[],"mappings":"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","sourcesContent":["// Styles\nimport '../KTextField/KTextField.sass'\nimport './KOtpInput.sass'\n\n// Extensions\nimport KInput from '../KInput'\nimport KTextField from '../KTextField/KTextField'\n// Directives\nimport ripple from '../../directives/ripple'\n\n// Utilities\nimport { convertToUnit, keyCodes } from '../../util/helpers'\nimport { breaking } from '../../util/console'\n\n// Types\nimport mixins from '../../util/mixins'\nimport { KNode } from 'kdu'\n\nconst baseMixins = mixins(\n  KInput,\n)\n\ninterface options extends InstanceType<typeof baseMixins> {\n  $refs: {\n    input: HTMLInputElement[]\n  }\n}\n\n/* @kdujs/component */\nexport default baseMixins.extend<options>().extend({\n  name: 'k-otp-input',\n\n  directives: {\n    ripple,\n  },\n\n  inheritAttrs: false,\n\n  props: {\n    length: {\n      type: [Number, String],\n      default: 6,\n    },\n    type: {\n      type: String,\n      default: 'text',\n    },\n    plain: Boolean,\n  },\n\n  data: () => ({\n    badInput: false,\n    initialValue: null,\n    isBooted: false,\n    otp: [] as string[],\n  }),\n\n  computed: {\n    outlined (): Boolean {\n      return !this.plain\n    },\n    classes (): object {\n      return {\n        ...KInput.options.computed.classes.call(this),\n        ...KTextField.options.computed.classes.call(this),\n        'k-otp-input--plain': this.plain,\n      }\n    },\n    isDirty (): boolean {\n      return KInput.options.computed.isDirty.call(this) || this.badInput\n    },\n  },\n\n  watch: {\n    isFocused: 'updateValue',\n    value (val) {\n      this.lazyValue = val\n    },\n  },\n\n  created () {\n    /* istanbul ignore next */\n    if (this.$attrs.hasOwnProperty('browser-autocomplete')) {\n      breaking('browser-autocomplete', 'autocomplete', this)\n    }\n\n    this.otp = this.internalValue?.split('') || []\n  },\n\n  mounted () {\n    requestAnimationFrame(() => (this.isBooted = true))\n  },\n\n  methods: {\n    /** @public */\n    focus (e: Event, otpIdx: number) {\n      this.onFocus(e, otpIdx || 0)\n    },\n    genInputSlot (otpIdx: number) {\n      return this.$createElement('div', this.setBackgroundColor(this.backgroundColor, {\n        staticClass: 'k-input__slot',\n        style: { height: convertToUnit(this.height) },\n        on: {\n          click: () => this.onClick(otpIdx),\n          mousedown: (e: Event) => this.onMouseDown(e, otpIdx),\n          mouseup: (e: Event) => this.onMouseUp(e, otpIdx),\n        },\n      }), [this.genDefaultSlot(otpIdx)])\n    },\n    genControl (otpIdx: number) {\n      return this.$createElement('div', {\n        staticClass: 'k-input__control',\n      }, [\n        this.genInputSlot(otpIdx),\n      ])\n    },\n    genDefaultSlot (otpIdx: number) {\n      return [\n        this.genFieldset(),\n        this.genTextFieldSlot(otpIdx),\n      ]\n    },\n    genContent () {\n      return Array.from({ length: +this.length }, (_, i) => {\n        return this.$createElement('div', this.setTextColor(this.validationState, {\n          staticClass: 'k-input',\n          class: this.classes,\n        }), [this.genControl(i)])\n      })\n    },\n    genFieldset () {\n      return this.$createElement('fieldset', {\n        attrs: {\n          'aria-hidden': true,\n        },\n      }, [this.genLegend()])\n    },\n    genLegend () {\n      const span = this.$createElement('span', {\n        domProps: { innerHTML: '&#8203;' },\n      })\n\n      return this.$createElement('legend', {\n        style: {\n          width: '0px',\n        },\n      }, [span])\n    },\n    genInput (otpIdx: number) {\n      const listeners = Object.assign({}, this.listeners$)\n      delete listeners.change // Change should not be bound externally\n\n      return this.$createElement('input', {\n        style: {},\n        domProps: {\n          value: this.otp[otpIdx],\n          min: this.type === 'number' ? 0 : null,\n        },\n        attrs: {\n          ...this.attrs$,\n          disabled: this.isDisabled,\n          readonly: this.isReadonly,\n          type: this.type,\n          id: `${this.computedId}--${otpIdx}`,\n          class: `otp-field-box--${otpIdx}`,\n          maxlength: 1,\n        },\n        on: Object.assign(listeners, {\n          blur: this.onBlur,\n          input: (e: Event) => this.onInput(e, otpIdx),\n          focus: (e: Event) => this.onFocus(e, otpIdx),\n          paste: (e: ClipboardEvent) => this.onPaste(e, otpIdx),\n          keydown: this.onKeyDown,\n          keyup: (e: KeyboardEvent) => this.onKeyUp(e, otpIdx),\n        }),\n        ref: 'input',\n        refInFor: true,\n      })\n    },\n    genTextFieldSlot (otpIdx: number): KNode {\n      return this.$createElement('div', {\n        staticClass: 'k-text-field__slot',\n      }, [\n        this.genInput(otpIdx),\n      ])\n    },\n    onBlur (e?: Event) {\n      this.isFocused = false\n      e && this.$nextTick(() => this.$emit('blur', e))\n    },\n    onClick (otpIdx: number) {\n      if (this.isFocused || this.isDisabled || !this.$refs.input[otpIdx]) return\n\n      this.onFocus(undefined, otpIdx)\n    },\n    onFocus (e?: Event, otpIdx?: number) {\n      e?.preventDefault()\n      e?.stopPropagation()\n      const elements = this.$refs.input as HTMLInputElement[]\n      const ref = this.$refs.input && elements[otpIdx || 0]\n      if (!ref) return\n\n      if (document.activeElement !== ref) {\n        ref.focus()\n        return ref.select()\n      }\n\n      if (!this.isFocused) {\n        this.isFocused = true\n        ref.select()\n        e && this.$emit('focus', e)\n      }\n    },\n    onInput (e: Event, otpIdx: number) {\n      const target = e.target as HTMLInputElement\n      const value = target.value\n      this.applyValue(otpIdx, target.value, () => {\n        this.internalValue = this.otp.join('')\n      })\n      this.badInput = target.validity && target.validity.badInput\n\n      const nextIndex = otpIdx + 1\n      if (value) {\n        if (nextIndex < +this.length) {\n          this.changeFocus(nextIndex)\n        } else {\n          this.clearFocus(otpIdx)\n          this.onCompleted()\n        }\n      }\n    },\n    clearFocus (index: number) {\n      const input = this.$refs.input[index] as HTMLInputElement\n      input.blur()\n    },\n    onKeyDown (e: KeyboardEvent) {\n      if (e.keyCode === keyCodes.enter) {\n        this.$emit('change', this.internalValue)\n      }\n\n      this.$emit('keydown', e)\n    },\n    onMouseDown (e: Event, otpIdx: number) {\n      // Prevent input from being blurred\n      if (e.target !== this.$refs.input[otpIdx]) {\n        e.preventDefault()\n        e.stopPropagation()\n      }\n\n      KInput.options.methods.onMouseDown.call(this, e)\n    },\n    onMouseUp (e: Event, otpIdx: number) {\n      if (this.hasMouseDown) this.focus(e, otpIdx)\n\n      KInput.options.methods.onMouseUp.call(this, e)\n    },\n    onPaste (event: ClipboardEvent, index: number) {\n      const maxCursor = +this.length - 1\n      const inputVal = event?.clipboardData?.getData('Text')\n      const inputDataArray = inputVal?.split('') || []\n      event.preventDefault()\n      const newOtp: string[] = [...this.otp]\n      for (let i = 0; i < inputDataArray.length; i++) {\n        const appIdx = index + i\n        if (appIdx > maxCursor) break\n        newOtp[appIdx] = inputDataArray[i].toString()\n      }\n      this.otp = newOtp\n      const targetFocus = Math.min(index + inputDataArray.length, maxCursor)\n      this.changeFocus(targetFocus)\n\n      if (newOtp.length === +this.length) { this.onCompleted(); this.clearFocus(targetFocus) }\n    },\n    applyValue (index: number, inputVal: string, next: Function) {\n      const newOtp: string[] = [...this.otp]\n      newOtp[index] = inputVal\n      this.otp = newOtp\n      next()\n    },\n    changeFocus (index: number) {\n      this.onFocus(undefined, index || 0)\n    },\n    updateValue (val: boolean) {\n      // Sets validationState from validatable\n      this.hasColor = val\n\n      if (val) {\n        this.initialValue = this.lazyValue\n      } else if (this.initialValue !== this.lazyValue) {\n        this.$emit('change', this.lazyValue)\n      }\n    },\n    onKeyUp (event: KeyboardEvent, index: number) {\n      event.preventDefault()\n      const eventKey = event.key\n      if (['Tab', 'Shift', 'Meta', 'Control', 'Alt'].includes(eventKey)) {\n        return\n      }\n      if (['Delete'].includes(eventKey)) {\n        return\n      }\n      if (eventKey === 'ArrowLeft' || (eventKey === 'Backspace' && !this.otp[index])) {\n        return index > 0 && this.changeFocus(index - 1)\n      }\n      if (eventKey === 'ArrowRight') {\n        return index + 1 < +this.length && this.changeFocus(index + 1)\n      }\n    },\n    onCompleted () {\n      const rsp = this.otp.join('')\n      if (rsp.length === +this.length) {\n        this.$emit('finish', rsp)\n      }\n    },\n  },\n  render (h): KNode {\n    return h('div', {\n      staticClass: 'k-otp-input',\n      class: this.themeClasses,\n    }, this.genContent())\n  },\n})\n"],"sourceRoot":"","file":"KOtpInput.js"}
+{"version":3,"sources":["../../../src/components/KOtpInput/KOtpInput.ts"],"names":[],"mappings":"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","sourcesContent":["// Styles\nimport '../KTextField/KTextField.sass'\nimport './KOtpInput.sass'\n\n// Extensions\nimport KInput from '../KInput'\nimport KTextField from '../KTextField/KTextField'\n// Directives\nimport ripple from '../../directives/ripple'\n\n// Utilities\nimport { convertToUnit, keyCodes } from '../../util/helpers'\nimport { breaking } from '../../util/console'\n\n// Types\nimport mixins from '../../util/mixins'\nimport { KNode } from 'kdu'\n\nconst baseMixins = mixins(\n  KInput,\n)\n\ninterface options extends InstanceType<typeof baseMixins> {\n  $refs: {\n    input: HTMLInputElement[]\n  }\n}\n\n/* @kdujs/component */\nexport default baseMixins.extend<options>().extend({\n  name: 'k-otp-input',\n\n  directives: {\n    ripple,\n  },\n\n  inheritAttrs: false,\n\n  props: {\n    length: {\n      type: [Number, String],\n      default: 6,\n    },\n    type: {\n      type: String,\n      default: 'text',\n    },\n    plain: Boolean,\n  },\n\n  data: () => ({\n    initialValue: null,\n    isBooted: false,\n    otp: [] as string[],\n  }),\n\n  computed: {\n    outlined (): Boolean {\n      return !this.plain\n    },\n    classes (): object {\n      return {\n        ...KInput.options.computed.classes.call(this),\n        ...KTextField.options.computed.classes.call(this),\n        'k-otp-input--plain': this.plain,\n      }\n    },\n  },\n\n  watch: {\n    isFocused: 'updateValue',\n    value (val) {\n      this.lazyValue = val\n      this.otp = val?.split('') || []\n    },\n  },\n\n  created () {\n    /* istanbul ignore next */\n    if (this.$attrs.hasOwnProperty('browser-autocomplete')) {\n      breaking('browser-autocomplete', 'autocomplete', this)\n    }\n\n    this.otp = this.internalValue?.split('') || []\n  },\n\n  mounted () {\n    requestAnimationFrame(() => (this.isBooted = true))\n  },\n\n  methods: {\n    /** @public */\n    focus (e: Event, otpIdx: number) {\n      this.onFocus(e, otpIdx || 0)\n    },\n    genInputSlot (otpIdx: number) {\n      return this.$createElement('div', this.setBackgroundColor(this.backgroundColor, {\n        staticClass: 'k-input__slot',\n        style: { height: convertToUnit(this.height) },\n        on: {\n          click: () => this.onClick(otpIdx),\n          mousedown: (e: Event) => this.onMouseDown(e, otpIdx),\n          mouseup: (e: Event) => this.onMouseUp(e, otpIdx),\n        },\n      }), [this.genDefaultSlot(otpIdx)])\n    },\n    genControl (otpIdx: number) {\n      return this.$createElement('div', {\n        staticClass: 'k-input__control',\n      }, [\n        this.genInputSlot(otpIdx),\n      ])\n    },\n    genDefaultSlot (otpIdx: number) {\n      return [\n        this.genFieldset(),\n        this.genTextFieldSlot(otpIdx),\n      ]\n    },\n    genContent () {\n      return Array.from({ length: +this.length }, (_, i) => {\n        return this.$createElement('div', this.setTextColor(this.validationState, {\n          staticClass: 'k-input',\n          class: this.classes,\n        }), [this.genControl(i)])\n      })\n    },\n    genFieldset () {\n      return this.$createElement('fieldset', {\n        attrs: {\n          'aria-hidden': true,\n        },\n      }, [this.genLegend()])\n    },\n    genLegend () {\n      const span = this.$createElement('span', {\n        domProps: { innerHTML: '&#8203;' },\n      })\n\n      return this.$createElement('legend', {\n        style: {\n          width: '0px',\n        },\n      }, [span])\n    },\n    genInput (otpIdx: number) {\n      const listeners = Object.assign({}, this.listeners$)\n      delete listeners.change // Change should not be bound externally\n\n      return this.$createElement('input', {\n        style: {},\n        domProps: {\n          value: this.otp[otpIdx],\n          min: this.type === 'number' ? 0 : null,\n        },\n        attrs: {\n          ...this.attrs$,\n          autocomplete: 'one-time-code',\n          disabled: this.isDisabled,\n          readonly: this.isReadonly,\n          type: this.type,\n          id: `${this.computedId}--${otpIdx}`,\n          class: `otp-field-box--${otpIdx}`,\n        },\n        on: Object.assign(listeners, {\n          blur: this.onBlur,\n          input: (e: Event) => this.onInput(e, otpIdx),\n          focus: (e: Event) => this.onFocus(e, otpIdx),\n          keydown: this.onKeyDown,\n          keyup: (e: KeyboardEvent) => this.onKeyUp(e, otpIdx),\n        }),\n        ref: 'input',\n        refInFor: true,\n      })\n    },\n    genTextFieldSlot (otpIdx: number): KNode {\n      return this.$createElement('div', {\n        staticClass: 'k-text-field__slot',\n      }, [\n        this.genInput(otpIdx),\n      ])\n    },\n    onBlur (e?: Event) {\n      this.isFocused = false\n      e && this.$nextTick(() => this.$emit('blur', e))\n    },\n    onClick (otpIdx: number) {\n      if (this.isFocused || this.isDisabled || !this.$refs.input[otpIdx]) return\n\n      this.onFocus(undefined, otpIdx)\n    },\n    onFocus (e?: Event, otpIdx?: number) {\n      e?.preventDefault()\n      e?.stopPropagation()\n      const elements = this.$refs.input as HTMLInputElement[]\n      const ref = this.$refs.input && elements[otpIdx || 0]\n      if (!ref) return\n\n      if (document.activeElement !== ref) {\n        ref.focus()\n        return ref.select()\n      }\n\n      if (!this.isFocused) {\n        this.isFocused = true\n        ref.select()\n        e && this.$emit('focus', e)\n      }\n    },\n    onInput (e: Event, index: number) {\n      const maxCursor = +this.length - 1\n\n      const target = e.target as HTMLInputElement\n      const value = target.value\n      const inputDataArray = value?.split('') || []\n\n      const newOtp: string[] = [...this.otp]\n      for (let i = 0; i < inputDataArray.length; i++) {\n        const appIdx = index + i\n        if (appIdx > maxCursor) break\n        newOtp[appIdx] = inputDataArray[i].toString()\n      }\n      if (!inputDataArray.length) {\n        newOtp.splice(index, 1)\n      }\n\n      this.otp = newOtp\n      this.internalValue = this.otp.join('')\n\n      if (index + inputDataArray.length >= +this.length) {\n        this.onCompleted()\n        this.clearFocus(index)\n      } else if (inputDataArray.length) {\n        this.changeFocus(index + inputDataArray.length)\n      }\n    },\n    clearFocus (index: number) {\n      const input = this.$refs.input[index] as HTMLInputElement\n      input.blur()\n    },\n    onKeyDown (e: KeyboardEvent) {\n      if (e.keyCode === keyCodes.enter) {\n        this.$emit('change', this.internalValue)\n      }\n\n      this.$emit('keydown', e)\n    },\n    onMouseDown (e: Event, otpIdx: number) {\n      // Prevent input from being blurred\n      if (e.target !== this.$refs.input[otpIdx]) {\n        e.preventDefault()\n        e.stopPropagation()\n      }\n\n      KInput.options.methods.onMouseDown.call(this, e)\n    },\n    onMouseUp (e: Event, otpIdx: number) {\n      if (this.hasMouseDown) this.focus(e, otpIdx)\n\n      KInput.options.methods.onMouseUp.call(this, e)\n    },\n    changeFocus (index: number) {\n      this.onFocus(undefined, index || 0)\n    },\n    updateValue (val: boolean) {\n      // Sets validationState from validatable\n      this.hasColor = val\n\n      if (val) {\n        this.initialValue = this.lazyValue\n      } else if (this.initialValue !== this.lazyValue) {\n        this.$emit('change', this.lazyValue)\n      }\n    },\n    onKeyUp (event: KeyboardEvent, index: number) {\n      event.preventDefault()\n      const eventKey = event.key\n      if (['Tab', 'Shift', 'Meta', 'Control', 'Alt'].includes(eventKey)) {\n        return\n      }\n      if (['Delete'].includes(eventKey)) {\n        return\n      }\n      if (eventKey === 'ArrowLeft' || (eventKey === 'Backspace' && !this.otp[index])) {\n        return index > 0 && this.changeFocus(index - 1)\n      }\n      if (eventKey === 'ArrowRight') {\n        return index + 1 < +this.length && this.changeFocus(index + 1)\n      }\n    },\n    onCompleted () {\n      const rsp = this.otp.join('')\n      if (rsp.length === +this.length) {\n        this.$emit('finish', rsp)\n      }\n    },\n  },\n  render (h): KNode {\n    return h('div', {\n      staticClass: 'k-otp-input',\n      class: this.themeClasses,\n    }, this.genContent())\n  },\n})\n"],"sourceRoot":"","file":"KOtpInput.js"}

package/lib/components/KOtpInput/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/KOtpInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAP,MAAsB,aAAtB;AAEA,SAAS,SAAT;AACA,eAAe,SAAf","sourcesContent":["import KOtpInput from './KOtpInput'\n\nexport { KOtpInput }\nexport default KOtpInput\n"],"sourceRoot":"","file":"index.js"}
+{"version":3,"sources":["../../../src/components/KOtpInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,aAAa;AAEnC,SAAS,SAAS;AAClB,eAAe,SAAS","sourcesContent":["import KOtpInput from './KOtpInput'\n\nexport { KOtpInput }\nexport default KOtpInput\n"],"sourceRoot":"","file":"index.js"}

package/lib/components/KOverflowBtn/KOverflowBtn.js

@@ -1,15 +1,14 @@
 // Styles
-import "..\\..\\..\\src\\components\\KOverflowBtn\\KOverflowBtn.sass"; // Extensions
-
+import "..\\..\\..\\src\\components\\KOverflowBtn\\KOverflowBtn.sass";
+// Extensions
 import KSelect from '../KSelect/KSelect';
 import KAutocomplete from '../KAutocomplete';
-import KTextField from '../KTextField/KTextField'; // Components
-
-import KBtn from '../KBtn'; // Utilities
-
+import KTextField from '../KTextField/KTextField';
+// Components
+import KBtn from '../KBtn';
+// Utilities
 import { consoleWarn } from '../../util/console';
 /* @kdujs/component */
-
 export default KAutocomplete.extend({
   name: 'k-overflow-btn',
   props: {
@@ -18,35 +17,33 @@ export default KAutocomplete.extend({
   },
   computed: {
     classes() {
-      return { ...KAutocomplete.options.computed.classes.call(this),
+      return {
+        ...KAutocomplete.options.computed.classes.call(this),
         'k-overflow-btn': true,
         'k-overflow-btn--segmented': this.segmented,
         'k-overflow-btn--editable': this.editable
       };
     },
-
     isAnyValueAllowed() {
       return this.editable || KAutocomplete.options.computed.isAnyValueAllowed.call(this);
     },
-
     isSingle() {
       return true;
     },
-
     computedItems() {
       return this.segmented ? this.allItems : this.filteredItems;
+    },
+    labelValue() {
+      return this.isFocused && !this.persistentPlaceholder || this.isLabelActive;
     }
-
   },
   methods: {
     genSelections() {
       return this.editable ? KAutocomplete.options.methods.genSelections.call(this) : KSelect.options.methods.genSelections.call(this); // Override k-autocomplete's override
     },
-
     genCommaSelection(item, index, last) {
       return this.segmented ? this.genSegmentedBtn(item) : KSelect.options.methods.genCommaSelection.call(this, item, index, last);
     },
-
     genInput() {
       const input = KTextField.options.methods.genInput.call(this);
       input.data = input.data || {};
@@ -54,26 +51,22 @@ export default KAutocomplete.extend({
       input.data.attrs.readonly = !this.isAnyValueAllowed;
       return input;
     },
-
     genLabel() {
       if (this.editable && this.isFocused) return null;
       const label = KTextField.options.methods.genLabel.call(this);
       if (!label) return label;
-      label.data = label.data || {}; // Reset previously set styles from parent
-
+      label.data = label.data || {};
+      // Reset previously set styles from parent
       label.data.style = {};
       return label;
     },
-
     genSegmentedBtn(item) {
       const itemValue = this.getValue(item);
       const itemObj = this.computedItems.find(i => this.getValue(i) === itemValue) || item;
-
       if (!itemObj.text || !itemObj.callback) {
         consoleWarn('When using "segmented" prop without a selection slot, items must contain both a text and callback property', this);
         return null;
       }
-
       return this.$createElement(KBtn, {
         props: {
           text: true
@@ -83,11 +76,9 @@ export default KAutocomplete.extend({
             e.stopPropagation();
             itemObj.callback(e);
           }
-
         }
       }, [itemObj.text]);
     },
-
     updateValue(val) {
       if (val) {
         this.initialValue = this.lazyValue;
@@ -95,7 +86,6 @@ export default KAutocomplete.extend({
         this.$emit('change', this.lazyValue);
       }
     }
-
   }
 });
 //# sourceMappingURL=KOverflowBtn.js.map

package/lib/components/KOverflowBtn/KOverflowBtn.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/KOverflowBtn/KOverflowBtn.ts"],"names":[],"mappings":"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","sourcesContent":["// Styles\nimport './KOverflowBtn.sass'\n\n// Extensions\nimport KSelect from '../KSelect/KSelect'\nimport KAutocomplete from '../KAutocomplete'\nimport KTextField from '../KTextField/KTextField'\n\n// Components\nimport KBtn from '../KBtn'\n\n// Utilities\nimport { consoleWarn } from '../../util/console'\n\n/* @kdujs/component */\nexport default KAutocomplete.extend({\n  name: 'k-overflow-btn',\n\n  props: {\n    editable: Boolean,\n    segmented: Boolean,\n  },\n\n  computed: {\n    classes (): object {\n      return {\n        ...KAutocomplete.options.computed.classes.call(this),\n        'k-overflow-btn': true,\n        'k-overflow-btn--segmented': this.segmented,\n        'k-overflow-btn--editable': this.editable,\n      }\n    },\n    isAnyValueAllowed (): boolean {\n      return this.editable ||\n        KAutocomplete.options.computed.isAnyValueAllowed.call(this)\n    },\n    isSingle (): true {\n      return true\n    },\n    computedItems (): object[] {\n      return this.segmented ? this.allItems : this.filteredItems\n    },\n  },\n\n  methods: {\n    genSelections () {\n      return this.editable\n        ? KAutocomplete.options.methods.genSelections.call(this)\n        : KSelect.options.methods.genSelections.call(this) // Override k-autocomplete's override\n    },\n    genCommaSelection (item: any, index: number, last: boolean) {\n      return this.segmented\n        ? this.genSegmentedBtn(item)\n        : KSelect.options.methods.genCommaSelection.call(this, item, index, last)\n    },\n    genInput () {\n      const input = KTextField.options.methods.genInput.call(this)\n\n      input.data = input.data || {}\n      input.data.domProps!.value = this.editable ? this.internalSearch : ''\n      input.data.attrs!.readonly = !this.isAnyValueAllowed\n\n      return input\n    },\n    genLabel () {\n      if (this.editable && this.isFocused) return null\n\n      const label = KTextField.options.methods.genLabel.call(this)\n\n      if (!label) return label\n\n      label.data = label.data || {}\n\n      // Reset previously set styles from parent\n      label.data.style = {}\n\n      return label\n    },\n    genSegmentedBtn (item: any) {\n      const itemValue = this.getValue(item)\n      const itemObj = this.computedItems.find(i => this.getValue(i) === itemValue) || item\n\n      if (!itemObj.text || !itemObj.callback) {\n        consoleWarn('When using \"segmented\" prop without a selection slot, items must contain both a text and callback property', this)\n        return null\n      }\n\n      return this.$createElement(KBtn, {\n        props: { text: true },\n        on: {\n          click (e: Event) {\n            e.stopPropagation()\n            itemObj.callback(e)\n          },\n        },\n      }, [itemObj.text])\n    },\n    updateValue (val: boolean) {\n      if (val) {\n        this.initialValue = this.lazyValue\n      } else if (this.initialValue !== this.lazyValue) {\n        this.$emit('change', this.lazyValue)\n      }\n    },\n  },\n})\n"],"sourceRoot":"","file":"KOverflowBtn.js"}
+{"version":3,"sources":["../../../src/components/KOverflowBtn/KOverflowBtn.ts"],"names":[],"mappings":"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","sourcesContent":["// Styles\nimport './KOverflowBtn.sass'\n\n// Extensions\nimport KSelect from '../KSelect/KSelect'\nimport KAutocomplete from '../KAutocomplete'\nimport KTextField from '../KTextField/KTextField'\n\n// Components\nimport KBtn from '../KBtn'\n\n// Utilities\nimport { consoleWarn } from '../../util/console'\n\n/* @kdujs/component */\nexport default KAutocomplete.extend({\n  name: 'k-overflow-btn',\n\n  props: {\n    editable: Boolean,\n    segmented: Boolean,\n  },\n\n  computed: {\n    classes (): object {\n      return {\n        ...KAutocomplete.options.computed.classes.call(this),\n        'k-overflow-btn': true,\n        'k-overflow-btn--segmented': this.segmented,\n        'k-overflow-btn--editable': this.editable,\n      }\n    },\n    isAnyValueAllowed (): boolean {\n      return this.editable ||\n        KAutocomplete.options.computed.isAnyValueAllowed.call(this)\n    },\n    isSingle (): true {\n      return true\n    },\n    computedItems (): object[] {\n      return this.segmented ? this.allItems : this.filteredItems\n    },\n    labelValue (): boolean {\n      return (this.isFocused && !this.persistentPlaceholder) || this.isLabelActive\n    },\n  },\n\n  methods: {\n    genSelections () {\n      return this.editable\n        ? KAutocomplete.options.methods.genSelections.call(this)\n        : KSelect.options.methods.genSelections.call(this) // Override k-autocomplete's override\n    },\n    genCommaSelection (item: any, index: number, last: boolean) {\n      return this.segmented\n        ? this.genSegmentedBtn(item)\n        : KSelect.options.methods.genCommaSelection.call(this, item, index, last)\n    },\n    genInput () {\n      const input = KTextField.options.methods.genInput.call(this)\n\n      input.data = input.data || {}\n      input.data.domProps!.value = this.editable ? this.internalSearch : ''\n      input.data.attrs!.readonly = !this.isAnyValueAllowed\n\n      return input\n    },\n    genLabel () {\n      if (this.editable && this.isFocused) return null\n\n      const label = KTextField.options.methods.genLabel.call(this)\n\n      if (!label) return label\n\n      label.data = label.data || {}\n\n      // Reset previously set styles from parent\n      label.data.style = {}\n\n      return label\n    },\n    genSegmentedBtn (item: any) {\n      const itemValue = this.getValue(item)\n      const itemObj = this.computedItems.find(i => this.getValue(i) === itemValue) || item\n\n      if (!itemObj.text || !itemObj.callback) {\n        consoleWarn('When using \"segmented\" prop without a selection slot, items must contain both a text and callback property', this)\n        return null\n      }\n\n      return this.$createElement(KBtn, {\n        props: { text: true },\n        on: {\n          click (e: Event) {\n            e.stopPropagation()\n            itemObj.callback(e)\n          },\n        },\n      }, [itemObj.text])\n    },\n    updateValue (val: boolean) {\n      if (val) {\n        this.initialValue = this.lazyValue\n      } else if (this.initialValue !== this.lazyValue) {\n        this.$emit('change', this.lazyValue)\n      }\n    },\n  },\n})\n"],"sourceRoot":"","file":"KOverflowBtn.js"}

package/lib/components/KOverflowBtn/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/KOverflowBtn/index.ts"],"names":[],"mappings":"AAAA,OAAO,YAAP,MAAyB,gBAAzB;AAEA,SAAS,YAAT;AACA,eAAe,YAAf","sourcesContent":["import KOverflowBtn from './KOverflowBtn'\n\nexport { KOverflowBtn }\nexport default KOverflowBtn\n"],"sourceRoot":"","file":"index.js"}
+{"version":3,"sources":["../../../src/components/KOverflowBtn/index.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,gBAAgB;AAEzC,SAAS,YAAY;AACrB,eAAe,YAAY","sourcesContent":["import KOverflowBtn from './KOverflowBtn'\n\nexport { KOverflowBtn }\nexport default KOverflowBtn\n"],"sourceRoot":"","file":"index.js"}