primevue
Version:
PrimeVue is an open source UI library for Vue featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBloc
2 lines (1 loc) • 9.5 kB
JavaScript
import e from"primevue/icons/eye";import t from"primevue/icons/eyeslash";import n from"primevue/inputtext";import i from"primevue/overlayeventbus";import l from"primevue/portal";import{ZIndexUtils as r,DomHandler as o,ConnectedOverlayScrollHandler as s,UniqueComponentId as a}from"primevue/utils";import u from"primevue/basecomponent";import c from"primevue/password/style";import{resolveComponent as p,openBlock as d,createElementBlock as h,mergeProps as f,createVNode as y,renderSlot as m,createBlock as v,resolveDynamicComponent as b,createCommentVNode as g,createElementVNode as k,toDisplayString as S,withCtx as x,Transition as w}from"vue";var L={name:"Password",extends:{name:"BasePassword",extends:u,props:{modelValue:String,promptLabel:{type:String,default:null},mediumRegex:{type:String,default:"^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})"},strongRegex:{type:String,default:"^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.{8,})"},weakLabel:{type:String,default:null},mediumLabel:{type:String,default:null},strongLabel:{type:String,default:null},feedback:{type:Boolean,default:!0},appendTo:{type:[String,Object],default:"body"},toggleMask:{type:Boolean,default:!1},hideIcon:{type:String,default:void 0},showIcon:{type:String,default:void 0},disabled:{type:Boolean,default:!1},placeholder:{type:String,default:null},required:{type:Boolean,default:!1},inputId:{type:String,default:null},inputClass:{type:[String,Object],default:null},inputStyle:{type:Object,default:null},inputProps:{type:null,default:null},panelId:{type:String,default:null},panelClass:{type:[String,Object],default:null},panelStyle:{type:Object,default:null},panelProps:{type:null,default:null},ariaLabelledby:{type:String,default:null},ariaLabel:{type:String,default:null}},style:c,provide:function(){return{$parentInstance:this}}},emits:["update:modelValue","change","focus","blur","invalid"],data:function(){return{overlayVisible:!1,meter:null,infoText:null,focused:!1,unmasked:!1}},mediumCheckRegExp:null,strongCheckRegExp:null,resizeListener:null,scrollHandler:null,overlay:null,mounted:function(){this.infoText=this.promptText,this.mediumCheckRegExp=new RegExp(this.mediumRegex),this.strongCheckRegExp=new RegExp(this.strongRegex)},beforeUnmount:function(){this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.overlay&&(r.clear(this.overlay),this.overlay=null)},methods:{onOverlayEnter:function(e){r.set("overlay",e,this.$primevue.config.zIndex.overlay),o.addStyles(e,{position:"absolute",top:"0",left:"0"}),this.alignOverlay(),this.bindScrollListener(),this.bindResizeListener()},onOverlayLeave:function(){this.unbindScrollListener(),this.unbindResizeListener(),this.overlay=null},onOverlayAfterLeave:function(e){r.clear(e)},alignOverlay:function(){"self"===this.appendTo?o.relativePosition(this.overlay,this.$refs.input.$el):(this.overlay.style.minWidth=o.getOuterWidth(this.$refs.input.$el)+"px",o.absolutePosition(this.overlay,this.$refs.input.$el))},testStrength:function(e){var t=0;return this.strongCheckRegExp.test(e)?t=3:this.mediumCheckRegExp.test(e)?t=2:e.length&&(t=1),t},onInput:function(e){this.$emit("update:modelValue",e.target.value),this.$emit("change",e)},onFocus:function(e){this.focused=!0,this.feedback&&(this.setPasswordMeter(this.modelValue),this.overlayVisible=!0),this.$emit("focus",e)},onBlur:function(e){this.focused=!1,this.feedback&&(this.overlayVisible=!1),this.$emit("blur",e)},onKeyUp:function(e){if(this.feedback){var t=this.checkPasswordStrength(e.target.value),n=t.label;if(this.meter=t.meter,this.infoText=n,"Escape"===e.code)return void(this.overlayVisible&&(this.overlayVisible=!1));this.overlayVisible||(this.overlayVisible=!0)}},setPasswordMeter:function(){if(this.modelValue){var e=this.checkPasswordStrength(this.modelValue),t=e.label;this.meter=e.meter,this.infoText=t,this.overlayVisible||(this.overlayVisible=!0)}},checkPasswordStrength:function(e){var t=null,n=null;switch(this.testStrength(e)){case 1:t=this.weakText,n={strength:"weak",width:"33.33%"};break;case 2:t=this.mediumText,n={strength:"medium",width:"66.66%"};break;case 3:t=this.strongText,n={strength:"strong",width:"100%"};break;default:t=this.promptText,n=null}return{label:t,meter:n}},onInvalid:function(e){this.$emit("invalid",e)},bindScrollListener:function(){var e=this;this.scrollHandler||(this.scrollHandler=new s(this.$refs.input.$el,(function(){e.overlayVisible&&(e.overlayVisible=!1)}))),this.scrollHandler.bindScrollListener()},unbindScrollListener:function(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},bindResizeListener:function(){var e=this;this.resizeListener||(this.resizeListener=function(){e.overlayVisible&&!o.isTouchDevice()&&(e.overlayVisible=!1)},window.addEventListener("resize",this.resizeListener))},unbindResizeListener:function(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},overlayRef:function(e){this.overlay=e},onMaskToggle:function(){this.unmasked=!this.unmasked},onOverlayClick:function(e){i.emit("overlay-click",{originalEvent:e,target:this.$el})}},computed:{inputType:function(){return this.unmasked?"text":"password"},filled:function(){return null!=this.modelValue&&this.modelValue.toString().length>0},weakText:function(){return this.weakLabel||this.$primevue.config.locale.weak},mediumText:function(){return this.mediumLabel||this.$primevue.config.locale.medium},strongText:function(){return this.strongLabel||this.$primevue.config.locale.strong},promptText:function(){return this.promptLabel||this.$primevue.config.locale.passwordPrompt},panelUniqueId:function(){return a()+"_panel"}},components:{PInputText:n,Portal:l,EyeSlashIcon:t,EyeIcon:e}};function O(e){return O="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},O(e)}function T(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,i)}return n}function I(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?T(Object(n),!0).forEach((function(t){P(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):T(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function P(e,t,n){var i;return(t="symbol"==O(i=$(t,"string"))?i:String(i))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function $(e,t){if("object"!=O(e)||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var i=n.call(e,t||"default");if("object"!=O(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}var V=["id"];L.render=function(e,t,n,i,l,r){var o=p("PInputText"),s=p("Portal");return d(),h("div",f({class:e.cx("root"),style:e.sx("root")},e.ptm("root"),{"data-pc-name":"password"}),[y(o,f({ref:"input",id:e.inputId,type:r.inputType,class:[e.cx("input"),e.inputClass],style:e.inputStyle,value:e.modelValue,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-controls":e.panelProps&&e.panelProps.id||e.panelId||r.panelUniqueId,"aria-expanded":l.overlayVisible,"aria-haspopup":!0,placeholder:e.placeholder,required:e.required,disabled:e.disabled,onInput:r.onInput,onFocus:r.onFocus,onBlur:r.onBlur,onKeyup:r.onKeyUp,onInvalid:r.onInvalid},e.inputProps,{pt:e.ptm("input"),unstyled:e.unstyled}),null,16,["id","type","class","style","value","aria-labelledby","aria-label","aria-controls","aria-expanded","placeholder","required","disabled","onInput","onFocus","onBlur","onKeyup","onInvalid","pt","unstyled"]),e.toggleMask&&l.unmasked?m(e.$slots,"hideicon",{key:0,onClick:r.onMaskToggle,toggleCallback:r.onMaskToggle},(function(){return[(d(),v(b(e.hideIcon?"i":"EyeSlashIcon"),f({class:e.hideIcon,onClick:r.onMaskToggle},e.ptm("hideIcon")),null,16,["class","onClick"]))]})):g("",!0),e.toggleMask&&!l.unmasked?m(e.$slots,"showicon",{key:1,onClick:r.onMaskToggle,toggleCallback:r.onMaskToggle},(function(){return[(d(),v(b(e.showIcon?"i":"EyeIcon"),f({class:e.showIcon,onClick:r.onMaskToggle},e.ptm("showIcon")),null,16,["class","onClick"]))]})):g("",!0),k("span",f({class:"p-hidden-accessible","aria-live":"polite"},e.ptm("hiddenAccesible"),{"data-p-hidden-accessible":!0}),S(l.infoText),17),y(s,{appendTo:e.appendTo},{default:x((function(){return[y(w,f({name:"p-connected-overlay",onEnter:r.onOverlayEnter,onLeave:r.onOverlayLeave,onAfterLeave:r.onOverlayAfterLeave},e.ptm("transition")),{default:x((function(){return[l.overlayVisible?(d(),h("div",f({key:0,ref:r.overlayRef,id:e.panelId||r.panelUniqueId,class:[e.cx("panel"),e.panelClass],style:e.panelStyle,onClick:t[0]||(t[0]=function(){return r.onOverlayClick&&r.onOverlayClick.apply(r,arguments)})},I(I({},e.panelProps),e.ptm("panel"))),[m(e.$slots,"header"),m(e.$slots,"content",{},(function(){return[k("div",f({class:e.cx("meter")},e.ptm("meter")),[k("div",f({class:e.cx("meterLabel"),style:{width:l.meter?l.meter.width:""}},e.ptm("meterLabel")),null,16)],16),k("div",f({class:e.cx("info")},e.ptm("info")),S(l.infoText),17)]})),m(e.$slots,"footer")],16,V)):g("",!0)]})),_:3},16,["onEnter","onLeave","onAfterLeave"])]})),_:3},8,["appendTo"])],16)};export{L as default};