@hipay/hipay-material-ui 1.0.0-beta.9 → 2.0.0-beta.36

package/es/HiTable/BodyCells/CellAddress.js

@@ -1,129 +0,0 @@
-// @inheritedComponent CellLayout
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import Tooltip from '../../Tooltip';
-import * as cst from '../constants';
-import withStyles from '../../styles/withStyles';
-import CellLayout from './CellLayout';
-
-export const styles = theme => ({
-    rightEllipsisSpan: {
-        display: 'inline-block',
-        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
- * - sinon on affiche la ville et le pays
- * - 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;
-
-        let label = '';
-        if (typeof name !== 'undefined') {
-            label = name + ', ';
-        }
-        if (typeof city !== 'undefined') {
-            label += city;
-        }
-        if (typeof name === 'undefined' && typeof country !== 'undefined' && view === cst.VIEWS.LARGE) {
-            if (label !== '') label += ', ';
-            label += country;
-        } else if (typeof name === 'undefined' && typeof isoCountry !== 'undefined' && view !== cst.VIEWS.LARGE) {
-            if (label !== '') label += ', ';
-            label += isoCountry;
-        }
-
-        let tooltipContent = React.createElement(
-            'div',
-            null,
-            React.createElement(
-                'div',
-                null,
-                name
-            ),
-            React.createElement(
-                'div',
-                null,
-                streetAddress
-            ),
-            React.createElement(
-                'div',
-                null,
-                React.createElement(
-                    'span',
-                    null,
-                    city + ', '
-                ),
-                React.createElement(
-                    'span',
-                    null,
-                    postalCode
-                )
-            ),
-            React.createElement(
-                'div',
-                null,
-                country
-            )
-        );
-
-        return React.createElement(
-            Tooltip,
-            { title: tooltipContent, placement: this.props.sticky ? 'right' : 'bottom' },
-            React.createElement(
-                'div',
-                { className: classes.rightEllipsisSpan },
-                label
-            )
-        );
-    }
-}
-
-CellAddress.defaultProps = {
-    view: 'l'
-};
-CellAddress.propTypes = process.env.NODE_ENV !== "production" ? {
-    /**
-     * Useful to extend the style applied to components.
-     */
-    classes: PropTypes.object,
-    /**
-     * Numéro et nom de la rue
-     */
-    streetAddress: PropTypes.string,
-    /**
-     * Nom du lieu
-     */
-    name: PropTypes.string,
-    /**
-     * Ville
-     */
-    city: PropTypes.string,
-    /**
-     * Code postal
-     */
-    postalCode: PropTypes.string,
-    /**
-     * Pays
-     */
-    country: PropTypes.string,
-    /**
-     * Code ISO du pays
-     */
-    isoCountry: PropTypes.string,
-    /**
-     * View (L/M/S)
-     */
-    view: PropTypes.oneOf(['l', 'm', 's'])
-} : {};
-export default withStyles(styles, { name: 'HmuiCellAddress' })(CellAddress);

package/es/HiTable/BodyCells/CellCountry.js

@@ -1,107 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import CellImage from './CellImage';
-import Tooltip from '../../Tooltip';
-import withStyles from '../../styles/withStyles';
-import * as cst from '../constants';
-
-export const styles = theme => ({
-    img: {
-        width: 24,
-        height: 'auto',
-        float: 'left'
-    },
-    label: {
-        marginLeft: 5
-    },
-    tooltipImg: {
-        width: 24,
-        height: 'auto',
-        float: 'left',
-        marginTop: 2
-    },
-    tooltipLabel: {
-        marginLeft: 5,
-        position: 'relative',
-        bottom: 2,
-        verticalAlign: 'middle'
-    },
-    wrapper: {
-        whiteSpace: 'nowrap',
-        overflow: "hidden",
-        textOverflow: "ellipsis"
-    }
-});
-
-/**
- * Cette cellule permet d'afficher une image/logo (24px largeur) et un label (optionnel) pour un pays
- *
- * en vue large : Affiche l'image et la valeur longue (value), pas de tooltip
- *
- * en vue medium : Affiche la valeur longue uniquement (value), tooltip = Image + Value
- *
- * en vue small : Affiche la valeur courte (id),  tooltip = Image + Value
- *
- */
-class CellCountry extends React.PureComponent {
-
-    render() {
-        const { classes, value, isoCode, view } = this.props;
-
-        let path = '/static/hmu/images/countries/' + isoCode.toLowerCase() + '.svg';
-
-        let tooltipContent = React.createElement(
-            'div',
-            null,
-            React.createElement('img', { src: path, className: classes.tooltipImg }),
-            React.createElement(
-                'span',
-                { className: classes.tooltipLabel },
-                value
-            )
-        );
-
-        if (view === cst.VIEWS.LARGE) {
-            return React.createElement(CellImage, { view: cst.VIEWS.LARGE, value: value, path: path });
-        } else {
-            let valueElement = value;
-            if (view === cst.VIEWS.SMALL) {
-                valueElement = isoCode.toUpperCase();
-            }
-            return React.createElement(
-                Tooltip,
-                { title: tooltipContent, placement: this.props.sticky ? 'right' : 'bottom' },
-                React.createElement(
-                    'div',
-                    { className: classes.wrapper },
-                    React.createElement(
-                        'span',
-                        { className: classes.label },
-                        valueElement
-                    )
-                )
-            );
-        }
-    }
-}
-
-CellCountry.propTypes = process.env.NODE_ENV !== "production" ? {
-    /**
-     * Useful to extend the style applied to components.
-     */
-    classes: PropTypes.object,
-    /**
-     * Label
-     */
-    value: PropTypes.string.isRequired,
-    /**
-     * Code ISO
-     */
-    isoCode: PropTypes.string.isRequired,
-    /**
-     * View (L/M/S)
-     */
-    view: PropTypes.oneOf(['l', 'm', 's'])
-} : {};
-export default withStyles(styles, { name: 'HmuiCellCountry' })(CellCountry);

package/es/HiTable/BodyCells/CellDate.js

@@ -1,111 +0,0 @@
-import _extends from 'babel-runtime/helpers/extends';
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import withStyles from '../../styles/withStyles';
-import Tooltip from '../../Tooltip';
-import * as cst from '../constants';
-
-export const styles = theme => ({
-    rightEllipsisSpan: {
-        display: 'inline-block',
-        overflow: 'hidden',
-        textOverflow: 'ellipsis',
-        whiteSpace: 'pre',
-        width: '100%'
-    }
-});
-
-/**
- * Cette cellule permet d'afficher une date en fonction de la locale de l'utilisateur
- */
-class CellDate extends React.Component {
-
-    render() {
-        const { classes, displayTime, value, locale, view } = this.props;
-
-        const date = new Date(value);
-
-        let options = _extends({
-            weekday: 'long',
-            year: 'numeric',
-            month: 'long',
-            day: '2-digit'
-        }, displayTime && {
-            hour: '2-digit',
-            minute: '2-digit',
-            second: '2-digit'
-        });
-        const titleValue = date.toLocaleString(locale, options);
-        let displayedValue = titleValue;
-        if (view === cst.VIEWS.SMALL) {
-            options = _extends({
-                year: '2-digit',
-                month: '2-digit',
-                day: '2-digit'
-            }, displayTime && {
-                hour: '2-digit',
-                minute: '2-digit'
-            });
-            displayedValue = date.toLocaleString(locale, options);
-        } else if (view === cst.VIEWS.MEDIUM) {
-            options = _extends({
-                year: 'numeric',
-                month: '2-digit',
-                day: '2-digit'
-            }, displayTime && {
-                hour: '2-digit',
-                minute: '2-digit',
-                second: '2-digit'
-            });
-            displayedValue = date.toLocaleString(locale, options);
-        }
-
-        if (view === cst.VIEWS.LARGE) {
-            return React.createElement(
-                'div',
-                { className: classes.rightEllipsisSpan },
-                displayedValue
-            );
-        }
-
-        return React.createElement(
-            Tooltip,
-            { title: titleValue, placement: this.props.sticky ? 'right' : 'bottom' },
-            React.createElement(
-                'div',
-                { className: classes.rightEllipsisSpan },
-                displayedValue
-            )
-        );
-    }
-}
-
-CellDate.defaultProps = {
-    displayTime: false,
-    locale: 'en-EN',
-    view: 'l'
-};
-CellDate.propTypes = process.env.NODE_ENV !== "production" ? {
-    /**
-     * Useful to extend the style applied to components.
-     */
-    classes: PropTypes.object,
-    /**
-     * Affiche l'heure
-     */
-    displayTime: PropTypes.bool,
-    /**
-     * Locale BCP 47
-     */
-    locale: PropTypes.string,
-    /**
-     * Volume/Amount
-     */
-    value: PropTypes.string.isRequired,
-    /**
-     * View (L/M/S)
-     */
-    view: PropTypes.oneOf(['l', 'm', 's'])
-} : {};
-export default withStyles(styles, { name: 'HmuiCellDate' })(CellDate);

package/es/HiTable/BodyCells/CellIcon.js

@@ -1,83 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import Tooltip from '../../Tooltip';
-import withStyles from '../../styles/withStyles';
-import * as cst from '../constants';
-import HiIconBuilder from '../../utils/HiIconBuilder';
-
-export const styles = theme => ({
-    icon: {
-        float: 'left'
-    },
-    label: {
-        margin: 5
-    },
-    wrapper: {
-        whiteSpace: 'nowrap',
-        overflow: 'hidden',
-        textOverflow: 'ellipsis'
-    }
-});
-
-/**
- * Cette cellule permet d'afficher une icône et un label (optionnel).
- * En vue small (s) elle affiche uniquement l'icône avec une largeur fixe.
- */
-class CellIcon extends React.PureComponent {
-
-    render() {
-        const { classes, icon, value, view } = this.props;
-
-        const iconElement = React.createElement(HiIconBuilder, { className: classes.icon, icon: icon, size: 18 });
-
-        const tooltipContent = React.createElement(
-            'div',
-            null,
-            iconElement,
-            React.createElement(
-                'span',
-                null,
-                value
-            )
-        );
-
-        return React.createElement(
-            Tooltip,
-            { title: tooltipContent, placement: this.props.sticky ? 'right' : 'bottom' },
-            React.createElement(
-                'div',
-                { className: classes.wrapper },
-                iconElement,
-                view !== cst.VIEWS.SMALL && typeof value !== 'undefined' && React.createElement(
-                    'span',
-                    { className: classes.label },
-                    value
-                )
-            )
-        );
-    }
-}
-
-CellIcon.defaultProps = {
-    view: 'l'
-};
-CellIcon.propTypes = process.env.NODE_ENV !== "production" ? {
-    /**
-     * Useful to extend the style applied to components.
-     */
-    classes: PropTypes.object,
-    /**
-     * Icône name [from material-design-icons](https://materialdesignicons.com/)
-     */
-    icon: PropTypes.string.isRequired,
-    /**
-     * Label
-     */
-    value: PropTypes.string,
-    /**
-     * View (L/M/S)
-     */
-    view: PropTypes.oneOf(['l', 'm', 's'])
-} : {};
-export default withStyles(styles, { name: 'HmuiCellIcon' })(CellIcon);

package/es/HiTable/BodyCells/CellImage.js

@@ -1,115 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import Tooltip from '../../Tooltip';
-import withStyles from '../../styles/withStyles';
-import * as cst from '../constants';
-
-export const styles = theme => ({
-    img: {
-        width: 24,
-        height: 'auto',
-        float: 'left'
-    },
-    smallImg: {
-        width: 24,
-        height: 'auto'
-    },
-    label: {
-        marginLeft: 5
-    },
-    tooltipImg: {
-        width: 24,
-        height: 'auto',
-        float: 'left',
-        marginTop: 2
-    },
-    tooltipLabel: {
-        marginLeft: 5,
-        position: 'relative',
-        bottom: 2,
-        verticalAlign: 'middle'
-
-    },
-    wrapper: {
-        whiteSpace: 'nowrap',
-        overflow: "hidden",
-        textOverflow: "ellipsis"
-    },
-    center: {
-        textAlign: 'center'
-    }
-});
-
-/**
- * Cette cellule permet d'afficher une image/logo (24px largeur) et un label (optionnel).
- * En vue large, aucun tooltip n'est affiché
- * En vue small (s) elle affiche uniquement l'image avec une largeur fixe.
- */
-class CellImage extends React.PureComponent {
-
-    render() {
-        const { classes, path, value, view } = this.props;
-
-        const tooltipContent = React.createElement(
-            'div',
-            null,
-            React.createElement('img', { src: path, alt: value, className: classes.tooltipImg }),
-            React.createElement(
-                'span',
-                { className: classes.tooltipLabel },
-                value
-            )
-        );
-
-        let innerCellElement = null;
-        if (view === cst.VIEWS.SMALL) {
-            innerCellElement = React.createElement(
-                'div',
-                { className: classes.center },
-                React.createElement('img', { src: path, alt: value, className: classes.smallImg })
-            );
-        } else {
-            innerCellElement = React.createElement(
-                'div',
-                { className: classes.wrapper },
-                React.createElement('img', { src: path, alt: value, className: classes.img }),
-                !!value && React.createElement(
-                    'span',
-                    { className: classes.label },
-                    value
-                )
-            );
-        }
-
-        if (view === cst.VIEWS.LARGE) {
-            return innerCellElement;
-        } else {
-            return React.createElement(
-                Tooltip,
-                { title: tooltipContent, placement: this.props.sticky ? 'right' : 'bottom' },
-                innerCellElement
-            );
-        }
-    }
-}
-
-CellImage.propTypes = process.env.NODE_ENV !== "production" ? {
-    /**
-     * Useful to extend the style applied to components.
-     */
-    classes: PropTypes.object,
-    /**
-     * Image path
-     */
-    path: PropTypes.string.isRequired,
-    /**
-     * Label
-     */
-    value: PropTypes.string,
-    /**
-     * View (L/M/S)
-     */
-    view: PropTypes.oneOf(['l', 'm', 's'])
-} : {};
-export default withStyles(styles, { name: 'HmuiCellImage' })(CellImage);