@dialpad/dialtone-vue 3.218.1 → 3.218.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/lib/input/input.cjs +1 -1
  2. package/dist/lib/input/input.cjs.map +1 -1
  3. package/dist/lib/input/input.js +43 -30
  4. package/dist/lib/input/input.js.map +1 -1
  5. package/dist/types/components/emoji_picker/emoji_picker.vue.d.ts +8 -0
  6. package/dist/types/components/emoji_picker/modules/emoji_search.vue.d.ts +8 -0
  7. package/dist/types/components/emoji_picker/modules/emoji_search.vue.d.ts.map +1 -1
  8. package/dist/types/components/input/input.vue.d.ts +4 -0
  9. package/dist/types/components/input/input.vue.d.ts.map +1 -1
  10. package/dist/types/components/rich_text_editor/extensions/variable/VariableComponent.vue.d.ts +4 -0
  11. package/dist/types/recipes/conversation_view/message_input/message_input_link.vue.d.ts +4 -0
  12. package/dist/types/recipes/conversation_view/message_input/message_input_link.vue.d.ts.map +1 -1
  13. package/package.json +3 -3
package/dist/lib/input/input.cjs CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("../../common/constants/index.cjs"),n=require("./input-constants.cjs"),d=require("../../common/utils/index.cjs"),m=require("../../common/mixins/input.cjs"),t=require("vue"),g=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),f=require("../validation-messages/validation-messages.cjs"),S={compatConfig:{MODE:3},name:"DtInput",components:{DtValidationMessages:f.default},mixins:[m.MessagesMixin],inheritAttrs:!1,props:{name:{type:String,default:""},type:{type:String,default:n.INPUT_TYPES.TEXT,validator:e=>Object.values(n.INPUT_TYPES).includes(e)},modelValue:{type:[String,Number],default:""},disabled:{type:Boolean,default:!1},label:{type:String,default:""},labelVisible:{type:Boolean,default:!0},description:{type:String,default:""},size:{type:String,default:"md",validator:e=>Object.values(n.INPUT_SIZES).includes(e)},inputClass:{type:[String,Object,Array],default:""},inputWrapperClass:{type:[String,Object,Array],default:""},rootClass:{type:[String,Object,Array],default:""},currentLength:{type:Number,default:null},retainWarning:{type:Boolean,default:!1},validate:{type:Object,default:null},hidden:{type:Boolean,default:!1}},emits:["input","blur","clear","focus","focusin","focusout","update:modelValue","update:length","update:invalid"],data(){return{isInputFocused:!1,isInvalid:!1,defaultLength:0,hasSlotContent:d.hasSlotContent}},computed:{isTextarea(){return this.type===n.INPUT_TYPES.TEXTAREA},isDefaultSize(){return this.size===n.INPUT_SIZES.DEFAULT},iconSize(){return n.INPUT_ICON_SIZES[this.size]},isValidSize(){return Object.values(n.INPUT_SIZES).includes(this.size)},isValidDescriptionSize(){return Object.values(h.DESCRIPTION_SIZE_TYPES).includes(this.size)},inputComponent(){return this.isTextarea?"textarea":"input"},inputListeners(){return{input:async e=>{let a=e.target.value;this.type===n.INPUT_TYPES.FILE&&(a=Array.from(e.target.files).map(r=>r.name)),this.$emit("input",a),this.$emit("update:modelValue",a)},blur:e=>{this.isInputFocused=!1,this.onBlur(e)},focus:e=>{this.isInputFocused=!0,this.$emit("focus",e)},focusin:e=>this.$emit("focusin",e),focusout:e=>this.$emit("focusout",e)}},descriptionKey(){return`input-description-${d.getUniqueString()}`},inputState(){return d.getValidationState(this.validationMessages)},defaultLengthCalculation(){return this.calculateLength(this.modelValue)},validationProps(){var e,a,s,r,u,i,o,l,c,p;return{length:{description:(a=(e=this==null?void 0:this.validate)==null?void 0:e.length)==null?void 0:a.description,max:(r=(s=this==null?void 0:this.validate)==null?void 0:s.length)==null?void 0:r.max,warn:(i=(u=this==null?void 0:this.validate)==null?void 0:u.length)==null?void 0:i.warn,message:(l=(o=this==null?void 0:this.validate)==null?void 0:o.length)==null?void 0:l.message,limitMaxLength:(p=(c=this==null?void 0:this.validate)==null?void 0:c.length)!=null&&p.limitMaxLength?this.validate.length.limitMaxLength:!1}}},validationMessages(){return this.showLengthLimitValidation?this.formattedMessages.concat([this.inputLengthErrorMessage()]):this.formattedMessages},showInputState(){return this.showMessages&&this.inputState},inputLength(){return this.currentLength?this.currentLength:this.defaultLengthCalculation},inputLengthState(){return this.inputLength<this.validationProps.length.warn?null:this.inputLength<=this.validationProps.length.max?this.validationProps.length.warn?h.VALIDATION_MESSAGE_TYPES.WARNING:null:h.VALIDATION_MESSAGE_TYPES.ERROR},shouldValidateLength(){return!!(this.validationProps.length.description&&this.validationProps.length.max)},shouldLimitMaxLength(){return this.shouldValidateLength&&this.validationProps.length.limitMaxLength},showLengthLimitValidation(){return this.shouldValidateLength&&this.inputLengthState!==null&&this.validationProps.length.message&&(this.retainWarning||this.isInputFocused||this.isInvalid)},sizeModifierClass(){return this.isDefaultSize||!this.isValidSize?"":n.INPUT_SIZE_CLASSES[this.inputComponent][this.size]},stateClass(){return[n.INPUT_STATE_CLASSES[this.inputState]]}},watch:{isInvalid(e){this.$emit("update:invalid",e)},modelValue:{immediate:!0,handler(e){this.shouldValidateLength&&this.validateLength(this.inputLength),this.currentLength==null&&this.$emit("update:length",this.calculateLength(e)),this.isTextarea&&this.$refs.input&&this.$refs.input.value!==e&&(this.$refs.input.value=e)}}},beforeMount(){this.descriptionSizeClasses=n.DESCRIPTION_SIZE_CLASSES,this.labelSizeClasses=n.LABEL_SIZE_CLASSES},mounted(){this.isTextarea&&this.$refs.input&&(this.$refs.input.value=this.modelValue)},methods:{removeClassStyleAttrs:d.removeClassStyleAttrs,addClassStyleAttrs:d.addClassStyleAttrs,inputClasses(){return["d-input__input",this.inputComponent==="input"?"d-input":"d-textarea",{[this.stateClass]:this.showInputState,"d-input-icon--left":this.$slots.leftIcon,"d-input-icon--right":this.$slots.rightIcon},this.sizeModifierClass,this.inputClass]},inputWrapperClasses(){return this.hidden?[]:["d-input__wrapper",{[this.stateClass]:this.showInputState},this.inputWrapperClass]},calculateLength(e){return typeof e!="string"?0:[...e].length},inputLengthErrorMessage(){return{message:this.validationProps.length.message,type:this.inputLengthState}},onBlur(e){var a;(a=this.$refs.container)!=null&&a.contains(e.relatedTarget)||this.$emit("blur",e)},emitClearEvents(){this.$emit("input",""),this.$emit("clear"),this.$emit("update:modelValue","")},blur(){this.$refs.input.blur()},focus(){this.$refs.input.focus()},select(){this.$refs.input.select()},getMessageKey(e,a){return`message-${e}-${a}`},validateLength(e){this.isInvalid=e>this.validationProps.length.max},clearInput(){this.$refs.input.value="",this.$refs.input.focus(),this.emitClearEvents()}}},v=["aria-details"],C=["id"],_={key:0},L={key:1,"data-qa":"dt-input-length-description",class:"d-input__length-description"},y=["read-only"],E=["name","disabled","autocomplete","maxlength"],I=["value","name","type","disabled","autocomplete","maxlength"];function b(e,a,s,r,u,i){const o=t.resolveComponent("dt-validation-messages");return t.openBlock(),t.createElementBlock("div",t.mergeProps({ref:"container",class:[s.rootClass,"d-input__root",{"d-input--hidden":s.hidden}]},i.addClassStyleAttrs(e.$attrs),{"data-qa":"dt-input"}),[t.createElementVNode("label",{class:"d-input__label","aria-details":e.$slots.description||s.description?i.descriptionKey:void 0,"data-qa":"dt-input-label-wrapper"},[t.renderSlot(e.$slots,"labelSlot",{},()=>[s.labelVisible&&s.label?(t.openBlock(),t.createElementBlock("div",{key:0,ref:"label","data-qa":"dt-input-label",class:t.normalizeClass(["d-input__label-text","d-label",e.labelSizeClasses[s.size]])},t.toDisplayString(s.label),3)):t.createCommentVNode("",!0)]),u.hasSlotContent(e.$slots.description)||s.description||i.shouldValidateLength?(t.openBlock(),t.createElementBlock("div",{key:0,id:i.descriptionKey,ref:"description",class:t.normalizeClass(["d-input__description","d-description",e.descriptionSizeClasses[s.size]]),"data-qa":"dt-input-description"},[u.hasSlotContent(e.$slots.description)||s.description?(t.openBlock(),t.createElementBlock("div",_,[t.renderSlot(e.$slots,"description",{},()=>[t.createTextVNode(t.toDisplayString(s.description),1)])])):t.createCommentVNode("",!0),i.shouldValidateLength?(t.openBlock(),t.createElementBlock("div",L,t.toDisplayString(i.validationProps.length.description),1)):t.createCommentVNode("",!0)],10,C)):t.createCommentVNode("",!0),t.createElementVNode("div",{class:t.normalizeClass(i.inputWrapperClasses()),"read-only":s.disabled===!0?!0:void 0},[t.createElementVNode("span",{class:"d-input-icon d-input-icon--left","data-qa":"dt-input-left-icon-wrapper",onFocusout:a[0]||(a[0]=(...l)=>i.onBlur&&i.onBlur(...l))},[t.renderSlot(e.$slots,"leftIcon",{iconSize:i.iconSize})],32),i.isTextarea?(t.openBlock(),t.createElementBlock("textarea",t.mergeProps({key:0,ref:"input",name:s.name,disabled:s.disabled,autocomplete:e.$attrs.autocomplete??"off",class:i.inputClasses(),maxlength:i.shouldLimitMaxLength?i.validationProps.length.max:null,"data-qa":"dt-input-input"},i.removeClassStyleAttrs(e.$attrs),t.toHandlers(i.inputListeners,!0)),null,16,E)):(t.openBlock(),t.createElementBlock("input",t.mergeProps({key:1,ref:"input",value:s.modelValue,name:s.name,type:s.type,disabled:s.disabled,autocomplete:e.$attrs.autocomplete??"off",class:i.inputClasses(),maxlength:i.shouldLimitMaxLength?i.validationProps.length.max:null,"data-qa":"dt-input-input"},i.removeClassStyleAttrs(e.$attrs),t.toHandlers(i.inputListeners,!0)),null,16,I)),t.createElementVNode("span",{class:"d-input-icon d-input-icon--right","data-qa":"dt-input-right-icon-wrapper",onFocusout:a[1]||(a[1]=(...l)=>i.onBlur&&i.onBlur(...l))},[t.renderSlot(e.$slots,"rightIcon",{iconSize:i.iconSize,clear:i.clearInput})],32)],10,y)],8,v),t.createVNode(o,t.mergeProps({"validation-messages":i.validationMessages,"show-messages":e.showMessages,class:e.messagesClass},e.messagesChildProps,{"data-qa":"dt-input-messages"}),null,16,["validation-messages","show-messages","class"])],16)}const P=g._(S,[["render",b]]);exports.default=P;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("../../common/constants/index.cjs"),n=require("./input-constants.cjs"),o=require("../../common/utils/index.cjs"),m=require("../../common/mixins/input.cjs"),t=require("vue"),g=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),f=require("../validation-messages/validation-messages.cjs"),S={compatConfig:{MODE:3},name:"DtInput",components:{DtValidationMessages:f.default},mixins:[m.MessagesMixin],inheritAttrs:!1,props:{name:{type:String,default:""},type:{type:String,default:n.INPUT_TYPES.TEXT,validator:e=>Object.values(n.INPUT_TYPES).includes(e)},modelValue:{type:[String,Number],default:""},disabled:{type:Boolean,default:!1},label:{type:String,default:""},labelVisible:{type:Boolean,default:!0},description:{type:String,default:""},size:{type:String,default:"md",validator:e=>Object.values(n.INPUT_SIZES).includes(e)},inputClass:{type:[String,Object,Array],default:""},inputWrapperClass:{type:[String,Object,Array],default:""},rootClass:{type:[String,Object,Array],default:""},currentLength:{type:Number,default:null},retainWarning:{type:Boolean,default:!1},validate:{type:Object,default:null},hidden:{type:Boolean,default:!1}},emits:["input","blur","clear","focus","focusin","focusout","update:modelValue","update:length","update:invalid"],data(){return{isInputFocused:!1,isInvalid:!1,defaultLength:0,hasSlotContent:o.hasSlotContent,isComposing:!1,justEndedComposition:!1}},computed:{isTextarea(){return this.type===n.INPUT_TYPES.TEXTAREA},isDefaultSize(){return this.size===n.INPUT_SIZES.DEFAULT},iconSize(){return n.INPUT_ICON_SIZES[this.size]},isValidSize(){return Object.values(n.INPUT_SIZES).includes(this.size)},isValidDescriptionSize(){return Object.values(h.DESCRIPTION_SIZE_TYPES).includes(this.size)},inputComponent(){return this.isTextarea?"textarea":"input"},inputListeners(){return{compositionstart:()=>{this.isComposing=!0},compositionend:()=>{this.isComposing=!1,this.justEndedComposition=!0;const e=this.$refs.input.value;this.$emit("input",e),this.$emit("update:modelValue",e),Promise.resolve().then(()=>{this.justEndedComposition=!1})},input:async e=>{if(this.isComposing||this.justEndedComposition)return;let a=e.target.value;this.type===n.INPUT_TYPES.FILE&&(a=Array.from(e.target.files).map(r=>r.name)),this.$emit("input",a),this.$emit("update:modelValue",a)},blur:e=>{this.isInputFocused=!1,this.onBlur(e)},focus:e=>{this.isInputFocused=!0,this.$emit("focus",e)},focusin:e=>this.$emit("focusin",e),focusout:e=>this.$emit("focusout",e)}},descriptionKey(){return`input-description-${o.getUniqueString()}`},inputState(){return o.getValidationState(this.validationMessages)},defaultLengthCalculation(){return this.calculateLength(this.modelValue)},validationProps(){var e,a,s,r,u,i,d,l,p,c;return{length:{description:(a=(e=this==null?void 0:this.validate)==null?void 0:e.length)==null?void 0:a.description,max:(r=(s=this==null?void 0:this.validate)==null?void 0:s.length)==null?void 0:r.max,warn:(i=(u=this==null?void 0:this.validate)==null?void 0:u.length)==null?void 0:i.warn,message:(l=(d=this==null?void 0:this.validate)==null?void 0:d.length)==null?void 0:l.message,limitMaxLength:(c=(p=this==null?void 0:this.validate)==null?void 0:p.length)!=null&&c.limitMaxLength?this.validate.length.limitMaxLength:!1}}},validationMessages(){return this.showLengthLimitValidation?this.formattedMessages.concat([this.inputLengthErrorMessage()]):this.formattedMessages},showInputState(){return this.showMessages&&this.inputState},inputLength(){return this.currentLength?this.currentLength:this.defaultLengthCalculation},inputLengthState(){return this.inputLength<this.validationProps.length.warn?null:this.inputLength<=this.validationProps.length.max?this.validationProps.length.warn?h.VALIDATION_MESSAGE_TYPES.WARNING:null:h.VALIDATION_MESSAGE_TYPES.ERROR},shouldValidateLength(){return!!(this.validationProps.length.description&&this.validationProps.length.max)},shouldLimitMaxLength(){return this.shouldValidateLength&&this.validationProps.length.limitMaxLength},showLengthLimitValidation(){return this.shouldValidateLength&&this.inputLengthState!==null&&this.validationProps.length.message&&(this.retainWarning||this.isInputFocused||this.isInvalid)},sizeModifierClass(){return this.isDefaultSize||!this.isValidSize?"":n.INPUT_SIZE_CLASSES[this.inputComponent][this.size]},stateClass(){return[n.INPUT_STATE_CLASSES[this.inputState]]}},watch:{isInvalid(e){this.$emit("update:invalid",e)},modelValue:{immediate:!0,handler(e){this.shouldValidateLength&&this.validateLength(this.inputLength),this.currentLength==null&&this.$emit("update:length",this.calculateLength(e)),this.isTextarea&&!this.isComposing&&this.$refs.input&&this.$refs.input.value!==e&&(this.$refs.input.value=e)}}},beforeMount(){this.descriptionSizeClasses=n.DESCRIPTION_SIZE_CLASSES,this.labelSizeClasses=n.LABEL_SIZE_CLASSES},mounted(){this.isTextarea&&this.$refs.input&&(this.$refs.input.value=this.modelValue)},methods:{removeClassStyleAttrs:o.removeClassStyleAttrs,addClassStyleAttrs:o.addClassStyleAttrs,inputClasses(){return["d-input__input",this.inputComponent==="input"?"d-input":"d-textarea",{[this.stateClass]:this.showInputState,"d-input-icon--left":this.$slots.leftIcon,"d-input-icon--right":this.$slots.rightIcon},this.sizeModifierClass,this.inputClass]},inputWrapperClasses(){return this.hidden?[]:["d-input__wrapper",{[this.stateClass]:this.showInputState},this.inputWrapperClass]},calculateLength(e){return typeof e!="string"?0:[...e].length},inputLengthErrorMessage(){return{message:this.validationProps.length.message,type:this.inputLengthState}},onBlur(e){var a;(a=this.$refs.container)!=null&&a.contains(e.relatedTarget)||this.$emit("blur",e)},emitClearEvents(){this.$emit("input",""),this.$emit("clear"),this.$emit("update:modelValue","")},blur(){this.$refs.input.blur()},focus(){this.$refs.input.focus()},select(){this.$refs.input.select()},getMessageKey(e,a){return`message-${e}-${a}`},validateLength(e){this.isInvalid=e>this.validationProps.length.max},clearInput(){this.$refs.input.value="",this.$refs.input.focus(),this.emitClearEvents()}}},v=["aria-details"],C=["id"],_={key:0},L={key:1,"data-qa":"dt-input-length-description",class:"d-input__length-description"},E=["read-only"],y=["name","disabled","autocomplete","maxlength"],I=["value","name","type","disabled","autocomplete","maxlength"];function b(e,a,s,r,u,i){const d=t.resolveComponent("dt-validation-messages");return t.openBlock(),t.createElementBlock("div",t.mergeProps({ref:"container",class:[s.rootClass,"d-input__root",{"d-input--hidden":s.hidden}]},i.addClassStyleAttrs(e.$attrs),{"data-qa":"dt-input"}),[t.createElementVNode("label",{class:"d-input__label","aria-details":e.$slots.description||s.description?i.descriptionKey:void 0,"data-qa":"dt-input-label-wrapper"},[t.renderSlot(e.$slots,"labelSlot",{},()=>[s.labelVisible&&s.label?(t.openBlock(),t.createElementBlock("div",{key:0,ref:"label","data-qa":"dt-input-label",class:t.normalizeClass(["d-input__label-text","d-label",e.labelSizeClasses[s.size]])},t.toDisplayString(s.label),3)):t.createCommentVNode("",!0)]),u.hasSlotContent(e.$slots.description)||s.description||i.shouldValidateLength?(t.openBlock(),t.createElementBlock("div",{key:0,id:i.descriptionKey,ref:"description",class:t.normalizeClass(["d-input__description","d-description",e.descriptionSizeClasses[s.size]]),"data-qa":"dt-input-description"},[u.hasSlotContent(e.$slots.description)||s.description?(t.openBlock(),t.createElementBlock("div",_,[t.renderSlot(e.$slots,"description",{},()=>[t.createTextVNode(t.toDisplayString(s.description),1)])])):t.createCommentVNode("",!0),i.shouldValidateLength?(t.openBlock(),t.createElementBlock("div",L,t.toDisplayString(i.validationProps.length.description),1)):t.createCommentVNode("",!0)],10,C)):t.createCommentVNode("",!0),t.createElementVNode("div",{class:t.normalizeClass(i.inputWrapperClasses()),"read-only":s.disabled===!0?!0:void 0},[t.createElementVNode("span",{class:"d-input-icon d-input-icon--left","data-qa":"dt-input-left-icon-wrapper",onFocusout:a[0]||(a[0]=(...l)=>i.onBlur&&i.onBlur(...l))},[t.renderSlot(e.$slots,"leftIcon",{iconSize:i.iconSize})],32),i.isTextarea?(t.openBlock(),t.createElementBlock("textarea",t.mergeProps({key:0,ref:"input",name:s.name,disabled:s.disabled,autocomplete:e.$attrs.autocomplete??"off",class:i.inputClasses(),maxlength:i.shouldLimitMaxLength?i.validationProps.length.max:null,"data-qa":"dt-input-input"},i.removeClassStyleAttrs(e.$attrs),t.toHandlers(i.inputListeners,!0)),null,16,y)):(t.openBlock(),t.createElementBlock("input",t.mergeProps({key:1,ref:"input",value:s.modelValue,name:s.name,type:s.type,disabled:s.disabled,autocomplete:e.$attrs.autocomplete??"off",class:i.inputClasses(),maxlength:i.shouldLimitMaxLength?i.validationProps.length.max:null,"data-qa":"dt-input-input"},i.removeClassStyleAttrs(e.$attrs),t.toHandlers(i.inputListeners,!0)),null,16,I)),t.createElementVNode("span",{class:"d-input-icon d-input-icon--right","data-qa":"dt-input-right-icon-wrapper",onFocusout:a[1]||(a[1]=(...l)=>i.onBlur&&i.onBlur(...l))},[t.renderSlot(e.$slots,"rightIcon",{iconSize:i.iconSize,clear:i.clearInput})],32)],10,E)],8,v),t.createVNode(d,t.mergeProps({"validation-messages":i.validationMessages,"show-messages":e.showMessages,class:e.messagesClass},e.messagesChildProps,{"data-qa":"dt-input-messages"}),null,16,["validation-messages","show-messages","class"])],16)}const P=g._(S,[["render",b]]);exports.default=P;
2
2
  //# sourceMappingURL=input.cjs.map
package/dist/lib/input/input.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input.cjs","sources":["../../../components/input/input.vue"],"sourcesContent":["<template>\n <div\n ref=\"container\"\n :class=\"[rootClass, 'd-input__root', { 'd-input--hidden': hidden }]\"\n v-bind=\"addClassStyleAttrs($attrs)\"\n data-qa=\"dt-input\"\n >\n <label\n class=\"d-input__label\"\n :aria-details=\"$slots.description || description ? descriptionKey : undefined\"\n data-qa=\"dt-input-label-wrapper\"\n >\n <!-- @slot Slot for label, defaults to label prop -->\n <slot name=\"labelSlot\">\n <div\n v-if=\"labelVisible && label\"\n ref=\"label\"\n data-qa=\"dt-input-label\"\n :class=\"[\n 'd-input__label-text',\n 'd-label',\n labelSizeClasses[size],\n ]\"\n >\n {{ label }}\n </div>\n </slot>\n <div\n v-if=\"hasSlotContent($slots.description) || description || shouldValidateLength\"\n :id=\"descriptionKey\"\n ref=\"description\"\n :class=\"[\n 'd-input__description',\n 'd-description',\n descriptionSizeClasses[size],\n ]\"\n data-qa=\"dt-input-description\"\n >\n <div\n v-if=\"hasSlotContent($slots.description) || description\"\n >\n <!-- @slot Slot for description, defaults to description prop -->\n <slot name=\"description\">{{ description }}</slot>\n </div>\n <div\n v-if=\"shouldValidateLength\"\n data-qa=\"dt-input-length-description\"\n class=\"d-input__length-description\"\n >\n {{ validationProps.length.description }}\n </div>\n </div>\n <div\n :class=\"inputWrapperClasses()\"\n :read-only=\"disabled === true ? true : undefined\"\n >\n <span\n class=\"d-input-icon d-input-icon--left\"\n data-qa=\"dt-input-left-icon-wrapper\"\n @focusout=\"onBlur\"\n >\n <!-- @slot Slot for left icon -->\n <slot\n name=\"leftIcon\"\n :icon-size=\"iconSize\"\n />\n </span>\n <textarea\n v-if=\"isTextarea\"\n ref=\"input\"\n :name=\"name\"\n :disabled=\"disabled\"\n :autocomplete=\"$attrs.autocomplete ?? 'off'\"\n :class=\"inputClasses()\"\n :maxlength=\"shouldLimitMaxLength ? validationProps.length.max : null\"\n data-qa=\"dt-input-input\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n />\n <input\n v-else\n ref=\"input\"\n :value=\"modelValue\"\n :name=\"name\"\n :type=\"type\"\n :disabled=\"disabled\"\n :autocomplete=\"$attrs.autocomplete ?? 'off'\"\n :class=\"inputClasses()\"\n :maxlength=\"shouldLimitMaxLength ? validationProps.length.max : null\"\n data-qa=\"dt-input-input\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n >\n <span\n class=\"d-input-icon d-input-icon--right\"\n data-qa=\"dt-input-right-icon-wrapper\"\n @focusout=\"onBlur\"\n >\n <!-- @slot Slot for right icon -->\n <slot\n name=\"rightIcon\"\n :icon-size=\"iconSize\"\n :clear=\"clearInput\"\n />\n </span>\n </div>\n </label>\n <dt-validation-messages\n :validation-messages=\"validationMessages\"\n :show-messages=\"showMessages\"\n :class=\"messagesClass\"\n v-bind=\"messagesChildProps\"\n data-qa=\"dt-input-messages\"\n />\n </div>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport { DESCRIPTION_SIZE_TYPES, VALIDATION_MESSAGE_TYPES } from '@/common/constants';\nimport {\n INPUT_TYPES,\n INPUT_SIZES,\n INPUT_SIZE_CLASSES,\n INPUT_ICON_SIZES,\n INPUT_STATE_CLASSES,\n DESCRIPTION_SIZE_CLASSES,\n LABEL_SIZE_CLASSES,\n} from './input_constants';\nimport {\n getUniqueString,\n getValidationState,\n hasSlotContent,\n removeClassStyleAttrs,\n addClassStyleAttrs,\n} from '@/common/utils';\nimport { DtValidationMessages } from '@/components/validation_messages';\nimport { MessagesMixin } from '@/common/mixins/input';\n\n/**\n * An input field is an input control that allows users to enter alphanumeric information.\n * It can have a range of options and supports single line and multi-line lengths,\n * as well as varying formats, including numbers, masked passwords, etc.\n * @property {Boolean} placeholder attribute\n * @see https://dialtone.dialpad.com/components/input.html\n */\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtInput',\n\n components: { DtValidationMessages },\n\n mixins: [MessagesMixin],\n\n inheritAttrs: false,\n\n props: {\n /**\n * Name property of the input element\n */\n name: {\n type: String,\n default: '',\n },\n\n /**\n * Type of the input.\n * When `textarea` a `<textarea>` element will be rendered instead of an `<input>` element.\n * @values text, password, email, number, textarea, date, time, file, tel, search, color\n * @default 'text'\n */\n type: {\n type: String,\n default: INPUT_TYPES.TEXT,\n validator: (t) => Object.values(INPUT_TYPES).includes(t),\n },\n\n /**\n * Value of the input\n */\n modelValue: {\n type: [String, Number],\n default: '',\n },\n\n /**\n * Disables the input\n * @values true, false\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Label for the input\n */\n label: {\n type: String,\n default: '',\n },\n\n /**\n * Determines visibility of input label.\n * @values true, false\n */\n labelVisible: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Description for the input\n */\n description: {\n type: String,\n default: '',\n },\n\n /**\n * Size of the input, one of `xs`, `sm`, `md`, `lg`, `xl`\n * @values xs, sm, md, lg, xl\n */\n size: {\n type: String,\n default: 'md',\n validator: (t) => Object.values(INPUT_SIZES).includes(t),\n },\n\n /**\n * Additional class name for the input element.\n * Can accept String, Object, and Array, i.e. has the\n * same API as Vue's built-in handling of the class attribute.\n */\n inputClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * Additional class name for the input wrapper element.\n * Can accept all of: String, Object, and Array, i.e. has the\n * same api as Vue's built-in handling of the class attribute.\n */\n inputWrapperClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * Additional class name for the root element.\n * Can accept all of: String, Object, and Array, i.e. has the\n * same api as Vue's built-in handling of the class attribute.\n */\n rootClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * The current character length that the user has entered into the input.\n * This will only need to be used if you are using `validate.length` and\n * the string contains abnormal characters.\n * For example, an emoji could take up many characters in the input, but should only count as 1 character.\n * If no number is provided, a built-in length calculation will be used for the length validation.\n */\n currentLength: {\n type: Number,\n default: null,\n },\n\n /**\n * Whether the input will continue to display a warning validation message even if the input has lost focus.\n */\n retainWarning: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Validation for the input. Supports maximum length validation with the structure:\n * `{ \"length\": {\"description\": string, \"max\": number, \"warn\": number, \"message\": string,\n * \"limitMaxLength\": boolean }}`\n */\n validate: {\n type: Object,\n default: null,\n },\n\n /**\n * hidden allows to use input without the element visually present in DOM\n */\n hidden: {\n type: Boolean,\n default: false,\n },\n },\n\n emits: [\n /**\n * Native input event\n *\n * @event input\n * @type {String}\n */\n 'input',\n\n /**\n * Native input blur event\n *\n * @event blur\n * @type {FocusEvent}\n */\n 'blur',\n\n /**\n * Input clear event\n *\n * @event clear\n */\n 'clear',\n\n /**\n * Native input focus event\n *\n * @event focus\n * @type {FocusEvent}\n */\n 'focus',\n\n /**\n * Native input focusin event\n *\n * @event focusin\n * @type {FocusEvent}\n */\n 'focusin',\n\n /**\n * Native input focusout event\n *\n * @event focusout\n * @type {FocusEvent}\n */\n 'focusout',\n\n /**\n * Event fired to sync the modelValue prop with the parent component\n * @event update:modelValue\n */\n 'update:modelValue',\n\n /**\n * Length of the input when currentLength prop is not passed\n *\n * @event update:length\n * @type {Number}\n */\n 'update:length',\n\n /**\n * Result of the input validation\n *\n * @event update:invalid\n * @type {Boolean}\n */\n 'update:invalid',\n ],\n\n data () {\n return {\n isInputFocused: false,\n isInvalid: false,\n defaultLength: 0,\n hasSlotContent,\n };\n },\n\n computed: {\n\n isTextarea () {\n return this.type === INPUT_TYPES.TEXTAREA;\n },\n\n isDefaultSize () {\n return this.size === INPUT_SIZES.DEFAULT;\n },\n\n iconSize () {\n return INPUT_ICON_SIZES[this.size];\n },\n\n isValidSize () {\n return Object.values(INPUT_SIZES).includes(this.size);\n },\n\n isValidDescriptionSize () {\n return Object.values(DESCRIPTION_SIZE_TYPES).includes(this.size);\n },\n\n inputComponent () {\n if (this.isTextarea) {\n return 'textarea';\n }\n\n return 'input';\n },\n\n inputListeners () {\n return {\n input: async event => {\n let val = event.target.value;\n if (this.type === INPUT_TYPES.FILE) {\n const files = Array.from(event.target.files);\n val = files.map(file => file.name);\n }\n this.$emit('input', val);\n this.$emit('update:modelValue', val);\n },\n\n blur: event => {\n this.isInputFocused = false;\n this.onBlur(event);\n },\n\n focus: event => {\n this.isInputFocused = true;\n this.$emit('focus', event);\n },\n\n focusin: event => this.$emit('focusin', event),\n focusout: event => this.$emit('focusout', event),\n };\n },\n\n descriptionKey () {\n return `input-description-${getUniqueString()}`;\n },\n\n inputState () {\n return getValidationState(this.validationMessages);\n },\n\n defaultLengthCalculation () {\n return this.calculateLength(this.modelValue);\n },\n\n validationProps () {\n return {\n length: {\n description: this?.validate?.length?.description,\n max: this?.validate?.length?.max,\n warn: this?.validate?.length?.warn,\n message: this?.validate?.length?.message,\n limitMaxLength: this?.validate?.length?.limitMaxLength ? this.validate.length.limitMaxLength : false,\n },\n };\n },\n\n validationMessages () {\n // Add length validation message if exists\n if (this.showLengthLimitValidation) {\n return this.formattedMessages.concat([this.inputLengthErrorMessage()]);\n }\n\n return this.formattedMessages;\n },\n\n showInputState () {\n return this.showMessages && this.inputState;\n },\n\n inputLength () {\n return this.currentLength ? this.currentLength : this.defaultLengthCalculation;\n },\n\n inputLengthState () {\n if (this.inputLength < this.validationProps.length.warn) {\n return null;\n } else if (this.inputLength <= this.validationProps.length.max) {\n return this.validationProps.length.warn ? VALIDATION_MESSAGE_TYPES.WARNING : null;\n } else {\n return VALIDATION_MESSAGE_TYPES.ERROR;\n }\n },\n\n shouldValidateLength () {\n return !!(\n this.validationProps.length.description &&\n this.validationProps.length.max\n );\n },\n\n shouldLimitMaxLength () {\n return this.shouldValidateLength && this.validationProps.length.limitMaxLength;\n },\n\n showLengthLimitValidation () {\n return (\n this.shouldValidateLength &&\n this.inputLengthState !== null &&\n this.validationProps.length.message &&\n (this.retainWarning || this.isInputFocused || this.isInvalid)\n );\n },\n\n sizeModifierClass () {\n if (this.isDefaultSize || !this.isValidSize) {\n return '';\n }\n\n return INPUT_SIZE_CLASSES[this.inputComponent][this.size];\n },\n\n stateClass () {\n return [INPUT_STATE_CLASSES[this.inputState]];\n },\n },\n\n watch: {\n isInvalid (val) {\n this.$emit('update:invalid', val);\n },\n\n modelValue: {\n immediate: true,\n handler (newValue) {\n if (this.shouldValidateLength) {\n this.validateLength(this.inputLength);\n }\n\n if (this.currentLength == null) {\n this.$emit('update:length', this.calculateLength(newValue));\n }\n\n // Set textarea value programmatically to avoid attribute binding\n if (this.isTextarea && this.$refs.input && this.$refs.input.value !== newValue) {\n this.$refs.input.value = newValue;\n }\n },\n },\n },\n\n beforeMount () {\n this.descriptionSizeClasses = DESCRIPTION_SIZE_CLASSES;\n this.labelSizeClasses = LABEL_SIZE_CLASSES;\n },\n\n mounted () {\n // Set initial textarea value programmatically\n if (this.isTextarea && this.$refs.input) {\n this.$refs.input.value = this.modelValue;\n }\n },\n\n methods: {\n removeClassStyleAttrs,\n addClassStyleAttrs,\n inputClasses () {\n return [\n 'd-input__input',\n this.inputComponent === 'input' ? 'd-input' : 'd-textarea',\n {\n [this.stateClass]: this.showInputState,\n 'd-input-icon--left': this.$slots.leftIcon,\n 'd-input-icon--right': this.$slots.rightIcon,\n },\n this.sizeModifierClass,\n this.inputClass,\n ];\n },\n\n inputWrapperClasses () {\n if (this.hidden) {\n return [];\n }\n return [\n 'd-input__wrapper',\n { [this.stateClass]: this.showInputState },\n this.inputWrapperClass,\n ];\n },\n\n calculateLength (value) {\n if (typeof value !== 'string') {\n return 0;\n }\n\n return [...value].length;\n },\n\n inputLengthErrorMessage () {\n return {\n message: this.validationProps.length.message,\n type: this.inputLengthState,\n };\n },\n\n onBlur (e) {\n // Do not emit a blur event if the target element is a child of this component\n if (!this.$refs.container?.contains(e.relatedTarget)) {\n this.$emit('blur', e);\n }\n },\n\n emitClearEvents () {\n this.$emit('input', '');\n this.$emit('clear');\n this.$emit('update:modelValue', '');\n },\n\n blur () {\n this.$refs.input.blur();\n },\n\n focus () {\n this.$refs.input.focus();\n },\n\n select () {\n this.$refs.input.select();\n },\n\n getMessageKey (type, index) {\n return `message-${type}-${index}`;\n },\n\n validateLength (length) {\n this.isInvalid = (length > this.validationProps.length.max);\n },\n\n clearInput () {\n this.$refs.input.value = '';\n this.$refs.input.focus();\n this.emitClearEvents();\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtValidationMessages","MessagesMixin","INPUT_TYPES","t","INPUT_SIZES","hasSlotContent","INPUT_ICON_SIZES","DESCRIPTION_SIZE_TYPES","event","val","file","getUniqueString","getValidationState","_b","_a","_d","_c","_f","_e","_h","_g","_j","_i","VALIDATION_MESSAGE_TYPES","INPUT_SIZE_CLASSES","INPUT_STATE_CLASSES","newValue","DESCRIPTION_SIZE_CLASSES","LABEL_SIZE_CLASSES","removeClassStyleAttrs","addClassStyleAttrs","value","type","index","length","_openBlock","_createElementBlock","_mergeProps","$props","$options","_ctx","_createElementVNode","_renderSlot","_normalizeClass","$data","_hoisted_3","_hoisted_4","_toDisplayString","args","_toHandlers","_hoisted_6","_hoisted_7","_createVNode","_component_dt_validation_messages"],"mappings":"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"}
1
+ {"version":3,"file":"input.cjs","sources":["../../../components/input/input.vue"],"sourcesContent":["<template>\n <div\n ref=\"container\"\n :class=\"[rootClass, 'd-input__root', { 'd-input--hidden': hidden }]\"\n v-bind=\"addClassStyleAttrs($attrs)\"\n data-qa=\"dt-input\"\n >\n <label\n class=\"d-input__label\"\n :aria-details=\"$slots.description || description ? descriptionKey : undefined\"\n data-qa=\"dt-input-label-wrapper\"\n >\n <!-- @slot Slot for label, defaults to label prop -->\n <slot name=\"labelSlot\">\n <div\n v-if=\"labelVisible && label\"\n ref=\"label\"\n data-qa=\"dt-input-label\"\n :class=\"[\n 'd-input__label-text',\n 'd-label',\n labelSizeClasses[size],\n ]\"\n >\n {{ label }}\n </div>\n </slot>\n <div\n v-if=\"hasSlotContent($slots.description) || description || shouldValidateLength\"\n :id=\"descriptionKey\"\n ref=\"description\"\n :class=\"[\n 'd-input__description',\n 'd-description',\n descriptionSizeClasses[size],\n ]\"\n data-qa=\"dt-input-description\"\n >\n <div\n v-if=\"hasSlotContent($slots.description) || description\"\n >\n <!-- @slot Slot for description, defaults to description prop -->\n <slot name=\"description\">{{ description }}</slot>\n </div>\n <div\n v-if=\"shouldValidateLength\"\n data-qa=\"dt-input-length-description\"\n class=\"d-input__length-description\"\n >\n {{ validationProps.length.description }}\n </div>\n </div>\n <div\n :class=\"inputWrapperClasses()\"\n :read-only=\"disabled === true ? true : undefined\"\n >\n <span\n class=\"d-input-icon d-input-icon--left\"\n data-qa=\"dt-input-left-icon-wrapper\"\n @focusout=\"onBlur\"\n >\n <!-- @slot Slot for left icon -->\n <slot\n name=\"leftIcon\"\n :icon-size=\"iconSize\"\n />\n </span>\n <textarea\n v-if=\"isTextarea\"\n ref=\"input\"\n :name=\"name\"\n :disabled=\"disabled\"\n :autocomplete=\"$attrs.autocomplete ?? 'off'\"\n :class=\"inputClasses()\"\n :maxlength=\"shouldLimitMaxLength ? validationProps.length.max : null\"\n data-qa=\"dt-input-input\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n />\n <input\n v-else\n ref=\"input\"\n :value=\"modelValue\"\n :name=\"name\"\n :type=\"type\"\n :disabled=\"disabled\"\n :autocomplete=\"$attrs.autocomplete ?? 'off'\"\n :class=\"inputClasses()\"\n :maxlength=\"shouldLimitMaxLength ? validationProps.length.max : null\"\n data-qa=\"dt-input-input\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n >\n <span\n class=\"d-input-icon d-input-icon--right\"\n data-qa=\"dt-input-right-icon-wrapper\"\n @focusout=\"onBlur\"\n >\n <!-- @slot Slot for right icon -->\n <slot\n name=\"rightIcon\"\n :icon-size=\"iconSize\"\n :clear=\"clearInput\"\n />\n </span>\n </div>\n </label>\n <dt-validation-messages\n :validation-messages=\"validationMessages\"\n :show-messages=\"showMessages\"\n :class=\"messagesClass\"\n v-bind=\"messagesChildProps\"\n data-qa=\"dt-input-messages\"\n />\n </div>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport { DESCRIPTION_SIZE_TYPES, VALIDATION_MESSAGE_TYPES } from '@/common/constants';\nimport {\n INPUT_TYPES,\n INPUT_SIZES,\n INPUT_SIZE_CLASSES,\n INPUT_ICON_SIZES,\n INPUT_STATE_CLASSES,\n DESCRIPTION_SIZE_CLASSES,\n LABEL_SIZE_CLASSES,\n} from './input_constants';\nimport {\n getUniqueString,\n getValidationState,\n hasSlotContent,\n removeClassStyleAttrs,\n addClassStyleAttrs,\n} from '@/common/utils';\nimport { DtValidationMessages } from '@/components/validation_messages';\nimport { MessagesMixin } from '@/common/mixins/input';\n\n/**\n * An input field is an input control that allows users to enter alphanumeric information.\n * It can have a range of options and supports single line and multi-line lengths,\n * as well as varying formats, including numbers, masked passwords, etc.\n * @property {Boolean} placeholder attribute\n * @see https://dialtone.dialpad.com/components/input.html\n */\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtInput',\n\n components: { DtValidationMessages },\n\n mixins: [MessagesMixin],\n\n inheritAttrs: false,\n\n props: {\n /**\n * Name property of the input element\n */\n name: {\n type: String,\n default: '',\n },\n\n /**\n * Type of the input.\n * When `textarea` a `<textarea>` element will be rendered instead of an `<input>` element.\n * @values text, password, email, number, textarea, date, time, file, tel, search, color\n * @default 'text'\n */\n type: {\n type: String,\n default: INPUT_TYPES.TEXT,\n validator: (t) => Object.values(INPUT_TYPES).includes(t),\n },\n\n /**\n * Value of the input\n */\n modelValue: {\n type: [String, Number],\n default: '',\n },\n\n /**\n * Disables the input\n * @values true, false\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Label for the input\n */\n label: {\n type: String,\n default: '',\n },\n\n /**\n * Determines visibility of input label.\n * @values true, false\n */\n labelVisible: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Description for the input\n */\n description: {\n type: String,\n default: '',\n },\n\n /**\n * Size of the input, one of `xs`, `sm`, `md`, `lg`, `xl`\n * @values xs, sm, md, lg, xl\n */\n size: {\n type: String,\n default: 'md',\n validator: (t) => Object.values(INPUT_SIZES).includes(t),\n },\n\n /**\n * Additional class name for the input element.\n * Can accept String, Object, and Array, i.e. has the\n * same API as Vue's built-in handling of the class attribute.\n */\n inputClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * Additional class name for the input wrapper element.\n * Can accept all of: String, Object, and Array, i.e. has the\n * same api as Vue's built-in handling of the class attribute.\n */\n inputWrapperClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * Additional class name for the root element.\n * Can accept all of: String, Object, and Array, i.e. has the\n * same api as Vue's built-in handling of the class attribute.\n */\n rootClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * The current character length that the user has entered into the input.\n * This will only need to be used if you are using `validate.length` and\n * the string contains abnormal characters.\n * For example, an emoji could take up many characters in the input, but should only count as 1 character.\n * If no number is provided, a built-in length calculation will be used for the length validation.\n */\n currentLength: {\n type: Number,\n default: null,\n },\n\n /**\n * Whether the input will continue to display a warning validation message even if the input has lost focus.\n */\n retainWarning: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Validation for the input. Supports maximum length validation with the structure:\n * `{ \"length\": {\"description\": string, \"max\": number, \"warn\": number, \"message\": string,\n * \"limitMaxLength\": boolean }}`\n */\n validate: {\n type: Object,\n default: null,\n },\n\n /**\n * hidden allows to use input without the element visually present in DOM\n */\n hidden: {\n type: Boolean,\n default: false,\n },\n },\n\n emits: [\n /**\n * Native input event\n *\n * @event input\n * @type {String}\n */\n 'input',\n\n /**\n * Native input blur event\n *\n * @event blur\n * @type {FocusEvent}\n */\n 'blur',\n\n /**\n * Input clear event\n *\n * @event clear\n */\n 'clear',\n\n /**\n * Native input focus event\n *\n * @event focus\n * @type {FocusEvent}\n */\n 'focus',\n\n /**\n * Native input focusin event\n *\n * @event focusin\n * @type {FocusEvent}\n */\n 'focusin',\n\n /**\n * Native input focusout event\n *\n * @event focusout\n * @type {FocusEvent}\n */\n 'focusout',\n\n /**\n * Event fired to sync the modelValue prop with the parent component\n * @event update:modelValue\n */\n 'update:modelValue',\n\n /**\n * Length of the input when currentLength prop is not passed\n *\n * @event update:length\n * @type {Number}\n */\n 'update:length',\n\n /**\n * Result of the input validation\n *\n * @event update:invalid\n * @type {Boolean}\n */\n 'update:invalid',\n ],\n\n data () {\n return {\n isInputFocused: false,\n isInvalid: false,\n defaultLength: 0,\n hasSlotContent,\n isComposing: false,\n justEndedComposition: false,\n };\n },\n\n computed: {\n\n isTextarea () {\n return this.type === INPUT_TYPES.TEXTAREA;\n },\n\n isDefaultSize () {\n return this.size === INPUT_SIZES.DEFAULT;\n },\n\n iconSize () {\n return INPUT_ICON_SIZES[this.size];\n },\n\n isValidSize () {\n return Object.values(INPUT_SIZES).includes(this.size);\n },\n\n isValidDescriptionSize () {\n return Object.values(DESCRIPTION_SIZE_TYPES).includes(this.size);\n },\n\n inputComponent () {\n if (this.isTextarea) {\n return 'textarea';\n }\n\n return 'input';\n },\n\n inputListeners () {\n return {\n compositionstart: () => {\n this.isComposing = true;\n },\n\n compositionend: () => {\n this.isComposing = false;\n this.justEndedComposition = true;\n const val = this.$refs.input.value;\n this.$emit('input', val);\n this.$emit('update:modelValue', val);\n // Clear the flag after the current synchronous event processing so\n // Firefox's post-compositionend input event is skipped, but the\n // next real user input (a separate browser task) is not.\n Promise.resolve().then(() => { this.justEndedComposition = false; });\n },\n\n input: async event => {\n if (this.isComposing) return;\n if (this.justEndedComposition) return;\n let val = event.target.value;\n if (this.type === INPUT_TYPES.FILE) {\n const files = Array.from(event.target.files);\n val = files.map(file => file.name);\n }\n this.$emit('input', val);\n this.$emit('update:modelValue', val);\n },\n\n blur: event => {\n this.isInputFocused = false;\n this.onBlur(event);\n },\n\n focus: event => {\n this.isInputFocused = true;\n this.$emit('focus', event);\n },\n\n focusin: event => this.$emit('focusin', event),\n focusout: event => this.$emit('focusout', event),\n };\n },\n\n descriptionKey () {\n return `input-description-${getUniqueString()}`;\n },\n\n inputState () {\n return getValidationState(this.validationMessages);\n },\n\n defaultLengthCalculation () {\n return this.calculateLength(this.modelValue);\n },\n\n validationProps () {\n return {\n length: {\n description: this?.validate?.length?.description,\n max: this?.validate?.length?.max,\n warn: this?.validate?.length?.warn,\n message: this?.validate?.length?.message,\n limitMaxLength: this?.validate?.length?.limitMaxLength ? this.validate.length.limitMaxLength : false,\n },\n };\n },\n\n validationMessages () {\n // Add length validation message if exists\n if (this.showLengthLimitValidation) {\n return this.formattedMessages.concat([this.inputLengthErrorMessage()]);\n }\n\n return this.formattedMessages;\n },\n\n showInputState () {\n return this.showMessages && this.inputState;\n },\n\n inputLength () {\n return this.currentLength ? this.currentLength : this.defaultLengthCalculation;\n },\n\n inputLengthState () {\n if (this.inputLength < this.validationProps.length.warn) {\n return null;\n } else if (this.inputLength <= this.validationProps.length.max) {\n return this.validationProps.length.warn ? VALIDATION_MESSAGE_TYPES.WARNING : null;\n } else {\n return VALIDATION_MESSAGE_TYPES.ERROR;\n }\n },\n\n shouldValidateLength () {\n return !!(\n this.validationProps.length.description &&\n this.validationProps.length.max\n );\n },\n\n shouldLimitMaxLength () {\n return this.shouldValidateLength && this.validationProps.length.limitMaxLength;\n },\n\n showLengthLimitValidation () {\n return (\n this.shouldValidateLength &&\n this.inputLengthState !== null &&\n this.validationProps.length.message &&\n (this.retainWarning || this.isInputFocused || this.isInvalid)\n );\n },\n\n sizeModifierClass () {\n if (this.isDefaultSize || !this.isValidSize) {\n return '';\n }\n\n return INPUT_SIZE_CLASSES[this.inputComponent][this.size];\n },\n\n stateClass () {\n return [INPUT_STATE_CLASSES[this.inputState]];\n },\n },\n\n watch: {\n isInvalid (val) {\n this.$emit('update:invalid', val);\n },\n\n modelValue: {\n immediate: true,\n handler (newValue) {\n if (this.shouldValidateLength) {\n this.validateLength(this.inputLength);\n }\n\n if (this.currentLength == null) {\n this.$emit('update:length', this.calculateLength(newValue));\n }\n\n // Set textarea value programmatically to avoid attribute binding\n // Skip during IME composition to avoid interrupting in-progress input\n if (this.isTextarea && !this.isComposing && this.$refs.input && this.$refs.input.value !== newValue) {\n this.$refs.input.value = newValue;\n }\n },\n },\n },\n\n beforeMount () {\n this.descriptionSizeClasses = DESCRIPTION_SIZE_CLASSES;\n this.labelSizeClasses = LABEL_SIZE_CLASSES;\n },\n\n mounted () {\n // Set initial textarea value programmatically\n if (this.isTextarea && this.$refs.input) {\n this.$refs.input.value = this.modelValue;\n }\n },\n\n methods: {\n removeClassStyleAttrs,\n addClassStyleAttrs,\n inputClasses () {\n return [\n 'd-input__input',\n this.inputComponent === 'input' ? 'd-input' : 'd-textarea',\n {\n [this.stateClass]: this.showInputState,\n 'd-input-icon--left': this.$slots.leftIcon,\n 'd-input-icon--right': this.$slots.rightIcon,\n },\n this.sizeModifierClass,\n this.inputClass,\n ];\n },\n\n inputWrapperClasses () {\n if (this.hidden) {\n return [];\n }\n return [\n 'd-input__wrapper',\n { [this.stateClass]: this.showInputState },\n this.inputWrapperClass,\n ];\n },\n\n calculateLength (value) {\n if (typeof value !== 'string') {\n return 0;\n }\n\n return [...value].length;\n },\n\n inputLengthErrorMessage () {\n return {\n message: this.validationProps.length.message,\n type: this.inputLengthState,\n };\n },\n\n onBlur (e) {\n // Do not emit a blur event if the target element is a child of this component\n if (!this.$refs.container?.contains(e.relatedTarget)) {\n this.$emit('blur', e);\n }\n },\n\n emitClearEvents () {\n this.$emit('input', '');\n this.$emit('clear');\n this.$emit('update:modelValue', '');\n },\n\n blur () {\n this.$refs.input.blur();\n },\n\n focus () {\n this.$refs.input.focus();\n },\n\n select () {\n this.$refs.input.select();\n },\n\n getMessageKey (type, index) {\n return `message-${type}-${index}`;\n },\n\n validateLength (length) {\n this.isInvalid = (length > this.validationProps.length.max);\n },\n\n clearInput () {\n this.$refs.input.value = '';\n this.$refs.input.focus();\n this.emitClearEvents();\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtValidationMessages","MessagesMixin","INPUT_TYPES","t","INPUT_SIZES","hasSlotContent","INPUT_ICON_SIZES","DESCRIPTION_SIZE_TYPES","val","event","file","getUniqueString","getValidationState","_b","_a","_d","_c","_f","_e","_h","_g","_j","_i","VALIDATION_MESSAGE_TYPES","INPUT_SIZE_CLASSES","INPUT_STATE_CLASSES","newValue","DESCRIPTION_SIZE_CLASSES","LABEL_SIZE_CLASSES","removeClassStyleAttrs","addClassStyleAttrs","value","type","index","length","_openBlock","_createElementBlock","_mergeProps","$props","$options","_ctx","_createElementVNode","_renderSlot","_normalizeClass","$data","_hoisted_3","_hoisted_4","_toDisplayString","args","_toHandlers","_hoisted_6","_hoisted_7","_createVNode","_component_dt_validation_messages"],"mappings":"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"}
package/dist/lib/input/input.js CHANGED
@@ -1,14 +1,14 @@
1
- import { VALIDATION_MESSAGE_TYPES as C, DESCRIPTION_SIZE_TYPES as b } from "../../common/constants/index.js";
2
- import { INPUT_TYPES as o, DESCRIPTION_SIZE_CLASSES as I, LABEL_SIZE_CLASSES as _, INPUT_STATE_CLASSES as E, INPUT_SIZE_CLASSES as V, INPUT_SIZES as m, INPUT_ICON_SIZES as z } from "./input-constants.js";
3
- import { addClassStyleAttrs as M, removeClassStyleAttrs as P, getValidationState as T, getUniqueString as A, hasSlotContent as N } from "../../common/utils/index.js";
1
+ import { VALIDATION_MESSAGE_TYPES as L, DESCRIPTION_SIZE_TYPES as b } from "../../common/constants/index.js";
2
+ import { INPUT_TYPES as o, DESCRIPTION_SIZE_CLASSES as I, LABEL_SIZE_CLASSES as E, INPUT_STATE_CLASSES as _, INPUT_SIZE_CLASSES as V, INPUT_SIZES as g, INPUT_ICON_SIZES as P } from "./input-constants.js";
3
+ import { addClassStyleAttrs as z, removeClassStyleAttrs as M, getValidationState as T, getUniqueString as A, hasSlotContent as N } from "../../common/utils/index.js";
4
4
  import { MessagesMixin as w } from "../../common/mixins/input.js";
5
- import { resolveComponent as x, openBlock as a, createElementBlock as n, mergeProps as h, createElementVNode as p, renderSlot as c, normalizeClass as f, toDisplayString as S, createCommentVNode as g, createTextVNode as O, toHandlers as y, createVNode as B } from "vue";
6
- import { _ as D } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
7
- import q from "../validation-messages/validation-messages.js";
8
- const j = {
5
+ import { resolveComponent as x, openBlock as a, createElementBlock as n, mergeProps as h, createElementVNode as p, renderSlot as m, normalizeClass as f, toDisplayString as S, createCommentVNode as c, createTextVNode as O, toHandlers as y, createVNode as B } from "vue";
6
+ import { _ as j } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
7
+ import D from "../validation-messages/validation-messages.js";
8
+ const q = {
9
9
  compatConfig: { MODE: 3 },
10
10
  name: "DtInput",
11
- components: { DtValidationMessages: q },
11
+ components: { DtValidationMessages: D },
12
12
  mixins: [w],
13
13
  inheritAttrs: !1,
14
14
  props: {
@@ -74,7 +74,7 @@ const j = {
74
74
  size: {
75
75
  type: String,
76
76
  default: "md",
77
- validator: (t) => Object.values(m).includes(t)
77
+ validator: (t) => Object.values(g).includes(t)
78
78
  },
79
79
  /**
80
80
  * Additional class name for the input element.
@@ -205,7 +205,9 @@ const j = {
205
205
  isInputFocused: !1,
206
206
  isInvalid: !1,
207
207
  defaultLength: 0,
208
- hasSlotContent: N
208
+ hasSlotContent: N,
209
+ isComposing: !1,
210
+ justEndedComposition: !1
209
211
  };
210
212
  },
211
213
  computed: {
@@ -213,13 +215,13 @@ const j = {
213
215
  return this.type === o.TEXTAREA;
214
216
  },
215
217
  isDefaultSize() {
216
- return this.size === m.DEFAULT;
218
+ return this.size === g.DEFAULT;
217
219
  },
218
220
  iconSize() {
219
- return z[this.size];
221
+ return P[this.size];
220
222
  },
221
223
  isValidSize() {
222
- return Object.values(m).includes(this.size);
224
+ return Object.values(g).includes(this.size);
223
225
  },
224
226
  isValidDescriptionSize() {
225
227
  return Object.values(b).includes(this.size);
@@ -229,7 +231,18 @@ const j = {
229
231
  },
230
232
  inputListeners() {
231
233
  return {
234
+ compositionstart: () => {
235
+ this.isComposing = !0;
236
+ },
237
+ compositionend: () => {
238
+ this.isComposing = !1, this.justEndedComposition = !0;
239
+ const t = this.$refs.input.value;
240
+ this.$emit("input", t), this.$emit("update:modelValue", t), Promise.resolve().then(() => {
241
+ this.justEndedComposition = !1;
242
+ });
243
+ },
232
244
  input: async (t) => {
245
+ if (this.isComposing || this.justEndedComposition) return;
233
246
  let s = t.target.value;
234
247
  this.type === o.FILE && (s = Array.from(t.target.files).map((r) => r.name)), this.$emit("input", s), this.$emit("update:modelValue", s);
235
248
  },
@@ -253,14 +266,14 @@ const j = {
253
266
  return this.calculateLength(this.modelValue);
254
267
  },
255
268
  validationProps() {
256
- var t, s, i, r, u, e, d, l, v, L;
269
+ var t, s, i, r, u, e, d, l, v, C;
257
270
  return {
258
271
  length: {
259
272
  description: (s = (t = this == null ? void 0 : this.validate) == null ? void 0 : t.length) == null ? void 0 : s.description,
260
273
  max: (r = (i = this == null ? void 0 : this.validate) == null ? void 0 : i.length) == null ? void 0 : r.max,
261
274
  warn: (e = (u = this == null ? void 0 : this.validate) == null ? void 0 : u.length) == null ? void 0 : e.warn,
262
275
  message: (l = (d = this == null ? void 0 : this.validate) == null ? void 0 : d.length) == null ? void 0 : l.message,
263
- limitMaxLength: (L = (v = this == null ? void 0 : this.validate) == null ? void 0 : v.length) != null && L.limitMaxLength ? this.validate.length.limitMaxLength : !1
276
+ limitMaxLength: (C = (v = this == null ? void 0 : this.validate) == null ? void 0 : v.length) != null && C.limitMaxLength ? this.validate.length.limitMaxLength : !1
264
277
  }
265
278
  };
266
279
  },
@@ -274,7 +287,7 @@ const j = {
274
287
  return this.currentLength ? this.currentLength : this.defaultLengthCalculation;
275
288
  },
276
289
  inputLengthState() {
277
- return this.inputLength < this.validationProps.length.warn ? null : this.inputLength <= this.validationProps.length.max ? this.validationProps.length.warn ? C.WARNING : null : C.ERROR;
290
+ return this.inputLength < this.validationProps.length.warn ? null : this.inputLength <= this.validationProps.length.max ? this.validationProps.length.warn ? L.WARNING : null : L.ERROR;
278
291
  },
279
292
  shouldValidateLength() {
280
293
  return !!(this.validationProps.length.description && this.validationProps.length.max);
@@ -289,7 +302,7 @@ const j = {
289
302
  return this.isDefaultSize || !this.isValidSize ? "" : V[this.inputComponent][this.size];
290
303
  },
291
304
  stateClass() {
292
- return [E[this.inputState]];
305
+ return [_[this.inputState]];
293
306
  }
294
307
  },
295
308
  watch: {
@@ -299,19 +312,19 @@ const j = {
299
312
  modelValue: {
300
313
  immediate: !0,
301
314
  handler(t) {
302
- this.shouldValidateLength && this.validateLength(this.inputLength), this.currentLength == null && this.$emit("update:length", this.calculateLength(t)), this.isTextarea && this.$refs.input && this.$refs.input.value !== t && (this.$refs.input.value = t);
315
+ this.shouldValidateLength && this.validateLength(this.inputLength), this.currentLength == null && this.$emit("update:length", this.calculateLength(t)), this.isTextarea && !this.isComposing && this.$refs.input && this.$refs.input.value !== t && (this.$refs.input.value = t);
303
316
  }
304
317
  }
305
318
  },
306
319
  beforeMount() {
307
- this.descriptionSizeClasses = I, this.labelSizeClasses = _;
320
+ this.descriptionSizeClasses = I, this.labelSizeClasses = E;
308
321
  },
309
322
  mounted() {
310
323
  this.isTextarea && this.$refs.input && (this.$refs.input.value = this.modelValue);
311
324
  },
312
325
  methods: {
313
- removeClassStyleAttrs: P,
314
- addClassStyleAttrs: M,
326
+ removeClassStyleAttrs: M,
327
+ addClassStyleAttrs: z,
315
328
  inputClasses() {
316
329
  return [
317
330
  "d-input__input",
@@ -383,7 +396,7 @@ function Y(t, s, i, r, u, e) {
383
396
  "aria-details": t.$slots.description || i.description ? e.descriptionKey : void 0,
384
397
  "data-qa": "dt-input-label-wrapper"
385
398
  }, [
386
- c(t.$slots, "labelSlot", {}, () => [
399
+ m(t.$slots, "labelSlot", {}, () => [
387
400
  i.labelVisible && i.label ? (a(), n("div", {
388
401
  key: 0,
389
402
  ref: "label",
@@ -393,7 +406,7 @@ function Y(t, s, i, r, u, e) {
393
406
  "d-label",
394
407
  t.labelSizeClasses[i.size]
395
408
  ])
396
- }, S(i.label), 3)) : g("", !0)
409
+ }, S(i.label), 3)) : c("", !0)
397
410
  ]),
398
411
  u.hasSlotContent(t.$slots.description) || i.description || e.shouldValidateLength ? (a(), n("div", {
399
412
  key: 0,
@@ -407,12 +420,12 @@ function Y(t, s, i, r, u, e) {
407
420
  "data-qa": "dt-input-description"
408
421
  }, [
409
422
  u.hasSlotContent(t.$slots.description) || i.description ? (a(), n("div", R, [
410
- c(t.$slots, "description", {}, () => [
423
+ m(t.$slots, "description", {}, () => [
411
424
  O(S(i.description), 1)
412
425
  ])
413
- ])) : g("", !0),
414
- e.shouldValidateLength ? (a(), n("div", U, S(e.validationProps.length.description), 1)) : g("", !0)
415
- ], 10, F)) : g("", !0),
426
+ ])) : c("", !0),
427
+ e.shouldValidateLength ? (a(), n("div", U, S(e.validationProps.length.description), 1)) : c("", !0)
428
+ ], 10, F)) : c("", !0),
416
429
  p("div", {
417
430
  class: f(e.inputWrapperClasses()),
418
431
  "read-only": i.disabled === !0 ? !0 : void 0
@@ -422,7 +435,7 @@ function Y(t, s, i, r, u, e) {
422
435
  "data-qa": "dt-input-left-icon-wrapper",
423
436
  onFocusout: s[0] || (s[0] = (...l) => e.onBlur && e.onBlur(...l))
424
437
  }, [
425
- c(t.$slots, "leftIcon", { iconSize: e.iconSize })
438
+ m(t.$slots, "leftIcon", { iconSize: e.iconSize })
426
439
  ], 32),
427
440
  e.isTextarea ? (a(), n("textarea", h({
428
441
  key: 0,
@@ -450,7 +463,7 @@ function Y(t, s, i, r, u, e) {
450
463
  "data-qa": "dt-input-right-icon-wrapper",
451
464
  onFocusout: s[1] || (s[1] = (...l) => e.onBlur && e.onBlur(...l))
452
465
  }, [
453
- c(t.$slots, "rightIcon", {
466
+ m(t.$slots, "rightIcon", {
454
467
  iconSize: e.iconSize,
455
468
  clear: e.clearInput
456
469
  })
@@ -464,7 +477,7 @@ function Y(t, s, i, r, u, e) {
464
477
  }, t.messagesChildProps, { "data-qa": "dt-input-messages" }), null, 16, ["validation-messages", "show-messages", "class"])
465
478
  ], 16);
466
479
  }
467
- const et = /* @__PURE__ */ D(j, [["render", Y]]);
480
+ const et = /* @__PURE__ */ j(q, [["render", Y]]);
468
481
  export {
469
482
  et as default
470
483
  };
package/dist/lib/input/input.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input.js","sources":["../../../components/input/input.vue"],"sourcesContent":["<template>\n <div\n ref=\"container\"\n :class=\"[rootClass, 'd-input__root', { 'd-input--hidden': hidden }]\"\n v-bind=\"addClassStyleAttrs($attrs)\"\n data-qa=\"dt-input\"\n >\n <label\n class=\"d-input__label\"\n :aria-details=\"$slots.description || description ? descriptionKey : undefined\"\n data-qa=\"dt-input-label-wrapper\"\n >\n <!-- @slot Slot for label, defaults to label prop -->\n <slot name=\"labelSlot\">\n <div\n v-if=\"labelVisible && label\"\n ref=\"label\"\n data-qa=\"dt-input-label\"\n :class=\"[\n 'd-input__label-text',\n 'd-label',\n labelSizeClasses[size],\n ]\"\n >\n {{ label }}\n </div>\n </slot>\n <div\n v-if=\"hasSlotContent($slots.description) || description || shouldValidateLength\"\n :id=\"descriptionKey\"\n ref=\"description\"\n :class=\"[\n 'd-input__description',\n 'd-description',\n descriptionSizeClasses[size],\n ]\"\n data-qa=\"dt-input-description\"\n >\n <div\n v-if=\"hasSlotContent($slots.description) || description\"\n >\n <!-- @slot Slot for description, defaults to description prop -->\n <slot name=\"description\">{{ description }}</slot>\n </div>\n <div\n v-if=\"shouldValidateLength\"\n data-qa=\"dt-input-length-description\"\n class=\"d-input__length-description\"\n >\n {{ validationProps.length.description }}\n </div>\n </div>\n <div\n :class=\"inputWrapperClasses()\"\n :read-only=\"disabled === true ? true : undefined\"\n >\n <span\n class=\"d-input-icon d-input-icon--left\"\n data-qa=\"dt-input-left-icon-wrapper\"\n @focusout=\"onBlur\"\n >\n <!-- @slot Slot for left icon -->\n <slot\n name=\"leftIcon\"\n :icon-size=\"iconSize\"\n />\n </span>\n <textarea\n v-if=\"isTextarea\"\n ref=\"input\"\n :name=\"name\"\n :disabled=\"disabled\"\n :autocomplete=\"$attrs.autocomplete ?? 'off'\"\n :class=\"inputClasses()\"\n :maxlength=\"shouldLimitMaxLength ? validationProps.length.max : null\"\n data-qa=\"dt-input-input\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n />\n <input\n v-else\n ref=\"input\"\n :value=\"modelValue\"\n :name=\"name\"\n :type=\"type\"\n :disabled=\"disabled\"\n :autocomplete=\"$attrs.autocomplete ?? 'off'\"\n :class=\"inputClasses()\"\n :maxlength=\"shouldLimitMaxLength ? validationProps.length.max : null\"\n data-qa=\"dt-input-input\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n >\n <span\n class=\"d-input-icon d-input-icon--right\"\n data-qa=\"dt-input-right-icon-wrapper\"\n @focusout=\"onBlur\"\n >\n <!-- @slot Slot for right icon -->\n <slot\n name=\"rightIcon\"\n :icon-size=\"iconSize\"\n :clear=\"clearInput\"\n />\n </span>\n </div>\n </label>\n <dt-validation-messages\n :validation-messages=\"validationMessages\"\n :show-messages=\"showMessages\"\n :class=\"messagesClass\"\n v-bind=\"messagesChildProps\"\n data-qa=\"dt-input-messages\"\n />\n </div>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport { DESCRIPTION_SIZE_TYPES, VALIDATION_MESSAGE_TYPES } from '@/common/constants';\nimport {\n INPUT_TYPES,\n INPUT_SIZES,\n INPUT_SIZE_CLASSES,\n INPUT_ICON_SIZES,\n INPUT_STATE_CLASSES,\n DESCRIPTION_SIZE_CLASSES,\n LABEL_SIZE_CLASSES,\n} from './input_constants';\nimport {\n getUniqueString,\n getValidationState,\n hasSlotContent,\n removeClassStyleAttrs,\n addClassStyleAttrs,\n} from '@/common/utils';\nimport { DtValidationMessages } from '@/components/validation_messages';\nimport { MessagesMixin } from '@/common/mixins/input';\n\n/**\n * An input field is an input control that allows users to enter alphanumeric information.\n * It can have a range of options and supports single line and multi-line lengths,\n * as well as varying formats, including numbers, masked passwords, etc.\n * @property {Boolean} placeholder attribute\n * @see https://dialtone.dialpad.com/components/input.html\n */\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtInput',\n\n components: { DtValidationMessages },\n\n mixins: [MessagesMixin],\n\n inheritAttrs: false,\n\n props: {\n /**\n * Name property of the input element\n */\n name: {\n type: String,\n default: '',\n },\n\n /**\n * Type of the input.\n * When `textarea` a `<textarea>` element will be rendered instead of an `<input>` element.\n * @values text, password, email, number, textarea, date, time, file, tel, search, color\n * @default 'text'\n */\n type: {\n type: String,\n default: INPUT_TYPES.TEXT,\n validator: (t) => Object.values(INPUT_TYPES).includes(t),\n },\n\n /**\n * Value of the input\n */\n modelValue: {\n type: [String, Number],\n default: '',\n },\n\n /**\n * Disables the input\n * @values true, false\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Label for the input\n */\n label: {\n type: String,\n default: '',\n },\n\n /**\n * Determines visibility of input label.\n * @values true, false\n */\n labelVisible: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Description for the input\n */\n description: {\n type: String,\n default: '',\n },\n\n /**\n * Size of the input, one of `xs`, `sm`, `md`, `lg`, `xl`\n * @values xs, sm, md, lg, xl\n */\n size: {\n type: String,\n default: 'md',\n validator: (t) => Object.values(INPUT_SIZES).includes(t),\n },\n\n /**\n * Additional class name for the input element.\n * Can accept String, Object, and Array, i.e. has the\n * same API as Vue's built-in handling of the class attribute.\n */\n inputClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * Additional class name for the input wrapper element.\n * Can accept all of: String, Object, and Array, i.e. has the\n * same api as Vue's built-in handling of the class attribute.\n */\n inputWrapperClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * Additional class name for the root element.\n * Can accept all of: String, Object, and Array, i.e. has the\n * same api as Vue's built-in handling of the class attribute.\n */\n rootClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * The current character length that the user has entered into the input.\n * This will only need to be used if you are using `validate.length` and\n * the string contains abnormal characters.\n * For example, an emoji could take up many characters in the input, but should only count as 1 character.\n * If no number is provided, a built-in length calculation will be used for the length validation.\n */\n currentLength: {\n type: Number,\n default: null,\n },\n\n /**\n * Whether the input will continue to display a warning validation message even if the input has lost focus.\n */\n retainWarning: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Validation for the input. Supports maximum length validation with the structure:\n * `{ \"length\": {\"description\": string, \"max\": number, \"warn\": number, \"message\": string,\n * \"limitMaxLength\": boolean }}`\n */\n validate: {\n type: Object,\n default: null,\n },\n\n /**\n * hidden allows to use input without the element visually present in DOM\n */\n hidden: {\n type: Boolean,\n default: false,\n },\n },\n\n emits: [\n /**\n * Native input event\n *\n * @event input\n * @type {String}\n */\n 'input',\n\n /**\n * Native input blur event\n *\n * @event blur\n * @type {FocusEvent}\n */\n 'blur',\n\n /**\n * Input clear event\n *\n * @event clear\n */\n 'clear',\n\n /**\n * Native input focus event\n *\n * @event focus\n * @type {FocusEvent}\n */\n 'focus',\n\n /**\n * Native input focusin event\n *\n * @event focusin\n * @type {FocusEvent}\n */\n 'focusin',\n\n /**\n * Native input focusout event\n *\n * @event focusout\n * @type {FocusEvent}\n */\n 'focusout',\n\n /**\n * Event fired to sync the modelValue prop with the parent component\n * @event update:modelValue\n */\n 'update:modelValue',\n\n /**\n * Length of the input when currentLength prop is not passed\n *\n * @event update:length\n * @type {Number}\n */\n 'update:length',\n\n /**\n * Result of the input validation\n *\n * @event update:invalid\n * @type {Boolean}\n */\n 'update:invalid',\n ],\n\n data () {\n return {\n isInputFocused: false,\n isInvalid: false,\n defaultLength: 0,\n hasSlotContent,\n };\n },\n\n computed: {\n\n isTextarea () {\n return this.type === INPUT_TYPES.TEXTAREA;\n },\n\n isDefaultSize () {\n return this.size === INPUT_SIZES.DEFAULT;\n },\n\n iconSize () {\n return INPUT_ICON_SIZES[this.size];\n },\n\n isValidSize () {\n return Object.values(INPUT_SIZES).includes(this.size);\n },\n\n isValidDescriptionSize () {\n return Object.values(DESCRIPTION_SIZE_TYPES).includes(this.size);\n },\n\n inputComponent () {\n if (this.isTextarea) {\n return 'textarea';\n }\n\n return 'input';\n },\n\n inputListeners () {\n return {\n input: async event => {\n let val = event.target.value;\n if (this.type === INPUT_TYPES.FILE) {\n const files = Array.from(event.target.files);\n val = files.map(file => file.name);\n }\n this.$emit('input', val);\n this.$emit('update:modelValue', val);\n },\n\n blur: event => {\n this.isInputFocused = false;\n this.onBlur(event);\n },\n\n focus: event => {\n this.isInputFocused = true;\n this.$emit('focus', event);\n },\n\n focusin: event => this.$emit('focusin', event),\n focusout: event => this.$emit('focusout', event),\n };\n },\n\n descriptionKey () {\n return `input-description-${getUniqueString()}`;\n },\n\n inputState () {\n return getValidationState(this.validationMessages);\n },\n\n defaultLengthCalculation () {\n return this.calculateLength(this.modelValue);\n },\n\n validationProps () {\n return {\n length: {\n description: this?.validate?.length?.description,\n max: this?.validate?.length?.max,\n warn: this?.validate?.length?.warn,\n message: this?.validate?.length?.message,\n limitMaxLength: this?.validate?.length?.limitMaxLength ? this.validate.length.limitMaxLength : false,\n },\n };\n },\n\n validationMessages () {\n // Add length validation message if exists\n if (this.showLengthLimitValidation) {\n return this.formattedMessages.concat([this.inputLengthErrorMessage()]);\n }\n\n return this.formattedMessages;\n },\n\n showInputState () {\n return this.showMessages && this.inputState;\n },\n\n inputLength () {\n return this.currentLength ? this.currentLength : this.defaultLengthCalculation;\n },\n\n inputLengthState () {\n if (this.inputLength < this.validationProps.length.warn) {\n return null;\n } else if (this.inputLength <= this.validationProps.length.max) {\n return this.validationProps.length.warn ? VALIDATION_MESSAGE_TYPES.WARNING : null;\n } else {\n return VALIDATION_MESSAGE_TYPES.ERROR;\n }\n },\n\n shouldValidateLength () {\n return !!(\n this.validationProps.length.description &&\n this.validationProps.length.max\n );\n },\n\n shouldLimitMaxLength () {\n return this.shouldValidateLength && this.validationProps.length.limitMaxLength;\n },\n\n showLengthLimitValidation () {\n return (\n this.shouldValidateLength &&\n this.inputLengthState !== null &&\n this.validationProps.length.message &&\n (this.retainWarning || this.isInputFocused || this.isInvalid)\n );\n },\n\n sizeModifierClass () {\n if (this.isDefaultSize || !this.isValidSize) {\n return '';\n }\n\n return INPUT_SIZE_CLASSES[this.inputComponent][this.size];\n },\n\n stateClass () {\n return [INPUT_STATE_CLASSES[this.inputState]];\n },\n },\n\n watch: {\n isInvalid (val) {\n this.$emit('update:invalid', val);\n },\n\n modelValue: {\n immediate: true,\n handler (newValue) {\n if (this.shouldValidateLength) {\n this.validateLength(this.inputLength);\n }\n\n if (this.currentLength == null) {\n this.$emit('update:length', this.calculateLength(newValue));\n }\n\n // Set textarea value programmatically to avoid attribute binding\n if (this.isTextarea && this.$refs.input && this.$refs.input.value !== newValue) {\n this.$refs.input.value = newValue;\n }\n },\n },\n },\n\n beforeMount () {\n this.descriptionSizeClasses = DESCRIPTION_SIZE_CLASSES;\n this.labelSizeClasses = LABEL_SIZE_CLASSES;\n },\n\n mounted () {\n // Set initial textarea value programmatically\n if (this.isTextarea && this.$refs.input) {\n this.$refs.input.value = this.modelValue;\n }\n },\n\n methods: {\n removeClassStyleAttrs,\n addClassStyleAttrs,\n inputClasses () {\n return [\n 'd-input__input',\n this.inputComponent === 'input' ? 'd-input' : 'd-textarea',\n {\n [this.stateClass]: this.showInputState,\n 'd-input-icon--left': this.$slots.leftIcon,\n 'd-input-icon--right': this.$slots.rightIcon,\n },\n this.sizeModifierClass,\n this.inputClass,\n ];\n },\n\n inputWrapperClasses () {\n if (this.hidden) {\n return [];\n }\n return [\n 'd-input__wrapper',\n { [this.stateClass]: this.showInputState },\n this.inputWrapperClass,\n ];\n },\n\n calculateLength (value) {\n if (typeof value !== 'string') {\n return 0;\n }\n\n return [...value].length;\n },\n\n inputLengthErrorMessage () {\n return {\n message: this.validationProps.length.message,\n type: this.inputLengthState,\n };\n },\n\n onBlur (e) {\n // Do not emit a blur event if the target element is a child of this component\n if (!this.$refs.container?.contains(e.relatedTarget)) {\n this.$emit('blur', e);\n }\n },\n\n emitClearEvents () {\n this.$emit('input', '');\n this.$emit('clear');\n this.$emit('update:modelValue', '');\n },\n\n blur () {\n this.$refs.input.blur();\n },\n\n focus () {\n this.$refs.input.focus();\n },\n\n select () {\n this.$refs.input.select();\n },\n\n getMessageKey (type, index) {\n return `message-${type}-${index}`;\n },\n\n validateLength (length) {\n this.isInvalid = (length > this.validationProps.length.max);\n },\n\n clearInput () {\n this.$refs.input.value = '';\n this.$refs.input.focus();\n this.emitClearEvents();\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtValidationMessages","MessagesMixin","INPUT_TYPES","INPUT_SIZES","hasSlotContent","INPUT_ICON_SIZES","DESCRIPTION_SIZE_TYPES","event","val","file","getUniqueString","getValidationState","_b","_a","_d","_c","_f","_e","_h","_g","_j","_i","VALIDATION_MESSAGE_TYPES","INPUT_SIZE_CLASSES","INPUT_STATE_CLASSES","newValue","DESCRIPTION_SIZE_CLASSES","LABEL_SIZE_CLASSES","removeClassStyleAttrs","addClassStyleAttrs","value","e","type","index","length","_openBlock","_createElementBlock","_mergeProps","$props","$options","_ctx","_createElementVNode","_renderSlot","_normalizeClass","$data","_hoisted_3","_hoisted_4","_toDisplayString","args","_toHandlers","_hoisted_6","_hoisted_7","_createVNode","_component_dt_validation_messages"],"mappings":"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"}
1
+ {"version":3,"file":"input.js","sources":["../../../components/input/input.vue"],"sourcesContent":["<template>\n <div\n ref=\"container\"\n :class=\"[rootClass, 'd-input__root', { 'd-input--hidden': hidden }]\"\n v-bind=\"addClassStyleAttrs($attrs)\"\n data-qa=\"dt-input\"\n >\n <label\n class=\"d-input__label\"\n :aria-details=\"$slots.description || description ? descriptionKey : undefined\"\n data-qa=\"dt-input-label-wrapper\"\n >\n <!-- @slot Slot for label, defaults to label prop -->\n <slot name=\"labelSlot\">\n <div\n v-if=\"labelVisible && label\"\n ref=\"label\"\n data-qa=\"dt-input-label\"\n :class=\"[\n 'd-input__label-text',\n 'd-label',\n labelSizeClasses[size],\n ]\"\n >\n {{ label }}\n </div>\n </slot>\n <div\n v-if=\"hasSlotContent($slots.description) || description || shouldValidateLength\"\n :id=\"descriptionKey\"\n ref=\"description\"\n :class=\"[\n 'd-input__description',\n 'd-description',\n descriptionSizeClasses[size],\n ]\"\n data-qa=\"dt-input-description\"\n >\n <div\n v-if=\"hasSlotContent($slots.description) || description\"\n >\n <!-- @slot Slot for description, defaults to description prop -->\n <slot name=\"description\">{{ description }}</slot>\n </div>\n <div\n v-if=\"shouldValidateLength\"\n data-qa=\"dt-input-length-description\"\n class=\"d-input__length-description\"\n >\n {{ validationProps.length.description }}\n </div>\n </div>\n <div\n :class=\"inputWrapperClasses()\"\n :read-only=\"disabled === true ? true : undefined\"\n >\n <span\n class=\"d-input-icon d-input-icon--left\"\n data-qa=\"dt-input-left-icon-wrapper\"\n @focusout=\"onBlur\"\n >\n <!-- @slot Slot for left icon -->\n <slot\n name=\"leftIcon\"\n :icon-size=\"iconSize\"\n />\n </span>\n <textarea\n v-if=\"isTextarea\"\n ref=\"input\"\n :name=\"name\"\n :disabled=\"disabled\"\n :autocomplete=\"$attrs.autocomplete ?? 'off'\"\n :class=\"inputClasses()\"\n :maxlength=\"shouldLimitMaxLength ? validationProps.length.max : null\"\n data-qa=\"dt-input-input\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n />\n <input\n v-else\n ref=\"input\"\n :value=\"modelValue\"\n :name=\"name\"\n :type=\"type\"\n :disabled=\"disabled\"\n :autocomplete=\"$attrs.autocomplete ?? 'off'\"\n :class=\"inputClasses()\"\n :maxlength=\"shouldLimitMaxLength ? validationProps.length.max : null\"\n data-qa=\"dt-input-input\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n >\n <span\n class=\"d-input-icon d-input-icon--right\"\n data-qa=\"dt-input-right-icon-wrapper\"\n @focusout=\"onBlur\"\n >\n <!-- @slot Slot for right icon -->\n <slot\n name=\"rightIcon\"\n :icon-size=\"iconSize\"\n :clear=\"clearInput\"\n />\n </span>\n </div>\n </label>\n <dt-validation-messages\n :validation-messages=\"validationMessages\"\n :show-messages=\"showMessages\"\n :class=\"messagesClass\"\n v-bind=\"messagesChildProps\"\n data-qa=\"dt-input-messages\"\n />\n </div>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport { DESCRIPTION_SIZE_TYPES, VALIDATION_MESSAGE_TYPES } from '@/common/constants';\nimport {\n INPUT_TYPES,\n INPUT_SIZES,\n INPUT_SIZE_CLASSES,\n INPUT_ICON_SIZES,\n INPUT_STATE_CLASSES,\n DESCRIPTION_SIZE_CLASSES,\n LABEL_SIZE_CLASSES,\n} from './input_constants';\nimport {\n getUniqueString,\n getValidationState,\n hasSlotContent,\n removeClassStyleAttrs,\n addClassStyleAttrs,\n} from '@/common/utils';\nimport { DtValidationMessages } from '@/components/validation_messages';\nimport { MessagesMixin } from '@/common/mixins/input';\n\n/**\n * An input field is an input control that allows users to enter alphanumeric information.\n * It can have a range of options and supports single line and multi-line lengths,\n * as well as varying formats, including numbers, masked passwords, etc.\n * @property {Boolean} placeholder attribute\n * @see https://dialtone.dialpad.com/components/input.html\n */\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtInput',\n\n components: { DtValidationMessages },\n\n mixins: [MessagesMixin],\n\n inheritAttrs: false,\n\n props: {\n /**\n * Name property of the input element\n */\n name: {\n type: String,\n default: '',\n },\n\n /**\n * Type of the input.\n * When `textarea` a `<textarea>` element will be rendered instead of an `<input>` element.\n * @values text, password, email, number, textarea, date, time, file, tel, search, color\n * @default 'text'\n */\n type: {\n type: String,\n default: INPUT_TYPES.TEXT,\n validator: (t) => Object.values(INPUT_TYPES).includes(t),\n },\n\n /**\n * Value of the input\n */\n modelValue: {\n type: [String, Number],\n default: '',\n },\n\n /**\n * Disables the input\n * @values true, false\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Label for the input\n */\n label: {\n type: String,\n default: '',\n },\n\n /**\n * Determines visibility of input label.\n * @values true, false\n */\n labelVisible: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Description for the input\n */\n description: {\n type: String,\n default: '',\n },\n\n /**\n * Size of the input, one of `xs`, `sm`, `md`, `lg`, `xl`\n * @values xs, sm, md, lg, xl\n */\n size: {\n type: String,\n default: 'md',\n validator: (t) => Object.values(INPUT_SIZES).includes(t),\n },\n\n /**\n * Additional class name for the input element.\n * Can accept String, Object, and Array, i.e. has the\n * same API as Vue's built-in handling of the class attribute.\n */\n inputClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * Additional class name for the input wrapper element.\n * Can accept all of: String, Object, and Array, i.e. has the\n * same api as Vue's built-in handling of the class attribute.\n */\n inputWrapperClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * Additional class name for the root element.\n * Can accept all of: String, Object, and Array, i.e. has the\n * same api as Vue's built-in handling of the class attribute.\n */\n rootClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * The current character length that the user has entered into the input.\n * This will only need to be used if you are using `validate.length` and\n * the string contains abnormal characters.\n * For example, an emoji could take up many characters in the input, but should only count as 1 character.\n * If no number is provided, a built-in length calculation will be used for the length validation.\n */\n currentLength: {\n type: Number,\n default: null,\n },\n\n /**\n * Whether the input will continue to display a warning validation message even if the input has lost focus.\n */\n retainWarning: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Validation for the input. Supports maximum length validation with the structure:\n * `{ \"length\": {\"description\": string, \"max\": number, \"warn\": number, \"message\": string,\n * \"limitMaxLength\": boolean }}`\n */\n validate: {\n type: Object,\n default: null,\n },\n\n /**\n * hidden allows to use input without the element visually present in DOM\n */\n hidden: {\n type: Boolean,\n default: false,\n },\n },\n\n emits: [\n /**\n * Native input event\n *\n * @event input\n * @type {String}\n */\n 'input',\n\n /**\n * Native input blur event\n *\n * @event blur\n * @type {FocusEvent}\n */\n 'blur',\n\n /**\n * Input clear event\n *\n * @event clear\n */\n 'clear',\n\n /**\n * Native input focus event\n *\n * @event focus\n * @type {FocusEvent}\n */\n 'focus',\n\n /**\n * Native input focusin event\n *\n * @event focusin\n * @type {FocusEvent}\n */\n 'focusin',\n\n /**\n * Native input focusout event\n *\n * @event focusout\n * @type {FocusEvent}\n */\n 'focusout',\n\n /**\n * Event fired to sync the modelValue prop with the parent component\n * @event update:modelValue\n */\n 'update:modelValue',\n\n /**\n * Length of the input when currentLength prop is not passed\n *\n * @event update:length\n * @type {Number}\n */\n 'update:length',\n\n /**\n * Result of the input validation\n *\n * @event update:invalid\n * @type {Boolean}\n */\n 'update:invalid',\n ],\n\n data () {\n return {\n isInputFocused: false,\n isInvalid: false,\n defaultLength: 0,\n hasSlotContent,\n isComposing: false,\n justEndedComposition: false,\n };\n },\n\n computed: {\n\n isTextarea () {\n return this.type === INPUT_TYPES.TEXTAREA;\n },\n\n isDefaultSize () {\n return this.size === INPUT_SIZES.DEFAULT;\n },\n\n iconSize () {\n return INPUT_ICON_SIZES[this.size];\n },\n\n isValidSize () {\n return Object.values(INPUT_SIZES).includes(this.size);\n },\n\n isValidDescriptionSize () {\n return Object.values(DESCRIPTION_SIZE_TYPES).includes(this.size);\n },\n\n inputComponent () {\n if (this.isTextarea) {\n return 'textarea';\n }\n\n return 'input';\n },\n\n inputListeners () {\n return {\n compositionstart: () => {\n this.isComposing = true;\n },\n\n compositionend: () => {\n this.isComposing = false;\n this.justEndedComposition = true;\n const val = this.$refs.input.value;\n this.$emit('input', val);\n this.$emit('update:modelValue', val);\n // Clear the flag after the current synchronous event processing so\n // Firefox's post-compositionend input event is skipped, but the\n // next real user input (a separate browser task) is not.\n Promise.resolve().then(() => { this.justEndedComposition = false; });\n },\n\n input: async event => {\n if (this.isComposing) return;\n if (this.justEndedComposition) return;\n let val = event.target.value;\n if (this.type === INPUT_TYPES.FILE) {\n const files = Array.from(event.target.files);\n val = files.map(file => file.name);\n }\n this.$emit('input', val);\n this.$emit('update:modelValue', val);\n },\n\n blur: event => {\n this.isInputFocused = false;\n this.onBlur(event);\n },\n\n focus: event => {\n this.isInputFocused = true;\n this.$emit('focus', event);\n },\n\n focusin: event => this.$emit('focusin', event),\n focusout: event => this.$emit('focusout', event),\n };\n },\n\n descriptionKey () {\n return `input-description-${getUniqueString()}`;\n },\n\n inputState () {\n return getValidationState(this.validationMessages);\n },\n\n defaultLengthCalculation () {\n return this.calculateLength(this.modelValue);\n },\n\n validationProps () {\n return {\n length: {\n description: this?.validate?.length?.description,\n max: this?.validate?.length?.max,\n warn: this?.validate?.length?.warn,\n message: this?.validate?.length?.message,\n limitMaxLength: this?.validate?.length?.limitMaxLength ? this.validate.length.limitMaxLength : false,\n },\n };\n },\n\n validationMessages () {\n // Add length validation message if exists\n if (this.showLengthLimitValidation) {\n return this.formattedMessages.concat([this.inputLengthErrorMessage()]);\n }\n\n return this.formattedMessages;\n },\n\n showInputState () {\n return this.showMessages && this.inputState;\n },\n\n inputLength () {\n return this.currentLength ? this.currentLength : this.defaultLengthCalculation;\n },\n\n inputLengthState () {\n if (this.inputLength < this.validationProps.length.warn) {\n return null;\n } else if (this.inputLength <= this.validationProps.length.max) {\n return this.validationProps.length.warn ? VALIDATION_MESSAGE_TYPES.WARNING : null;\n } else {\n return VALIDATION_MESSAGE_TYPES.ERROR;\n }\n },\n\n shouldValidateLength () {\n return !!(\n this.validationProps.length.description &&\n this.validationProps.length.max\n );\n },\n\n shouldLimitMaxLength () {\n return this.shouldValidateLength && this.validationProps.length.limitMaxLength;\n },\n\n showLengthLimitValidation () {\n return (\n this.shouldValidateLength &&\n this.inputLengthState !== null &&\n this.validationProps.length.message &&\n (this.retainWarning || this.isInputFocused || this.isInvalid)\n );\n },\n\n sizeModifierClass () {\n if (this.isDefaultSize || !this.isValidSize) {\n return '';\n }\n\n return INPUT_SIZE_CLASSES[this.inputComponent][this.size];\n },\n\n stateClass () {\n return [INPUT_STATE_CLASSES[this.inputState]];\n },\n },\n\n watch: {\n isInvalid (val) {\n this.$emit('update:invalid', val);\n },\n\n modelValue: {\n immediate: true,\n handler (newValue) {\n if (this.shouldValidateLength) {\n this.validateLength(this.inputLength);\n }\n\n if (this.currentLength == null) {\n this.$emit('update:length', this.calculateLength(newValue));\n }\n\n // Set textarea value programmatically to avoid attribute binding\n // Skip during IME composition to avoid interrupting in-progress input\n if (this.isTextarea && !this.isComposing && this.$refs.input && this.$refs.input.value !== newValue) {\n this.$refs.input.value = newValue;\n }\n },\n },\n },\n\n beforeMount () {\n this.descriptionSizeClasses = DESCRIPTION_SIZE_CLASSES;\n this.labelSizeClasses = LABEL_SIZE_CLASSES;\n },\n\n mounted () {\n // Set initial textarea value programmatically\n if (this.isTextarea && this.$refs.input) {\n this.$refs.input.value = this.modelValue;\n }\n },\n\n methods: {\n removeClassStyleAttrs,\n addClassStyleAttrs,\n inputClasses () {\n return [\n 'd-input__input',\n this.inputComponent === 'input' ? 'd-input' : 'd-textarea',\n {\n [this.stateClass]: this.showInputState,\n 'd-input-icon--left': this.$slots.leftIcon,\n 'd-input-icon--right': this.$slots.rightIcon,\n },\n this.sizeModifierClass,\n this.inputClass,\n ];\n },\n\n inputWrapperClasses () {\n if (this.hidden) {\n return [];\n }\n return [\n 'd-input__wrapper',\n { [this.stateClass]: this.showInputState },\n this.inputWrapperClass,\n ];\n },\n\n calculateLength (value) {\n if (typeof value !== 'string') {\n return 0;\n }\n\n return [...value].length;\n },\n\n inputLengthErrorMessage () {\n return {\n message: this.validationProps.length.message,\n type: this.inputLengthState,\n };\n },\n\n onBlur (e) {\n // Do not emit a blur event if the target element is a child of this component\n if (!this.$refs.container?.contains(e.relatedTarget)) {\n this.$emit('blur', e);\n }\n },\n\n emitClearEvents () {\n this.$emit('input', '');\n this.$emit('clear');\n this.$emit('update:modelValue', '');\n },\n\n blur () {\n this.$refs.input.blur();\n },\n\n focus () {\n this.$refs.input.focus();\n },\n\n select () {\n this.$refs.input.select();\n },\n\n getMessageKey (type, index) {\n return `message-${type}-${index}`;\n },\n\n validateLength (length) {\n this.isInvalid = (length > this.validationProps.length.max);\n },\n\n clearInput () {\n this.$refs.input.value = '';\n this.$refs.input.focus();\n this.emitClearEvents();\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtValidationMessages","MessagesMixin","INPUT_TYPES","INPUT_SIZES","hasSlotContent","INPUT_ICON_SIZES","DESCRIPTION_SIZE_TYPES","val","event","file","getUniqueString","getValidationState","_b","_a","_d","_c","_f","_e","_h","_g","_j","_i","VALIDATION_MESSAGE_TYPES","INPUT_SIZE_CLASSES","INPUT_STATE_CLASSES","newValue","DESCRIPTION_SIZE_CLASSES","LABEL_SIZE_CLASSES","removeClassStyleAttrs","addClassStyleAttrs","value","e","type","index","length","_openBlock","_createElementBlock","_mergeProps","$props","$options","_ctx","_createElementVNode","_renderSlot","_normalizeClass","$data","_hoisted_3","_hoisted_4","_toDisplayString","args","_toHandlers","_hoisted_6","_hoisted_7","_createVNode","_component_dt_validation_messages"],"mappings":"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"}
package/dist/types/components/emoji_picker/emoji_picker.vue.d.ts CHANGED
@@ -112,6 +112,8 @@ declare const _default: import('vue').DefineComponent<{}, {
112
112
  isInvalid: boolean;
113
113
  defaultLength: number;
114
114
  hasSlotContent: typeof import('../..').hasSlotContent;
115
+ isComposing: boolean;
116
+ justEndedComposition: boolean;
115
117
  }, {
116
118
  isTextarea(): boolean;
117
119
  isDefaultSize(): boolean;
@@ -120,6 +122,8 @@ declare const _default: import('vue').DefineComponent<{}, {
120
122
  isValidDescriptionSize(): boolean;
121
123
  inputComponent(): "input" | "textarea";
122
124
  inputListeners(): {
125
+ compositionstart: () => void;
126
+ compositionend: () => void;
123
127
  input: (event: any) => Promise<void>;
124
128
  blur: (event: any) => void;
125
129
  focus: (event: any) => void;
@@ -339,6 +343,8 @@ declare const _default: import('vue').DefineComponent<{}, {
339
343
  isInvalid: boolean;
340
344
  defaultLength: number;
341
345
  hasSlotContent: typeof import('../..').hasSlotContent;
346
+ isComposing: boolean;
347
+ justEndedComposition: boolean;
342
348
  }, {
343
349
  formattedMessages(): any;
344
350
  } & {
@@ -349,6 +355,8 @@ declare const _default: import('vue').DefineComponent<{}, {
349
355
  isValidDescriptionSize(): boolean;
350
356
  inputComponent(): "input" | "textarea";
351
357
  inputListeners(): {
358
+ compositionstart: () => void;
359
+ compositionend: () => void;
352
360
  input: (event: any) => Promise<void>;
353
361
  blur: (event: any) => void;
354
362
  focus: (event: any) => void;
package/dist/types/components/emoji_picker/modules/emoji_search.vue.d.ts CHANGED
@@ -86,6 +86,8 @@ declare const _default: import('vue').DefineComponent<{}, {
86
86
  isInvalid: boolean;
87
87
  defaultLength: number;
88
88
  hasSlotContent: typeof import('../../..').hasSlotContent;
89
+ isComposing: boolean;
90
+ justEndedComposition: boolean;
89
91
  }, {
90
92
  isTextarea(): boolean;
91
93
  isDefaultSize(): boolean;
@@ -94,6 +96,8 @@ declare const _default: import('vue').DefineComponent<{}, {
94
96
  isValidDescriptionSize(): boolean;
95
97
  inputComponent(): "input" | "textarea";
96
98
  inputListeners(): {
99
+ compositionstart: () => void;
100
+ compositionend: () => void;
97
101
  input: (event: any) => Promise<void>;
98
102
  blur: (event: any) => void;
99
103
  focus: (event: any) => void;
@@ -313,6 +317,8 @@ declare const _default: import('vue').DefineComponent<{}, {
313
317
  isInvalid: boolean;
314
318
  defaultLength: number;
315
319
  hasSlotContent: typeof import('../../..').hasSlotContent;
320
+ isComposing: boolean;
321
+ justEndedComposition: boolean;
316
322
  }, {
317
323
  formattedMessages(): any;
318
324
  } & {
@@ -323,6 +329,8 @@ declare const _default: import('vue').DefineComponent<{}, {
323
329
  isValidDescriptionSize(): boolean;
324
330
  inputComponent(): "input" | "textarea";
325
331
  inputListeners(): {
332
+ compositionstart: () => void;
333
+ compositionend: () => void;
326
334
  input: (event: any) => Promise<void>;
327
335
  blur: (event: any) => void;
328
336
  focus: (event: any) => void;
package/dist/types/components/emoji_picker/modules/emoji_search.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"emoji_search.vue.d.ts","sourceRoot":"","sources":["../../../../../components/emoji_picker/modules/emoji_search.vue"],"names":[],"mappings":"AAuCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwGA,0CAEC"}
1
+ {"version":3,"file":"emoji_search.vue.d.ts","sourceRoot":"","sources":["../../../../../components/emoji_picker/modules/emoji_search.vue"],"names":[],"mappings":"AAuCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwGA,0CAEC"}
package/dist/types/components/input/input.vue.d.ts CHANGED
@@ -67,6 +67,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
67
67
  isInvalid: boolean;
68
68
  defaultLength: number;
69
69
  hasSlotContent: typeof hasSlotContent;
70
+ isComposing: boolean;
71
+ justEndedComposition: boolean;
70
72
  }, {
71
73
  isTextarea(): boolean;
72
74
  isDefaultSize(): boolean;
@@ -75,6 +77,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
75
77
  isValidDescriptionSize(): boolean;
76
78
  inputComponent(): "input" | "textarea";
77
79
  inputListeners(): {
80
+ compositionstart: () => void;
81
+ compositionend: () => void;
78
82
  input: (event: any) => Promise<void>;
79
83
  blur: (event: any) => void;
80
84
  focus: (event: any) => void;
package/dist/types/components/input/input.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input.vue.d.ts","sourceRoot":"","sources":["../../../../components/input/input.vue"],"names":[],"mappings":"AAoHA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+BAkpBO,gBAAgB;sCAAhB,gBAAgB;mCAAhB,gBAAgB"}
1
+ {"version":3,"file":"input.vue.d.ts","sourceRoot":"","sources":["../../../../components/input/input.vue"],"names":[],"mappings":"AAoHA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+BAuqBO,gBAAgB;sCAAhB,gBAAgB;mCAAhB,gBAAgB"}
package/dist/types/components/rich_text_editor/extensions/variable/VariableComponent.vue.d.ts CHANGED
@@ -1673,6 +1673,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
1673
1673
  isInvalid: boolean;
1674
1674
  defaultLength: number;
1675
1675
  hasSlotContent: typeof import('../../../..').hasSlotContent;
1676
+ isComposing: boolean;
1677
+ justEndedComposition: boolean;
1676
1678
  }, {
1677
1679
  isTextarea(): boolean;
1678
1680
  isDefaultSize(): boolean;
@@ -1681,6 +1683,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
1681
1683
  isValidDescriptionSize(): boolean;
1682
1684
  inputComponent(): "input" | "textarea";
1683
1685
  inputListeners(): {
1686
+ compositionstart: () => void;
1687
+ compositionend: () => void;
1684
1688
  input: (event: any) => Promise<void>;
1685
1689
  blur: (event: any) => void;
1686
1690
  focus: (event: any) => void;
package/dist/types/recipes/conversation_view/message_input/message_input_link.vue.d.ts CHANGED
@@ -1216,6 +1216,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
1216
1216
  isInvalid: boolean;
1217
1217
  defaultLength: number;
1218
1218
  hasSlotContent: typeof import('../../..').hasSlotContent;
1219
+ isComposing: boolean;
1220
+ justEndedComposition: boolean;
1219
1221
  }, {
1220
1222
  isTextarea(): boolean;
1221
1223
  isDefaultSize(): boolean;
@@ -1224,6 +1226,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
1224
1226
  isValidDescriptionSize(): boolean;
1225
1227
  inputComponent(): "input" | "textarea";
1226
1228
  inputListeners(): {
1229
+ compositionstart: () => void;
1230
+ compositionend: () => void;
1227
1231
  input: (event: any) => Promise<void>;
1228
1232
  blur: (event: any) => void;
1229
1233
  focus: (event: any) => void;
package/dist/types/recipes/conversation_view/message_input/message_input_link.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"message_input_link.vue.d.ts","sourceRoot":"","sources":["../../../../../recipes/conversation_view/message_input/message_input_link.vue"],"names":[],"mappings":"AAsGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yEAsLA,IAnFM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BAmFN,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC"}
1
+ {"version":3,"file":"message_input_link.vue.d.ts","sourceRoot":"","sources":["../../../../../recipes/conversation_view/message_input/message_input_link.vue"],"names":[],"mappings":"AAsGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yEAsLA,IAnFM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BAmFN,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA8ID,GA9IC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dialpad/dialtone-vue",
3
- "version": "3.218.1",
3
+ "version": "3.218.2",
4
4
  "description": "Vue component library for Dialpad's design system Dialtone",
5
5
  "files": [
6
6
  "dist"
@@ -60,8 +60,8 @@
60
60
  "react": "19.2.4",
61
61
  "storybook": "10.2.6",
62
62
  "vue": "^3.3.4",
63
- "@dialpad/dialtone-css": "8.77.0",
64
- "@dialpad/generator-dialtone": "0.1.0"
63
+ "@dialpad/generator-dialtone": "0.1.0",
64
+ "@dialpad/dialtone-css": "8.77.0"
65
65
  },
66
66
  "peerDependencies": {
67
67
  "vue": ">=3.2",