UNPKG

@visitscotland/component-library

Version:
1 lines 5.83 kB
(self.webpackChunk_visitscotland_component_library=self.webpackChunk_visitscotland_component_library||[]).push([[6305],{2780:function(){},24319:function(t,n,e){"use strict";var i=e(59639),u=e(34352),r=e(48836),a=e(85510),l=e(68269);n.A={name:"VsInput",status:"prototype",release:"0.0.1",components:{BFormInput:u.bL,VsButton:r.default},mixins:[a.A,l.A],props:{value:{type:Number,default:0},fieldName:{type:String,required:!0},minimumNumber:{type:Number,default:0},maximumNumber:{type:Number,default:10},autoComplete:{type:Boolean,default:!0},validationRules:{type:Object,default:function(){return{}}},invalid:{type:Boolean,default:!1},triggerValidate:{type:Boolean,default:!1},validationMessages:{type:Object,default:function(){return{}}},genericValidation:{type:Object,default:function(){return{}}},hintText:{type:String,default:""},clearButtonText:{type:String,default:""},reAlertErrors:{type:Boolean,default:!1}},emits:["updated"],setup:function(){return{v$:(0,i.Ay)()}},data:function(){return{inputVal:this.value,clearErrorsOnFocus:!1}},computed:{elementClass:function(){var t=this.v$.inputVal&&this.v$.inputVal.$anyError||this.invalid?"vs-input--error":"",n="vs-input--".concat(this.fieldName);return"".concat(t," ").concat(n)},showClearButton:function(){return!(!this.inputVal.length||""===this.clearButtonText)},errorClass:function(){return this.v$.inputVal&&this.v$.inputVal.$anyError||this.invalid?"vs-input--error":""}},watch:{triggerValidate:function(){this.manualValidate()},inputVal:function(t){this.$emit("updated",{field:this.fieldName,value:t})},value:function(t){this.inputVal=t}},methods:{clearInput:function(){this.inputVal=0},focusOnInput:function(){var t=this;this.$nextTick((function(){t.$refs.input.$el.focus()}))},clearInputAndFocus:function(){this.clearInput(),this.focusOnInput()},controlBlurred:function(){this.inputVal<this.minimumNumber&&(this.inputVal=this.minimumNumber),this.inputVal>this.maximumNumber&&(this.inputVal=this.maximumNumber),this.validateErrors()},validateErrors:function(){this.clearErrorsOnFocus=!1,this.emitStatus()},resetErrors:function(){this.clearErrorsOnFocus=!0},decrementValue:function(t){t&&t.preventDefault(),this.inputVal=Math.max(this.inputVal-1,this.minimumNumber)},incrementValue:function(t){t&&t.preventDefault(),this.inputVal=Math.min(this.inputVal+1,this.maximumNumber)}},validations:function(){return this.rules}}},27120:function(t,n,e){"use strict";e.d(n,{X:function(){return i.X}});var i=e(97088)},33286:function(t,n,e){"use strict";var i=e(85072),u=e.n(i),r=e(97825),a=e.n(r),l=e(77659),s=e.n(l),o=e(55056),c=e.n(o),m=e(10540),d=e.n(m),p=e(41113),f=e.n(p),h=e(2780),v=e.n(h),b={};b.styleTagTransform=f(),b.setAttributes=c(),b.insert=s().bind(null,"head"),b.domAPI=a(),b.insertStyleElement=d(),u()(v(),b),v()&&v().locals&&v().locals},65891:function(t,n,e){"use strict";e.d(n,{A:function(){return i.A}});var i=e(24319)},66305:function(t,n,e){"use strict";e.r(n);var i=e(27120),u=e(65891);e(96946);const r=(0,e(66262).A)(u.A,[["render",i.X]]);n.default=r},96946:function(t,n,e){"use strict";e(33286)},97088:function(t,n,e){"use strict";e.d(n,{X:function(){return m}});var i=e(20641),u=e(90033),r=e(53751),a={"data-test":"vs-number-input"},l=["id"],s=["id"],o={class:"visually-hidden"},c={class:"visually-hidden"};function m(t,n,e,m,d,p){var f=(0,i.g2)("VsButton"),h=(0,i.g2)("BFormInput");return(0,i.uX)(),(0,i.CE)("div",a,[e.hintText?((0,i.uX)(),(0,i.CE)("p",{key:0,class:"hint-text",id:"hint-".concat(e.fieldName)},(0,u.toDisplayString)(e.hintText),9,l)):(0,i.Q3)("",!0),t.errorsList.length||e.invalid?((0,i.uX)(),(0,i.CE)("div",{key:1,role:"alert","aria-live":"assertive",id:"error-".concat(e.fieldName)},[((0,i.uX)(!0),(0,i.CE)(i.FK,null,(0,i.pI)(t.errorsList,(function(t){return(0,i.bo)(((0,i.uX)(),(0,i.CE)("p",{key:t,class:"error mb-0"},[(0,i.Lk)("span",o,(0,u.toDisplayString)(e.fieldName),1),(0,i.eW)(" "+(0,u.toDisplayString)(e.validationMessages[t]||e.genericValidation[t]),1)])),[[r.vShow,!e.reAlertErrors&&!d.clearErrorsOnFocus]])})),128))],8,s)):(0,i.Q3)("",!0),(0,i.bF)(f,{class:"vs-number-input__increment","icon-only":!0,size:"sm",icon:"fa-regular fa-minus",disabled:d.inputVal<=e.minimumNumber||null,onClick:p.decrementValue},{default:(0,i.k6)((function(){return n[2]||(n[2]=[(0,i.eW)(" Remove 1 ")])})),_:1,__:[2]},8,["disabled","onClick"]),(0,i.bF)(h,{ref:"input",type:"Number",class:(0,u.normalizeClass)(["vs-number-input",p.elementClass]),modelValue:d.inputVal,"onUpdate:modelValue":n[0]||(n[0]=function(t){return d.inputVal=t}),id:e.fieldName,name:e.fieldName,required:t.isRequired,v:d.inputVal,"aria-invalid":t.v$.inputVal&&t.v$.inputVal.$anyError||e.invalid,"aria-describedby":t.ariaDescription,maxlength:e.validationRules.maxLength?e.validationRules.maxLength:null,minlength:e.validationRules.minLength?e.validationRules.minLength:null,min:e.minimumNumber||null,max:e.maximumNumber||null,onBlur:p.controlBlurred,onChange:p.validateErrors,onFocus:p.resetErrors},null,8,["modelValue","class","id","name","required","v","aria-invalid","aria-describedby","maxlength","minlength","min","max","onBlur","onChange","onFocus"]),(0,i.bF)(f,{class:"vs-number-input__increment","icon-only":!0,size:"sm",icon:"fa-regular fa-plus",disabled:d.inputVal>=e.maximumNumber||null,onClick:p.incrementValue},{default:(0,i.k6)((function(){return n[3]||(n[3]=[(0,i.eW)(" Add 1 ")])})),_:1,__:[3]},8,["disabled","onClick"]),p.showClearButton?((0,i.uX)(),(0,i.Wv)(f,{key:2,class:"vs-number-input__clear-button d-none d-lg-block","data-test":"input-clear-button",variant:"subtle",icon:"vs-icon-control-dismiss",size:"md","icon-only":"",onClick:n[1]||(n[1]=(0,r.withModifiers)((function(t){return p.clearInputAndFocus()}),["prevent"]))},{default:(0,i.k6)((function(){return[(0,i.Lk)("span",c,(0,u.toDisplayString)(e.clearButtonText),1)]})),_:1})):(0,i.Q3)("",!0)])}}}]);