@plesk/ui-library 3.27.0 → 3.27.1

package/esm/components/Drawer/DrawerProgress.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2019. Plesk International GmbH. All rights reserved.
-import React, { Component, Fragment } from 'react';
+import React, { Component, Fragment, isValidElement, cloneElement } from 'react';
 import Button from '../Button';
 import Translate from '../Translate';
 import Progress from '../Progress';
@@ -9,6 +9,20 @@ import ProgressStep, { STATUS_DONE, STATUS_ERROR, STATUS_NOT_STARTED } from '../
 import { CLS_PREFIX } from '../../constants';
 import { safeInvoke } from '../utils';
 
+const renderAdditionalButtons = buttons => {
+  const buttonProcessing = button => {
+    if ( /*#__PURE__*/isValidElement(button) && button.type === Button) {
+      return /*#__PURE__*/cloneElement(button, {
+        size: 'lg'
+      });
+    }
+
+    return button;
+  };
+
+  return Array.isArray(buttons) ? buttons.map(buttonProcessing) : buttonProcessing(buttons);
+};
+
 class DrawerProgress extends Component {
   constructor(...args) {
     super(...args);
@@ -125,7 +139,7 @@ class DrawerProgress extends Component {
     }, step)))));
     const footer = hasFooter ? /*#__PURE__*/React.createElement("div", {
       className: `${baseClassName}__footer`
-    }, buttons, canCancel && /*#__PURE__*/React.createElement(Button, {
+    }, renderAdditionalButtons(buttons), canCancel && /*#__PURE__*/React.createElement(Button, {
       onClick: this.handleCancel,
       size: "lg"
     }, /*#__PURE__*/React.createElement(Translate, {

package/esm/components/FormFieldPassword/FormFieldPassword.js

@@ -33,9 +33,17 @@ class FormFieldPassword extends Component {
 
     _defineProperty(this, "state", {
       visible: false,
-      passwordMeterVisible: false
+      passwordMeterVisible: false,
+      scoreResult: {
+        password: null,
+        intent: null,
+        strength: null,
+        unusedRules: []
+      }
     });
 
+    _defineProperty(this, "passwordOnScoring", null);
+
     _defineProperty(this, "targetRef", /*#__PURE__*/createRef());
 
     _defineProperty(this, "handleToggleClick", () => {
@@ -55,9 +63,10 @@ class FormFieldPassword extends Component {
     _defineProperty(this, "handleBlur", this.handleClosePasswordMeter);
   }
 
-  passwordScore(value) {
+  async passwordScore(value) {
     if (!value) {
       return {
+        password: null,
         intent: null,
         strength: null,
         unusedRules: []
@@ -65,12 +74,15 @@ class FormFieldPassword extends Component {
     }
 
     const {
-      passwordScoreRules
+      passwordScoreRules,
+      customPasswordScore
     } = this.props;
+    const passwordScoreFunc = customPasswordScore || passwordScore;
     const {
+      password,
       score,
       unusedRules
-    } = passwordScore(value, passwordScoreRules);
+    } = await passwordScoreFunc(value, passwordScoreRules);
     let intent = 'success';
     let strength = /*#__PURE__*/React.createElement(Translate, {
       content: "FormFieldPassword.strengthVeryStrong",
@@ -104,6 +116,7 @@ class FormFieldPassword extends Component {
     }
 
     return {
+      password,
       intent,
       strength,
       unusedRules
@@ -118,10 +131,24 @@ class FormFieldPassword extends Component {
       passwordMeterProps
     } = this.props;
     const {
+      password,
       intent,
       strength,
       unusedRules
-    } = this.passwordScore(value);
+    } = this.state.scoreResult;
+
+    if (!!value && value !== password && value !== this.passwordOnScoring) {
+      this.passwordOnScoring = value;
+      this.passwordScore(value).then(scoreResult => {
+        if (this.passwordOnScoring === scoreResult.password) {
+          this.passwordOnScoring = null;
+          this.setState({
+            scoreResult
+          });
+        }
+      });
+    }
+
     return /*#__PURE__*/React.createElement(Popover, _extends({
       visible: passwordMeterVisible && !!value,
       target: target,
@@ -208,6 +235,7 @@ class FormFieldPassword extends Component {
       hidePasswordMeter,
       passwordMeterProps,
       passwordScoreRules,
+      customPasswordScore,
       size,
       autoFocus,
       autoComplete,
@@ -306,6 +334,12 @@ FormFieldPassword.propTypes = {
     score: PropTypes.func.isRequired
   })),
 
+  /**
+   * Custom password score estimator
+   * @since 3.27.1
+   */
+  customPasswordScore: PropTypes.func,
+
   /**
    * Size of the control
    * @since 1.5.6
@@ -347,6 +381,7 @@ FormFieldPassword.defaultProps = {
   hidePasswordMeter: false,
   passwordMeterProps: {},
   passwordScoreRules: undefined,
+  customPasswordScore: undefined,
   size: 'md',
   autoFocus: undefined,
   autoComplete: undefined,

package/esm/components/FormFieldPassword/passwordScore.js

@@ -14,10 +14,11 @@ const passwordScore = (password, rules = PASSWORD_SCORE_RULES) => {
       score += mark;
     }
   });
-  return {
+  return Promise.resolve({
+    password,
     score,
     unusedRules
-  };
+  });
 };
 
 export const PASSWORD_SCORE_RULES = [{

package/esm/components/Icon/Icon.js

@@ -73,7 +73,7 @@ const Icon = ({
   }, props), newName ? /*#__PURE__*/React.createElement("svg", {
     focusable: "false"
   }, /*#__PURE__*/React.createElement("use", {
-    xlinkHref: getHref(newName, newSize)
+    href: getHref(newName, newSize)
   })) : src && /*#__PURE__*/React.createElement("img", {
     src: src,
     alt: alt

package/esm/components/Rating/images/rating.svg

@@ -1,6 +1,6 @@
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="56" height="248" viewBox="0 0 51 248">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="56" height="248" viewBox="0 0 51 248">
 <defs><symbol id="star"><path stroke-width="3" d="m25,1 6,17h18l-14,11 5,17-15-10-15,10 5-17-14-11h18z"></path></symbol></defs>
-<use x="0" y="0"   fill="none" stroke="#ff9500" xlink:href="#star"></use>
-<use x="0" y="100" fill="#ff9500" stroke="#ff9500" xlink:href="#star"></use>
-<use x="0" y="200" fill="#848484" stroke="#848484" xlink:href="#star"></use>
-</svg>
+<use x="0" y="0"   fill="none" stroke="#ff9500" href="#star"></use>
+<use x="0" y="100" fill="#ff9500" stroke="#ff9500" href="#star"></use>
+<use x="0" y="200" fill="#848484" stroke="#848484" href="#star"></use>
+</svg>

package/esm/index.js

@@ -1,6 +1,6 @@
 // Copyright 1999-2018. Plesk International GmbH. All rights reserved.
 import svg4everybody from 'svg4everybody';
-const version = "3.27.0";
+const version = "3.27.1";
 export * from './publicPath';
 export { version };
 export * from './utils';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plesk/ui-library",
-  "version": "3.27.0",
+  "version": "3.27.1",
   "description": "Plesk UI Library",
   "main": "index.js",
   "module": "esm/index.js",