techsbcn-storybook 0.14.7 → 0.15.0

package/dist/components/tables/SearchComponent/SearchComponent.d.ts

@@ -11,6 +11,7 @@ export interface SearchComponentProps {
         singleFilter?: any;
         doubleFilter?: DoubleFilter;
     }[];
+    filtersSize?: number;
     enableAfter?: boolean;
 }
 interface DoubleFilter {

package/dist/components/tables/TableComponent/TableComponent.d.ts

@@ -60,6 +60,7 @@ interface ColumnProps {
         hasColor?: boolean;
         enumSuffix?: string;
     };
+    orderBy?: string;
 }
 interface ActionProps {
     children: React.ReactNode;

package/dist/data/Routes.d.ts

@@ -0,0 +1,2 @@
+import { ObjectKey } from '../interfaces';
+export declare const ROUTES: ObjectKey;

package/dist/data/SelectMock.d.ts

@@ -6,4 +6,6 @@ interface ColourOption {
 export declare const colourOptions: ColourOption[];
 export declare const ResponseHandler: (response: any) => any;
 export declare const SearchSimple: (_filters: SearchFilters) => Promise<SearchSimpleResult[]>;
+export declare const ResponseBlobHandler: (response: any) => any;
+export declare const readFile: (guid: string) => Promise<any>;
 export {};

package/dist/data/index.d.ts

@@ -1,5 +1,6 @@
 export * from './SelectMock';
 export * from './UserList';
 export * from './Values';
+export * from './Routes';
 export * from './enums/scopes';
 export * from './enums/ActiveStatus';

package/dist/techsbcn-storybook.cjs.development.js

@@ -229,13 +229,15 @@ var SearchComponent = function SearchComponent(props) {
   }, React__default.createElement(material.Grid, {
     container: true,
     spacing: 3
-  }, props.filters && props.filters.map(function (filter, i) {
+  }, props.filters && props.filters.length > 0 && props.filters.map(function (filter, i) {
+    var _props$filtersSize, _props$filtersSize2;
+
     return React__default.createElement(material.Grid, {
       item: true,
       key: i,
       xs: 12,
-      sm: 6,
-      xl: 4
+      sm: (_props$filtersSize = props.filtersSize) != null ? _props$filtersSize : 6,
+      xl: (_props$filtersSize2 = props.filtersSize) != null ? _props$filtersSize2 : 4
     }, filter.doubleFilter ? DoubleFilter(filter.doubleFilter) : filter.singleFilter);
   })))));
 };
@@ -373,12 +375,16 @@ var ImageTableComponent = function ImageTableComponent(props) {
       setImage = _useState2[1];
 
   React.useEffect(function () {
-    setLoading(true);
-    props.readFile(props.guid).then(function (result) {
-      setImage(props.convertImage ? props.convertImage(result) : result);
-      setLoading(false);
-    });
-  }, [props]);
+    if (!image) {
+      setLoading(true);
+      props.readFile(props.guid).then(function (result) {
+        setImage(props.convertImage ? props.convertImage(result) : result);
+        setLoading(false);
+      })["catch"](function () {
+        return setLoading(false);
+      });
+    }
+  }, [props, image]);
   return React__default.createElement(material.Box, {
     className: "images-table-component"
   }, loading ? React__default.createElement(material.Box, {
@@ -553,7 +559,9 @@ var TableComponent = function TableComponent(props) {
       return String(value);
     }
 
-    return value;
+    return React__default.createElement(_.Typography, {
+      whiteSpace: "break-spaces"
+    }, value);
   };
 
   var ObjectbyString = function ObjectbyString(o, s) {
@@ -631,11 +639,12 @@ var TableComponent = function TableComponent(props) {
   }, React__default.createElement(_.Hidden, {
     smDown: true
   }, React__default.createElement(_.TableHead, null, React__default.createElement(_.TableRow, null, props.columns.map(function (column) {
-    var _props$isCheckTable10, _props$isCheckTable11, _props$isCheckTable12;
+    var _ref, _props$isCheckTable10, _props$isCheckTable11, _props$isCheckTable12;
 
+    var guid = Math.random().toString(36).substring(7);
     return React__default.createElement(_.TableCell, {
       className: "table-column",
-      key: column.isUnique ? column.id + "-unique" : column.id,
+      key: column.isUnique ? guid : column.id,
       align: column.align ? column.align : 'center',
       style: {
         minWidth: column.minWidth,
@@ -643,10 +652,12 @@ var TableComponent = function TableComponent(props) {
       }
     }, column.id !== 'actions' && !column.isCheck && !column.isActiveFunction && !column.noSort ? React__default.createElement(_.TableSortLabel, {
       className: "table-header-cell",
-      active: filters.orderBy === column.id,
+      active: (_ref = filters.orderBy === column.orderBy) != null ? _ref : column.id,
       direction: filters.orderAsc ? 'asc' : 'desc',
       onClick: function onClick() {
-        return createSortHandler(column.id);
+        var _column$orderBy;
+
+        return createSortHandler((_column$orderBy = column.orderBy) != null ? _column$orderBy : column.id);
       },
       hideSortIcon: true
     }, column.label) : column.isCheck ? React__default.createElement(_.Box, {
@@ -679,9 +690,10 @@ var TableComponent = function TableComponent(props) {
     }, props.columns.map(function (column) {
       var value = ObjectbyString(row, column.id);
       var isItemSelected = column.isCheck && isSelected(row.id);
+      var guid = Math.random().toString(36).substring(7);
       return React__default.createElement(_.TableCell, {
         className: "table-cell",
-        key: column.isUnique ? column.id + "-unique" : column.id,
+        key: column.isUnique ? guid : column.id,
         sx: {
           textAlign: {
             xs: 'left',
@@ -745,10 +757,10 @@ var TableComponent = function TableComponent(props) {
     count: props.totalCount,
     rowsPerPage: props.baseFilters.limit,
     labelRowsPerPage: props.values.SHOWING,
-    labelDisplayedRows: function labelDisplayedRows(_ref) {
-      var from = _ref.from,
-          to = _ref.to,
-          count = _ref.count;
+    labelDisplayedRows: function labelDisplayedRows(_ref2) {
+      var from = _ref2.from,
+          to = _ref2.to,
+          count = _ref2.count;
       return props.values.TABLE_LABEL_DISPLAY(from, to, count);
     },
     page: props.baseFilters.page - 1,
@@ -931,7 +943,9 @@ var SimpleTableComponent = function SimpleTableComponent(props) {
       return String(value);
     }
 
-    return value;
+    return React__default.createElement(_.Typography, {
+      whiteSpace: "break-spaces"
+    }, value);
   };
 
   var ObjectbyString = function ObjectbyString(o, s) {
@@ -1005,9 +1019,10 @@ var SimpleTableComponent = function SimpleTableComponent(props) {
     if (column.id) {
       var _props$isCheckTable13, _props$isCheckTable14, _props$isCheckTable15, _props$isCheckTable16;
 
+      var guid = Math.random().toString(36).substring(7);
       return React__default.createElement(_.TableCell, {
         className: "table-column",
-        key: column.isUnique ? column.id + "-unique" : column.id,
+        key: column.isUnique ? guid : column.id,
         align: column.align ? column.align : 'center',
         style: {
           minWidth: column.minWidth,
@@ -1051,9 +1066,10 @@ var SimpleTableComponent = function SimpleTableComponent(props) {
       if (column.id) {
         var value = ObjectbyString(row, column.id);
         var isItemSelected = column.isCheck && isSelected(row.id);
+        var guid = Math.random().toString(36).substring(7);
         return React__default.createElement(_.TableCell, {
           className: "table-cell",
-          key: column.isUnique ? column.id + "-unique" : column.id,
+          key: column.isUnique ? guid : column.id,
           sx: {
             textAlign: {
               xs: 'left',
@@ -1519,17 +1535,6 @@ var TextSimpleComponent = function TextSimpleComponent(props) {
     });
   }
 
-  var ChildrenValues = function ChildrenValues() {
-    return React__default.createElement(React__default.Fragment, null, props.startIcon && React__default.createElement(_.Box, {
-      mr: 1
-    }, props.startIcon), props.isLoading ? React__default.createElement(_.CircularProgress, {
-      className: "circular-progress-main-color",
-      size: 20
-    }) : props.value, props.endIcon && React__default.createElement(_.Box, {
-      ml: "" + (props.fullWidth ? 'auto' : 1)
-    }, props.endIcon));
-  };
-
   return React__default.createElement(_.Box, {
     className: "text-simple-component",
     display: "flex",
@@ -1546,7 +1551,14 @@ var TextSimpleComponent = function TextSimpleComponent(props) {
     alignItems: "center",
     className: "text-simple-box " + ((_props$className = props.className) != null ? _props$className : '') + " " + (props.noMargin ? 'no-margin' : '') + " " + (props.noBorders || props.skeletonValue && props.skeletonValue.useSkeleton ? 'no-border' : '') + " " + (props.error ? 'has-error-border' : ''),
     width: "" + (props.fullWidth ? 'auto' : 'fit-content')
-  }, props.skeletonValue && props.skeletonValue.useSkeleton ? React__default.createElement(SkeletonCompleteDefault, Object.assign({}, props.skeletonValue)) : React__default.createElement(ChildrenValues, null)), props.helperText && React__default.createElement(_.Box, {
+  }, props.skeletonValue && props.skeletonValue.useSkeleton ? React__default.createElement(SkeletonCompleteDefault, Object.assign({}, props.skeletonValue)) : React__default.createElement(React__default.Fragment, null, props.startIcon && React__default.createElement(_.Box, {
+    mr: 1
+  }, props.startIcon), props.isLoading ? React__default.createElement(_.CircularProgress, {
+    className: "circular-progress-main-color",
+    size: 20
+  }) : props.value, props.endIcon && React__default.createElement(_.Box, {
+    ml: "" + (props.fullWidth ? 'auto' : 1)
+  }, props.endIcon))), props.helperText && React__default.createElement(_.Box, {
     className: "helper-text " + (props.error ? 'has-error' : '')
   }, props.skeletonValue && props.skeletonValue.useSkeleton ? React__default.createElement(_.Skeleton, {
     width: "15%",