{"version":3,"sources":["webpack:///./src/ui-components/inputWithCharacterCounter/inputWithCharacterCounter.vue?df1e","webpack:///./src/ui-components/inputWithCharacterCounter/inputWithCharacterCounter.vue?6ff3","webpack:///./src/ui-components/inputWithCharacterCounter/inputWithCharacterCounter.vue?3ebf","webpack:///./src/ui-components/inputWithCharacterCounter/inputWithCharacterCounter.vue?8c6e","webpack:///./src/ui-components/inputWithCharacterCounter/inputWithCharacterCounter.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","inputType","directives","name","rawName","value","expression","modifiers","class","isOverLimit","domProps","on","$event","target","composing","localInputModel","trim","$forceUpdate","attrs","error","_v","_s","_e","counterMessage","staticRenderFns","InputWithCharacterCounter","newValue","$emit","length","maxLength","currentCharacterCount","Math","abs","computedCounter","Vue","tslib_1","Prop","required","validator","includes","Component","model","prop","event","component"],"mappings":"2IAAA,W,yCCAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,cAAc,CAAoB,aAAlBN,EAAIO,UAA0BH,EAAG,WAAW,CAACI,WAAW,CAAC,CAACC,KAAK,QAAQC,QAAQ,eAAeC,MAAOX,EAAmB,gBAAEY,WAAW,kBAAkBC,UAAU,CAAC,MAAO,KAAQC,MAAM,CACvT,wCAAyCd,EAAIe,aAC7CC,SAAS,CAAC,MAAShB,EAAmB,iBAAGiB,GAAG,CAAC,MAAQ,SAASC,GAAWA,EAAOC,OAAOC,YAAqBpB,EAAIqB,gBAAgBH,EAAOC,OAAOR,MAAMW,SAAQ,KAAO,SAASJ,GAAQ,OAAOlB,EAAIuB,mBAAmBnB,EAAG,QAAQ,CAACI,WAAW,CAAC,CAACC,KAAK,QAAQC,QAAQ,eAAeC,MAAOX,EAAmB,gBAAEY,WAAW,kBAAkBC,UAAU,CAAC,MAAO,KAAQC,MAAM,CACxW,wCAAyCd,EAAIe,aAC7CS,MAAM,CAAC,KAAO,QAAQR,SAAS,CAAC,MAAShB,EAAmB,iBAAGiB,GAAG,CAAC,MAAQ,SAASC,GAAWA,EAAOC,OAAOC,YAAqBpB,EAAIqB,gBAAgBH,EAAOC,OAAOR,MAAMW,SAAQ,KAAO,SAASJ,GAAQ,OAAOlB,EAAIuB,mBAAmBnB,EAAG,QAAQ,CAACU,MAAM,CAAE,uCAAwCd,EAAIe,aAAef,EAAIyB,QAAS,CAAEzB,EAAIyB,QAAUzB,EAAIe,YAAa,CAACf,EAAI0B,GAAG,IAAI1B,EAAI2B,GAAG3B,EAAIyB,OAAO,MAAM,CAAEzB,EAAe,YAAEI,EAAG,IAAI,CAACE,YAAY,8BAA8BN,EAAI4B,KAAK5B,EAAI0B,GAAG,IAAI1B,EAAI2B,GAAG3B,EAAI6B,gBAAgB,OAAO,MACtgBC,EAAkB,G,gGCyCDC,EAAyB,oHA+E3C,OA/E2C,6DA8B5C,eAKE,OAAO9B,KAAKU,OACb,aAEmBqB,GAClB/B,KAAKgC,MAAM,QAASD,KAGtB,4CAKE,OAAO/B,KAAKoB,gBAAgBa,SAG9B,sCAKE,OAAOjC,KAAKkC,UAAYlC,KAAKmC,wBAG/B,kCAKE,OAAOnC,KAAKmC,sBAAwBnC,KAAKkC,YAG3C,qCAME,OAAmC,IAA/BlC,KAAKmC,sBACA,GAAP,OAAUnC,KAAKkC,UAAS,uBACflC,KAAKc,YACP,GAAP,OAAUsB,KAAKC,IAAIrC,KAAKsC,iBAAgB,0BAEjC,GAAP,OAAUtC,KAAKsC,gBAAe,wBAEjC,EA/E2C,CAASC,QAK3BC,QAAzBC,eAAK,CAAEC,UAAU,KAAO,4BAUzBF,QAJCC,eAAK,CACJC,UAAU,EACVC,UAAW,SAACjC,GAAa,MAAK,CAAC,OAAQ,YAAYkC,SAASlC,OAC5D,gCAOwB8B,QAAzBC,eAAK,CAAEC,UAAU,KAAO,gCAOEF,QAA1BC,eAAK,CAAEC,UAAU,KAAQ,4BA5BPZ,EAAyB,QAN7Ce,eAAU,CACTC,MAAO,CACLC,KAAM,QACNC,MAAO,YAGUlB,WC9CiZ,I,wBCQlamB,EAAY,eACd,EACAnD,EACA+B,GACA,EACA,KACA,WACA,MAIa,aAAAoB,E","file":"js/chunk-7bc616b3.2f29666441d75b0a00d1.1730771797376.min.js","sourcesContent":["export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--10-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--10-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--10-oneOf-1-2!../../../node_modules/less-loader/dist/cjs.js??ref--10-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./inputWithCharacterCounter.vue?vue&type=style&index=0&id=139c356d&lang=less&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"form-group\"},[(_vm.inputType === 'textarea')?_c('textarea',{directives:[{name:\"model\",rawName:\"v-model.trim\",value:(_vm.localInputModel),expression:\"localInputModel\",modifiers:{\"trim\":true}}],class:{\n 'form-group__input-with-counter--error': _vm.isOverLimit\n },domProps:{\"value\":(_vm.localInputModel)},on:{\"input\":function($event){if($event.target.composing){ return; }_vm.localInputModel=$event.target.value.trim()},\"blur\":function($event){return _vm.$forceUpdate()}}}):_c('input',{directives:[{name:\"model\",rawName:\"v-model.trim\",value:(_vm.localInputModel),expression:\"localInputModel\",modifiers:{\"trim\":true}}],class:{\n 'form-group__input-with-counter--error': _vm.isOverLimit\n },attrs:{\"type\":\"text\"},domProps:{\"value\":(_vm.localInputModel)},on:{\"input\":function($event){if($event.target.composing){ return; }_vm.localInputModel=$event.target.value.trim()},\"blur\":function($event){return _vm.$forceUpdate()}}}),_c('label',{class:{ 'form-group__character-counter--error': _vm.isOverLimit || _vm.error }},[(_vm.error && !_vm.isOverLimit)?[_vm._v(\" \"+_vm._s(_vm.error)+\" \")]:[(_vm.isOverLimit)?_c('i',{staticClass:\"fas fa-exclamation-circle\"}):_vm._e(),_vm._v(\" \"+_vm._s(_vm.counterMessage)+\" \")]],2)])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport { Vue, Prop, Component } from 'vue-property-decorator'\n\n/**\n * A Vue component that renders an input field with a character counter.\n * The input can be either a textarea or a text input, depending on the `inputType` prop.\n * It displays a character counter and shows an error message if the input exceeds the maximum allowed characters.\n * If an external validation error message is provided via the `error` prop, it will be displayed instead of the character counter.\n */\n@Component({\n model: {\n prop: 'value', // The prop that v-model will bind to\n event: 'input' // The event that v-model will emit\n }\n})\nexport default class InputWithCharacterCounter extends Vue {\n /**\n * The value for the input field, which will be bound to v-model.\n * @type {string}\n */\n @Prop({ required: true }) readonly value!: string\n\n /**\n * The type of input to render, either 'text' or 'textarea'.\n * @type {string}\n */\n @Prop({\n required: true,\n validator: (value: string) => ['text', 'textarea'].includes(value)\n })\n readonly inputType!: string\n\n /**\n * The maximum number of characters allowed in the input field.\n * @type {number}\n */\n @Prop({ required: true }) readonly maxLength!: number\n\n /**\n * An external validation error message to display.\n * If provided, this message will be shown instead of the character counter.\n * @type {string | undefined}\n */\n @Prop({ required: false }) readonly error!: string\n\n /**\n * A local copy of the input model, used for two-way binding.\n * @type {string}\n */\n get localInputModel(): string {\n return this.value\n }\n\n set localInputModel(newValue: string) {\n this.$emit('input', newValue)\n }\n\n /**\n * Calculates the current number of characters in the input field.\n * @returns {number} The current character count.\n */\n get currentCharacterCount(): number {\n return this.localInputModel.length\n }\n\n /**\n * Calculates the number of characters remaining or over the limit.\n * @returns {number} The computed counter value.\n */\n get computedCounter(): number {\n return this.maxLength - this.currentCharacterCount\n }\n\n /**\n * Determines if the input has exceeded the maximum character limit.\n * @returns {boolean} True if the input is over the limit, false otherwise.\n */\n get isOverLimit(): boolean {\n return this.currentCharacterCount > this.maxLength\n }\n\n /**\n * Generates the message to display in the character counter label.\n * The message varies depending on whether the input is empty, within the limit, or over the limit.\n * @returns {string} The character counter message.\n */\n get counterMessage(): string {\n if (this.currentCharacterCount === 0) {\n return `${this.maxLength} characters allowed`\n } else if (this.isOverLimit) {\n return `${Math.abs(this.computedCounter)} characters over limit`\n } else {\n return `${this.computedCounter} characters left`\n }\n }\n}\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/ts-loader/index.js??ref--13-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./inputWithCharacterCounter.vue?vue&type=script&lang=ts&\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/ts-loader/index.js??ref--13-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./inputWithCharacterCounter.vue?vue&type=script&lang=ts&\"","import { render, staticRenderFns } from \"./inputWithCharacterCounter.vue?vue&type=template&id=139c356d&scoped=true&\"\nimport script from \"./inputWithCharacterCounter.vue?vue&type=script&lang=ts&\"\nexport * from \"./inputWithCharacterCounter.vue?vue&type=script&lang=ts&\"\nimport style0 from \"./inputWithCharacterCounter.vue?vue&type=style&index=0&id=139c356d&lang=less&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n script,\n render,\n staticRenderFns,\n false,\n null,\n \"139c356d\",\n null\n \n)\n\nexport default component.exports"],"sourceRoot":""}