@hipay/hipay-material-ui 2.0.0-beta.35 → 2.0.0-beta.37

package/umd/hipay-material-ui.development.js

@@ -1,4 +1,4 @@
-/** @license HiPay-Material-UI v2.0.0-beta.35
+/** @license HiPay-Material-UI v2.0.0-beta.37
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -987,9 +987,9 @@
                 hover: 'rgba(0, 0, 0, 0.08)',
                 hoverOpacity: 0.08,
                 // The color of a selected action.
-                selected: 'rgba(0, 0, 0, 0.04)',
+                selected: '#F8F9FB',
                 // The color of a disabled action.
-                disabled: 'rgba(0, 0, 0, 0.26)',
+                disabled: '#E0E0E0',
                 // The background color of a disabled action.
                 disabledBackground: 'rgba(0, 0, 0, 0.12)'
               },
@@ -1105,7 +1105,7 @@
                   _palette$type = palette.type,
                   type = _palette$type === void 0 ? 'light' : _palette$type,
                   _palette$contrastThre = palette.contrastThreshold,
-                  contrastThreshold = _palette$contrastThre === void 0 ? 4 : _palette$contrastThre,
+                  contrastThreshold = _palette$contrastThre === void 0 ? 2.9 : _palette$contrastThre,
                   _palette$tonalOffset = palette.tonalOffset,
                   tonalOffset = _palette$tonalOffset === void 0 ? 0.2 : _palette$tonalOffset,
                   _palette$context = palette.context,
@@ -65988,7 +65988,7 @@
 
                 /* Styles applied to the root element. */
                 faIcon: {
-                  fontSize: 24
+                  fontSize: 20
                 },
 
                 /* Styles applied to the root element if `color="primary"`. */
@@ -66028,11 +66028,10 @@
                   classes = props.classes,
                   className = props.className,
                   color = props.color,
-                  fontSize = props.fontSize,
                   icon = props.icon,
                   size = props.size,
                   theme = props.theme,
-                  other = objectWithoutProperties(props, ["children", "classes", "className", "color", "fontSize", "icon", "size", "theme"]);
+                  other = objectWithoutProperties(props, ["children", "classes", "className", "color", "icon", "size", "theme"]);
 
               var iconName = icon !== null ? icon : children;
               var isHiColor = ['positive', 'negative', 'middle', 'neutral'].includes(color); // Line Awesome icons
@@ -66041,7 +66040,7 @@
                 return React.createElement("i", _extends_1({
                   className: classnames('fa', iconName, classes.root, defineProperty({}, classes["color".concat(capitalize(color))], color !== 'inherit'), className),
                   style: {
-                    fontSize: fontSize !== 'inherit' ? size : 'inherit'
+                    fontSize: size
                   }
                 }, other));
               } // Specific HiPay icons
@@ -66051,12 +66050,9 @@
                 var IconName = hiSvgIcons[capitalize(camelize$2(iconName))];
                 return React.createElement(IconName, _extends_1({
                   className: classnames(classes.root, className),
-                  color: isHiColor || color === 'primary' || color === 'secondary' ? theme.palette[color].main : theme.palette.primary.main
-                }, fontSize === 'default' ? {
+                  color: isHiColor || color === 'primary' || color === 'secondary' ? theme.palette[color].main : theme.palette.primary.main,
                   width: size,
                   height: size
-                } : {
-                  fontSize: fontSize
                 }, other));
               } // MDI - Material Design Icons - https://materialdesignicons.com
 
@@ -66065,26 +66061,20 @@
                 var _IconName = mdi[capitalize(camelize$2(iconName.slice(4)))];
                 return React.createElement(_IconName, _extends_1({
                   className: classnames(classes.root, defineProperty({}, classes["color".concat(capitalize(color))], isHiColor), className),
-                  color: isHiColor ? 'inherit' : color
-                }, fontSize === 'default' ? {
+                  color: isHiColor ? 'inherit' : color,
                   style: {
                     fontSize: size
                   }
-                } : {
-                  fontSize: fontSize
                 }, other));
               } // @material-ui/icons
 
 
               return React.createElement(Icon$2, _extends_1({
                 className: classnames(classes.root, defineProperty({}, classes["color".concat(capitalize(color))], isHiColor), className),
-                color: isHiColor ? 'inherit' : color
-              }, fontSize === 'default' ? {
+                color: isHiColor ? 'inherit' : color,
                 style: {
                   fontSize: size
                 }
-              } : {
-                fontSize: fontSize
               }, other), iconName);
             }
 
@@ -66110,11 +66100,6 @@
                */
               color: propTypes.oneOf(['inherit', 'primary', 'secondary', 'action', 'error', 'disabled', 'positive', 'negative', 'middle', 'neutral']),
 
-              /**
-               * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size.
-               */
-              fontSize: propTypes.oneOf(['inherit', 'default']),
-
               /**
                * Deprecated use (same as children)
                * The name of the icon font ligature.
@@ -66128,9 +66113,8 @@
             };
             HiIcon.defaultProps = {
               color: 'inherit',
-              fontSize: 'default',
               icon: null,
-              size: 24
+              size: 20
             };
             HiIcon.muiName = 'HiIcon';
             var HiIcon$1 = withStyles(styles$2, {
@@ -66142,8 +66126,9 @@
             var styles$3 = function styles(theme) {
               return {
                 root: {
-                  marginRight: 12,
-                  marginLeft: 12
+                  marginRight: 4,
+                  marginLeft: 4,
+                  padding: 0
                 },
                 checked: {},
                 checkedPrimary: {
@@ -66217,18 +66202,19 @@
                       indeterminateIcon = _this$props.indeterminateIcon,
                       style = _this$props.style,
                       size = _this$props.size,
-                      other = objectWithoutProperties(_this$props, ["classes", "color", "checkedIcon", "icon", "indeterminateIcon", "style", "size"]);
+                      className = _this$props.className,
+                      other = objectWithoutProperties(_this$props, ["classes", "color", "checkedIcon", "icon", "indeterminateIcon", "style", "size", "className"]);
 
                   var iconStyles = _extends_1({
                     width: size,
                     height: size
                   }, style);
 
-                  var hcolor = ['positive', 'negative', 'middle', 'neutral'].includes(color) ? 'default' : color;
+                  var hcolor = ['positive', 'negative', 'middle', 'neutral'].includes(color) ? 'inherit' : color;
                   return React.createElement(Checkbox$2, _extends_1({
                     classes: {
                       root: classes.root,
-                      checked: classnames(classes.checked, (_classNames = {}, defineProperty(_classNames, classes.checkedPrimary, color === 'primary' || color === 'default'), defineProperty(_classNames, classes.checkedSecondary, color === 'secondary'), defineProperty(_classNames, classes.checkedPositive, color === 'positive'), defineProperty(_classNames, classes.checkedNegative, color === 'negative'), defineProperty(_classNames, classes.checkedMiddle, color === 'middle'), defineProperty(_classNames, classes.checkedNeutral, color === 'neutral'), _classNames)),
+                      checked: classnames(classes.checked, (_classNames = {}, defineProperty(_classNames, classes.checkedPrimary, color === 'primary' || color === 'inherit'), defineProperty(_classNames, classes.checkedSecondary, color === 'secondary'), defineProperty(_classNames, classes.checkedPositive, color === 'positive'), defineProperty(_classNames, classes.checkedNegative, color === 'negative'), defineProperty(_classNames, classes.checkedMiddle, color === 'middle'), defineProperty(_classNames, classes.checkedNeutral, color === 'neutral'), _classNames)),
                       disabled: classes.disabled
                     },
                     style: iconStyles,
@@ -66237,19 +66223,22 @@
                   }, icon && {
                     icon: React.createElement(HiIcon$1, {
                       className: classes.root,
-                      icon: icon
+                      icon: icon,
+                      size: 20
                     })
                   }, checkedIcon && {
                     checkedIcon: React.createElement(HiIcon$1, {
                       className: classes.root,
                       icon: checkedIcon,
-                      color: color
+                      color: color,
+                      size: 20
                     })
                   }, indeterminateIcon && {
                     indeterminateIcon: React.createElement(HiIcon$1, {
                       className: classes.root,
                       icon: indeterminateIcon,
-                      color: color
+                      color: color,
+                      size: 20
                     })
                   }, other));
                 }
@@ -66261,7 +66250,8 @@
             HiCheckbox.defaultProps = {
               checked: false,
               color: 'default',
-              size: 20
+              size: 20,
+              icon: 'check_box_outline_blank'
             };
             HiCheckbox.propTypes = {
               /**
@@ -68702,8 +68692,8 @@
                 startAdornment: {
                   color: theme.palette.neutral.main,
                   zIndex: 1,
-                  marginLeft: 8,
-                  marginRight: 16
+                  marginLeft: 0,
+                  marginRight: 8
                 },
                 startAdornmentFocus: {
                   color: theme.palette.neutral.dark
@@ -76308,6 +76298,14 @@
                   }
                 };
 
+                _this.handleKeyDown = function (event) {
+                  var key = keycode(event);
+
+                  if (['space', 'enter'].includes(key)) {
+                    _this.handleHelperClick(event);
+                  }
+                };
+
                 _this.handleHover = function (value) {
                   return function () {
                     _this.setState({
@@ -76336,6 +76334,7 @@
                   hovered: false
                 };
                 _this.handleHelperClick = _this.handleHelperClick.bind(assertThisInitialized(assertThisInitialized(_this)));
+                _this.handleKeyDown = _this.handleKeyDown.bind(assertThisInitialized(assertThisInitialized(_this)));
                 _this.handleFocus = _this.handleFocus.bind(assertThisInitialized(assertThisInitialized(_this)));
                 _this.handleHover = _this.handleHover.bind(assertThisInitialized(assertThisInitialized(_this)));
                 return _this;
@@ -76378,7 +76377,12 @@
                     className: classes.errorDiv
                   }, React.createElement("div", {
                     className: classnames(classes.arrowDown, classes.errorDivArrowDown)
-                  }), errorText), helperIcon && helperText && !error && helperOpen && React.createElement("div", {
+                  }), React.createElement("span", {
+                    // eslint-disable-next-line react/no-danger
+                    dangerouslySetInnerHTML: {
+                      __html: escapeHTML(errorText)
+                    }
+                  })), helperIcon && helperText && !error && helperOpen && React.createElement("div", {
                     className: classes.helperDiv
                   }, React.createElement("div", {
                     className: classnames(classes.arrowDown, classes.helperDivArrowDown)
@@ -76395,10 +76399,14 @@
                     focused: !disabled && (focused || hovered)
                   }, InputLabelProps), error && React.createElement(Warning$1, {
                     className: classes.errorIcon,
-                    onClick: this.handleHelperClick
+                    onClick: this.handleHelperClick,
+                    tabIndex: 0,
+                    onKeyDown: this.handleKeyDown
                   }), helperIcon && helperText && !error && React.createElement(Info$1, {
                     className: classnames(classes.helperIcon, defineProperty({}, classes.helperIconActive, helperOpen)),
-                    onClick: this.handleHelperClick
+                    onClick: this.handleHelperClick,
+                    tabIndex: 0,
+                    onKeyDown: this.handleKeyDown
                   })), React.createElement("div", {
                     onMouseEnter: this.handleHover(true),
                     onMouseLeave: this.handleHover(false),
@@ -88368,7 +88376,8 @@
               showClockButton: false
             };
             var NavBar$1 = withStyles(styles$j, {
-              name: 'HmuiNavbar'
+              hiComponent: true,
+              name: 'HmuiNavBar'
             })(NavBar);
 
             var Weekday$1 = function Weekday(_ref) {
@@ -88476,7 +88485,6 @@
                 // The month's main table
                 month: {
                   display: 'table',
-                  borderCollapse: 'collapse',
                   borderSpacing: 0,
                   userSelect: 'none' // margin: '0 1rem',
                   // marginTop: '1rem',
@@ -88568,7 +88576,10 @@
                 /* default modifiers */
                 // Added to the day's cell for the current day
                 today: {
-                  color: theme.palette.primary.light,
+                  // color: theme.palette.primary.light,
+                  border: '2px solid #8b9898',
+                  borderRadius: '50%',
+                  color: "".concat(theme.palette.neutral.dark, " !important"),
                   fontWeight: theme.typography.fontWeightMedium
                 },
                 // Added to the day's cell outside the current month
@@ -88593,7 +88604,9 @@
                 selected: {
                   // backgroundColor: fade(theme.palette.business.primary.normal, 0.36),
                   backgroundColor: theme.palette.primary.main,
-                  color: theme.palette.primary.contrastText
+                  color: theme.palette.primary.contrastText,
+                  borderRadius: '0%',
+                  border: 'none'
                 }
               };
             });
@@ -88820,7 +88833,7 @@
                     todayButton: translations.today,
                     onTodayButtonClick: this.handleCurrentMonthChange,
                     weekdayElement: Weekday$1,
-                    navbarElement: function navbarElement(props2) {
+                    NavBarElement: function NavBarElement(props2) {
                       return React.createElement(NavBar$1, _extends_1({
                         showClockButton: enableTime,
                         onClockClick: _this2.handleClockClick
@@ -88863,8 +88876,8 @@
                     inputProps: inputProps,
                     placeholder: '',
                     format: enableTime ? "".concat(format, " HH:mm") : format,
-                    formatDate: momentLocaleUtils.formatDate,
-                    parseDate: momentLocaleUtils.parseDate,
+                    formatDate: moment$1.formatDate,
+                    parseDate: moment$1.parseDate,
                     onDayChange: this.handleDayChange
                   }));
                 }
@@ -88960,6 +88973,8 @@
               name: 'HmuiHiDatePicker'
             })(HiDatePicker);
 
+            //export { default as HiDateRangeSelector } from './HiDatePicker/HiDateRangeSelector';
+
             exports.createGenerateClassName = createGenerateClassName;
             exports.createMuiTheme = createMuiTheme;
             exports.createStyles = createStyles;