1 line
23 KiB
Plaintext
1 line
23 KiB
Plaintext
|
{"version":3,"file":"index.mjs","sources":["../../src/inputotp/BaseInputOtp.vue","../../src/inputotp/InputOtp.vue","../../src/inputotp/InputOtp.vue?vue&type=template&id=71101059&lang.js"],"sourcesContent":["<script>\nimport BaseInput from '@primevue/core/baseinput';\nimport InputOtpStyle from 'primevue/inputotp/style';\n\nexport default {\n name: 'BaseInputOtp',\n extends: BaseInput,\n props: {\n readonly: {\n type: Boolean,\n default: false\n },\n tabindex: {\n type: Number,\n default: null\n },\n length: {\n type: Number,\n default: 4\n },\n mask: {\n type: Boolean,\n default: false\n },\n integerOnly: {\n type: Boolean,\n default: false\n }\n },\n style: InputOtpStyle,\n provide() {\n return {\n $pcInputOtp: this,\n $parentInstance: this\n };\n }\n};\n</script>\n","<template>\n <div :class=\"cx('root')\" v-bind=\"ptmi('root')\">\n <template v-for=\"i in length\" :key=\"i\">\n <slot :events=\"getTemplateEvents(i - 1)\" :attrs=\"getTemplateAttrs(i - 1)\" :index=\"i\">\n <OtpInputText\n :value=\"tokens[i - 1]\"\n :type=\"inputType\"\n :class=\"cx('pcInputText')\"\n :name=\"$formName\"\n :inputmode=\"inputMode\"\n :variant=\"variant\"\n :readonly=\"readonly\"\n :disabled=\"disabled\"\n :size=\"size\"\n :invalid=\"invalid\"\n :tabindex=\"tabindex\"\n :unstyled=\"unstyled\"\n @input=\"onInput($event, i - 1)\"\n @focus=\"onFocus($event)\"\n @blur=\"onBlur($event)\"\n @paste=\"onPaste($event)\"\n @keydown=\"onKeyDown($event)\"\n @click=\"onClick($event)\"\n :pt=\"ptm('pcInputText')\"\n />\n </slot>\n </template>\n </div>\n</template>\n\n<script>\nimport { isTouchDevice } from '@primeuix/utils/dom';\nimport InputText from 'primevue/inputtext';\nimport BaseInputOtp from './BaseInputOtp.vue';\n\nexport default {\n name: 'InputOtp',\n extends: BaseInputOtp,\n inheritAttrs: false,\n emits: ['change', 'focus', 'blur'],\n data() {\n return {\n tokens: []\n };\n },\n watch: {\n modelValue: {\n immediate: true,\n handler(newValue) {\n this.tokens = newValue ? newValue.split('') : new Array(this.length);\n }\n }\n },\n methods: {\n getTemplateAttrs(index) {\n return {\n value: this.tokens[index]\n };\n },\n getTemplateEvents(index) {\n return {\n input: (event) => this.onInput(event, index),\n keydown: (event) => this.onKeyDown(event),\n focus: (event) => this.onFocus(event),\n blur: (event) => this.onBlur(event),\n paste: (event) => this.onPaste(event)\n };\n },\n onInput(event, index) {\n this.tokens[index] = event.target.value;\n this.updateModel(event);\n\n if (event.inputType === 'deleteContentBackward') {\n this.moveToPrev(event);\n } else if (event.inputType === 'insertText' || event.inputType === 'deleteContentForward' || (isTouchDevice() && event instanceof CustomEvent)) {\n this.moveToNext(event);\n }\n },\n updateModel(event) {\n const newValue = this.tokens.join('');\n\n this.writeValue(newValue, event);\n this.$emit('change', {\n originalEvent: event,\n value: newValue\n });\n },\n moveToPrev(event) {\n
|