@hipay/hipay-material-ui 1.0.0-beta.1 → 1.0.0-beta.11

package/es/HiPdfReader/HiPdfReader.js

@@ -0,0 +1,198 @@
+import _extends from 'babel-runtime/helpers/extends';
+import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Document, Page } from 'react-pdf';
+import HiButton from '../HiButton';
+import ChevronRightIcon from 'mdi-material-ui/ChevronRight';
+import ChevronLeftIcon from 'mdi-material-ui/ChevronLeft';
+import { CircularProgress } from 'material-ui/Progress';
+import { withStyles } from '../styles';
+
+export const styles = theme => ({
+    root: {
+        position: 'relative'
+    },
+    pageNumber: {
+        position: 'absolute',
+        bottom: 16,
+        left: -24,
+        backgroundColor: '#FFFFFF',
+        borderRadius: 4,
+        paddingTop: 7,
+        paddingBottom: 7,
+        paddingRight: 8,
+        paddingLeft: 8,
+        fontSize: 15,
+        fontFamily: theme.typography.fontFamily,
+        boxShadow: '1px 1px 5px rgba(0, 0, 0, .16)',
+        color: '#737373'
+    },
+    pagesNavigation: {
+        position: 'absolute',
+        top: 16,
+        right: -30,
+        backgroundColor: '#FFFFFF',
+        borderRadius: 3,
+        paddingTop: 4,
+        paddingBottom: 4,
+        paddingRight: 3,
+        paddingLeft: 3,
+        fontFamily: theme.typography.fontFamily,
+        boxShadow: '1px 1px 5px rgba(0, 0, 0, .16)',
+        color: '#737373',
+        '&>button:first-child': {
+            marginRight: 6
+        }
+    },
+    navigationButton: {
+        padding: 0,
+        minWidth: 0,
+        minHeight: 0
+    }
+});
+
+// Constantes utilisées pour le redimentionnement du PDF (format mobile par exemple)
+const maxWindowWidth = 900;
+const maxPdfWidth = 600;
+
+var _ref = React.createElement(CircularProgress, null);
+
+var _ref2 = React.createElement(ChevronLeftIcon, null);
+
+var _ref3 = React.createElement(ChevronRightIcon, null);
+
+class HiPdfReader extends React.PureComponent {
+    constructor(...args) {
+        var _temp;
+
+        return _temp = super(...args), this.state = {
+            numPages: null,
+            pageNumber: 1,
+            error: false,
+            width: 600
+        }, this.handleLoadSuccess = ({ numPages }) => {
+            this.setState({ numPages, error: false });
+        }, this.handleLoadError = () => {
+            this.setState({ error: true });
+        }, this.handleClickNextPage = () => {
+            this.setState({ pageNumber: this.state.pageNumber + 1 });
+        }, this.handleClickPreviousPage = () => {
+            this.setState({ pageNumber: this.state.pageNumber - 1 });
+        }, _temp;
+    }
+
+    // Calculate & Update state of new dimensions
+    updateDimensions() {
+        if (window.innerWidth < maxWindowWidth) {
+            let updateWidth = Math.round(window.innerWidth * 100 / maxWindowWidth / 100 * maxPdfWidth);
+            this.setState({ width: updateWidth });
+        } else {
+            this.setState({ width: maxPdfWidth });
+        }
+    }
+
+    componentDidMount() {
+        this.updateDimensions();
+        window.addEventListener('resize', this.updateDimensions.bind(this));
+    }
+
+    componentWillUnmount() {
+        window.removeEventListener('resize', this.updateDimensions.bind(this));
+    }
+
+    // Fonction appelée une fois le pdf correctement chargé
+
+
+    // Fonction appelée en cas d'erreur de chargement du pdf
+
+
+    // Fonction appelée au clic du bouton pour visualiser la page suivante du pdf
+
+
+    // Fonction appelée au clic du bouton pour visualiser la page précédente du pdf
+
+
+    // Render
+    render() {
+        const { pageNumber, numPages, error } = this.state;
+        const _props = this.props,
+              { classes, file, displayPagination, displayNavigationButtons } = _props,
+              props = _objectWithoutProperties(_props, ['classes', 'file', 'displayPagination', 'displayNavigationButtons']);
+
+        return React.createElement(
+            'div',
+            { className: classes.root },
+            React.createElement(
+                Document,
+                _extends({
+                    className: classes.style,
+                    file: file,
+                    onLoadSuccess: this.handleLoadSuccess,
+                    onLoadError: this.handleLoadError,
+                    loading: _ref
+                }, props),
+                React.createElement(Page, {
+                    pageNumber: pageNumber,
+                    renderAnnotations: false,
+                    renderTextLayer: false,
+                    width: this.state.width
+                })
+            ),
+            !error && numPages > 1 && displayPagination && React.createElement(
+                'span',
+                { className: classes.pageNumber },
+                'Page ',
+                pageNumber,
+                ' sur ',
+                numPages
+            ),
+            !error && numPages > 1 && displayNavigationButtons && React.createElement(
+                'span',
+                { className: classes.pagesNavigation },
+                React.createElement(
+                    HiButton,
+                    {
+                        onClick: this.handleClickPreviousPage,
+                        disabled: pageNumber === 1,
+                        className: classes.navigationButton
+                    },
+                    _ref2
+                ),
+                React.createElement(
+                    HiButton,
+                    {
+                        onClick: this.handleClickNextPage,
+                        disabled: pageNumber === numPages,
+                        className: classes.navigationButton
+                    },
+                    _ref3
+                )
+            )
+        );
+    }
+}
+
+HiPdfReader.defaultProps = {
+    displayPagination: true,
+    displayNavigationButtons: true
+};
+HiPdfReader.propTypes = process.env.NODE_ENV !== "production" ? {
+    /**
+     * Surcharge les classes du composant
+     */
+    classes: PropTypes.object,
+    /**
+     * Chemin vers le fichier PDF
+     */
+    file: PropTypes.string.isRequired,
+    /**
+     * On affiche la pagination si le PDF contient plusieurs pages
+     */
+    displayPagination: PropTypes.bool,
+    /**
+     * On affiche les boutons de navigation entre les pages si le PDF contient plusieurs pages
+     */
+    displayNavigationButtons: PropTypes.bool
+} : {};
+export default withStyles(styles, { name: 'HmuiHiPdfReader', index: 51 })(HiPdfReader);

package/es/HiPdfReader/index.js

@@ -0,0 +1 @@
+export { default } from './HiPdfReader';

package/es/HiPins/HiPins.js

@@ -15,7 +15,6 @@ export const styles = theme => ({
         textAlign: 'center',
         borderRadius: '45px',
         verticalAlign: 'middle',
-        margin: 0.5 * theme.spacing.unit,
         fontSize: 11,
         fontWeight: theme.typography.fontWeightMedium,
         fontFamily: theme.typography.fontFamily