@hipay/hipay-material-ui 1.0.0-beta.6 → 1.0.0-beta.8

package/es/HiTable/HiTable.js

@@ -581,7 +581,8 @@ class HiTable extends React.Component {
             translations,
             view,
             groupBy,
-            lookupColumns
+            lookupColumns,
+            loading
         } = this.props;
 
         const { dateUpdate, isScrollToBottom, groupByIds } = this.state;
@@ -652,7 +653,8 @@ class HiTable extends React.Component {
                         groupBy: groupBy,
                         onClickNext: this.handleNextStickyRow,
                         groupByIds: groupByIds,
-                        lookupColumns: lookupColumns
+                        lookupColumns: lookupColumns,
+                        loading: loading
                     }),
                     infiniteScroll && React.createElement(HiTableFooterScroll, {
                         tabId: tabId,
@@ -717,7 +719,8 @@ HiTable.defaultProps = {
         }
     },
     view: 'l',
-    lookupColumns: []
+    lookupColumns: [],
+    loading: false
 };
 HiTable.propTypes = process.env.NODE_ENV !== "production" ? {
     /**
@@ -748,6 +751,10 @@ HiTable.propTypes = process.env.NODE_ENV !== "production" ? {
      * Active le filtre sur les colonnes filtrables
      */
     filterable: PropTypes.bool,
+    /**
+     * Id de la colonne par laquelle sont regroupé les éléments
+     */
+    groupBy: PropTypes.string,
     /**
      * Ajoute le loader et le requestNextDatas en fin de tableau (si infiniteScroll activé)
      */
@@ -760,6 +767,10 @@ HiTable.propTypes = process.env.NODE_ENV !== "production" ? {
      * Ajoute l'infinite scroll
      */
     infiniteScroll: PropTypes.bool,
+    /**
+     * État du tableau en cours de chargement des données
+     */
+    loading: PropTypes.bool,
     /**
      * Identifiant de la ou des colonnes sur la/lesquelles il y a une 'lookup' search
      */
@@ -867,10 +878,6 @@ HiTable.propTypes = process.env.NODE_ENV !== "production" ? {
      * Taille du tableau (L/M/S),
      * définit l'espace entre les cellules et leurs tailles par default
      */
-    view: PropTypes.oneOf(['l', 'm', 's']),
-    /**
-     * Id de la colonne par laquelle sont regroupé les éléments
-     */
-    groupBy: PropTypes.string
+    view: PropTypes.oneOf(['l', 'm', 's'])
 } : {};
 export default withStyles(styles, { withTheme: true, name: 'HmuiHiTable' })(HiTable);

package/es/HiTable/HiTableBody.js

@@ -191,7 +191,8 @@ class HiTableBody extends React.Component {
             numberLocale,
             groupByIds,
             sortedColumnId,
-            lookupColumns
+            lookupColumns,
+            loading
         } = this.props;
 
         const { openedParentRowId, openedDetailsRowIdList } = this.state;
@@ -330,7 +331,11 @@ class HiTableBody extends React.Component {
             {
                 id: `${tabId}-body`,
                 className: classes.tbody,
-                style: { height },
+                style: _extends({
+                    height
+                }, loading && {
+                    opacity: 0.6
+                }),
                 onScroll: onScroll
             },
             tableRows.map(tableRow => {
@@ -349,7 +354,8 @@ HiTableBody.defaultProps = {
     dense: false,
     height: 450,
     sticky: true,
-    view: 'l'
+    view: 'l',
+    loading: false
 };
 HiTableBody.propTypes = process.env.NODE_ENV !== "production" ? {
     /**
@@ -381,6 +387,10 @@ HiTableBody.propTypes = process.env.NODE_ENV !== "production" ? {
      * Hauteur du tableau (px)
      */
     height: PropTypes.number,
+    /**
+     * État du tableau en cours de chargement des données
+     */
+    loading: PropTypes.bool,
     /**
      * Identifiant de la ou des colonnes sur la/lesquelles il y a une 'lookup' search
      */

package/es/HiTable/OrderColumns.js

@@ -63,7 +63,8 @@ export const styles = theme => ({
     controlLabelRoot: {
         marginLeft: 6,
         marginBottom: 8,
-        fontSize: 15
+        fontSize: 15,
+        width: 160
     },
     switchLabelRoot: {
         marginLeft: 15,
@@ -72,7 +73,10 @@ export const styles = theme => ({
     columnLabel: {
         position: 'relative',
         top: 5,
-        left: 5
+        left: 5,
+        overflow: 'hidden',
+        textOverflow: 'ellipsis',
+        whiteSpace: 'nowrap'
     },
     label: {
         fontWeight: 'inherit'

package/es/styles/createHiMuiTheme.js

@@ -238,6 +238,10 @@ const typography = {
     body4: {
         fontSize: 12,
         fontFamily
+    },
+    body5: {
+        fontSize: 11,
+        fontFamily
     }
 };
 

package/index.es.js

@@ -1,4 +1,4 @@
-/** @license Material-UI v1.0.0-beta.5
+/** @license Material-UI v1.0.0-beta.7
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/index.js

@@ -1,4 +1,4 @@
-/** @license Material-UI v1.0.0-beta.5
+/** @license Material-UI v1.0.0-beta.7
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/package.json

@@ -2,7 +2,7 @@
   "name": "@hipay/hipay-material-ui",
   "private": false,
   "author": "HiPay PSYCHE Team",
-  "version": "1.0.0-beta.6",
+  "version": "1.0.0-beta.8",
   "description": "HiPay Material-UI Style Guide - React components that implement Google's Material Design from Material-UI.",
   "main": "./index.js",
   "repository": {

package/styles/createHiMuiTheme.js

@@ -266,6 +266,10 @@ var typography = {
     body4: {
         fontSize: 12,
         fontFamily: fontFamily
+    },
+    body5: {
+        fontSize: 11,
+        fontFamily: fontFamily
     }
 };