primereact 10.5.1 → 10.5.2

package/password/password.cjs.js

@@ -213,6 +213,7 @@ var PasswordBase = componentbase.ComponentBase.extend({
     className: null,
     inputStyle: null,
     inputClassName: null,
+    invalid: false,
     panelStyle: null,
     panelClassName: null,
     transitionOptions: null,
@@ -329,6 +330,43 @@ var Password = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
       }
     }
   };
+  var updateFeedback = function updateFeedback(value) {
+    if (!props.feedback) {
+      return false;
+    }
+    var label = null;
+    var meter = null;
+    switch (testStrength(value)) {
+      case 1:
+        label = weakLabel;
+        meter = {
+          strength: 'weak',
+          width: '33.33%'
+        };
+        break;
+      case 2:
+        label = mediumLabel;
+        meter = {
+          strength: 'medium',
+          width: '66.66%'
+        };
+        break;
+      case 3:
+        label = strongLabel;
+        meter = {
+          strength: 'strong',
+          width: '100%'
+        };
+        break;
+      default:
+        label = promptLabel;
+        meter = null;
+        break;
+    }
+    setMeterState(meter);
+    setInfoTextState(label);
+    return true;
+  };
   var onPanelClick = function onPanelClick(event) {
     if (props.feedback) {
       overlayservice.OverlayService.emit('overlay-click', {
@@ -391,38 +429,6 @@ var Password = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
   var onKeyup = function onKeyup(e) {
     var keyCode = e.code;
     if (props.feedback) {
-      var value = e.target.value;
-      var label = null;
-      var meter = null;
-      switch (testStrength(value)) {
-        case 1:
-          label = weakLabel;
-          meter = {
-            strength: 'weak',
-            width: '33.33%'
-          };
-          break;
-        case 2:
-          label = mediumLabel;
-          meter = {
-            strength: 'medium',
-            width: '66.66%'
-          };
-          break;
-        case 3:
-          label = strongLabel;
-          meter = {
-            strength: 'strong',
-            width: '100%'
-          };
-          break;
-        default:
-          label = promptLabel;
-          meter = null;
-          break;
-      }
-      setMeterState(meter);
-      setInfoTextState(label);
       if (!!keyCode && keyCode !== 'Escape' && !overlayVisibleState) {
         show();
       }
@@ -438,7 +444,16 @@ var Password = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
     }
   };
   var testStrength = function testStrength(str) {
-    if (strongCheckRegExp.current.test(str)) return 3;else if (mediumCheckRegExp.current.test(str)) return 2;else if (str.length) return 1;
+    if (!str || str.length === 0) {
+      return 0;
+    }
+    if (strongCheckRegExp.current.test(str)) {
+      return 3;
+    } else if (mediumCheckRegExp.current.test(str)) {
+      return 2;
+    } else if (str.length > 0) {
+      return 1;
+    }
     return 0;
   };
   React__namespace.useImperativeHandle(ref, function () {
@@ -473,27 +488,42 @@ var Password = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
       utils.DomHandler.removeClass(elementRef.current, 'p-inputwrapper-filled');
     }
   }, [isFilled]);
+  hooks.useUpdateEffect(function () {
+    updateFeedback(props.value);
+  }, [props.value]);
   hooks.useMountEffect(function () {
     alignOverlay();
   });
   hooks.useUnmountEffect(function () {
     utils.ZIndexUtils.clear(overlayRef.current);
   });
+  var onToggleMaskKeyDown = function onToggleMaskKeyDown(event) {
+    if (event.key === 'Enter' || event.code === 'Space') {
+      toggleMask();
+      event.preventDefault();
+    }
+  };
   var createIcon = function createIcon() {
     var icon;
     var hideIconProps = mergeProps({
       key: 'hideIcon',
-      role: 'button',
-      tabIndex: props.tabIndex,
+      role: 'switch',
+      tabIndex: props.tabIndex || '0',
       className: cx('hideIcon'),
-      onClick: toggleMask
+      onClick: toggleMask,
+      onKeyDown: onToggleMaskKeyDown,
+      'aria-label': PrimeReact.ariaLabel('passwordHide') || 'Hide Password',
+      'aria-checked': 'false'
     }, ptm('hideIcon'));
     var showIconProps = mergeProps({
       key: 'showIcon',
-      role: 'button',
-      tabIndex: props.tabIndex,
+      role: 'switch',
+      tabIndex: props.tabIndex || '0',
       className: cx('showIcon'),
-      onClick: toggleMask
+      onClick: toggleMask,
+      onKeyDown: onToggleMaskKeyDown,
+      'aria-label': PrimeReact.ariaLabel('passwordShow') || 'Show Password',
+      'aria-checked': 'true'
     }, ptm('showIcon'));
     if (unmaskedState) {
       icon = props.hideIcon || /*#__PURE__*/React__namespace.createElement(eyeslash.EyeSlashIcon, hideIconProps);
@@ -601,6 +631,7 @@ var Password = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace
     onFocus: onFocus,
     onInput: onInput,
     onKeyUp: onKeyup,
+    invalid: props.invalid,
     style: props.inputStyle,
     tabIndex: props.tabIndex,
     tooltip: props.tooltip,

package/password/password.cjs.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/api"),n=require("primereact/componentbase"),r=require("primereact/csstransition"),o=require("primereact/hooks"),a=require("primereact/icons/eye"),l=require("primereact/icons/eyeslash"),i=require("primereact/inputtext"),s=require("primereact/overlayservice"),u=require("primereact/portal"),c=require("primereact/utils");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function f(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var d=f(e),m=p(t);function y(){return y=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},y.apply(this,arguments)}function b(e){return b="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},b(e)}function g(e,t){if("object"!==b(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!==b(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function w(e){var t=g(e,"string");return"symbol"===b(t)?t:String(t)}function h(e){if(Array.isArray(e))return e}function v(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a,l,i=[],s=!0,u=!1;try{if(a=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;s=!1}else for(;!(s=(r=a.call(n)).done)&&(i.push(r.value),i.length!==t);s=!0);}catch(e){u=!0,o=e}finally{try{if(!s&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(u)throw o}}return i}}function O(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function E(e,t){if(e){if("string"==typeof e)return O(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?O(e,t):void 0}}function x(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function I(e,t){return h(e)||v(e,t)||E(e,t)||x()}var S=n.ComponentBase.extend({defaultProps:{__TYPE:"Password",id:null,inputId:null,inputRef:null,promptLabel:null,weakLabel:null,mediumLabel:null,strongLabel:null,mediumRegex:"^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})",strongRegex:"^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.{8,})",feedback:!0,toggleMask:!1,appendTo:null,header:null,content:null,footer:null,showIcon:null,hideIcon:null,icon:null,tooltip:null,tooltipOptions:null,style:null,className:null,inputStyle:null,inputClassName:null,panelStyle:null,panelClassName:null,transitionOptions:null,tabIndex:null,value:void 0,onInput:null,onShow:null,onHide:null,children:void 0},css:{classes:{root:function(e){var t=e.props;return c.classNames("p-password p-component p-inputwrapper",{"p-inputwrapper-filled":e.isFilled,"p-inputwrapper-focus":e.focusedState,"p-input-icon-right":t.toggleMask},t.className)},input:function(e){return c.classNames("p-password-input",e.props.inputClassName)},panel:function(e){var t=e.context;return c.classNames("p-password-panel p-component",e.props.panelClassName,{"p-input-filled":t&&"filled"===t.inputStyle||"filled"===m.default.inputStyle,"p-ripple-disabled":t&&!1===t.ripple||!1===m.default.ripple})},meter:"p-password-meter",meterLabel:function(e){return c.classNames("p-password-strength",e.strength)},info:function(e){return c.classNames("p-password-info",e.strength)},showIcon:"p-password-show-icon",hideIcon:"p-password-hide-icon",transition:"p-connected-overlay"},styles:"\n@layer primereact {\n    .p-password {\n        position: relative;\n        display: inline-flex;\n    }\n    \n    .p-password-panel {\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n    \n    .p-password .p-password-panel {\n        min-width: 100%;\n    }\n    \n    .p-password-meter {\n        height: 10px;\n    }\n    \n    .p-password-strength {\n        height: 100%;\n        width: 0%;\n        transition: width 1s ease-in-out;\n    }\n    \n    .p-fluid .p-password {\n        display: flex;\n    }\n    \n    .p-password-input::-ms-reveal,\n    .p-password-input::-ms-clear {\n        display: none;\n    }\n\n    .p-password .p-password-show-icon,\n    .p-password .p-password-hide-icon {\n        line-height: 1.5;\n        cursor: pointer;\n    }\n}\n"}});function j(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function k(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?j(Object(n),!0).forEach((function(t){var r,o,a;r=e,a=n[t],(o=w(o=t))in r?Object.defineProperty(r,o,{value:a,enumerable:!0,configurable:!0,writable:!0}):r[o]=a})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):j(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var N=d.memo(d.forwardRef((function(e,p){var f=o.useMergeProps(),b=d.useContext(t.PrimeReactContext),g=S.getProps(e,b),w=g.promptLabel||t.localeOption("passwordPrompt"),h=g.weakLabel||t.localeOption("weak"),v=g.mediumLabel||t.localeOption("medium"),O=g.strongLabel||t.localeOption("strong"),E=I(d.useState(!1),2),x=E[0],j=E[1],N=I(d.useState(null),2),P=N[0],R=N[1],C=I(d.useState(w),2),U=C[0],D=C[1],H=I(d.useState(!1),2),L=H[0],M=H[1],T=I(d.useState(!1),2),q=T[0],A=T[1],_=d.useRef(null),Z=d.useRef(null),z=d.useRef(g.inputRef),F=d.useRef(new RegExp(g.mediumRegex)),J=d.useRef(new RegExp(g.strongRegex)),K=q?"text":"password",X={props:g,state:{overlayVisible:x,meter:P,infoText:U,focused:L,unmasked:q}},B=S.setMetaData(X),V=B.ptm,G=B.cx;n.useHandleStyle(S.css.styles,B.isUnstyled,{name:"password"});var Y=o.useDisplayOrder("password",x);o.useGlobalOnEscapeKey({callback:function(){le()},when:x&&g.feedback&&Y,priority:[o.ESC_KEY_HANDLING_PRIORITIES.PASSWORD,Y]});var W=I(o.useOverlayListener({target:_,overlay:Z,listener:function(e,t){t.valid&&le()},when:x}),2),$=W[0],Q=W[1],ee=z.current&&z.current.value,te=d.useMemo((function(){return c.ObjectUtils.isNotEmpty(g.value)||c.ObjectUtils.isNotEmpty(g.defaultValue)||c.ObjectUtils.isNotEmpty(ee)}),[g.value,g.defaultValue,ee]),ne=function(){if(P){var e=null;switch(P.strength){case"weak":e=h;break;case"medium":e=v;break;case"strong":e=O}e&&U!==e&&D(e)}else U!==w&&D(w)},re=function(e){g.feedback&&s.OverlayService.emit("overlay-click",{originalEvent:e,target:_.current})},oe=function(){A((function(e){return!e}))},ae=function(){ne(),j(!0)},le=function(){j(!1)},ie=function(){z.current&&c.DomHandler.alignOverlay(Z.current,z.current.parentElement,g.appendTo||b&&b.appendTo||m.default.appendTo)},se=function(){c.ZIndexUtils.set("overlay",Z.current,b&&b.autoZIndex||m.default.autoZIndex,b&&b.zIndex.overlay||m.default.zIndex.overlay),c.DomHandler.addStyles(Z.current,{position:"absolute",top:"0",left:"0"}),ie()},ue=function(){$(),g.onShow&&g.onShow()},ce=function(){Q()},pe=function(){c.ZIndexUtils.clear(Z.current),g.onHide&&g.onHide()},fe=function(e){return J.current.test(e)?3:F.current.test(e)?2:e.length?1:0};d.useImperativeHandle(p,(function(){return{props:g,toggleMask:oe,focus:function(){return c.DomHandler.focus(z.current)},getElement:function(){return _.current},getOverlay:function(){return Z.current},getInput:function(){return z.current}}})),d.useEffect((function(){c.ObjectUtils.combinedRefs(z,g.inputRef)}),[z,g.inputRef]),d.useEffect((function(){F.current=new RegExp(g.mediumRegex)}),[g.mediumRegex]),d.useEffect((function(){J.current=new RegExp(g.strongRegex)}),[g.strongRegex]),d.useEffect((function(){!te&&c.DomHandler.hasClass(_.current,"p-inputwrapper-filled")&&c.DomHandler.removeClass(_.current,"p-inputwrapper-filled")}),[te]),o.useMountEffect((function(){ie()})),o.useUnmountEffect((function(){c.ZIndexUtils.clear(Z.current)}));var de=c.classNames("p-password p-component p-inputwrapper",{"p-inputwrapper-filled":te,"p-inputwrapper-focus":L,"p-input-icon-right":g.toggleMask},g.className),me=S.getOtherProps(g),ye=function(){var e=f({key:"hideIcon",role:"button",tabIndex:g.tabIndex,className:G("hideIcon"),onClick:oe},V("hideIcon")),t=f({key:"showIcon",role:"button",tabIndex:g.tabIndex,className:G("showIcon"),onClick:oe},V("showIcon")),n=c.IconUtils.getJSXIcon(q?g.hideIcon||d.createElement(l.EyeSlashIcon,e):g.showIcon||d.createElement(a.EyeIcon,t),k({},q?e:t),{props:g});if(g.toggleMask){var r=n;if(g.icon)r=c.ObjectUtils.getJSXElement(g.icon,{onClick:oe,className:de,element:r,props:g});return r}return null}(),be=function(){var e=P||{strength:"",width:"0%"},t=e.strength,n=e.width,o=c.ObjectUtils.getJSXElement(g.header,g),a=c.ObjectUtils.getJSXElement(g.footer,g),l=f({className:G("panel",{context:b}),style:g.panelStyle,onClick:re},V("panel")),i=f({className:G("meter")},V("meter")),s=f({className:G("meterLabel",{strength:t}),style:{width:n}},V("meterLabel")),p=f({className:G("info",{strength:t})},V("info")),m=g.content?c.ObjectUtils.getJSXElement(g.content,g):d.createElement(d.Fragment,null,d.createElement("div",i,d.createElement("div",s)),d.createElement("div",p,U)),w=f({classNames:G("transition"),in:x,timeout:{enter:120,exit:100},options:g.transitionOptions,unmountOnExit:!0,onEnter:se,onEntered:ue,onExit:ce,onExited:pe},V("transition")),h=d.createElement(r.CSSTransition,y({nodeRef:Z},w),d.createElement("div",y({ref:Z},l),o,m,a));return d.createElement(u.Portal,{element:h,appendTo:g.appendTo})}(),ge=f({ref:_,id:g.id,className:G("root",{isFilled:te,focusedState:L}),style:g.style},V("root")),we=f(k(k({ref:z,id:g.inputId},me),{},{className:c.classNames(g.inputClassName,G("input")),onBlur:function(e){M(!1),g.feedback&&le(),g.onBlur&&g.onBlur(e)},onFocus:function(e){M(!0),g.feedback&&ae(),g.onFocus&&g.onFocus(e)},onInput:function(e,t){g.onInput&&g.onInput(e,t),g.onChange||(c.ObjectUtils.isNotEmpty(e.target.value)?c.DomHandler.addClass(_.current,"p-inputwrapper-filled"):c.DomHandler.removeClass(_.current,"p-inputwrapper-filled"))},onKeyUp:function(e){var t=e.code;if(g.feedback){var n=null,r=null;switch(fe(e.target.value)){case 1:n=h,r={strength:"weak",width:"33.33%"};break;case 2:n=v,r={strength:"medium",width:"66.66%"};break;case 3:n=O,r={strength:"strong",width:"100%"};break;default:n=w,r=null}R(r),D(n),t&&"Escape"!==t&&!x&&ae()}g.onKeyUp&&g.onKeyUp(e)},style:g.inputStyle,tabIndex:g.tabIndex,tooltip:g.tooltip,tooltipOptions:g.tooltipOptions,type:K,value:g.value,__parentMetadata:{parent:X}}),V("input"));return d.createElement("div",ge,d.createElement(i.InputText,we),ye,be)})));N.displayName="Password",exports.Password=N;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/api"),n=require("primereact/componentbase"),r=require("primereact/csstransition"),o=require("primereact/hooks"),a=require("primereact/icons/eye"),l=require("primereact/icons/eyeslash"),i=require("primereact/inputtext"),s=require("primereact/overlayservice"),u=require("primereact/portal"),c=require("primereact/utils");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function d(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var f=d(e),m=p(t);function y(){return y=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},y.apply(this,arguments)}function b(e){return b="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},b(e)}function w(e,t){if("object"!==b(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!==b(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function g(e){var t=w(e,"string");return"symbol"===b(t)?t:String(t)}function h(e){if(Array.isArray(e))return e}function v(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a,l,i=[],s=!0,u=!1;try{if(a=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;s=!1}else for(;!(s=(r=a.call(n)).done)&&(i.push(r.value),i.length!==t);s=!0);}catch(e){u=!0,o=e}finally{try{if(!s&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(u)throw o}}return i}}function O(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function E(e,t){if(e){if("string"==typeof e)return O(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?O(e,t):void 0}}function S(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function x(e,t){return h(e)||v(e,t)||E(e,t)||S()}var I=n.ComponentBase.extend({defaultProps:{__TYPE:"Password",id:null,inputId:null,inputRef:null,promptLabel:null,weakLabel:null,mediumLabel:null,strongLabel:null,mediumRegex:"^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})",strongRegex:"^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.{8,})",feedback:!0,toggleMask:!1,appendTo:null,header:null,content:null,footer:null,showIcon:null,hideIcon:null,icon:null,tooltip:null,tooltipOptions:null,style:null,className:null,inputStyle:null,inputClassName:null,invalid:!1,panelStyle:null,panelClassName:null,transitionOptions:null,tabIndex:null,value:void 0,onInput:null,onShow:null,onHide:null,children:void 0},css:{classes:{root:function(e){var t=e.props;return c.classNames("p-password p-component p-inputwrapper",{"p-inputwrapper-filled":e.isFilled,"p-inputwrapper-focus":e.focusedState,"p-input-icon-right":t.toggleMask},t.className)},input:function(e){return c.classNames("p-password-input",e.props.inputClassName)},panel:function(e){var t=e.context;return c.classNames("p-password-panel p-component",e.props.panelClassName,{"p-input-filled":t&&"filled"===t.inputStyle||"filled"===m.default.inputStyle,"p-ripple-disabled":t&&!1===t.ripple||!1===m.default.ripple})},meter:"p-password-meter",meterLabel:function(e){return c.classNames("p-password-strength",e.strength)},info:function(e){return c.classNames("p-password-info",e.strength)},showIcon:"p-password-show-icon",hideIcon:"p-password-hide-icon",transition:"p-connected-overlay"},styles:"\n@layer primereact {\n    .p-password {\n        position: relative;\n        display: inline-flex;\n    }\n    \n    .p-password-panel {\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n    \n    .p-password .p-password-panel {\n        min-width: 100%;\n    }\n    \n    .p-password-meter {\n        height: 10px;\n    }\n    \n    .p-password-strength {\n        height: 100%;\n        width: 0%;\n        transition: width 1s ease-in-out;\n    }\n    \n    .p-fluid .p-password {\n        display: flex;\n    }\n    \n    .p-password-input::-ms-reveal,\n    .p-password-input::-ms-clear {\n        display: none;\n    }\n\n    .p-password .p-password-show-icon,\n    .p-password .p-password-hide-icon {\n        line-height: 1.5;\n        cursor: pointer;\n    }\n}\n"}});function j(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function k(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?j(Object(n),!0).forEach((function(t){var r,o,a;r=e,a=n[t],(o=g(o=t))in r?Object.defineProperty(r,o,{value:a,enumerable:!0,configurable:!0,writable:!0}):r[o]=a})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):j(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var N=f.memo(f.forwardRef((function(e,p){var d=o.useMergeProps(),b=f.useContext(t.PrimeReactContext),w=I.getProps(e,b),g=w.promptLabel||t.localeOption("passwordPrompt"),h=w.weakLabel||t.localeOption("weak"),v=w.mediumLabel||t.localeOption("medium"),O=w.strongLabel||t.localeOption("strong"),E=x(f.useState(!1),2),S=E[0],j=E[1],N=x(f.useState(null),2),P=N[0],R=N[1],C=x(f.useState(g),2),U=C[0],D=C[1],H=x(f.useState(!1),2),L=H[0],M=H[1],T=x(f.useState(!1),2),q=T[0],A=T[1],_=f.useRef(null),Z=f.useRef(null),K=f.useRef(w.inputRef),z=f.useRef(new RegExp(w.mediumRegex)),F=f.useRef(new RegExp(w.strongRegex)),J=q?"text":"password",X={props:w,state:{overlayVisible:S,meter:P,infoText:U,focused:L,unmasked:q}},B=I.setMetaData(X),V=B.ptm,G=B.cx;n.useHandleStyle(I.css.styles,B.isUnstyled,{name:"password"});var Y=o.useDisplayOrder("password",S);o.useGlobalOnEscapeKey({callback:function(){ie()},when:S&&w.feedback&&Y,priority:[o.ESC_KEY_HANDLING_PRIORITIES.PASSWORD,Y]});var W=x(o.useOverlayListener({target:_,overlay:Z,listener:function(e,t){t.valid&&ie()},when:S}),2),$=W[0],Q=W[1],ee=K.current&&K.current.value,te=f.useMemo((function(){return c.ObjectUtils.isNotEmpty(w.value)||c.ObjectUtils.isNotEmpty(w.defaultValue)||c.ObjectUtils.isNotEmpty(ee)}),[w.value,w.defaultValue,ee]),ne=function(){if(P){var e=null;switch(P.strength){case"weak":e=h;break;case"medium":e=v;break;case"strong":e=O}e&&U!==e&&D(e)}else U!==g&&D(g)},re=function(e){if(!w.feedback)return!1;var t=null,n=null;switch(fe(e)){case 1:t=h,n={strength:"weak",width:"33.33%"};break;case 2:t=v,n={strength:"medium",width:"66.66%"};break;case 3:t=O,n={strength:"strong",width:"100%"};break;default:t=g,n=null}return R(n),D(t),!0},oe=function(e){w.feedback&&s.OverlayService.emit("overlay-click",{originalEvent:e,target:_.current})},ae=function(){A((function(e){return!e}))},le=function(){ne(),j(!0)},ie=function(){j(!1)},se=function(){K.current&&c.DomHandler.alignOverlay(Z.current,K.current.parentElement,w.appendTo||b&&b.appendTo||m.default.appendTo)},ue=function(){c.ZIndexUtils.set("overlay",Z.current,b&&b.autoZIndex||m.default.autoZIndex,b&&b.zIndex.overlay||m.default.zIndex.overlay),c.DomHandler.addStyles(Z.current,{position:"absolute",top:"0",left:"0"}),se()},ce=function(){$(),w.onShow&&w.onShow()},pe=function(){Q()},de=function(){c.ZIndexUtils.clear(Z.current),w.onHide&&w.onHide()},fe=function(e){return e&&0!==e.length?F.current.test(e)?3:z.current.test(e)?2:e.length>0?1:0:0};f.useImperativeHandle(p,(function(){return{props:w,toggleMask:ae,focus:function(){return c.DomHandler.focus(K.current)},getElement:function(){return _.current},getOverlay:function(){return Z.current},getInput:function(){return K.current}}})),f.useEffect((function(){c.ObjectUtils.combinedRefs(K,w.inputRef)}),[K,w.inputRef]),f.useEffect((function(){z.current=new RegExp(w.mediumRegex)}),[w.mediumRegex]),f.useEffect((function(){F.current=new RegExp(w.strongRegex)}),[w.strongRegex]),f.useEffect((function(){!te&&c.DomHandler.hasClass(_.current,"p-inputwrapper-filled")&&c.DomHandler.removeClass(_.current,"p-inputwrapper-filled")}),[te]),o.useUpdateEffect((function(){re(w.value)}),[w.value]),o.useMountEffect((function(){se()})),o.useUnmountEffect((function(){c.ZIndexUtils.clear(Z.current)}));var me=function(e){"Enter"!==e.key&&"Space"!==e.code||(ae(),e.preventDefault())},ye=c.classNames("p-password p-component p-inputwrapper",{"p-inputwrapper-filled":te,"p-inputwrapper-focus":L,"p-input-icon-right":w.toggleMask},w.className),be=I.getOtherProps(w),we=function(){var e=d({key:"hideIcon",role:"switch",tabIndex:w.tabIndex||"0",className:G("hideIcon"),onClick:ae,onKeyDown:me,"aria-label":t.ariaLabel("passwordHide")||"Hide Password","aria-checked":"false"},V("hideIcon")),n=d({key:"showIcon",role:"switch",tabIndex:w.tabIndex||"0",className:G("showIcon"),onClick:ae,onKeyDown:me,"aria-label":t.ariaLabel("passwordShow")||"Show Password","aria-checked":"true"},V("showIcon")),r=c.IconUtils.getJSXIcon(q?w.hideIcon||f.createElement(l.EyeSlashIcon,e):w.showIcon||f.createElement(a.EyeIcon,n),k({},q?e:n),{props:w});if(w.toggleMask){var o=r;if(w.icon)o=c.ObjectUtils.getJSXElement(w.icon,{onClick:ae,className:ye,element:o,props:w});return o}return null}(),ge=function(){var e=P||{strength:"",width:"0%"},t=e.strength,n=e.width,o=c.ObjectUtils.getJSXElement(w.header,w),a=c.ObjectUtils.getJSXElement(w.footer,w),l=d({className:G("panel",{context:b}),style:w.panelStyle,onClick:oe},V("panel")),i=d({className:G("meter")},V("meter")),s=d({className:G("meterLabel",{strength:t}),style:{width:n}},V("meterLabel")),p=d({className:G("info",{strength:t})},V("info")),m=w.content?c.ObjectUtils.getJSXElement(w.content,w):f.createElement(f.Fragment,null,f.createElement("div",i,f.createElement("div",s)),f.createElement("div",p,U)),g=d({classNames:G("transition"),in:S,timeout:{enter:120,exit:100},options:w.transitionOptions,unmountOnExit:!0,onEnter:ue,onEntered:ce,onExit:pe,onExited:de},V("transition")),h=f.createElement(r.CSSTransition,y({nodeRef:Z},g),f.createElement("div",y({ref:Z},l),o,m,a));return f.createElement(u.Portal,{element:h,appendTo:w.appendTo})}(),he=d({ref:_,id:w.id,className:G("root",{isFilled:te,focusedState:L}),style:w.style},V("root")),ve=d(k(k({ref:K,id:w.inputId},be),{},{className:c.classNames(w.inputClassName,G("input")),onBlur:function(e){M(!1),w.feedback&&ie(),w.onBlur&&w.onBlur(e)},onFocus:function(e){M(!0),w.feedback&&le(),w.onFocus&&w.onFocus(e)},onInput:function(e,t){w.onInput&&w.onInput(e,t),w.onChange||(c.ObjectUtils.isNotEmpty(e.target.value)?c.DomHandler.addClass(_.current,"p-inputwrapper-filled"):c.DomHandler.removeClass(_.current,"p-inputwrapper-filled"))},onKeyUp:function(e){var t=e.code;w.feedback&&t&&"Escape"!==t&&!S&&le(),w.onKeyUp&&w.onKeyUp(e)},invalid:w.invalid,style:w.inputStyle,tabIndex:w.tabIndex,tooltip:w.tooltip,tooltipOptions:w.tooltipOptions,type:J,value:w.value,__parentMetadata:{parent:X}}),V("input"));return f.createElement("div",he,f.createElement(i.InputText,ve),we,ge)})));N.displayName="Password",exports.Password=N;

package/password/password.d.ts

@@ -50,6 +50,11 @@ export interface PasswordPassThroughOptions {
      * Uses to pass attributes to the show icon's DOM element.
      */
     showIcon?: PasswordPassThroughType<React.SVGProps<SVGSVGElement> | React.HTMLAttributes<HTMLSpanElement>>;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * Uses to pass attributes to the panel's DOM element.
      */

package/password/password.esm.js

@@ -1,9 +1,9 @@
 'use client';
 import * as React from 'react';
-import PrimeReact, { PrimeReactContext, localeOption } from 'primereact/api';
+import PrimeReact, { PrimeReactContext, localeOption, ariaLabel } from 'primereact/api';
 import { ComponentBase, useHandleStyle } from 'primereact/componentbase';
 import { CSSTransition } from 'primereact/csstransition';
-import { useMergeProps, useDisplayOrder, useGlobalOnEscapeKey, ESC_KEY_HANDLING_PRIORITIES, useOverlayListener, useMountEffect, useUnmountEffect } from 'primereact/hooks';
+import { useMergeProps, useDisplayOrder, useGlobalOnEscapeKey, ESC_KEY_HANDLING_PRIORITIES, useOverlayListener, useUpdateEffect, useMountEffect, useUnmountEffect } from 'primereact/hooks';
 import { EyeIcon } from 'primereact/icons/eye';
 import { EyeSlashIcon } from 'primereact/icons/eyeslash';
 import { InputText } from 'primereact/inputtext';
@@ -186,6 +186,7 @@ var PasswordBase = ComponentBase.extend({
     className: null,
     inputStyle: null,
     inputClassName: null,
+    invalid: false,
     panelStyle: null,
     panelClassName: null,
     transitionOptions: null,
@@ -302,6 +303,43 @@ var Password = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
       }
     }
   };
+  var updateFeedback = function updateFeedback(value) {
+    if (!props.feedback) {
+      return false;
+    }
+    var label = null;
+    var meter = null;
+    switch (testStrength(value)) {
+      case 1:
+        label = weakLabel;
+        meter = {
+          strength: 'weak',
+          width: '33.33%'
+        };
+        break;
+      case 2:
+        label = mediumLabel;
+        meter = {
+          strength: 'medium',
+          width: '66.66%'
+        };
+        break;
+      case 3:
+        label = strongLabel;
+        meter = {
+          strength: 'strong',
+          width: '100%'
+        };
+        break;
+      default:
+        label = promptLabel;
+        meter = null;
+        break;
+    }
+    setMeterState(meter);
+    setInfoTextState(label);
+    return true;
+  };
   var onPanelClick = function onPanelClick(event) {
     if (props.feedback) {
       OverlayService.emit('overlay-click', {
@@ -364,38 +402,6 @@ var Password = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
   var onKeyup = function onKeyup(e) {
     var keyCode = e.code;
     if (props.feedback) {
-      var value = e.target.value;
-      var label = null;
-      var meter = null;
-      switch (testStrength(value)) {
-        case 1:
-          label = weakLabel;
-          meter = {
-            strength: 'weak',
-            width: '33.33%'
-          };
-          break;
-        case 2:
-          label = mediumLabel;
-          meter = {
-            strength: 'medium',
-            width: '66.66%'
-          };
-          break;
-        case 3:
-          label = strongLabel;
-          meter = {
-            strength: 'strong',
-            width: '100%'
-          };
-          break;
-        default:
-          label = promptLabel;
-          meter = null;
-          break;
-      }
-      setMeterState(meter);
-      setInfoTextState(label);
       if (!!keyCode && keyCode !== 'Escape' && !overlayVisibleState) {
         show();
       }
@@ -411,7 +417,16 @@ var Password = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     }
   };
   var testStrength = function testStrength(str) {
-    if (strongCheckRegExp.current.test(str)) return 3;else if (mediumCheckRegExp.current.test(str)) return 2;else if (str.length) return 1;
+    if (!str || str.length === 0) {
+      return 0;
+    }
+    if (strongCheckRegExp.current.test(str)) {
+      return 3;
+    } else if (mediumCheckRegExp.current.test(str)) {
+      return 2;
+    } else if (str.length > 0) {
+      return 1;
+    }
     return 0;
   };
   React.useImperativeHandle(ref, function () {
@@ -446,27 +461,42 @@ var Password = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
       DomHandler.removeClass(elementRef.current, 'p-inputwrapper-filled');
     }
   }, [isFilled]);
+  useUpdateEffect(function () {
+    updateFeedback(props.value);
+  }, [props.value]);
   useMountEffect(function () {
     alignOverlay();
   });
   useUnmountEffect(function () {
     ZIndexUtils.clear(overlayRef.current);
   });
+  var onToggleMaskKeyDown = function onToggleMaskKeyDown(event) {
+    if (event.key === 'Enter' || event.code === 'Space') {
+      toggleMask();
+      event.preventDefault();
+    }
+  };
   var createIcon = function createIcon() {
     var icon;
     var hideIconProps = mergeProps({
       key: 'hideIcon',
-      role: 'button',
-      tabIndex: props.tabIndex,
+      role: 'switch',
+      tabIndex: props.tabIndex || '0',
       className: cx('hideIcon'),
-      onClick: toggleMask
+      onClick: toggleMask,
+      onKeyDown: onToggleMaskKeyDown,
+      'aria-label': ariaLabel('passwordHide') || 'Hide Password',
+      'aria-checked': 'false'
     }, ptm('hideIcon'));
     var showIconProps = mergeProps({
       key: 'showIcon',
-      role: 'button',
-      tabIndex: props.tabIndex,
+      role: 'switch',
+      tabIndex: props.tabIndex || '0',
       className: cx('showIcon'),
-      onClick: toggleMask
+      onClick: toggleMask,
+      onKeyDown: onToggleMaskKeyDown,
+      'aria-label': ariaLabel('passwordShow') || 'Show Password',
+      'aria-checked': 'true'
     }, ptm('showIcon'));
     if (unmaskedState) {
       icon = props.hideIcon || /*#__PURE__*/React.createElement(EyeSlashIcon, hideIconProps);
@@ -574,6 +604,7 @@ var Password = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     onFocus: onFocus,
     onInput: onInput,
     onKeyUp: onKeyup,
+    invalid: props.invalid,
     style: props.inputStyle,
     tabIndex: props.tabIndex,
     tooltip: props.tooltip,

package/password/password.esm.min.js

@@ -1 +1 @@
-import*as e from"react";import t,{PrimeReactContext as n,localeOption as r}from"primereact/api";import{ComponentBase as o,useHandleStyle as i}from"primereact/componentbase";import{CSSTransition as a}from"primereact/csstransition";import{useMergeProps as l,useDisplayOrder as s,useGlobalOnEscapeKey as u,ESC_KEY_HANDLING_PRIORITIES as p,useOverlayListener as c,useMountEffect as f,useUnmountEffect as m}from"primereact/hooks";import{EyeIcon as d}from"primereact/icons/eye";import{EyeSlashIcon as y}from"primereact/icons/eyeslash";import{InputText as g}from"primereact/inputtext";import{OverlayService as w}from"primereact/overlayservice";import{Portal as b}from"primereact/portal";import{classNames as h,ObjectUtils as v,DomHandler as E,ZIndexUtils as x,IconUtils as S}from"primereact/utils";function O(){return O=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},O.apply(this,arguments)}function I(e){return I="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},I(e)}function k(e,t){if("object"!==I(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!==I(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function R(e){var t=k(e,"string");return"symbol"===I(t)?t:String(t)}function N(e){if(Array.isArray(e))return e}function j(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,i,a,l=[],s=!0,u=!1;try{if(i=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;s=!1}else for(;!(s=(r=i.call(n)).done)&&(l.push(r.value),l.length!==t);s=!0);}catch(e){u=!0,o=e}finally{try{if(!s&&null!=n.return&&(a=n.return(),Object(a)!==a))return}finally{if(u)throw o}}return l}}function P(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function C(e,t){if(e){if("string"==typeof e)return P(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?P(e,t):void 0}}function L(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function A(e,t){return N(e)||j(e,t)||C(e,t)||L()}var T=o.extend({defaultProps:{__TYPE:"Password",id:null,inputId:null,inputRef:null,promptLabel:null,weakLabel:null,mediumLabel:null,strongLabel:null,mediumRegex:"^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})",strongRegex:"^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.{8,})",feedback:!0,toggleMask:!1,appendTo:null,header:null,content:null,footer:null,showIcon:null,hideIcon:null,icon:null,tooltip:null,tooltipOptions:null,style:null,className:null,inputStyle:null,inputClassName:null,panelStyle:null,panelClassName:null,transitionOptions:null,tabIndex:null,value:void 0,onInput:null,onShow:null,onHide:null,children:void 0},css:{classes:{root:function(e){var t=e.props;return h("p-password p-component p-inputwrapper",{"p-inputwrapper-filled":e.isFilled,"p-inputwrapper-focus":e.focusedState,"p-input-icon-right":t.toggleMask},t.className)},input:function(e){return h("p-password-input",e.props.inputClassName)},panel:function(e){var n=e.context;return h("p-password-panel p-component",e.props.panelClassName,{"p-input-filled":n&&"filled"===n.inputStyle||"filled"===t.inputStyle,"p-ripple-disabled":n&&!1===n.ripple||!1===t.ripple})},meter:"p-password-meter",meterLabel:function(e){return h("p-password-strength",e.strength)},info:function(e){return h("p-password-info",e.strength)},showIcon:"p-password-show-icon",hideIcon:"p-password-hide-icon",transition:"p-connected-overlay"},styles:"\n@layer primereact {\n    .p-password {\n        position: relative;\n        display: inline-flex;\n    }\n    \n    .p-password-panel {\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n    \n    .p-password .p-password-panel {\n        min-width: 100%;\n    }\n    \n    .p-password-meter {\n        height: 10px;\n    }\n    \n    .p-password-strength {\n        height: 100%;\n        width: 0%;\n        transition: width 1s ease-in-out;\n    }\n    \n    .p-fluid .p-password {\n        display: flex;\n    }\n    \n    .p-password-input::-ms-reveal,\n    .p-password-input::-ms-clear {\n        display: none;\n    }\n\n    .p-password .p-password-show-icon,\n    .p-password .p-password-hide-icon {\n        line-height: 1.5;\n        cursor: pointer;\n    }\n}\n"}});function M(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function D(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?M(Object(n),!0).forEach((function(t){var r,o,i;r=e,i=n[t],(o=R(o=t))in r?Object.defineProperty(r,o,{value:i,enumerable:!0,configurable:!0,writable:!0}):r[o]=i})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):M(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var F=e.memo(e.forwardRef((function(o,I){var k=l(),R=e.useContext(n),N=T.getProps(o,R),j=N.promptLabel||r("passwordPrompt"),P=N.weakLabel||r("weak"),C=N.mediumLabel||r("medium"),L=N.strongLabel||r("strong"),M=A(e.useState(!1),2),F=M[0],z=M[1],J=A(e.useState(null),2),U=J[0],X=J[1],Z=A(e.useState(j),2),H=Z[0],_=Z[1],B=A(e.useState(!1),2),K=B[0],V=B[1],W=A(e.useState(!1),2),Y=W[0],$=W[1],q=e.useRef(null),G=e.useRef(null),Q=e.useRef(N.inputRef),ee=e.useRef(new RegExp(N.mediumRegex)),te=e.useRef(new RegExp(N.strongRegex)),ne=Y?"text":"password",re={props:N,state:{overlayVisible:F,meter:U,infoText:H,focused:K,unmasked:Y}},oe=T.setMetaData(re),ie=oe.ptm,ae=oe.cx;i(T.css.styles,oe.isUnstyled,{name:"password"});var le=s("password",F);u({callback:function(){we()},when:F&&N.feedback&&le,priority:[p.PASSWORD,le]});var se=A(c({target:q,overlay:G,listener:function(e,t){t.valid&&we()},when:F}),2),ue=se[0],pe=se[1],ce=Q.current&&Q.current.value,fe=e.useMemo((function(){return v.isNotEmpty(N.value)||v.isNotEmpty(N.defaultValue)||v.isNotEmpty(ce)}),[N.value,N.defaultValue,ce]),me=function(){if(U){var e=null;switch(U.strength){case"weak":e=P;break;case"medium":e=C;break;case"strong":e=L}e&&H!==e&&_(e)}else H!==j&&_(j)},de=function(e){N.feedback&&w.emit("overlay-click",{originalEvent:e,target:q.current})},ye=function(){$((function(e){return!e}))},ge=function(){me(),z(!0)},we=function(){z(!1)},be=function(){Q.current&&E.alignOverlay(G.current,Q.current.parentElement,N.appendTo||R&&R.appendTo||t.appendTo)},he=function(){x.set("overlay",G.current,R&&R.autoZIndex||t.autoZIndex,R&&R.zIndex.overlay||t.zIndex.overlay),E.addStyles(G.current,{position:"absolute",top:"0",left:"0"}),be()},ve=function(){ue(),N.onShow&&N.onShow()},Ee=function(){pe()},xe=function(){x.clear(G.current),N.onHide&&N.onHide()},Se=function(e){return te.current.test(e)?3:ee.current.test(e)?2:e.length?1:0};e.useImperativeHandle(I,(function(){return{props:N,toggleMask:ye,focus:function(){return E.focus(Q.current)},getElement:function(){return q.current},getOverlay:function(){return G.current},getInput:function(){return Q.current}}})),e.useEffect((function(){v.combinedRefs(Q,N.inputRef)}),[Q,N.inputRef]),e.useEffect((function(){ee.current=new RegExp(N.mediumRegex)}),[N.mediumRegex]),e.useEffect((function(){te.current=new RegExp(N.strongRegex)}),[N.strongRegex]),e.useEffect((function(){!fe&&E.hasClass(q.current,"p-inputwrapper-filled")&&E.removeClass(q.current,"p-inputwrapper-filled")}),[fe]),f((function(){be()})),m((function(){x.clear(G.current)}));var Oe=h("p-password p-component p-inputwrapper",{"p-inputwrapper-filled":fe,"p-inputwrapper-focus":K,"p-input-icon-right":N.toggleMask},N.className),Ie=T.getOtherProps(N),ke=function(){var t=k({key:"hideIcon",role:"button",tabIndex:N.tabIndex,className:ae("hideIcon"),onClick:ye},ie("hideIcon")),n=k({key:"showIcon",role:"button",tabIndex:N.tabIndex,className:ae("showIcon"),onClick:ye},ie("showIcon")),r=S.getJSXIcon(Y?N.hideIcon||e.createElement(y,t):N.showIcon||e.createElement(d,n),D({},Y?t:n),{props:N});if(N.toggleMask){var o=r;if(N.icon)o=v.getJSXElement(N.icon,{onClick:ye,className:Oe,element:o,props:N});return o}return null}(),Re=function(){var t=U||{strength:"",width:"0%"},n=t.strength,r=t.width,o=v.getJSXElement(N.header,N),i=v.getJSXElement(N.footer,N),l=k({className:ae("panel",{context:R}),style:N.panelStyle,onClick:de},ie("panel")),s=k({className:ae("meter")},ie("meter")),u=k({className:ae("meterLabel",{strength:n}),style:{width:r}},ie("meterLabel")),p=k({className:ae("info",{strength:n})},ie("info")),c=N.content?v.getJSXElement(N.content,N):e.createElement(e.Fragment,null,e.createElement("div",s,e.createElement("div",u)),e.createElement("div",p,H)),f=k({classNames:ae("transition"),in:F,timeout:{enter:120,exit:100},options:N.transitionOptions,unmountOnExit:!0,onEnter:he,onEntered:ve,onExit:Ee,onExited:xe},ie("transition")),m=e.createElement(a,O({nodeRef:G},f),e.createElement("div",O({ref:G},l),o,c,i));return e.createElement(b,{element:m,appendTo:N.appendTo})}(),Ne=k({ref:q,id:N.id,className:ae("root",{isFilled:fe,focusedState:K}),style:N.style},ie("root")),je=k(D(D({ref:Q,id:N.inputId},Ie),{},{className:h(N.inputClassName,ae("input")),onBlur:function(e){V(!1),N.feedback&&we(),N.onBlur&&N.onBlur(e)},onFocus:function(e){V(!0),N.feedback&&ge(),N.onFocus&&N.onFocus(e)},onInput:function(e,t){N.onInput&&N.onInput(e,t),N.onChange||(v.isNotEmpty(e.target.value)?E.addClass(q.current,"p-inputwrapper-filled"):E.removeClass(q.current,"p-inputwrapper-filled"))},onKeyUp:function(e){var t=e.code;if(N.feedback){var n=null,r=null;switch(Se(e.target.value)){case 1:n=P,r={strength:"weak",width:"33.33%"};break;case 2:n=C,r={strength:"medium",width:"66.66%"};break;case 3:n=L,r={strength:"strong",width:"100%"};break;default:n=j,r=null}X(r),_(n),t&&"Escape"!==t&&!F&&ge()}N.onKeyUp&&N.onKeyUp(e)},style:N.inputStyle,tabIndex:N.tabIndex,tooltip:N.tooltip,tooltipOptions:N.tooltipOptions,type:ne,value:N.value,__parentMetadata:{parent:re}}),ie("input"));return e.createElement("div",Ne,e.createElement(g,je),ke,Re)})));F.displayName="Password";export{F as Password};
+import*as e from"react";import t,{PrimeReactContext as n,localeOption as r,ariaLabel as o}from"primereact/api";import{ComponentBase as a,useHandleStyle as i}from"primereact/componentbase";import{CSSTransition as l}from"primereact/csstransition";import{useMergeProps as s,useDisplayOrder as u,useGlobalOnEscapeKey as p,ESC_KEY_HANDLING_PRIORITIES as c,useOverlayListener as f,useUpdateEffect as d,useMountEffect as m,useUnmountEffect as w}from"primereact/hooks";import{EyeIcon as y}from"primereact/icons/eye";import{EyeSlashIcon as g}from"primereact/icons/eyeslash";import{InputText as h}from"primereact/inputtext";import{OverlayService as b}from"primereact/overlayservice";import{Portal as v}from"primereact/portal";import{classNames as E,ObjectUtils as S,DomHandler as x,ZIndexUtils as k,IconUtils as O}from"primereact/utils";function I(){return I=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},I.apply(this,arguments)}function R(e){return R="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},R(e)}function N(e,t){if("object"!==R(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!==R(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function j(e){var t=N(e,"string");return"symbol"===R(t)?t:String(t)}function P(e){if(Array.isArray(e))return e}function C(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a,i,l=[],s=!0,u=!1;try{if(a=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;s=!1}else for(;!(s=(r=a.call(n)).done)&&(l.push(r.value),l.length!==t);s=!0);}catch(e){u=!0,o=e}finally{try{if(!s&&null!=n.return&&(i=n.return(),Object(i)!==i))return}finally{if(u)throw o}}return l}}function L(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function A(e,t){if(e){if("string"==typeof e)return L(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?L(e,t):void 0}}function T(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function D(e,t){return P(e)||C(e,t)||A(e,t)||T()}var M=a.extend({defaultProps:{__TYPE:"Password",id:null,inputId:null,inputRef:null,promptLabel:null,weakLabel:null,mediumLabel:null,strongLabel:null,mediumRegex:"^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})",strongRegex:"^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.{8,})",feedback:!0,toggleMask:!1,appendTo:null,header:null,content:null,footer:null,showIcon:null,hideIcon:null,icon:null,tooltip:null,tooltipOptions:null,style:null,className:null,inputStyle:null,inputClassName:null,invalid:!1,panelStyle:null,panelClassName:null,transitionOptions:null,tabIndex:null,value:void 0,onInput:null,onShow:null,onHide:null,children:void 0},css:{classes:{root:function(e){var t=e.props;return E("p-password p-component p-inputwrapper",{"p-inputwrapper-filled":e.isFilled,"p-inputwrapper-focus":e.focusedState,"p-input-icon-right":t.toggleMask},t.className)},input:function(e){return E("p-password-input",e.props.inputClassName)},panel:function(e){var n=e.context;return E("p-password-panel p-component",e.props.panelClassName,{"p-input-filled":n&&"filled"===n.inputStyle||"filled"===t.inputStyle,"p-ripple-disabled":n&&!1===n.ripple||!1===t.ripple})},meter:"p-password-meter",meterLabel:function(e){return E("p-password-strength",e.strength)},info:function(e){return E("p-password-info",e.strength)},showIcon:"p-password-show-icon",hideIcon:"p-password-hide-icon",transition:"p-connected-overlay"},styles:"\n@layer primereact {\n    .p-password {\n        position: relative;\n        display: inline-flex;\n    }\n    \n    .p-password-panel {\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n    \n    .p-password .p-password-panel {\n        min-width: 100%;\n    }\n    \n    .p-password-meter {\n        height: 10px;\n    }\n    \n    .p-password-strength {\n        height: 100%;\n        width: 0%;\n        transition: width 1s ease-in-out;\n    }\n    \n    .p-fluid .p-password {\n        display: flex;\n    }\n    \n    .p-password-input::-ms-reveal,\n    .p-password-input::-ms-clear {\n        display: none;\n    }\n\n    .p-password .p-password-show-icon,\n    .p-password .p-password-hide-icon {\n        line-height: 1.5;\n        cursor: pointer;\n    }\n}\n"}});function F(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function H(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?F(Object(n),!0).forEach((function(t){var r,o,a;r=e,a=n[t],(o=j(o=t))in r?Object.defineProperty(r,o,{value:a,enumerable:!0,configurable:!0,writable:!0}):r[o]=a})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):F(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var z=e.memo(e.forwardRef((function(a,R){var N=s(),j=e.useContext(n),P=M.getProps(a,j),C=P.promptLabel||r("passwordPrompt"),L=P.weakLabel||r("weak"),A=P.mediumLabel||r("medium"),T=P.strongLabel||r("strong"),F=D(e.useState(!1),2),z=F[0],J=F[1],K=D(e.useState(null),2),U=K[0],X=K[1],Z=D(e.useState(C),2),_=Z[0],B=Z[1],V=D(e.useState(!1),2),W=V[0],Y=V[1],$=D(e.useState(!1),2),q=$[0],G=$[1],Q=e.useRef(null),ee=e.useRef(null),te=e.useRef(P.inputRef),ne=e.useRef(new RegExp(P.mediumRegex)),re=e.useRef(new RegExp(P.strongRegex)),oe=q?"text":"password",ae={props:P,state:{overlayVisible:z,meter:U,infoText:_,focused:W,unmasked:q}},ie=M.setMetaData(ae),le=ie.ptm,se=ie.cx;i(M.css.styles,ie.isUnstyled,{name:"password"});var ue=u("password",z);p({callback:function(){ve()},when:z&&P.feedback&&ue,priority:[c.PASSWORD,ue]});var pe=D(f({target:Q,overlay:ee,listener:function(e,t){t.valid&&ve()},when:z}),2),ce=pe[0],fe=pe[1],de=te.current&&te.current.value,me=e.useMemo((function(){return S.isNotEmpty(P.value)||S.isNotEmpty(P.defaultValue)||S.isNotEmpty(de)}),[P.value,P.defaultValue,de]),we=function(){if(U){var e=null;switch(U.strength){case"weak":e=L;break;case"medium":e=A;break;case"strong":e=T}e&&_!==e&&B(e)}else _!==C&&B(C)},ye=function(e){if(!P.feedback)return!1;var t=null,n=null;switch(Ie(e)){case 1:t=L,n={strength:"weak",width:"33.33%"};break;case 2:t=A,n={strength:"medium",width:"66.66%"};break;case 3:t=T,n={strength:"strong",width:"100%"};break;default:t=C,n=null}return X(n),B(t),!0},ge=function(e){P.feedback&&b.emit("overlay-click",{originalEvent:e,target:Q.current})},he=function(){G((function(e){return!e}))},be=function(){we(),J(!0)},ve=function(){J(!1)},Ee=function(){te.current&&x.alignOverlay(ee.current,te.current.parentElement,P.appendTo||j&&j.appendTo||t.appendTo)},Se=function(){k.set("overlay",ee.current,j&&j.autoZIndex||t.autoZIndex,j&&j.zIndex.overlay||t.zIndex.overlay),x.addStyles(ee.current,{position:"absolute",top:"0",left:"0"}),Ee()},xe=function(){ce(),P.onShow&&P.onShow()},ke=function(){fe()},Oe=function(){k.clear(ee.current),P.onHide&&P.onHide()},Ie=function(e){return e&&0!==e.length?re.current.test(e)?3:ne.current.test(e)?2:e.length>0?1:0:0};e.useImperativeHandle(R,(function(){return{props:P,toggleMask:he,focus:function(){return x.focus(te.current)},getElement:function(){return Q.current},getOverlay:function(){return ee.current},getInput:function(){return te.current}}})),e.useEffect((function(){S.combinedRefs(te,P.inputRef)}),[te,P.inputRef]),e.useEffect((function(){ne.current=new RegExp(P.mediumRegex)}),[P.mediumRegex]),e.useEffect((function(){re.current=new RegExp(P.strongRegex)}),[P.strongRegex]),e.useEffect((function(){!me&&x.hasClass(Q.current,"p-inputwrapper-filled")&&x.removeClass(Q.current,"p-inputwrapper-filled")}),[me]),d((function(){ye(P.value)}),[P.value]),m((function(){Ee()})),w((function(){k.clear(ee.current)}));var Re=function(e){"Enter"!==e.key&&"Space"!==e.code||(he(),e.preventDefault())},Ne=E("p-password p-component p-inputwrapper",{"p-inputwrapper-filled":me,"p-inputwrapper-focus":W,"p-input-icon-right":P.toggleMask},P.className),je=M.getOtherProps(P),Pe=function(){var t=N({key:"hideIcon",role:"switch",tabIndex:P.tabIndex||"0",className:se("hideIcon"),onClick:he,onKeyDown:Re,"aria-label":o("passwordHide")||"Hide Password","aria-checked":"false"},le("hideIcon")),n=N({key:"showIcon",role:"switch",tabIndex:P.tabIndex||"0",className:se("showIcon"),onClick:he,onKeyDown:Re,"aria-label":o("passwordShow")||"Show Password","aria-checked":"true"},le("showIcon")),r=O.getJSXIcon(q?P.hideIcon||e.createElement(g,t):P.showIcon||e.createElement(y,n),H({},q?t:n),{props:P});if(P.toggleMask){var a=r;if(P.icon)a=S.getJSXElement(P.icon,{onClick:he,className:Ne,element:a,props:P});return a}return null}(),Ce=function(){var t=U||{strength:"",width:"0%"},n=t.strength,r=t.width,o=S.getJSXElement(P.header,P),a=S.getJSXElement(P.footer,P),i=N({className:se("panel",{context:j}),style:P.panelStyle,onClick:ge},le("panel")),s=N({className:se("meter")},le("meter")),u=N({className:se("meterLabel",{strength:n}),style:{width:r}},le("meterLabel")),p=N({className:se("info",{strength:n})},le("info")),c=P.content?S.getJSXElement(P.content,P):e.createElement(e.Fragment,null,e.createElement("div",s,e.createElement("div",u)),e.createElement("div",p,_)),f=N({classNames:se("transition"),in:z,timeout:{enter:120,exit:100},options:P.transitionOptions,unmountOnExit:!0,onEnter:Se,onEntered:xe,onExit:ke,onExited:Oe},le("transition")),d=e.createElement(l,I({nodeRef:ee},f),e.createElement("div",I({ref:ee},i),o,c,a));return e.createElement(v,{element:d,appendTo:P.appendTo})}(),Le=N({ref:Q,id:P.id,className:se("root",{isFilled:me,focusedState:W}),style:P.style},le("root")),Ae=N(H(H({ref:te,id:P.inputId},je),{},{className:E(P.inputClassName,se("input")),onBlur:function(e){Y(!1),P.feedback&&ve(),P.onBlur&&P.onBlur(e)},onFocus:function(e){Y(!0),P.feedback&&be(),P.onFocus&&P.onFocus(e)},onInput:function(e,t){P.onInput&&P.onInput(e,t),P.onChange||(S.isNotEmpty(e.target.value)?x.addClass(Q.current,"p-inputwrapper-filled"):x.removeClass(Q.current,"p-inputwrapper-filled"))},onKeyUp:function(e){var t=e.code;P.feedback&&t&&"Escape"!==t&&!z&&be(),P.onKeyUp&&P.onKeyUp(e)},invalid:P.invalid,style:P.inputStyle,tabIndex:P.tabIndex,tooltip:P.tooltip,tooltipOptions:P.tooltipOptions,type:oe,value:P.value,__parentMetadata:{parent:ae}}),le("input"));return e.createElement("div",Le,e.createElement(h,Ae),Pe,Ce)})));z.displayName="Password";export{z as Password};

package/password/password.js

@@ -200,6 +200,7 @@ this.primereact.password = (function (exports, React, PrimeReact, componentbase,
       className: null,
       inputStyle: null,
       inputClassName: null,
+      invalid: false,
       panelStyle: null,
       panelClassName: null,
       transitionOptions: null,
@@ -316,6 +317,43 @@ this.primereact.password = (function (exports, React, PrimeReact, componentbase,
         }
       }
     };
+    var updateFeedback = function updateFeedback(value) {
+      if (!props.feedback) {
+        return false;
+      }
+      var label = null;
+      var meter = null;
+      switch (testStrength(value)) {
+        case 1:
+          label = weakLabel;
+          meter = {
+            strength: 'weak',
+            width: '33.33%'
+          };
+          break;
+        case 2:
+          label = mediumLabel;
+          meter = {
+            strength: 'medium',
+            width: '66.66%'
+          };
+          break;
+        case 3:
+          label = strongLabel;
+          meter = {
+            strength: 'strong',
+            width: '100%'
+          };
+          break;
+        default:
+          label = promptLabel;
+          meter = null;
+          break;
+      }
+      setMeterState(meter);
+      setInfoTextState(label);
+      return true;
+    };
     var onPanelClick = function onPanelClick(event) {
       if (props.feedback) {
         overlayservice.OverlayService.emit('overlay-click', {
@@ -378,38 +416,6 @@ this.primereact.password = (function (exports, React, PrimeReact, componentbase,
     var onKeyup = function onKeyup(e) {
       var keyCode = e.code;
       if (props.feedback) {
-        var value = e.target.value;
-        var label = null;
-        var meter = null;
-        switch (testStrength(value)) {
-          case 1:
-            label = weakLabel;
-            meter = {
-              strength: 'weak',
-              width: '33.33%'
-            };
-            break;
-          case 2:
-            label = mediumLabel;
-            meter = {
-              strength: 'medium',
-              width: '66.66%'
-            };
-            break;
-          case 3:
-            label = strongLabel;
-            meter = {
-              strength: 'strong',
-              width: '100%'
-            };
-            break;
-          default:
-            label = promptLabel;
-            meter = null;
-            break;
-        }
-        setMeterState(meter);
-        setInfoTextState(label);
         if (!!keyCode && keyCode !== 'Escape' && !overlayVisibleState) {
           show();
         }
@@ -425,7 +431,16 @@ this.primereact.password = (function (exports, React, PrimeReact, componentbase,
       }
     };
     var testStrength = function testStrength(str) {
-      if (strongCheckRegExp.current.test(str)) return 3;else if (mediumCheckRegExp.current.test(str)) return 2;else if (str.length) return 1;
+      if (!str || str.length === 0) {
+        return 0;
+      }
+      if (strongCheckRegExp.current.test(str)) {
+        return 3;
+      } else if (mediumCheckRegExp.current.test(str)) {
+        return 2;
+      } else if (str.length > 0) {
+        return 1;
+      }
       return 0;
     };
     React__namespace.useImperativeHandle(ref, function () {
@@ -460,27 +475,42 @@ this.primereact.password = (function (exports, React, PrimeReact, componentbase,
         utils.DomHandler.removeClass(elementRef.current, 'p-inputwrapper-filled');
       }
     }, [isFilled]);
+    hooks.useUpdateEffect(function () {
+      updateFeedback(props.value);
+    }, [props.value]);
     hooks.useMountEffect(function () {
       alignOverlay();
     });
     hooks.useUnmountEffect(function () {
       utils.ZIndexUtils.clear(overlayRef.current);
     });
+    var onToggleMaskKeyDown = function onToggleMaskKeyDown(event) {
+      if (event.key === 'Enter' || event.code === 'Space') {
+        toggleMask();
+        event.preventDefault();
+      }
+    };
     var createIcon = function createIcon() {
       var icon;
       var hideIconProps = mergeProps({
         key: 'hideIcon',
-        role: 'button',
-        tabIndex: props.tabIndex,
+        role: 'switch',
+        tabIndex: props.tabIndex || '0',
         className: cx('hideIcon'),
-        onClick: toggleMask
+        onClick: toggleMask,
+        onKeyDown: onToggleMaskKeyDown,
+        'aria-label': PrimeReact.ariaLabel('passwordHide') || 'Hide Password',
+        'aria-checked': 'false'
       }, ptm('hideIcon'));
       var showIconProps = mergeProps({
         key: 'showIcon',
-        role: 'button',
-        tabIndex: props.tabIndex,
+        role: 'switch',
+        tabIndex: props.tabIndex || '0',
         className: cx('showIcon'),
-        onClick: toggleMask
+        onClick: toggleMask,
+        onKeyDown: onToggleMaskKeyDown,
+        'aria-label': PrimeReact.ariaLabel('passwordShow') || 'Show Password',
+        'aria-checked': 'true'
       }, ptm('showIcon'));
       if (unmaskedState) {
         icon = props.hideIcon || /*#__PURE__*/React__namespace.createElement(eyeslash.EyeSlashIcon, hideIconProps);
@@ -588,6 +618,7 @@ this.primereact.password = (function (exports, React, PrimeReact, componentbase,
       onFocus: onFocus,
       onInput: onInput,
       onKeyUp: onKeyup,
+      invalid: props.invalid,
       style: props.inputStyle,
       tabIndex: props.tabIndex,
       tooltip: props.tooltip,