mosstandardcomponents 1.0.17 → 1.0.18
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.
|
@@ -154,7 +154,7 @@ const k = { render: z }, _ = (t, n) => {
|
|
|
154
154
|
class: "absolute right-0 top-0 py-3 pl-1 pr-2 text-green"
|
|
155
155
|
}, U = ["id", "textContent"], W = ["id"], X = ["textContent"], Y = ["textContent"];
|
|
156
156
|
function Z(t, n, e, f, s, o) {
|
|
157
|
-
const
|
|
157
|
+
const g = m("icon-privacy"), b = m("icon-eye-slash"), v = m("icon-alert"), d = m("icon-check");
|
|
158
158
|
return r(), i("div", N, [
|
|
159
159
|
e.label ? (r(), i("label", {
|
|
160
160
|
key: 0,
|
|
@@ -222,11 +222,11 @@ function Z(t, n, e, f, s, o) {
|
|
|
222
222
|
"aria-label": t.showPassword ? "Verberg wachtwoord" : "Toon wachtwoord",
|
|
223
223
|
onClick: n[4] || (n[4] = (...h) => o.togglePassword && o.togglePassword(...h))
|
|
224
224
|
}, [
|
|
225
|
-
t.showPassword ? (r(), x(
|
|
225
|
+
t.showPassword ? (r(), x(g, {
|
|
226
226
|
key: 0,
|
|
227
227
|
class: "h-4 w-4",
|
|
228
228
|
"aria-hidden": "true"
|
|
229
|
-
})) : (r(), x(
|
|
229
|
+
})) : (r(), x(b, {
|
|
230
230
|
key: 1,
|
|
231
231
|
class: "h-4 w-4",
|
|
232
232
|
"aria-hidden": "true"
|
|
@@ -379,7 +379,7 @@ const te = { render: ee }, ne = {
|
|
|
379
379
|
key: 1,
|
|
380
380
|
class: "font-normal",
|
|
381
381
|
textContent: " (optioneel)"
|
|
382
|
-
}, se =
|
|
382
|
+
}, se = ["id", "value", "name", "placeholder", "required", "optional", "error", "min", "max", "autocomplete", "autofocus", "inputmode", "disabled", "readonly", "aria-describedby", "aria-errormessage", "pattern", "aria-invalid"], de = { class: "absolute bottom-0 top-0 my-auto ml-2" }, ue = {
|
|
383
383
|
key: 0,
|
|
384
384
|
class: "absolute right-0 top-0 py-3 pl-1 pr-2 text-error-500"
|
|
385
385
|
}, ce = {
|
|
@@ -387,7 +387,7 @@ const te = { render: ee }, ne = {
|
|
|
387
387
|
class: "absolute right-0 top-0 py-3 pl-1 pr-2 text-green"
|
|
388
388
|
}, he = ["id", "textContent"], me = ["id"], fe = ["textContent"];
|
|
389
389
|
function ye(t, n, e, f, s, o) {
|
|
390
|
-
const
|
|
390
|
+
const g = m("icon-euro"), b = m("icon-alert"), v = m("icon-check");
|
|
391
391
|
return r(), i("div", re, [
|
|
392
392
|
e.label ? (r(), i("label", {
|
|
393
393
|
key: 0,
|
|
@@ -413,9 +413,6 @@ function ye(t, n, e, f, s, o) {
|
|
|
413
413
|
e.disabled && e.modelValue || e.readonly ? "bg-blue-dark-100" : ""
|
|
414
414
|
]])
|
|
415
415
|
}, [
|
|
416
|
-
a("div", se, [
|
|
417
|
-
y(b, { class: "inline h-6 w-6 text-blue-dark" })
|
|
418
|
-
]),
|
|
419
416
|
a("input", {
|
|
420
417
|
id: s.computedId,
|
|
421
418
|
value: s.displayValue,
|
|
@@ -441,9 +438,12 @@ function ye(t, n, e, f, s, o) {
|
|
|
441
438
|
onBlur: n[1] || (n[1] = (...d) => o.onBlur && o.onBlur(...d)),
|
|
442
439
|
onFocus: n[2] || (n[2] = (...d) => o.onFocus && o.onFocus(...d)),
|
|
443
440
|
onKeyup: n[3] || (n[3] = w((...d) => o.onKeyupEnter && o.onKeyupEnter(...d), ["enter"]))
|
|
444
|
-
}, null, 40,
|
|
441
|
+
}, null, 40, se),
|
|
442
|
+
a("div", de, [
|
|
443
|
+
y(g, { class: "inline h-6 w-6 text-blue-dark" })
|
|
444
|
+
]),
|
|
445
445
|
e.error ? (r(), i("div", ue, [
|
|
446
|
-
y(
|
|
446
|
+
y(b, {
|
|
447
447
|
class: "-mt-1 mr-1 inline h-5 w-5",
|
|
448
448
|
"aria-hidden": "true"
|
|
449
449
|
})
|
|
@@ -473,7 +473,7 @@ function ye(t, n, e, f, s, o) {
|
|
|
473
473
|
], 8, me)) : l("", !0)
|
|
474
474
|
]);
|
|
475
475
|
}
|
|
476
|
-
const Ee = /* @__PURE__ */ _(ne, [["render", ye], ["__scopeId", "data-v-
|
|
476
|
+
const Ee = /* @__PURE__ */ _(ne, [["render", ye], ["__scopeId", "data-v-6897d101"]]), ge = {
|
|
477
477
|
name: "IbanInput",
|
|
478
478
|
components: {
|
|
479
479
|
IconAlert: p,
|
|
@@ -557,7 +557,7 @@ const Ee = /* @__PURE__ */ _(ne, [["render", ye], ["__scopeId", "data-v-7b7ca041
|
|
|
557
557
|
this.isActive = !1, this.$emit("onKeyupEnter", t.target.value);
|
|
558
558
|
}
|
|
559
559
|
}
|
|
560
|
-
},
|
|
560
|
+
}, be = { class: "pt-2" }, ve = ["for"], we = ["textContent"], pe = {
|
|
561
561
|
key: 0,
|
|
562
562
|
class: "text-red"
|
|
563
563
|
}, ke = {
|
|
@@ -572,8 +572,8 @@ const Ee = /* @__PURE__ */ _(ne, [["render", ye], ["__scopeId", "data-v-7b7ca041
|
|
|
572
572
|
class: "absolute right-0 top-0 py-3 pl-1 pr-2 text-green"
|
|
573
573
|
}, Ie = ["id", "textContent"], Ve = ["id"], Be = ["textContent"];
|
|
574
574
|
function Ae(t, n, e, f, s, o) {
|
|
575
|
-
const
|
|
576
|
-
return r(), i("div",
|
|
575
|
+
const g = m("icon-alert"), b = m("icon-check"), v = C("maska");
|
|
576
|
+
return r(), i("div", be, [
|
|
577
577
|
e.label ? (r(), i("label", {
|
|
578
578
|
key: 0,
|
|
579
579
|
for: t.computedId,
|
|
@@ -634,13 +634,13 @@ function Ae(t, n, e, f, s, o) {
|
|
|
634
634
|
innerHTML: o.maskaValue
|
|
635
635
|
}, null, 8, xe),
|
|
636
636
|
e.error ? (r(), i("div", Ce, [
|
|
637
|
-
y(
|
|
637
|
+
y(g, {
|
|
638
638
|
class: "-mt-1 mr-1 inline h-5 w-5",
|
|
639
639
|
"aria-hidden": "true"
|
|
640
640
|
})
|
|
641
641
|
])) : l("", !0),
|
|
642
642
|
!e.error && e.modelValue && t.shouldShowCheck ? (r(), i("div", Se, [
|
|
643
|
-
y(
|
|
643
|
+
y(b, {
|
|
644
644
|
class: "-mt-1 mr-1 inline h-5 w-5",
|
|
645
645
|
"aria-hidden": "true"
|
|
646
646
|
})
|
|
@@ -664,7 +664,7 @@ function Ae(t, n, e, f, s, o) {
|
|
|
664
664
|
], 8, Ve)) : l("", !0)
|
|
665
665
|
]);
|
|
666
666
|
}
|
|
667
|
-
const Ke = /* @__PURE__ */ _(
|
|
667
|
+
const Ke = /* @__PURE__ */ _(ge, [["render", Ae], ["__scopeId", "data-v-6050fb6d"]]);
|
|
668
668
|
export {
|
|
669
669
|
Ee as AmountInput,
|
|
670
670
|
Ke as IbanInput,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(i,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("maska")):typeof define=="function"&&define.amd?define(["exports","vue","maska"],e):(i=typeof globalThis<"u"?globalThis:i||self,e(i.mosstandardcomponents={},i.Vue,i.maska))})(this,function(i,e,g){"use strict";const p={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1008 1008"};function k(o,n){return e.openBlock(),e.createElementBlock("svg",p,[...n[0]||(n[0]=[e.createElementVNode("path",{fill:"currentColor",d:"M1008 540c0 14-4 27-11 39-103 170-293 285-493 285S114 749 11 579c-7-12-11-25-11-39s4-27 11-39c103-170 293-285 493-285s390 115 493 285c7 12 11 25 11 39zM531 324c0-15-12-27-27-27-94 0-171 77-171 171 0 15 12 27 27 27s27-12 27-27c0-64 53-117 117-117 15 0 27-12 27-27zm405 216c-53-83-127-154-214-199 22 39 34 83 34 127 0 139-113 252-252 252S252 607 252 468c0-44 12-88 34-127-87 45-161 116-214 199 96 148 251 252 432 252s336-104 432-252z"},null,-1)])])}const b={render:k},w={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1008 1008"};function B(o,n){return e.openBlock(),e.createElementBlock("svg",w,[...n[0]||(n[0]=[e.createElementVNode("path",{fill:"currentColor",d:"M1008 540c0 15-4 27-11 39-18 29-40 56-62 81-110 127-262 204-431 204l42-74c163-14 302-114 390-250-42-65-95-121-159-165l36-63c70 46 140 117 184 189 7 12 11 24 11 39zm-252-72c0 105-65 198-162 235l158-282c2 15 4 31 4 47zm-21-251v5C616 434 497 646 380 859l-28 50c-3 6-9 9-16 9-10 0-63-33-75-39-6-4-9-9-9-16 0-9 19-40 25-49C168 764 76 680 11 579c-7-11-11-25-11-39 0-13 4-28 11-39 112-171 285-285 493-285 34 0 68 3 101 10l31-55c3-6 9-9 15-9 11 0 63 33 75 39 6 4 9 9 9 16zM531 324c0-15-12-27-27-27-94 0-171 77-171 171 0 15 12 27 27 27s27-12 27-27c0-65 53-117 117-117 15 0 27-12 27-27zM312 751l44-79c-65-48-104-124-104-204 0-44 12-88 34-127-87 45-161 116-214 199 58 91 141 166 240 211z"},null,-1)])])}const C={render:B},V={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1039 1008"};function _(o,n){return e.openBlock(),e.createElementBlock("svg",V,[...n[0]||(n[0]=[e.createElementVNode("path",{fill:"currentColor",d:"M908 989H131q-32 0-62.5-17T19 926.5 0 863t19-68l388-670q42-62 113-62t112 62l389 670q18 28 18 64 0 75-68 113-31 17-63 17zM576 157q-19-38-55.5-38T463 150L69 826q-20 30 0 69 21 32 56 32h777q35 0 55.5-30.5t.5-70.5zm-13 501.5Q544 676 517.5 676T474 659t-17-45V351q0-29 17-46t45.5-17 45.5 17 17 46v263q0 27-19 44.5zm-97.5 174q-8.5-14.5-8.5-36t18.5-39.5 37.5-18 31 5 20 13q18 18 18 44t-18 44.5-39.5 18.5-36-8.5-23-23z"},null,-1)])])}const h={render:_},S={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1008 1008"};function E(o,n){return e.openBlock(),e.createElementBlock("svg",S,[...n[0]||(n[0]=[e.createElementVNode("path",{fill:"currentColor",d:"M940 318c0 14-6 28-16 39L517 764l-77 76c-10 10-24 16-38 16s-28-6-38-16l-77-76L84 560c-10-10-16-24-16-38s6-28 16-38l76-77c10-10 25-16 39-16s28 6 38 16l165 166 369-369c10-11 24-16 38-16s29 6 39 16l76 76c10 10 16 24 16 38z"},null,-1)])])}const f={render:E},y=(o,n)=>{const t=o.__vccOpts||o;for(const[d,r]of n)t[d]=r;return t},x={name:"InputField",components:{IconEyeSlash:C,IconPrivacy:b,IconAlert:h,IconCheck:f},props:{modelValue:String,label:String,name:String,placeholder:{type:String,default:" "},required:{type:Boolean,default:!1},optional:{type:Boolean,default:!1},disabled:Boolean,error:{type:Boolean,default:!1},pattern:{type:String,default:null},hidepasswordicon:{type:Boolean,default:!1},autocomplete:{type:String,default:"on"},inputmode:String,autofocus:Boolean,readonly:Boolean,minlength:String,maxlength:String,type:{type:String,default:"text"},id:{type:String,default:null},hint:String,errormessage:{type:String,default:""},borderClass:{type:String,default:null},showCheck:{type:Boolean,default:!1},inputClass:{type:String,default:null}},emits:["update:modelValue","focus","blur","showpassword","onKeyupEnter"],data:function(){return{initialType:"",fieldType:"text",isActive:!1,hasError:!1,showPassword:!1,shouldShowCheck:!1,computedId:null}},computed:{outlineClass:function(){return this.isActive?"border-blue":this.error?"border-error-500":!this.disabled&&this.modelValue?"border-blue-dark-900":this.disabled&&this.modelValue||this.readonly?"border-none":"border-blue-dark-200"}},watch:{type:function(){this.fieldType=this.type}},mounted:function(){this.computedId=this.id?this.id:"cb-input-"+Math.random().toString(36).slice(4),this.checkAutofill(),setTimeout(this.checkAutofill,1e3)},created:function(){this.initialType=this.type,this.fieldType=this.type},methods:{togglePassword:function(){this.showPassword=!this.showPassword,this.fieldType=this.showPassword?"text":"password",this.$emit("showpassword",this.showPassword)},onBlur:function(o){this.isActive=!1,this.$emit("blur",o.target.value),this.showCheck&&(this.shouldShowCheck=!0)},onFocus:function(o){this.isActive=!0,this.$emit("focus")},onKeyupEnter:function(o){this.isActive=!1,this.$emit("onKeyupEnter",o.target.value)},checkAutofill:function(){const o=this.$refs.input;o&&o.value&&this.$emit("update:modelValue",o.value)}}},N={class:"pt-2"},I=["for"],A=["textContent"],q={key:0,class:"text-red"},T={key:1,textContent:" (optioneel)",class:"font-normal"},z=["id","value","type","name","placeholder","required","optional","error","minlength","maxlength","autocomplete","autofocus","inputmode","disabled","readonly","aria-describedby","aria-errormessage","pattern","aria-invalid"],F=["aria-pressed","aria-label"],K={class:"sr-only"},P={key:1,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-error-500"},M={key:2,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-green"},D=["id","textContent"],L=["id"],H=["textContent"],j=["textContent"];function O(o,n,t,d,r,l){const c=e.resolveComponent("icon-privacy"),m=e.resolveComponent("icon-eye-slash"),u=e.resolveComponent("icon-alert"),a=e.resolveComponent("icon-check");return e.openBlock(),e.createElementBlock("div",N,[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:o.computedId,class:e.normalizeClass(["max-w-full whitespace-nowrap text-sm font-bold",{active:o.isActive||t.modelValue,"text-blue-dark":t.disabled,"text-blue":o.isActive,"text-blue-dark":!t.error&&!o.isActive,"text-blue-dark":t.error&&!o.isActive}])},[e.createElementVNode("span",{textContent:e.toDisplayString(t.label)},null,8,A),t.required?(e.openBlock(),e.createElementBlock("span",q," * ")):e.createCommentVNode("",!0),t.optional?(e.openBlock(),e.createElementBlock("span",T)):e.createCommentVNode("",!0)],10,I)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["relative mt-1 rounded-sm",[l.outlineClass,o.isActive||t.error?"border-2":"border",t.disabled&&t.modelValue||t.readonly?"bg-blue-dark-100":""]])},[e.createElementVNode("input",{id:o.computedId,ref:"input",value:t.modelValue,type:o.fieldType,name:t.name,placeholder:t.placeholder,required:t.required,optional:t.optional,error:t.error,minlength:t.minlength,maxlength:t.maxlength,autocomplete:t.autocomplete,autofocus:t.autofocus,inputmode:t.inputmode,disabled:t.disabled,readonly:t.readonly,"aria-describedby":t.hint?o.computedId+"-hint":null,"aria-errormessage":t.error?o.computedId+"-errormsg":null,pattern:t.pattern,"aria-invalid":t.error.toString(),class:"block h-12 w-full appearance-none border-0 bg-transparent pl-4 pr-8 focus:outline-none","data-clarity-mask":"true",onInput:n[0]||(n[0]=s=>o.$emit("update:modelValue",s.target.value)),onBlur:n[1]||(n[1]=(...s)=>l.onBlur&&l.onBlur(...s)),onFocus:n[2]||(n[2]=(...s)=>l.onFocus&&l.onFocus(...s)),onKeyup:n[3]||(n[3]=e.withKeys((...s)=>l.onKeyupEnter&&l.onKeyupEnter(...s),["enter"]))},null,40,z),o.initialType==="password"&&!t.hidepasswordicon&&!t.disabled?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["absolute right-0 top-0",{"right-8":t.error}])},[e.createElementVNode("button",{type:"button",class:"m-1 px-2 py-3 focus-visible:outline-blue-dark","aria-pressed":o.showPassword,"aria-label":o.showPassword?"Verberg wachtwoord":"Toon wachtwoord",onClick:n[4]||(n[4]=(...s)=>l.togglePassword&&l.togglePassword(...s))},[o.showPassword?(e.openBlock(),e.createBlock(c,{key:0,class:"h-4 w-4","aria-hidden":"true"})):(e.openBlock(),e.createBlock(m,{key:1,class:"h-4 w-4","aria-hidden":"true"})),e.createElementVNode("span",K,e.toDisplayString(o.showPassword?"verberg":"toon")+" wachtwoord",1)],8,F)],2)):e.createCommentVNode("",!0),t.error?(e.openBlock(),e.createElementBlock("div",P,[e.createVNode(u,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0),!t.error&&t.modelValue&&o.shouldShowCheck?(e.openBlock(),e.createElementBlock("div",M,[e.createVNode(a,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0)],2),t.hint&&!t.error?(e.openBlock(),e.createElementBlock("div",{key:1,id:o.computedId+"-hint",class:e.normalizeClass(["w-full pt-1 text-xs leading-4",{"text-grey-500":t.disabled}]),textContent:e.toDisplayString(t.hint)},null,10,D)):e.createCommentVNode("",!0),t.error&&t.errormessage?(e.openBlock(),e.createElementBlock("div",{key:2,id:o.computedId+"-errormsg",class:"w-full pt-1 text-sm font-bold leading-4 text-error-500","aria-live":"assertive"},[e.createElementVNode("span",{textContent:e.toDisplayString(t.errormessage)},null,8,H)],8,L)):e.createCommentVNode("",!0),o.initialType==="password"?(e.openBlock(),e.createElementBlock("p",{key:3,class:"sr-only","aria-live":"polite",textContent:e.toDisplayString(o.showPassword?"wachtwoord wordt getoond":"wachtwoord is verborgen")},null,8,j)):e.createCommentVNode("",!0)])}const G=y(x,[["render",O],["__scopeId","data-v-5a4e94c9"]]),Q={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1010 1008"};function J(o,n){return e.openBlock(),e.createElementBlock("svg",Q,[...n[0]||(n[0]=[e.createElementVNode("path",{d:"M503 100q113 0 209 55.5T863.5 307 919 516t-55.5 208.5T712 876t-209 56-208.5-56T143 724.5 87 516t56-209 151.5-151.5T503 100zm-25 255q29-12 58.5-12t59.5 7l22-83q-36-9-78-9-79 0-149.5 53.5T299 440h-49v55h39q-1 9-1 20t2 24h-40v54h49q22 84 87.5 135T542 779q43 0 73-9l11-4-17-84q-30 11-72 11t-80.5-27-55.5-73h147l10-54H385q-4-25-1-44h184l10-54H397q23-62 81-86z",fill:"currentColor"},null,-1)])])}const R={render:J},U={name:"AmountInput",components:{IconAlert:h,IconCheck:f,VectorImage,IconEuro:R},props:{modelValue:Number,label:String,name:String,placeholder:{type:String,default:""},required:Boolean,optional:Boolean,disabled:Boolean,error:Boolean,pattern:{type:String,default:"[1-9]?"},autocomplete:{type:String,default:"on"},inputmode:String,autofocus:Boolean,readonly:Boolean,min:String,max:String,id:{type:String,default:null},hint:String,errormessage:String,borderClass:String,showCheck:Boolean,symbol:String},emits:["update:modelValue","input","focus","blur","onKeyupEnter"],data(){return{isActive:!1,shouldShowCheck:!1,displayValue:"",computedId:null,isTyping:!1}},watch:{modelValue:{immediate:!0,handler(o){this.isTyping||(this.displayValue=this.formatCurrency(o))}}},computed:{outlineClass(){return this.isActive?"border-blue":this.error?"border-error-500":!this.disabled&&this.modelValue?"border-blue-dark-900":this.disabled&&this.modelValue||this.readonly?"border-none":"border-blue-dark-200"}},mounted(){this.computedId=this.id??"cb-input-"+Math.random().toString(36).slice(4)},methods:{onInput(o){this.isTyping=!0;const n=o.target.value,t=n.replace(/[^\d.,]/g,"").replace(",","."),d=parseFloat(t);isNaN(d)||(this.$emit("update:modelValue",d),this.$emit("input",d)),this.displayValue=n},onBlur(){this.isTyping=!1,this.applyFormatting(),this.isActive=!1,this.$emit("blur",this.modelValue)},onKeyupEnter(){this.isTyping=!1,this.applyFormatting(),this.isActive=!1,this.$emit("onKeyupEnter",this.modelValue)},applyFormatting(){const o=this.displayValue.replace(/[^\d.,]/g,"").replace(",","."),n=parseFloat(o);if(!isNaN(n)){const t=this.formatCurrency(n);this.displayValue=t,this.$emit("update:modelValue",n),this.$emit("input",n)}},formatCurrency(o){return o==null||o===""?"":new Intl.NumberFormat("nl-NL",{minimumFractionDigits:2,maximumFractionDigits:2}).format(o)},onFocus(){this.isActive=!0,this.$emit("focus")}}},W={class:"pt-2"},X=["for"],Y=["textContent"],Z={key:0,class:"text-red"},v={key:1,class:"font-normal",textContent:" (optioneel)"},$={class:"absolute bottom-0 top-0 my-auto ml-2"},ee=["id","value","name","placeholder","required","optional","error","min","max","autocomplete","autofocus","inputmode","disabled","readonly","aria-describedby","aria-errormessage","pattern","aria-invalid"],te={key:0,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-error-500"},oe={key:1,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-green"},ne=["id","textContent"],le=["id"],re=["textContent"];function ae(o,n,t,d,r,l){const c=e.resolveComponent("icon-euro"),m=e.resolveComponent("icon-alert"),u=e.resolveComponent("icon-check");return e.openBlock(),e.createElementBlock("div",W,[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:r.computedId,class:e.normalizeClass(["max-w-full whitespace-nowrap text-sm font-bold",{active:r.isActive||t.modelValue,"text-blue-dark":t.disabled,"text-blue":r.isActive,"text-blue-dark":!t.error&&!r.isActive,"text-blue-dark":t.error&&!r.isActive}])},[e.createElementVNode("span",{textContent:e.toDisplayString(t.label)},null,8,Y),t.required?(e.openBlock(),e.createElementBlock("span",Z," * ")):e.createCommentVNode("",!0),t.optional?(e.openBlock(),e.createElementBlock("span",v)):e.createCommentVNode("",!0)],10,X)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["relative mt-1 rounded-sm",[l.outlineClass,r.isActive||t.error?"border-2":"border",t.disabled&&t.modelValue||t.readonly?"bg-blue-dark-100":""]])},[e.createElementVNode("div",$,[e.createVNode(c,{class:"inline h-6 w-6 text-blue-dark"})]),e.createElementVNode("input",{id:r.computedId,value:r.displayValue,type:"text",name:t.name,placeholder:t.placeholder,required:t.required,optional:t.optional,error:t.error,min:t.min,max:t.max,autocomplete:t.autocomplete,autofocus:t.autofocus,inputmode:t.inputmode,disabled:t.disabled,readonly:t.readonly,"aria-describedby":t.hint?r.computedId+"-hint":!1,"aria-errormessage":t.error?r.computedId+"-errormsg":!1,pattern:t.pattern,"aria-invalid":t.error.toString(),class:"block h-12 w-full appearance-none border-0 bg-transparent pl-10 pr-8 focus:outline-none",onInput:n[0]||(n[0]=(...a)=>l.onInput&&l.onInput(...a)),onBlur:n[1]||(n[1]=(...a)=>l.onBlur&&l.onBlur(...a)),onFocus:n[2]||(n[2]=(...a)=>l.onFocus&&l.onFocus(...a)),onKeyup:n[3]||(n[3]=e.withKeys((...a)=>l.onKeyupEnter&&l.onKeyupEnter(...a),["enter"]))},null,40,ee),t.error?(e.openBlock(),e.createElementBlock("div",te,[e.createVNode(m,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0),!t.error&&t.modelValue&&r.shouldShowCheck?(e.openBlock(),e.createElementBlock("div",oe,[e.createVNode(u,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0)],2),t.hint&&!t.error?(e.openBlock(),e.createElementBlock("div",{key:1,id:r.computedId+"-hint",class:e.normalizeClass(["w-full pt-1 text-xs leading-4",{"text-grey-500":t.disabled}]),textContent:e.toDisplayString(t.hint)},null,10,ne)):e.createCommentVNode("",!0),t.error&&t.errormessage?(e.openBlock(),e.createElementBlock("div",{key:2,id:r.computedId+"-errormsg",class:"w-full pt-1 text-sm font-bold leading-4 text-error-500","aria-live":"assertive"},[e.createElementVNode("span",{textContent:e.toDisplayString(t.errormessage)},null,8,re)],8,le)):e.createCommentVNode("",!0)])}const ie=y(U,[["render",ae],["__scopeId","data-v-7b7ca041"]]),se={name:"IbanInput",components:{IconAlert:h,IconCheck:f},directives:{maska:g.vMaska},props:{modelValue:String,label:String,name:String,placeholder:{type:String,default:" "},required:{type:Boolean,default:!1},optional:{type:Boolean,default:!1},disabled:Boolean,error:{type:Boolean,default:!1},pattern:{type:String,default:null},autocomplete:{type:String,default:"on"},inputmode:String,autofocus:Boolean,readonly:Boolean,minlength:String,maxlength:String,type:{type:String,default:"text"},id:{type:String,default:null},hint:String,errormessage:{type:String,default:""},borderClass:{type:String,default:null},maskaVal:{type:String,default:""},showCheck:{type:Boolean,default:!1}},data:function(){return{initialType:"",fieldType:"text",isActive:!1,hasError:!1,shouldShowCheck:!1,maskaPattern:"@@## @@@@ #### #### ##",maskaPlaceholder:"NL20 INGB 0001 2345 67",computedId:null}},computed:{outlineClass:function(){return this.isActive?"border-blue":this.error?"border-error-500":!this.disabled&&this.modelValue?"border-blue-dark-900":this.disabled&&this.modelValue||this.readonly?"border-none":"border-blue-dark-200"},maskaValue:function(){let o=this.maskaPlaceholder;if(this.maskaVal){const n=this.maskaVal.length;o="<i>"+this.maskaVal+"</i>"+o.substring(n)}return o}},watch:{type:function(){this.fieldType=this.type}},created:function(){this.initialType=this.type,this.fieldType=this.type},mounted(){this.computedId=this.id?this.id:"cb-input-"+Math.random().toString(36).slice(4)},methods:{onBlur:function(o){this.isActive=!1,this.$emit("blur",o.target.value),this.showCheck&&(this.shouldShowCheck=!0)},onFocus:function(o){this.isActive=!0,this.$emit("focus")},onKeyupEnter:function(o){this.isActive=!1,this.$emit("onKeyupEnter",o.target.value)}}},de={class:"pt-2"},ce=["for"],me=["textContent"],ue={key:0,class:"text-red"},he={key:1,textContent:" (optioneel)",class:"font-normal"},fe=["id","value","type","name","placeholder","required","optional","error","autocomplete","autofocus","inputmode","disabled","readonly","aria-describedby","aria-errormessage","pattern","aria-invalid","data-maska"],ye=["innerHTML"],ge={key:0,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-error-500"},pe={key:1,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-green"},ke=["id","textContent"],be=["id"],we=["textContent"];function Be(o,n,t,d,r,l){const c=e.resolveComponent("icon-alert"),m=e.resolveComponent("icon-check"),u=e.resolveDirective("maska");return e.openBlock(),e.createElementBlock("div",de,[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:o.computedId,class:e.normalizeClass(["max-w-full whitespace-nowrap text-sm font-bold",{active:o.isActive||t.modelValue,"text-blue-dark":t.disabled,"text-blue":o.isActive,"text-blue-dark":!t.error&&!o.isActive,"text-blue-dark":t.error&&!o.isActive}])},[e.createElementVNode("span",{textContent:e.toDisplayString(t.label)},null,8,me),t.required?(e.openBlock(),e.createElementBlock("span",ue," * ")):e.createCommentVNode("",!0),t.optional?(e.openBlock(),e.createElementBlock("span",he)):e.createCommentVNode("",!0)],10,ce)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["relative mt-1 rounded-sm",[l.outlineClass,o.isActive||t.error?"border-2":"border",t.disabled&&t.modelValue||t.readonly?"bg-blue-dark-100":""]])},[e.withDirectives(e.createElementVNode("input",{id:o.computedId,value:t.modelValue,type:o.fieldType,name:t.name,placeholder:t.placeholder,required:t.required,optional:t.optional,error:t.error,autocomplete:t.autocomplete,autofocus:t.autofocus,inputmode:t.inputmode,disabled:t.disabled,readonly:t.readonly,"aria-describedby":t.hint?o.computedId+"-hint":null,"aria-errormessage":t.error?o.computedId+"-errormsg":null,pattern:t.pattern,"aria-invalid":t.error.toString(),"data-maska":o.maskaPattern,class:"block h-12 w-full appearance-none border-0 bg-transparent pl-3 pr-8 focus:outline-none",onInput:n[0]||(n[0]=a=>o.$emit("update:modelValue",a.target.value)),onBlur:n[1]||(n[1]=(...a)=>l.onBlur&&l.onBlur(...a)),onFocus:n[2]||(n[2]=(...a)=>l.onFocus&&l.onFocus(...a)),onKeyup:n[3]||(n[3]=e.withKeys((...a)=>l.onKeyupEnter&&l.onKeyupEnter(...a),["enter"]))},null,40,fe),[[u]]),e.createElementVNode("div",{class:"maska absolute left-1 top-0 my-1 px-2 leading-10 text-transparent opacity-0","aria-hidden":"true",innerHTML:l.maskaValue},null,8,ye),t.error?(e.openBlock(),e.createElementBlock("div",ge,[e.createVNode(c,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0),!t.error&&t.modelValue&&o.shouldShowCheck?(e.openBlock(),e.createElementBlock("div",pe,[e.createVNode(m,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0)],2),t.hint&&!t.error?(e.openBlock(),e.createElementBlock("div",{key:1,id:o.computedId+"-hint",class:e.normalizeClass(["w-full pt-1 text-xs leading-4",{"text-grey-500":t.disabled}]),textContent:e.toDisplayString(t.hint)},null,10,ke)):e.createCommentVNode("",!0),t.error&&t.errormessage?(e.openBlock(),e.createElementBlock("div",{key:2,id:o.computedId+"-errormsg",class:"w-full pt-1 text-sm font-bold leading-4 text-error-500","aria-live":"assertive"},[e.createElementVNode("span",{textContent:e.toDisplayString(t.errormessage)},null,8,we)],8,be)):e.createCommentVNode("",!0)])}const Ce=y(se,[["render",Be],["__scopeId","data-v-6050fb6d"]]);i.AmountInput=ie,i.IbanInput=Ce,i.InputField=G,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(i,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("maska")):typeof define=="function"&&define.amd?define(["exports","vue","maska"],e):(i=typeof globalThis<"u"?globalThis:i||self,e(i.mosstandardcomponents={},i.Vue,i.maska))})(this,function(i,e,g){"use strict";const p={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1008 1008"};function k(o,n){return e.openBlock(),e.createElementBlock("svg",p,[...n[0]||(n[0]=[e.createElementVNode("path",{fill:"currentColor",d:"M1008 540c0 14-4 27-11 39-103 170-293 285-493 285S114 749 11 579c-7-12-11-25-11-39s4-27 11-39c103-170 293-285 493-285s390 115 493 285c7 12 11 25 11 39zM531 324c0-15-12-27-27-27-94 0-171 77-171 171 0 15 12 27 27 27s27-12 27-27c0-64 53-117 117-117 15 0 27-12 27-27zm405 216c-53-83-127-154-214-199 22 39 34 83 34 127 0 139-113 252-252 252S252 607 252 468c0-44 12-88 34-127-87 45-161 116-214 199 96 148 251 252 432 252s336-104 432-252z"},null,-1)])])}const b={render:k},w={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1008 1008"};function B(o,n){return e.openBlock(),e.createElementBlock("svg",w,[...n[0]||(n[0]=[e.createElementVNode("path",{fill:"currentColor",d:"M1008 540c0 15-4 27-11 39-18 29-40 56-62 81-110 127-262 204-431 204l42-74c163-14 302-114 390-250-42-65-95-121-159-165l36-63c70 46 140 117 184 189 7 12 11 24 11 39zm-252-72c0 105-65 198-162 235l158-282c2 15 4 31 4 47zm-21-251v5C616 434 497 646 380 859l-28 50c-3 6-9 9-16 9-10 0-63-33-75-39-6-4-9-9-9-16 0-9 19-40 25-49C168 764 76 680 11 579c-7-11-11-25-11-39 0-13 4-28 11-39 112-171 285-285 493-285 34 0 68 3 101 10l31-55c3-6 9-9 15-9 11 0 63 33 75 39 6 4 9 9 9 16zM531 324c0-15-12-27-27-27-94 0-171 77-171 171 0 15 12 27 27 27s27-12 27-27c0-65 53-117 117-117 15 0 27-12 27-27zM312 751l44-79c-65-48-104-124-104-204 0-44 12-88 34-127-87 45-161 116-214 199 58 91 141 166 240 211z"},null,-1)])])}const C={render:B},V={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1039 1008"};function _(o,n){return e.openBlock(),e.createElementBlock("svg",V,[...n[0]||(n[0]=[e.createElementVNode("path",{fill:"currentColor",d:"M908 989H131q-32 0-62.5-17T19 926.5 0 863t19-68l388-670q42-62 113-62t112 62l389 670q18 28 18 64 0 75-68 113-31 17-63 17zM576 157q-19-38-55.5-38T463 150L69 826q-20 30 0 69 21 32 56 32h777q35 0 55.5-30.5t.5-70.5zm-13 501.5Q544 676 517.5 676T474 659t-17-45V351q0-29 17-46t45.5-17 45.5 17 17 46v263q0 27-19 44.5zm-97.5 174q-8.5-14.5-8.5-36t18.5-39.5 37.5-18 31 5 20 13q18 18 18 44t-18 44.5-39.5 18.5-36-8.5-23-23z"},null,-1)])])}const h={render:_},S={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1008 1008"};function E(o,n){return e.openBlock(),e.createElementBlock("svg",S,[...n[0]||(n[0]=[e.createElementVNode("path",{fill:"currentColor",d:"M940 318c0 14-6 28-16 39L517 764l-77 76c-10 10-24 16-38 16s-28-6-38-16l-77-76L84 560c-10-10-16-24-16-38s6-28 16-38l76-77c10-10 25-16 39-16s28 6 38 16l165 166 369-369c10-11 24-16 38-16s29 6 39 16l76 76c10 10 16 24 16 38z"},null,-1)])])}const f={render:E},y=(o,n)=>{const t=o.__vccOpts||o;for(const[d,r]of n)t[d]=r;return t},x={name:"InputField",components:{IconEyeSlash:C,IconPrivacy:b,IconAlert:h,IconCheck:f},props:{modelValue:String,label:String,name:String,placeholder:{type:String,default:" "},required:{type:Boolean,default:!1},optional:{type:Boolean,default:!1},disabled:Boolean,error:{type:Boolean,default:!1},pattern:{type:String,default:null},hidepasswordicon:{type:Boolean,default:!1},autocomplete:{type:String,default:"on"},inputmode:String,autofocus:Boolean,readonly:Boolean,minlength:String,maxlength:String,type:{type:String,default:"text"},id:{type:String,default:null},hint:String,errormessage:{type:String,default:""},borderClass:{type:String,default:null},showCheck:{type:Boolean,default:!1},inputClass:{type:String,default:null}},emits:["update:modelValue","focus","blur","showpassword","onKeyupEnter"],data:function(){return{initialType:"",fieldType:"text",isActive:!1,hasError:!1,showPassword:!1,shouldShowCheck:!1,computedId:null}},computed:{outlineClass:function(){return this.isActive?"border-blue":this.error?"border-error-500":!this.disabled&&this.modelValue?"border-blue-dark-900":this.disabled&&this.modelValue||this.readonly?"border-none":"border-blue-dark-200"}},watch:{type:function(){this.fieldType=this.type}},mounted:function(){this.computedId=this.id?this.id:"cb-input-"+Math.random().toString(36).slice(4),this.checkAutofill(),setTimeout(this.checkAutofill,1e3)},created:function(){this.initialType=this.type,this.fieldType=this.type},methods:{togglePassword:function(){this.showPassword=!this.showPassword,this.fieldType=this.showPassword?"text":"password",this.$emit("showpassword",this.showPassword)},onBlur:function(o){this.isActive=!1,this.$emit("blur",o.target.value),this.showCheck&&(this.shouldShowCheck=!0)},onFocus:function(o){this.isActive=!0,this.$emit("focus")},onKeyupEnter:function(o){this.isActive=!1,this.$emit("onKeyupEnter",o.target.value)},checkAutofill:function(){const o=this.$refs.input;o&&o.value&&this.$emit("update:modelValue",o.value)}}},N={class:"pt-2"},I=["for"],A=["textContent"],q={key:0,class:"text-red"},T={key:1,textContent:" (optioneel)",class:"font-normal"},z=["id","value","type","name","placeholder","required","optional","error","minlength","maxlength","autocomplete","autofocus","inputmode","disabled","readonly","aria-describedby","aria-errormessage","pattern","aria-invalid"],F=["aria-pressed","aria-label"],K={class:"sr-only"},P={key:1,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-error-500"},M={key:2,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-green"},D=["id","textContent"],L=["id"],H=["textContent"],j=["textContent"];function O(o,n,t,d,r,l){const c=e.resolveComponent("icon-privacy"),m=e.resolveComponent("icon-eye-slash"),u=e.resolveComponent("icon-alert"),a=e.resolveComponent("icon-check");return e.openBlock(),e.createElementBlock("div",N,[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:o.computedId,class:e.normalizeClass(["max-w-full whitespace-nowrap text-sm font-bold",{active:o.isActive||t.modelValue,"text-blue-dark":t.disabled,"text-blue":o.isActive,"text-blue-dark":!t.error&&!o.isActive,"text-blue-dark":t.error&&!o.isActive}])},[e.createElementVNode("span",{textContent:e.toDisplayString(t.label)},null,8,A),t.required?(e.openBlock(),e.createElementBlock("span",q," * ")):e.createCommentVNode("",!0),t.optional?(e.openBlock(),e.createElementBlock("span",T)):e.createCommentVNode("",!0)],10,I)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["relative mt-1 rounded-sm",[l.outlineClass,o.isActive||t.error?"border-2":"border",t.disabled&&t.modelValue||t.readonly?"bg-blue-dark-100":""]])},[e.createElementVNode("input",{id:o.computedId,ref:"input",value:t.modelValue,type:o.fieldType,name:t.name,placeholder:t.placeholder,required:t.required,optional:t.optional,error:t.error,minlength:t.minlength,maxlength:t.maxlength,autocomplete:t.autocomplete,autofocus:t.autofocus,inputmode:t.inputmode,disabled:t.disabled,readonly:t.readonly,"aria-describedby":t.hint?o.computedId+"-hint":null,"aria-errormessage":t.error?o.computedId+"-errormsg":null,pattern:t.pattern,"aria-invalid":t.error.toString(),class:"block h-12 w-full appearance-none border-0 bg-transparent pl-4 pr-8 focus:outline-none","data-clarity-mask":"true",onInput:n[0]||(n[0]=s=>o.$emit("update:modelValue",s.target.value)),onBlur:n[1]||(n[1]=(...s)=>l.onBlur&&l.onBlur(...s)),onFocus:n[2]||(n[2]=(...s)=>l.onFocus&&l.onFocus(...s)),onKeyup:n[3]||(n[3]=e.withKeys((...s)=>l.onKeyupEnter&&l.onKeyupEnter(...s),["enter"]))},null,40,z),o.initialType==="password"&&!t.hidepasswordicon&&!t.disabled?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["absolute right-0 top-0",{"right-8":t.error}])},[e.createElementVNode("button",{type:"button",class:"m-1 px-2 py-3 focus-visible:outline-blue-dark","aria-pressed":o.showPassword,"aria-label":o.showPassword?"Verberg wachtwoord":"Toon wachtwoord",onClick:n[4]||(n[4]=(...s)=>l.togglePassword&&l.togglePassword(...s))},[o.showPassword?(e.openBlock(),e.createBlock(c,{key:0,class:"h-4 w-4","aria-hidden":"true"})):(e.openBlock(),e.createBlock(m,{key:1,class:"h-4 w-4","aria-hidden":"true"})),e.createElementVNode("span",K,e.toDisplayString(o.showPassword?"verberg":"toon")+" wachtwoord",1)],8,F)],2)):e.createCommentVNode("",!0),t.error?(e.openBlock(),e.createElementBlock("div",P,[e.createVNode(u,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0),!t.error&&t.modelValue&&o.shouldShowCheck?(e.openBlock(),e.createElementBlock("div",M,[e.createVNode(a,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0)],2),t.hint&&!t.error?(e.openBlock(),e.createElementBlock("div",{key:1,id:o.computedId+"-hint",class:e.normalizeClass(["w-full pt-1 text-xs leading-4",{"text-grey-500":t.disabled}]),textContent:e.toDisplayString(t.hint)},null,10,D)):e.createCommentVNode("",!0),t.error&&t.errormessage?(e.openBlock(),e.createElementBlock("div",{key:2,id:o.computedId+"-errormsg",class:"w-full pt-1 text-sm font-bold leading-4 text-error-500","aria-live":"assertive"},[e.createElementVNode("span",{textContent:e.toDisplayString(t.errormessage)},null,8,H)],8,L)):e.createCommentVNode("",!0),o.initialType==="password"?(e.openBlock(),e.createElementBlock("p",{key:3,class:"sr-only","aria-live":"polite",textContent:e.toDisplayString(o.showPassword?"wachtwoord wordt getoond":"wachtwoord is verborgen")},null,8,j)):e.createCommentVNode("",!0)])}const G=y(x,[["render",O],["__scopeId","data-v-5a4e94c9"]]),Q={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1010 1008"};function J(o,n){return e.openBlock(),e.createElementBlock("svg",Q,[...n[0]||(n[0]=[e.createElementVNode("path",{d:"M503 100q113 0 209 55.5T863.5 307 919 516t-55.5 208.5T712 876t-209 56-208.5-56T143 724.5 87 516t56-209 151.5-151.5T503 100zm-25 255q29-12 58.5-12t59.5 7l22-83q-36-9-78-9-79 0-149.5 53.5T299 440h-49v55h39q-1 9-1 20t2 24h-40v54h49q22 84 87.5 135T542 779q43 0 73-9l11-4-17-84q-30 11-72 11t-80.5-27-55.5-73h147l10-54H385q-4-25-1-44h184l10-54H397q23-62 81-86z",fill:"currentColor"},null,-1)])])}const R={render:J},U={name:"AmountInput",components:{IconAlert:h,IconCheck:f,VectorImage,IconEuro:R},props:{modelValue:Number,label:String,name:String,placeholder:{type:String,default:""},required:Boolean,optional:Boolean,disabled:Boolean,error:Boolean,pattern:{type:String,default:"[1-9]?"},autocomplete:{type:String,default:"on"},inputmode:String,autofocus:Boolean,readonly:Boolean,min:String,max:String,id:{type:String,default:null},hint:String,errormessage:String,borderClass:String,showCheck:Boolean,symbol:String},emits:["update:modelValue","input","focus","blur","onKeyupEnter"],data(){return{isActive:!1,shouldShowCheck:!1,displayValue:"",computedId:null,isTyping:!1}},watch:{modelValue:{immediate:!0,handler(o){this.isTyping||(this.displayValue=this.formatCurrency(o))}}},computed:{outlineClass(){return this.isActive?"border-blue":this.error?"border-error-500":!this.disabled&&this.modelValue?"border-blue-dark-900":this.disabled&&this.modelValue||this.readonly?"border-none":"border-blue-dark-200"}},mounted(){this.computedId=this.id??"cb-input-"+Math.random().toString(36).slice(4)},methods:{onInput(o){this.isTyping=!0;const n=o.target.value,t=n.replace(/[^\d.,]/g,"").replace(",","."),d=parseFloat(t);isNaN(d)||(this.$emit("update:modelValue",d),this.$emit("input",d)),this.displayValue=n},onBlur(){this.isTyping=!1,this.applyFormatting(),this.isActive=!1,this.$emit("blur",this.modelValue)},onKeyupEnter(){this.isTyping=!1,this.applyFormatting(),this.isActive=!1,this.$emit("onKeyupEnter",this.modelValue)},applyFormatting(){const o=this.displayValue.replace(/[^\d.,]/g,"").replace(",","."),n=parseFloat(o);if(!isNaN(n)){const t=this.formatCurrency(n);this.displayValue=t,this.$emit("update:modelValue",n),this.$emit("input",n)}},formatCurrency(o){return o==null||o===""?"":new Intl.NumberFormat("nl-NL",{minimumFractionDigits:2,maximumFractionDigits:2}).format(o)},onFocus(){this.isActive=!0,this.$emit("focus")}}},W={class:"pt-2"},X=["for"],Y=["textContent"],Z={key:0,class:"text-red"},v={key:1,class:"font-normal",textContent:" (optioneel)"},$=["id","value","name","placeholder","required","optional","error","min","max","autocomplete","autofocus","inputmode","disabled","readonly","aria-describedby","aria-errormessage","pattern","aria-invalid"],ee={class:"absolute bottom-0 top-0 my-auto ml-2"},te={key:0,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-error-500"},oe={key:1,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-green"},ne=["id","textContent"],le=["id"],re=["textContent"];function ae(o,n,t,d,r,l){const c=e.resolveComponent("icon-euro"),m=e.resolveComponent("icon-alert"),u=e.resolveComponent("icon-check");return e.openBlock(),e.createElementBlock("div",W,[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:r.computedId,class:e.normalizeClass(["max-w-full whitespace-nowrap text-sm font-bold",{active:r.isActive||t.modelValue,"text-blue-dark":t.disabled,"text-blue":r.isActive,"text-blue-dark":!t.error&&!r.isActive,"text-blue-dark":t.error&&!r.isActive}])},[e.createElementVNode("span",{textContent:e.toDisplayString(t.label)},null,8,Y),t.required?(e.openBlock(),e.createElementBlock("span",Z," * ")):e.createCommentVNode("",!0),t.optional?(e.openBlock(),e.createElementBlock("span",v)):e.createCommentVNode("",!0)],10,X)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["relative mt-1 rounded-sm",[l.outlineClass,r.isActive||t.error?"border-2":"border",t.disabled&&t.modelValue||t.readonly?"bg-blue-dark-100":""]])},[e.createElementVNode("input",{id:r.computedId,value:r.displayValue,type:"text",name:t.name,placeholder:t.placeholder,required:t.required,optional:t.optional,error:t.error,min:t.min,max:t.max,autocomplete:t.autocomplete,autofocus:t.autofocus,inputmode:t.inputmode,disabled:t.disabled,readonly:t.readonly,"aria-describedby":t.hint?r.computedId+"-hint":!1,"aria-errormessage":t.error?r.computedId+"-errormsg":!1,pattern:t.pattern,"aria-invalid":t.error.toString(),class:"block h-12 w-full appearance-none border-0 bg-transparent pl-10 pr-8 focus:outline-none",onInput:n[0]||(n[0]=(...a)=>l.onInput&&l.onInput(...a)),onBlur:n[1]||(n[1]=(...a)=>l.onBlur&&l.onBlur(...a)),onFocus:n[2]||(n[2]=(...a)=>l.onFocus&&l.onFocus(...a)),onKeyup:n[3]||(n[3]=e.withKeys((...a)=>l.onKeyupEnter&&l.onKeyupEnter(...a),["enter"]))},null,40,$),e.createElementVNode("div",ee,[e.createVNode(c,{class:"inline h-6 w-6 text-blue-dark"})]),t.error?(e.openBlock(),e.createElementBlock("div",te,[e.createVNode(m,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0),!t.error&&t.modelValue&&r.shouldShowCheck?(e.openBlock(),e.createElementBlock("div",oe,[e.createVNode(u,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0)],2),t.hint&&!t.error?(e.openBlock(),e.createElementBlock("div",{key:1,id:r.computedId+"-hint",class:e.normalizeClass(["w-full pt-1 text-xs leading-4",{"text-grey-500":t.disabled}]),textContent:e.toDisplayString(t.hint)},null,10,ne)):e.createCommentVNode("",!0),t.error&&t.errormessage?(e.openBlock(),e.createElementBlock("div",{key:2,id:r.computedId+"-errormsg",class:"w-full pt-1 text-sm font-bold leading-4 text-error-500","aria-live":"assertive"},[e.createElementVNode("span",{textContent:e.toDisplayString(t.errormessage)},null,8,re)],8,le)):e.createCommentVNode("",!0)])}const ie=y(U,[["render",ae],["__scopeId","data-v-6897d101"]]),se={name:"IbanInput",components:{IconAlert:h,IconCheck:f},directives:{maska:g.vMaska},props:{modelValue:String,label:String,name:String,placeholder:{type:String,default:" "},required:{type:Boolean,default:!1},optional:{type:Boolean,default:!1},disabled:Boolean,error:{type:Boolean,default:!1},pattern:{type:String,default:null},autocomplete:{type:String,default:"on"},inputmode:String,autofocus:Boolean,readonly:Boolean,minlength:String,maxlength:String,type:{type:String,default:"text"},id:{type:String,default:null},hint:String,errormessage:{type:String,default:""},borderClass:{type:String,default:null},maskaVal:{type:String,default:""},showCheck:{type:Boolean,default:!1}},data:function(){return{initialType:"",fieldType:"text",isActive:!1,hasError:!1,shouldShowCheck:!1,maskaPattern:"@@## @@@@ #### #### ##",maskaPlaceholder:"NL20 INGB 0001 2345 67",computedId:null}},computed:{outlineClass:function(){return this.isActive?"border-blue":this.error?"border-error-500":!this.disabled&&this.modelValue?"border-blue-dark-900":this.disabled&&this.modelValue||this.readonly?"border-none":"border-blue-dark-200"},maskaValue:function(){let o=this.maskaPlaceholder;if(this.maskaVal){const n=this.maskaVal.length;o="<i>"+this.maskaVal+"</i>"+o.substring(n)}return o}},watch:{type:function(){this.fieldType=this.type}},created:function(){this.initialType=this.type,this.fieldType=this.type},mounted(){this.computedId=this.id?this.id:"cb-input-"+Math.random().toString(36).slice(4)},methods:{onBlur:function(o){this.isActive=!1,this.$emit("blur",o.target.value),this.showCheck&&(this.shouldShowCheck=!0)},onFocus:function(o){this.isActive=!0,this.$emit("focus")},onKeyupEnter:function(o){this.isActive=!1,this.$emit("onKeyupEnter",o.target.value)}}},de={class:"pt-2"},ce=["for"],me=["textContent"],ue={key:0,class:"text-red"},he={key:1,textContent:" (optioneel)",class:"font-normal"},fe=["id","value","type","name","placeholder","required","optional","error","autocomplete","autofocus","inputmode","disabled","readonly","aria-describedby","aria-errormessage","pattern","aria-invalid","data-maska"],ye=["innerHTML"],ge={key:0,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-error-500"},pe={key:1,class:"absolute right-0 top-0 py-3 pl-1 pr-2 text-green"},ke=["id","textContent"],be=["id"],we=["textContent"];function Be(o,n,t,d,r,l){const c=e.resolveComponent("icon-alert"),m=e.resolveComponent("icon-check"),u=e.resolveDirective("maska");return e.openBlock(),e.createElementBlock("div",de,[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:o.computedId,class:e.normalizeClass(["max-w-full whitespace-nowrap text-sm font-bold",{active:o.isActive||t.modelValue,"text-blue-dark":t.disabled,"text-blue":o.isActive,"text-blue-dark":!t.error&&!o.isActive,"text-blue-dark":t.error&&!o.isActive}])},[e.createElementVNode("span",{textContent:e.toDisplayString(t.label)},null,8,me),t.required?(e.openBlock(),e.createElementBlock("span",ue," * ")):e.createCommentVNode("",!0),t.optional?(e.openBlock(),e.createElementBlock("span",he)):e.createCommentVNode("",!0)],10,ce)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["relative mt-1 rounded-sm",[l.outlineClass,o.isActive||t.error?"border-2":"border",t.disabled&&t.modelValue||t.readonly?"bg-blue-dark-100":""]])},[e.withDirectives(e.createElementVNode("input",{id:o.computedId,value:t.modelValue,type:o.fieldType,name:t.name,placeholder:t.placeholder,required:t.required,optional:t.optional,error:t.error,autocomplete:t.autocomplete,autofocus:t.autofocus,inputmode:t.inputmode,disabled:t.disabled,readonly:t.readonly,"aria-describedby":t.hint?o.computedId+"-hint":null,"aria-errormessage":t.error?o.computedId+"-errormsg":null,pattern:t.pattern,"aria-invalid":t.error.toString(),"data-maska":o.maskaPattern,class:"block h-12 w-full appearance-none border-0 bg-transparent pl-3 pr-8 focus:outline-none",onInput:n[0]||(n[0]=a=>o.$emit("update:modelValue",a.target.value)),onBlur:n[1]||(n[1]=(...a)=>l.onBlur&&l.onBlur(...a)),onFocus:n[2]||(n[2]=(...a)=>l.onFocus&&l.onFocus(...a)),onKeyup:n[3]||(n[3]=e.withKeys((...a)=>l.onKeyupEnter&&l.onKeyupEnter(...a),["enter"]))},null,40,fe),[[u]]),e.createElementVNode("div",{class:"maska absolute left-1 top-0 my-1 px-2 leading-10 text-transparent opacity-0","aria-hidden":"true",innerHTML:l.maskaValue},null,8,ye),t.error?(e.openBlock(),e.createElementBlock("div",ge,[e.createVNode(c,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0),!t.error&&t.modelValue&&o.shouldShowCheck?(e.openBlock(),e.createElementBlock("div",pe,[e.createVNode(m,{class:"-mt-1 mr-1 inline h-5 w-5","aria-hidden":"true"})])):e.createCommentVNode("",!0)],2),t.hint&&!t.error?(e.openBlock(),e.createElementBlock("div",{key:1,id:o.computedId+"-hint",class:e.normalizeClass(["w-full pt-1 text-xs leading-4",{"text-grey-500":t.disabled}]),textContent:e.toDisplayString(t.hint)},null,10,ke)):e.createCommentVNode("",!0),t.error&&t.errormessage?(e.openBlock(),e.createElementBlock("div",{key:2,id:o.computedId+"-errormsg",class:"w-full pt-1 text-sm font-bold leading-4 text-error-500","aria-live":"assertive"},[e.createElementVNode("span",{textContent:e.toDisplayString(t.errormessage)},null,8,we)],8,be)):e.createCommentVNode("",!0)])}const Ce=y(se,[["render",Be],["__scopeId","data-v-6050fb6d"]]);i.AmountInput=ie,i.IbanInput=Ce,i.InputField=G,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})});
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
input[type=number][data-v-5a4e94c9]::-webkit-inner-spin-button,input[type=number][data-v-5a4e94c9]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=password][data-v-5a4e94c9]::-ms-reveal,input[type=password][data-v-5a4e94c9]::-ms-clear{display:none}input[type=number][data-v-5a4e94c9]{-moz-appearance:textfield}input[data-v-
|
|
1
|
+
input[type=number][data-v-5a4e94c9]::-webkit-inner-spin-button,input[type=number][data-v-5a4e94c9]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=password][data-v-5a4e94c9]::-ms-reveal,input[type=password][data-v-5a4e94c9]::-ms-clear{display:none}input[type=number][data-v-5a4e94c9]{-moz-appearance:textfield}input[data-v-6897d101]::-webkit-outer-spin-button,input[data-v-6897d101]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number][data-v-6897d101]{-moz-appearance:textfield}input[data-v-6050fb6d]{text-transform:uppercase}.maska[data-v-6050fb6d]{letter-spacing:0;font-variant-numeric:tabular-nums;pointer-events:none}input:not(:placeholder-shown)+label+.maska[data-v-6050fb6d],input:focus+label+.maska[data-v-6050fb6d]{opacity:1;color:#999}.maska[data-v-6050fb6d] i{color:transparent;opacity:0;text-transform:uppercase;font-style:unset}input[data-v-6050fb6d]::-webkit-outer-spin-button,input[data-v-6050fb6d]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number][data-v-6050fb6d]{-moz-appearance:textfield}
|