@hipay/hipay-material-ui 2.2.0-beta-core2 → 2.2.0-beta-core4

package/es/index.js

@@ -13,6 +13,7 @@ export { default as HiMap } from './HiMap/HiMap';
 export { default as HiMapExpand } from './HiMap/HiMapExpand';
 export { default as HiTextField } from './HiForm/HiTextField';
 export { default as HiPasswordField } from './HiForm/HiPasswordField';
+export { default as HiPdfReader } from './HiPdfReader/HiPdfReader';
 export { default as HiSlider } from './HiForm/HiSlider';
 export { default as HiSwitch } from './HiSwitch';
 export { default as HiSwitchState } from './HiSwitch/HiSwitchState';
@@ -20,7 +21,6 @@ export { default as HiTable } from './HiTable/HiTable';
 export { default as HiDotsStepper } from './HiDotsStepper/HiDotsStepper';
 export { default as HiDot } from './HiDotsStepper/HiDot';
 export { default as withMobileDialog } from './withMobileDialog';
-export { default as withWidth } from './withWidth';
 export { default as HiDatePicker } from './HiDatePicker/HiDatePicker';
 export { default as HiDateRangePicker } from './HiDatePicker/HiDateRangePicker';
 export { default as HiDateRangeSelector } from './HiDatePicker/HiDateRangeSelector';

package/es/withMobileDialog/withMobileDialog.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import PropTypes from 'prop-types';
-import withWidth, { isWidthDown } from '../withWidth';
+import withWidth, { isWidthDown } from '@material-ui/core/withWidth';
 /**
  * Dialog will responsively be full screen *at or below* the given breakpoint
  * (defaults to 'sm' for mobile devices).

package/index.es.js

@@ -1,4 +1,4 @@
-/** @license HiPay-Material-UI v2.2.0-beta-core
+/** @license HiPay-Material-UI v2.2.0-beta-core4
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -18,6 +18,7 @@ export { default as HiMap } from './HiMap/HiMap';
 export { default as HiMapExpand } from './HiMap/HiMapExpand';
 export { default as HiTextField } from './HiForm/HiTextField';
 export { default as HiPasswordField } from './HiForm/HiPasswordField';
+export { default as HiPdfReader } from './HiPdfReader/HiPdfReader';
 export { default as HiSlider } from './HiForm/HiSlider';
 export { default as HiSwitch } from './HiSwitch';
 export { default as HiSwitchState } from './HiSwitch/HiSwitchState';
@@ -25,7 +26,6 @@ export { default as HiTable } from './HiTable/HiTable';
 export { default as HiDotsStepper } from './HiDotsStepper/HiDotsStepper';
 export { default as HiDot } from './HiDotsStepper/HiDot';
 export { default as withMobileDialog } from './withMobileDialog';
-export { default as withWidth } from './withWidth';
 export { default as HiDatePicker } from './HiDatePicker/HiDatePicker';
 export { default as HiDateRangePicker } from './HiDatePicker/HiDateRangePicker';
 export { default as HiDateRangeSelector } from './HiDatePicker/HiDateRangeSelector';

package/index.js

@@ -1,4 +1,4 @@
-/** @license HiPay-Material-UI v2.2.0-beta-core
+/** @license HiPay-Material-UI v2.2.0-beta-core4
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -136,6 +136,12 @@ Object.defineProperty(exports, "HiPasswordField", {
     return _HiPasswordField.default;
   }
 });
+Object.defineProperty(exports, "HiPdfReader", {
+  enumerable: true,
+  get: function get() {
+    return _HiPdfReader.default;
+  }
+});
 Object.defineProperty(exports, "HiSlider", {
   enumerable: true,
   get: function get() {
@@ -178,12 +184,6 @@ Object.defineProperty(exports, "withMobileDialog", {
     return _withMobileDialog.default;
   }
 });
-Object.defineProperty(exports, "withWidth", {
-  enumerable: true,
-  get: function get() {
-    return _withWidth.default;
-  }
-});
 Object.defineProperty(exports, "HiDatePicker", {
   enumerable: true,
   get: function get() {
@@ -239,6 +239,8 @@ var _HiTextField = _interopRequireDefault(require("./HiForm/HiTextField"));
 
 var _HiPasswordField = _interopRequireDefault(require("./HiForm/HiPasswordField"));
 
+var _HiPdfReader = _interopRequireDefault(require("./HiPdfReader/HiPdfReader"));
+
 var _HiSlider = _interopRequireDefault(require("./HiForm/HiSlider"));
 
 var _HiSwitch = _interopRequireDefault(require("./HiSwitch"));
@@ -253,8 +255,6 @@ var _HiDot = _interopRequireDefault(require("./HiDotsStepper/HiDot"));
 
 var _withMobileDialog = _interopRequireDefault(require("./withMobileDialog"));
 
-var _withWidth = _interopRequireDefault(require("./withWidth"));
-
 var _HiDatePicker = _interopRequireDefault(require("./HiDatePicker/HiDatePicker"));
 
 var _HiDateRangePicker = _interopRequireDefault(require("./HiDatePicker/HiDateRangePicker"));

package/package.json

@@ -1,8 +1,7 @@
 {
   "name": "@hipay/hipay-material-ui",
-  "private": false,
   "author": "HiPay PSYCHE Team",
-  "version": "2.2.0-beta-core2",
+  "version": "2.2.0-beta-core4",
   "description": "React components that implement Google's Material Design.",
   "keywords": [
     "react",
@@ -60,6 +59,7 @@
     "react-jss": "^8.1.0",
     "react-lazyload": "^2.5.0",
     "react-leaflet": "^2.3.0",
+    "react-pdf": "^3.0.5",
     "react-spinners": "^0.4.5",
     "react-transition-group": "^2.2.1",
     "recompose": "^0.29.0",

package/withMobileDialog/withMobileDialog.js

@@ -15,7 +15,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _withWidth = _interopRequireWildcard(require("../withWidth"));
+var _withWidth = _interopRequireWildcard(require("@material-ui/core/withWidth"));
 
 /**
  * Dialog will responsively be full screen *at or below* the given breakpoint

package/es/withWidth/index.js

@@ -1,2 +0,0 @@
-export { default } from './withWidth';
-export * from './withWidth';

package/es/withWidth/withWidth.js

@@ -1,176 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectSpread from "@babel/runtime/helpers/objectSpread";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-
-/* eslint-disable react/no-did-mount-set-state */
-import React from 'react';
-import PropTypes from 'prop-types';
-import EventListener from 'react-event-listener';
-import debounce from 'debounce'; // < 1kb payload overhead when lodash/debounce is > 3kb.
-
-import wrapDisplayName from 'recompose/wrapDisplayName';
-import hoistNonReactStatics from 'hoist-non-react-statics';
-import withTheme from '@material-ui/core/styles/withTheme';
-import { keys as breakpointKeys } from '@material-ui/core/styles/createBreakpoints';
-import getThemeProps from '@material-ui/core/styles/getThemeProps'; // By default, returns true if screen width is the same or greater than the given breakpoint.
-
-export const isWidthUp = (breakpoint, width, inclusive = true) => {
-  if (inclusive) {
-    return breakpointKeys.indexOf(breakpoint) <= breakpointKeys.indexOf(width);
-  }
-
-  return breakpointKeys.indexOf(breakpoint) < breakpointKeys.indexOf(width);
-}; // By default, returns true if screen width is the same or less than the given breakpoint.
-
-export const isWidthDown = (breakpoint, width, inclusive = true) => {
-  if (inclusive) {
-    return breakpointKeys.indexOf(width) <= breakpointKeys.indexOf(breakpoint);
-  }
-
-  return breakpointKeys.indexOf(width) < breakpointKeys.indexOf(breakpoint);
-};
-
-const withWidth = (options = {}) => Component => {
-  const {
-    withTheme: withThemeOption = false,
-    noSSR = false,
-    initialWidth: initialWidthOption,
-    resizeInterval = 166 // Corresponds to 10 frames at 60 Hz.
-
-  } = options;
-
-  class WithWidth extends React.Component {
-    constructor(props) {
-      super(props);
-      this.handleResize = debounce(() => {
-        const width = this.getWidth();
-
-        if (width !== this.state.width) {
-          this.setState({
-            width
-          });
-        }
-      }, resizeInterval);
-      this.state = {
-        width: undefined
-      };
-
-      if (noSSR) {
-        this.state.width = this.getWidth();
-      }
-    }
-
-    componentDidMount() {
-      const width = this.getWidth();
-
-      if (width !== this.state.width) {
-        this.setState({
-          width
-        });
-      }
-    }
-
-    componentWillUnmount() {
-      this.handleResize.clear();
-    }
-
-    getWidth(innerWidth = window.innerWidth) {
-      const breakpoints = this.props.theme.breakpoints;
-      let width = null;
-      /**
-       * Start with the slowest value as low end devices often have a small screen.
-       *
-       * innerWidth |xs      sm      md      lg      xl
-       *            |-------|-------|-------|-------|------>
-       * width      |  xs   |  sm   |  md   |  lg   |  xl
-       */
-
-      let index = 1;
-
-      while (width === null && index < breakpointKeys.length) {
-        const currentWidth = breakpointKeys[index]; // @media are inclusive, so reproduce the behavior here.
-
-        if (innerWidth < breakpoints.values[currentWidth]) {
-          width = breakpointKeys[index - 1];
-          break;
-        }
-
-        index += 1;
-      }
-
-      width = width || 'xl';
-      return width;
-    }
-
-    render() {
-      const _this$props = this.props,
-            {
-        initialWidth,
-        theme,
-        width
-      } = _this$props,
-            other = _objectWithoutProperties(_this$props, ["initialWidth", "theme", "width"]);
-
-      const props = _objectSpread({
-        width: width || this.state.width || initialWidth || initialWidthOption || getThemeProps({
-          theme,
-          name: 'MuiWithWidth'
-        }).initialWidth
-      }, other);
-
-      const more = {};
-
-      if (withThemeOption) {
-        more.theme = theme;
-      } // When rendering the component on the server,
-      // we have no idea about the client browser screen width.
-      // In order to prevent blinks and help the reconciliation of the React tree
-      // we are not rendering the child component.
-      //
-      // An alternative is to use the `initialWidth` property.
-
-
-      if (props.width === undefined) {
-        return null;
-      }
-
-      return React.createElement(EventListener, {
-        target: "window",
-        onResize: this.handleResize
-      }, React.createElement(Component, _extends({}, more, props)));
-    }
-
-  }
-
-  WithWidth.propTypes = process.env.NODE_ENV !== "production" ? {
-    /**
-     * As `window.innerWidth` is unavailable on the server,
-     * we default to rendering an empty component during the first mount.
-     * In some situation, you might want to use an heuristic to approximate
-     * the screen width of the client browser screen width.
-     *
-     * For instance, you could be using the user-agent or the client-hints.
-     * http://caniuse.com/#search=client%20hint
-     */
-    initialWidth: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),
-
-    /**
-     * @ignore
-     */
-    theme: PropTypes.object.isRequired,
-
-    /**
-     * Bypass the width calculation logic.
-     */
-    width: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl'])
-  } : {};
-
-  if (process.env.NODE_ENV !== 'production') {
-    WithWidth.displayName = wrapDisplayName(Component, 'WithWidth');
-  }
-
-  hoistNonReactStatics(WithWidth, Component);
-  return withTheme()(WithWidth);
-};
-
-export default withWidth;

package/withWidth/index.js

@@ -1,27 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _exportNames = {};
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _withWidth.default;
-  }
-});
-
-var _withWidth = _interopRequireWildcard(require("./withWidth"));
-
-Object.keys(_withWidth).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _withWidth[key];
-    }
-  });
-});

package/withWidth/withWidth.js

@@ -1,229 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.isWidthDown = exports.isWidthUp = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _reactEventListener = _interopRequireDefault(require("react-event-listener"));
-
-var _debounce = _interopRequireDefault(require("debounce"));
-
-var _wrapDisplayName = _interopRequireDefault(require("recompose/wrapDisplayName"));
-
-var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
-
-var _withTheme = _interopRequireDefault(require("@material-ui/core/styles/withTheme"));
-
-var _createBreakpoints = require("@material-ui/core/styles/createBreakpoints");
-
-var _getThemeProps = _interopRequireDefault(require("@material-ui/core/styles/getThemeProps"));
-
-/* eslint-disable react/no-did-mount-set-state */
-// < 1kb payload overhead when lodash/debounce is > 3kb.
-// By default, returns true if screen width is the same or greater than the given breakpoint.
-var isWidthUp = function isWidthUp(breakpoint, width) {
-  var inclusive = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-
-  if (inclusive) {
-    return _createBreakpoints.keys.indexOf(breakpoint) <= _createBreakpoints.keys.indexOf(width);
-  }
-
-  return _createBreakpoints.keys.indexOf(breakpoint) < _createBreakpoints.keys.indexOf(width);
-}; // By default, returns true if screen width is the same or less than the given breakpoint.
-
-
-exports.isWidthUp = isWidthUp;
-
-var isWidthDown = function isWidthDown(breakpoint, width) {
-  var inclusive = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-
-  if (inclusive) {
-    return _createBreakpoints.keys.indexOf(width) <= _createBreakpoints.keys.indexOf(breakpoint);
-  }
-
-  return _createBreakpoints.keys.indexOf(width) < _createBreakpoints.keys.indexOf(breakpoint);
-};
-
-exports.isWidthDown = isWidthDown;
-
-var withWidth = function withWidth() {
-  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return function (Component) {
-    var _options$withTheme = options.withTheme,
-        withThemeOption = _options$withTheme === void 0 ? false : _options$withTheme,
-        _options$noSSR = options.noSSR,
-        noSSR = _options$noSSR === void 0 ? false : _options$noSSR,
-        initialWidthOption = options.initialWidth,
-        _options$resizeInterv = options.resizeInterval,
-        resizeInterval = _options$resizeInterv === void 0 ? 166 : _options$resizeInterv;
-
-    var WithWidth =
-    /*#__PURE__*/
-    function (_React$Component) {
-      (0, _inherits2.default)(WithWidth, _React$Component);
-
-      function WithWidth(props) {
-        var _this;
-
-        (0, _classCallCheck2.default)(this, WithWidth);
-        _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(WithWidth).call(this, props));
-        _this.handleResize = (0, _debounce.default)(function () {
-          var width = _this.getWidth();
-
-          if (width !== _this.state.width) {
-            _this.setState({
-              width: width
-            });
-          }
-        }, resizeInterval);
-        _this.state = {
-          width: undefined
-        };
-
-        if (noSSR) {
-          _this.state.width = _this.getWidth();
-        }
-
-        return _this;
-      }
-
-      (0, _createClass2.default)(WithWidth, [{
-        key: "componentDidMount",
-        value: function componentDidMount() {
-          var width = this.getWidth();
-
-          if (width !== this.state.width) {
-            this.setState({
-              width: width
-            });
-          }
-        }
-      }, {
-        key: "componentWillUnmount",
-        value: function componentWillUnmount() {
-          this.handleResize.clear();
-        }
-      }, {
-        key: "getWidth",
-        value: function getWidth() {
-          var innerWidth = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window.innerWidth;
-          var breakpoints = this.props.theme.breakpoints;
-          var width = null;
-          /**
-           * Start with the slowest value as low end devices often have a small screen.
-           *
-           * innerWidth |xs      sm      md      lg      xl
-           *            |-------|-------|-------|-------|------>
-           * width      |  xs   |  sm   |  md   |  lg   |  xl
-           */
-
-          var index = 1;
-
-          while (width === null && index < _createBreakpoints.keys.length) {
-            var currentWidth = _createBreakpoints.keys[index]; // @media are inclusive, so reproduce the behavior here.
-
-            if (innerWidth < breakpoints.values[currentWidth]) {
-              width = _createBreakpoints.keys[index - 1];
-              break;
-            }
-
-            index += 1;
-          }
-
-          width = width || 'xl';
-          return width;
-        }
-      }, {
-        key: "render",
-        value: function render() {
-          var _this$props = this.props,
-              initialWidth = _this$props.initialWidth,
-              theme = _this$props.theme,
-              width = _this$props.width,
-              other = (0, _objectWithoutProperties2.default)(_this$props, ["initialWidth", "theme", "width"]);
-          var props = (0, _extends2.default)({
-            width: width || this.state.width || initialWidth || initialWidthOption || (0, _getThemeProps.default)({
-              theme: theme,
-              name: 'MuiWithWidth'
-            }).initialWidth
-          }, other);
-          var more = {};
-
-          if (withThemeOption) {
-            more.theme = theme;
-          } // When rendering the component on the server,
-          // we have no idea about the client browser screen width.
-          // In order to prevent blinks and help the reconciliation of the React tree
-          // we are not rendering the child component.
-          //
-          // An alternative is to use the `initialWidth` property.
-
-
-          if (props.width === undefined) {
-            return null;
-          }
-
-          return _react.default.createElement(_reactEventListener.default, {
-            target: "window",
-            onResize: this.handleResize
-          }, _react.default.createElement(Component, (0, _extends2.default)({}, more, props)));
-        }
-      }]);
-      return WithWidth;
-    }(_react.default.Component);
-
-    WithWidth.propTypes = process.env.NODE_ENV !== "production" ? {
-      /**
-       * As `window.innerWidth` is unavailable on the server,
-       * we default to rendering an empty component during the first mount.
-       * In some situation, you might want to use an heuristic to approximate
-       * the screen width of the client browser screen width.
-       *
-       * For instance, you could be using the user-agent or the client-hints.
-       * http://caniuse.com/#search=client%20hint
-       */
-      initialWidth: _propTypes.default.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),
-
-      /**
-       * @ignore
-       */
-      theme: _propTypes.default.object.isRequired,
-
-      /**
-       * Bypass the width calculation logic.
-       */
-      width: _propTypes.default.oneOf(['xs', 'sm', 'md', 'lg', 'xl'])
-    } : {};
-
-    if (process.env.NODE_ENV !== 'production') {
-      WithWidth.displayName = (0, _wrapDisplayName.default)(Component, 'WithWidth');
-    }
-
-    (0, _hoistNonReactStatics.default)(WithWidth, Component);
-    return (0, _withTheme.default)()(WithWidth);
-  };
-};
-
-var _default = withWidth;
-exports.default = _default;