techsbcn-storybook 0.14.9 → 0.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/tables/TableComponent/TableComponent.d.ts +1 -0
- package/dist/data/Routes.d.ts +2 -0
- package/dist/data/SelectMock.d.ts +2 -0
- package/dist/data/index.d.ts +1 -0
- package/dist/techsbcn-storybook.cjs.development.js +27 -17
- package/dist/techsbcn-storybook.cjs.development.js.map +1 -1
- package/dist/techsbcn-storybook.cjs.production.min.js +1 -1
- package/dist/techsbcn-storybook.cjs.production.min.js.map +1 -1
- package/dist/techsbcn-storybook.esm.js +27 -17
- package/dist/techsbcn-storybook.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/tables/ImageTableComponent/ImageTableComponent.tsx +11 -6
- package/src/components/tables/SimpleTableComponent/SimpleTableComponent.tsx +4 -2
- package/src/components/tables/TableComponent/TableComponent.tsx +44 -39
- package/src/data/Routes.tsx +6 -0
- package/src/data/SelectMock.tsx +26 -0
- package/src/data/UserList.tsx +6 -0
- package/src/data/index.ts +1 -0
- package/src/stories/Tables/Tables.stories.tsx +13 -2
|
@@ -6,4 +6,6 @@ interface ColourOption {
|
|
|
6
6
|
export declare const colourOptions: ColourOption[];
|
|
7
7
|
export declare const ResponseHandler: (response: any) => any;
|
|
8
8
|
export declare const SearchSimple: (_filters: SearchFilters) => Promise<SearchSimpleResult[]>;
|
|
9
|
+
export declare const ResponseBlobHandler: (response: any) => any;
|
|
10
|
+
export declare const readFile: (guid: string) => Promise<any>;
|
|
9
11
|
export {};
|
package/dist/data/index.d.ts
CHANGED
|
@@ -375,12 +375,16 @@ var ImageTableComponent = function ImageTableComponent(props) {
|
|
|
375
375
|
setImage = _useState2[1];
|
|
376
376
|
|
|
377
377
|
React.useEffect(function () {
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
378
|
+
if (!image) {
|
|
379
|
+
setLoading(true);
|
|
380
|
+
props.readFile(props.guid).then(function (result) {
|
|
381
|
+
setImage(props.convertImage ? props.convertImage(result) : result);
|
|
382
|
+
setLoading(false);
|
|
383
|
+
})["catch"](function () {
|
|
384
|
+
return setLoading(false);
|
|
385
|
+
});
|
|
386
|
+
}
|
|
387
|
+
}, [props, image]);
|
|
384
388
|
return React__default.createElement(material.Box, {
|
|
385
389
|
className: "images-table-component"
|
|
386
390
|
}, loading ? React__default.createElement(material.Box, {
|
|
@@ -635,11 +639,12 @@ var TableComponent = function TableComponent(props) {
|
|
|
635
639
|
}, React__default.createElement(_.Hidden, {
|
|
636
640
|
smDown: true
|
|
637
641
|
}, React__default.createElement(_.TableHead, null, React__default.createElement(_.TableRow, null, props.columns.map(function (column) {
|
|
638
|
-
var _props$isCheckTable10, _props$isCheckTable11, _props$isCheckTable12;
|
|
642
|
+
var _ref, _props$isCheckTable10, _props$isCheckTable11, _props$isCheckTable12;
|
|
639
643
|
|
|
644
|
+
var guid = Math.random().toString(36).substring(7);
|
|
640
645
|
return React__default.createElement(_.TableCell, {
|
|
641
646
|
className: "table-column",
|
|
642
|
-
key: column.isUnique ?
|
|
647
|
+
key: column.isUnique ? guid : column.id,
|
|
643
648
|
align: column.align ? column.align : 'center',
|
|
644
649
|
style: {
|
|
645
650
|
minWidth: column.minWidth,
|
|
@@ -647,10 +652,12 @@ var TableComponent = function TableComponent(props) {
|
|
|
647
652
|
}
|
|
648
653
|
}, column.id !== 'actions' && !column.isCheck && !column.isActiveFunction && !column.noSort ? React__default.createElement(_.TableSortLabel, {
|
|
649
654
|
className: "table-header-cell",
|
|
650
|
-
active: filters.orderBy === column.id,
|
|
655
|
+
active: (_ref = filters.orderBy === column.orderBy) != null ? _ref : column.id,
|
|
651
656
|
direction: filters.orderAsc ? 'asc' : 'desc',
|
|
652
657
|
onClick: function onClick() {
|
|
653
|
-
|
|
658
|
+
var _column$orderBy;
|
|
659
|
+
|
|
660
|
+
return createSortHandler((_column$orderBy = column.orderBy) != null ? _column$orderBy : column.id);
|
|
654
661
|
},
|
|
655
662
|
hideSortIcon: true
|
|
656
663
|
}, column.label) : column.isCheck ? React__default.createElement(_.Box, {
|
|
@@ -683,9 +690,10 @@ var TableComponent = function TableComponent(props) {
|
|
|
683
690
|
}, props.columns.map(function (column) {
|
|
684
691
|
var value = ObjectbyString(row, column.id);
|
|
685
692
|
var isItemSelected = column.isCheck && isSelected(row.id);
|
|
693
|
+
var guid = Math.random().toString(36).substring(7);
|
|
686
694
|
return React__default.createElement(_.TableCell, {
|
|
687
695
|
className: "table-cell",
|
|
688
|
-
key: column.isUnique ?
|
|
696
|
+
key: column.isUnique ? guid : column.id,
|
|
689
697
|
sx: {
|
|
690
698
|
textAlign: {
|
|
691
699
|
xs: 'left',
|
|
@@ -749,10 +757,10 @@ var TableComponent = function TableComponent(props) {
|
|
|
749
757
|
count: props.totalCount,
|
|
750
758
|
rowsPerPage: props.baseFilters.limit,
|
|
751
759
|
labelRowsPerPage: props.values.SHOWING,
|
|
752
|
-
labelDisplayedRows: function labelDisplayedRows(
|
|
753
|
-
var from =
|
|
754
|
-
to =
|
|
755
|
-
count =
|
|
760
|
+
labelDisplayedRows: function labelDisplayedRows(_ref2) {
|
|
761
|
+
var from = _ref2.from,
|
|
762
|
+
to = _ref2.to,
|
|
763
|
+
count = _ref2.count;
|
|
756
764
|
return props.values.TABLE_LABEL_DISPLAY(from, to, count);
|
|
757
765
|
},
|
|
758
766
|
page: props.baseFilters.page - 1,
|
|
@@ -1011,9 +1019,10 @@ var SimpleTableComponent = function SimpleTableComponent(props) {
|
|
|
1011
1019
|
if (column.id) {
|
|
1012
1020
|
var _props$isCheckTable13, _props$isCheckTable14, _props$isCheckTable15, _props$isCheckTable16;
|
|
1013
1021
|
|
|
1022
|
+
var guid = Math.random().toString(36).substring(7);
|
|
1014
1023
|
return React__default.createElement(_.TableCell, {
|
|
1015
1024
|
className: "table-column",
|
|
1016
|
-
key: column.isUnique ?
|
|
1025
|
+
key: column.isUnique ? guid : column.id,
|
|
1017
1026
|
align: column.align ? column.align : 'center',
|
|
1018
1027
|
style: {
|
|
1019
1028
|
minWidth: column.minWidth,
|
|
@@ -1057,9 +1066,10 @@ var SimpleTableComponent = function SimpleTableComponent(props) {
|
|
|
1057
1066
|
if (column.id) {
|
|
1058
1067
|
var value = ObjectbyString(row, column.id);
|
|
1059
1068
|
var isItemSelected = column.isCheck && isSelected(row.id);
|
|
1069
|
+
var guid = Math.random().toString(36).substring(7);
|
|
1060
1070
|
return React__default.createElement(_.TableCell, {
|
|
1061
1071
|
className: "table-cell",
|
|
1062
|
-
key: column.isUnique ?
|
|
1072
|
+
key: column.isUnique ? guid : column.id,
|
|
1063
1073
|
sx: {
|
|
1064
1074
|
textAlign: {
|
|
1065
1075
|
xs: 'left',
|