@hipay/hipay-material-ui 2.3.0-rc.4 → 2.3.0-rc.PSYCHE-2530

package/es/HiButton/HiButton.js

@@ -1,232 +1,92 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-// @inheritedComponent Button
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import { makeStyles } from '@material-ui/core/styles';
-import { fade } from '@material-ui/core/styles/colorManipulator';
-import Button from '@material-ui/core/Button';
-const useStyles = makeStyles(theme => ({
-  root: {
-    '&$containedDisabled': {
-      color: theme.palette.neutral.contrastText,
-      backgroundColor: theme.palette.neutral.main
-    }
-  },
-  containedDisabled: {},
-  textNeutral: {
-    color: theme.palette.neutral.main,
-    '&$disabled': {
-      color: theme.palette.action.disabled
-    }
-  },
-  textPositive: {
-    color: theme.palette.positive.main,
-    '&:hover': {
-      backgroundColor: fade(theme.palette.positive.main, theme.palette.action.hoverOpacity),
-      // Reset on touch devices, it doesn't add specificity
-      '@media (hover: none)': {
-        backgroundColor: 'transparent'
-      }
-    },
-    '&$disabled': {
-      color: theme.palette.action.disabled
-    }
-  },
-  textNegative: {
-    color: theme.palette.negative.main,
-    '&:hover': {
-      backgroundColor: fade(theme.palette.negative.main, theme.palette.action.hoverOpacity),
-      // Reset on touch devices, it doesn't add specificity
-      '@media (hover: none)': {
-        backgroundColor: 'transparent'
-      }
-    },
-    '&$disabled': {
-      color: theme.palette.action.disabled
-    }
-  },
-  textMiddle: {
-    color: theme.palette.middle.main,
-    '&:hover': {
-      backgroundColor: fade(theme.palette.middle.main, theme.palette.action.hoverOpacity),
-      // Reset on touch devices, it doesn't add specificity
-      '@media (hover: none)': {
-        backgroundColor: 'transparent'
-      }
-    },
-    '&$disabled': {
-      color: theme.palette.action.disabled
-    }
-  },
+"use strict";
 
-  /* Styles applied to the root element if `variant="[contained ]"` and `color="positive"`. */
-  containedPrimary: {
-    '&$disabled': {
-      color: theme.palette.neutral.contrastText,
-      backgroundColor: theme.palette.neutral.main
-    }
-  },
-  containedPositive: {
-    color: theme.palette.positive.contrastText,
-    backgroundColor: theme.palette.positive.main,
-    '&:hover': {
-      backgroundColor: theme.palette.positive.dark,
-      // Reset on touch devices, it doesn't add specificity
-      '@media (hover: none)': {
-        backgroundColor: theme.palette.positive.main
-      }
-    },
-    '&$disabled': {
-      color: theme.palette.neutral.contrastText,
-      backgroundColor: theme.palette.neutral.main
-    }
-  },
+var _interopRequireDefault = require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
 
-  /* Styles applied to the root element if `variant="[contained]"` and `color="negative"`. */
-  containedNegative: {
-    color: theme.palette.negative.contrastText,
-    backgroundColor: theme.palette.negative.main,
-    '&:hover': {
-      backgroundColor: theme.palette.negative.dark,
-      // Reset on touch devices, it doesn't add specificity
-      '@media (hover: none)': {
-        backgroundColor: theme.palette.negative.main
-      }
-    },
-    '&$disabled': {
-      color: theme.palette.neutral.contrastText,
-      backgroundColor: theme.palette.neutral.main
-    }
-  },
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.useStyles = void 0;
 
-  /* Styles applied to the root element if `variant="[contained]"` and `color="middle"`. */
-  containedMiddle: {
-    color: theme.palette.middle.contrastText,
-    backgroundColor: theme.palette.middle.main,
-    '&:hover': {
-      backgroundColor: theme.palette.middle.dark,
-      // Reset on touch devices, it doesn't add specificity
-      '@media (hover: none)': {
-        backgroundColor: theme.palette.middle.main
-      }
-    },
-    '&$disabled': {
-      color: theme.palette.neutral.contrastText,
-      backgroundColor: theme.palette.neutral.main
-    }
-  },
+var _extends2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/extends"));
 
-  /* Styles applied to the root element if `variant="[contained]"` and `color="neutral"`. */
-  containedNeutral: {
-    color: theme.palette.neutral.contrastText,
-    backgroundColor: theme.palette.neutral.main,
-    '&:hover': {
-      backgroundColor: theme.palette.neutral.dark,
-      // Reset on touch devices, it doesn't add specificity
-      '@media (hover: none)': {
-        backgroundColor: theme.palette.neutral.main
-      }
-    },
-    '&$disabled': {
-      color: theme.palette.neutral.contrastText,
-      backgroundColor: theme.palette.neutral.main
-    }
-  },
+var _react = _interopRequireDefault(require("react"));
 
-  /* Styles applied to the root element if `variant="outlined"` and `color="positive"`. */
-  outlinedPositive: {
-    border: `1px solid ${fade(theme.palette.positive.main, 0.5)}`,
-    '&:hover': {
-      border: `1px solid ${theme.palette.positive.main}`
-    }
-  },
+var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
 
-  /* Styles applied to the root element if `variant="outlined"` and `color="negative"`. */
-  outlinedNegative: {
-    border: `1px solid ${fade(theme.palette.negative.main, 0.5)}`,
-    '&:hover': {
-      border: `1px solid ${theme.palette.negative.main}`
-    }
-  },
+var _styles = require("@material-ui/core/styles");
 
-  /* Styles applied to the root element if `variant="outlined"` and `color="middle"`. */
-  outlinedMiddle: {
-    border: `1px solid ${fade(theme.palette.middle.main, 0.5)}`,
-    '&:hover': {
-      border: `1px solid ${theme.palette.middle.main}`
-    }
-  },
+var _colorManipulator = require("@material-ui/core/styles/colorManipulator");
 
-  /* Styles applied to the root element if `variant="outlined"` and `color="neutral"`. */
-  outlinedNeutral: {
-    border: `1px solid ${fade(theme.palette.neutral.main, 0.5)}`,
-    '&:hover': {
-      border: `1px solid ${theme.palette.neutral.main}`
-    }
-  },
-  disabled: {}
-}));
-const HiButton = React.forwardRef((props, ref) => {
-  const {
-    children,
-    className,
-    color,
-    variant,
-    disabled
-  } = props,
-        other = _objectWithoutProperties(props, ["children", "className", "color", "variant", "disabled"]);
+var useStyles = (0, _styles.makeStyles)(function (theme) {
+  return {
+    root: {},
+    // a style rule
+    label: {},
+    // a nested style rule
+    text: function text(props) {
+      if (['neutral', 'positive', 'middle', 'negative'].includes(props.color)) {
+        return {
+          color: props.disabled ? theme.palette.action.disabled : theme.palette[props.color].main,
+          '&:hover': {
+            backgroundColor: (0, _colorManipulator.fade)(theme.palette[props.color].main, theme.palette.action.hoverOpacity),
+            // Reset on touch devices, it doesn't add specificity
+            '@media (hover: none)': {
+              backgroundColor: 'transparent'
+            }
+          }
+        };
+      }
+
+      return null;
+    },
+    contained: function contained(props) {
+      if (['neutral', 'positive', 'middle', 'negative'].includes(props.color)) {
+        return {
+          color: props.disabled ? theme.palette.neutral.contrastText : theme.palette[props.color].contrastText,
+          backgroundColor: props.disabled ? theme.palette.neutral.main : theme.palette[props.color].main,
+          '&:hover': {
+            backgroundColor: theme.palette[props.color].dark,
+            // Reset on touch devices, it doesn't add specificity
+            '@media (hover: none)': {
+              backgroundColor: theme.palette[props.color].main
+            }
+          }
+        };
+      }
 
-  const classes = useStyles();
-  const hcolor = ['positive', 'negative', 'middle', 'neutral'].includes(color) ? 'inherit' : color;
-  const contained = variant === 'contained';
-  const buttonClassNames = classNames(classes.root, {
-    [classes.containedDisabled]: variant === 'contained' && disabled,
-    [classes.textPositive]: (variant === 'text' || variant === 'outlined') && color === 'positive',
-    [classes.textNegative]: (variant === 'text' || variant === 'outlined') && color === 'negative',
-    [classes.textMiddle]: (variant === 'text' || variant === 'outlined') && color === 'middle',
-    [classes.textNeutral]: (variant === 'text' || variant === 'outlined') && (color === 'default' || color === 'neutral'),
-    [classes.containedPrimary]: contained && color === 'primary',
-    [classes.containedPositive]: contained && color === 'positive',
-    [classes.containedNegative]: contained && color === 'negative',
-    [classes.containedMiddle]: contained && color === 'middle',
-    [classes.containedNeutral]: contained && (color === 'default' || color === 'neutral'),
-    [classes.outlinedPositive]: variant === 'outlined' && color === 'positive',
-    [classes.outlinedNegative]: variant === 'outlined' && color === 'negative',
-    [classes.outlinedMiddle]: variant === 'outlined' && color === 'middle',
-    [classes.outlinedNeutral]: variant === 'outlined' && (color === 'default' || color === 'neutral'),
-    [classes.disabled]: disabled
-  });
-  return React.createElement(Button, _extends({
-    className: className,
-    classes: {
-      root: buttonClassNames
+      return null;
     },
-    color: hcolor,
-    variant: variant,
-    disabled: disabled,
-    buttonRef: ref
-  }, other), children);
+    outlined: function outlined(props) {
+      return ['neutral', 'positive', 'middle', 'negative'].includes(props.color) && {
+        color: theme.palette[props.color].main,
+        border: "1px solid ".concat((0, _colorManipulator.fade)(theme.palette[props.color].main, 0.5)),
+        '&:hover': {
+          border: "1px solid ".concat(theme.palette[props.color].main)
+        }
+      };
+    }
+  };
 });
-HiButton.propTypes = process.env.NODE_ENV !== "production" ? {
-  /**
-   * Surcharge des classes
-   */
-  className: PropTypes.string,
+/**
+ * HiButton
+ * Inherited from Button
+ */
+
+exports.useStyles = useStyles;
 
-  /**
-   * The color of the component. It supports those theme colors that make sense for this component.
-   */
-  color: PropTypes.oneOf(['default', 'inherit', 'primary', 'secondary', 'positive', 'negative', 'middle', 'neutral']),
+function HiButton(props) {
+  var classes = useStyles(props);
+  var color = ['neutral', 'positive', 'middle', 'negative'].includes(props.color) ? 'inherit' : props.color;
+  return _react.default.createElement(_Button.default, (0, _extends2.default)({
+    classes: classes
+  }, props, {
+    color: color
+  }));
+}
 
-  /**
-   * The variant to use.
-   */
-  variant: PropTypes.oneOf(['text', 'outlined', 'contained'])
-} : {};
 HiButton.defaultProps = {
-  color: 'neutral',
-  variant: 'text'
+  variant: 'text',
+  color: 'neutral'
 };
-export default HiButton;
+var _default = HiButton;
+exports.default = _default;

package/es/HiButton/index.js

@@ -1 +1,13 @@
-export { default } from './HiButton';
+"use strict";
+
+var _interopRequireDefault = require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _HiButton = _interopRequireDefault(require("./HiButton"));
+
+var _default = _HiButton.default;
+exports.default = _default;

package/es/HiCell/CellAddress.js

@@ -1,14 +1,38 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { withStyles } from '@material-ui/core/styles';
-export const styles = () => ({
-  rightEllipsisSpan: {
-    overflow: 'hidden',
-    textOverflow: 'ellipsis',
-    whiteSpace: 'pre',
-    width: '100%'
-  }
+"use strict";
+
+var _interopRequireDefault = require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
+exports.default = exports.styles = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/getPrototypeOf"));
+
+var _inherits2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/inherits"));
+
+var _defineProperty2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _styles = require("@material-ui/core/styles");
+
+var styles = function styles() {
+  return {
+    rightEllipsisSpan: {
+      overflow: 'hidden',
+      textOverflow: 'ellipsis',
+      whiteSpace: 'pre',
+      width: '100%'
+    }
+  };
+};
 /**
  * Cette cellule permet d'afficher une adresse ou le nom d'un lieu
  * - si le nom du lieu est défini, on affiche le lieu et la ville
@@ -16,81 +40,59 @@ export const styles = () => ({
  * - tous les champs définis sont affichés dans le tooltip
  */
 
-class CellAddress extends React.PureComponent {
-  render() {
-    const {
-      classes,
-      streetAddress,
-      name,
-      city,
-      postalCode,
-      view,
-      country,
-      isoCountry
-    } = this.props;
-    const labelItems = (view === 'l' ? [name, city, country] : [name, city, isoCountry]).filter(item => item !== undefined);
-    const label = labelItems && labelItems.length > 0 ? labelItems.join(', ') : '';
-    let title = '';
-    if (name) title += `${name}\n`;
-    if (streetAddress) title += `${streetAddress}\n`;
-    if (city && postalCode) title += `${city}, ${postalCode}\n`;
-    if (city && !postalCode) title += `${city}\n`;
-    if (postalCode && !city) title += `${postalCode}\n`;
-    if (country && isoCountry) title += `${country}, ${isoCountry}`;
-    if (country && !isoCountry) title += country;
-    if (isoCountry && !country) title += isoCountry;
-    return React.createElement("div", {
-      className: classes.rightEllipsisSpan,
-      title: title
-    }, label);
+
+exports.styles = styles;
+
+var CellAddress =
+/*#__PURE__*/
+function (_React$PureComponent) {
+  (0, _inherits2.default)(CellAddress, _React$PureComponent);
+
+  function CellAddress() {
+    (0, _classCallCheck2.default)(this, CellAddress);
+    return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(CellAddress).apply(this, arguments));
   }
 
-}
+  (0, _createClass2.default)(CellAddress, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          classes = _this$props.classes,
+          streetAddress = _this$props.streetAddress,
+          name = _this$props.name,
+          city = _this$props.city,
+          postalCode = _this$props.postalCode,
+          view = _this$props.view,
+          country = _this$props.country,
+          isoCountry = _this$props.isoCountry;
+      var labelItems = (view === 'l' ? [name, city, country] : [name, city, isoCountry]).filter(function (item) {
+        return item !== undefined;
+      });
+      var label = labelItems && labelItems.length > 0 ? labelItems.join(', ') : '';
+      var title = '';
+      if (name) title += "".concat(name, "\n");
+      if (streetAddress) title += "".concat(streetAddress, "\n");
+      if (city && postalCode) title += "".concat(city, ", ").concat(postalCode, "\n");
+      if (city && !postalCode) title += "".concat(city, "\n");
+      if (postalCode && !city) title += "".concat(postalCode, "\n");
+      if (country && isoCountry) title += "".concat(country, ", ").concat(isoCountry);
+      if (country && !isoCountry) title += country;
+      if (isoCountry && !country) title += isoCountry;
+      return _react.default.createElement("div", {
+        className: classes.rightEllipsisSpan,
+        title: title
+      }, label);
+    }
+  }]);
+  return CellAddress;
+}(_react.default.PureComponent);
 
-CellAddress.defaultProps = {
+(0, _defineProperty2.default)(CellAddress, "defaultProps", {
   view: 'l'
-};
-CellAddress.propTypes = process.env.NODE_ENV !== "production" ? {
-  /**
-   * Ville
-   */
-  city: PropTypes.string,
-
-  /**
-   * Useful to extend the style applied to components.
-   */
-  classes: PropTypes.object,
-
-  /**
-   * Pays
-   */
-  country: PropTypes.string,
-
-  /**
-   * Code ISO du pays
-   */
-  isoCountry: PropTypes.string,
-
-  /**
-   * Nom du lieu
-   */
-  name: PropTypes.string,
-
-  /**
-   * Code postal
-   */
-  postalCode: PropTypes.string,
-
-  /**
-   * Numéro et nom de la rue
-   */
-  streetAddress: PropTypes.string,
-
-  /**
-   * View (L/M/S)
-   */
-  view: PropTypes.oneOf(['l', 'm', 's'])
-} : {};
-export default withStyles(styles, {
+});
+
+var _default = (0, _styles.withStyles)(styles, {
   name: 'HmuiCellAddress'
-})(CellAddress);
+})(CellAddress);
+
+exports.default = _default;