@majoo-ui/react 1.55.36 → 1.55.37
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/components/datePicker/InputDatePicker.d.ts +44 -1
- package/components/table/MobileTable.d.ts +3 -1
- package/components/table/Table.d.ts +11 -1
- package/index.esm.js +40 -14
- package/index.umd.js +83 -55
- package/package.json +1 -1
|
@@ -2,6 +2,44 @@ import * as React from 'react';
|
|
|
2
2
|
import { ADVANCE_PICKER, RANGE_PICKER, SINGLE_PICKER, WEEKLY, MONTHLY, DATE_RANGE_PICKER } from './DatePicker';
|
|
3
3
|
import { CSS } from '../../config/stitches.config';
|
|
4
4
|
import { PopoverPlacement } from '../../type/base.types';
|
|
5
|
+
interface TimePickerProps {
|
|
6
|
+
/**
|
|
7
|
+
Resize time picker.
|
|
8
|
+
*/
|
|
9
|
+
size: 'sm' | 'lg';
|
|
10
|
+
/**
|
|
11
|
+
Change handler.
|
|
12
|
+
*/
|
|
13
|
+
onChange: () => void;
|
|
14
|
+
/**
|
|
15
|
+
Time picker default value; support moment format.
|
|
16
|
+
*/
|
|
17
|
+
defaultValue: Date;
|
|
18
|
+
/**
|
|
19
|
+
Time picker value; support moment format.
|
|
20
|
+
*/
|
|
21
|
+
value: Date;
|
|
22
|
+
/**
|
|
23
|
+
Disabled state.
|
|
24
|
+
*/
|
|
25
|
+
disabled: boolean;
|
|
26
|
+
/**
|
|
27
|
+
Disabled hour state.
|
|
28
|
+
*/
|
|
29
|
+
disabledHour: boolean;
|
|
30
|
+
/**
|
|
31
|
+
Disabled minute state.
|
|
32
|
+
*/
|
|
33
|
+
disabledMinute: boolean;
|
|
34
|
+
/**
|
|
35
|
+
Specify the minimum date.
|
|
36
|
+
*/
|
|
37
|
+
minDate: Date;
|
|
38
|
+
/**
|
|
39
|
+
Specify the maximum date.
|
|
40
|
+
*/
|
|
41
|
+
maxDate: Date;
|
|
42
|
+
}
|
|
5
43
|
export interface InputDatePickerProps {
|
|
6
44
|
/**
|
|
7
45
|
* Specify the DatePicker type.
|
|
@@ -63,6 +101,10 @@ export interface InputDatePickerProps {
|
|
|
63
101
|
* If true, the TimePicker component will be visible.
|
|
64
102
|
*/
|
|
65
103
|
showTimePicker?: boolean;
|
|
104
|
+
/**
|
|
105
|
+
* Props that will be passed to the TimePicker component.
|
|
106
|
+
*/
|
|
107
|
+
timePickerProps?: TimePickerProps;
|
|
66
108
|
/**
|
|
67
109
|
* Specify the minimum date.
|
|
68
110
|
*/
|
|
@@ -88,4 +130,5 @@ export interface InputDatePickerProps {
|
|
|
88
130
|
*/
|
|
89
131
|
portalled?: boolean;
|
|
90
132
|
}
|
|
91
|
-
export declare function InputDatePicker({ type, showRangeControl, rangePickerType, placeholder, size, disabled, onChange, defaultValue: defaultDateValue, value: dateValue, defaultDate, date, advanceView, placement, css, showTimePicker, minDate, maxDate, readOnly, isInvalid, allowReset, portalled, }: InputDatePickerProps): JSX.Element;
|
|
133
|
+
export declare function InputDatePicker({ type, showRangeControl, rangePickerType, placeholder, size, disabled, onChange, defaultValue: defaultDateValue, value: dateValue, defaultDate, date, advanceView, placement, css, showTimePicker, timePickerProps, minDate, maxDate, readOnly, isInvalid, allowReset, portalled, }: InputDatePickerProps): JSX.Element;
|
|
134
|
+
export {};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { CSS } from '../../config/stitches.config';
|
|
3
|
-
import { EmptyDataProps, RowGroup } from './Table';
|
|
3
|
+
import { EmptyDataProps, RowGroup, Decoration } from './Table';
|
|
4
4
|
import { TableInstance } from 'react-table';
|
|
5
5
|
interface CustomRowsStyle {
|
|
6
6
|
predicate: boolean;
|
|
@@ -22,6 +22,8 @@ interface MobileTableProps {
|
|
|
22
22
|
renderContextMenu: () => JSX.Element;
|
|
23
23
|
handleRowClick: (row: object, index: number) => void;
|
|
24
24
|
additionalExceptionIds: string[];
|
|
25
|
+
hideHeader?: boolean;
|
|
26
|
+
decoration?: Decoration;
|
|
25
27
|
}
|
|
26
28
|
declare const MobileTable: React.ForwardRefExoticComponent<MobileTableProps & React.RefAttributes<HTMLDivElement>>;
|
|
27
29
|
export default MobileTable;
|
|
@@ -99,6 +99,7 @@ export declare const TableContent: import("@stitches/react/types/styled-componen
|
|
|
99
99
|
}>>;
|
|
100
100
|
export declare const TableHead: import("@stitches/react/types/styled-component").StyledComponent<"thead", {
|
|
101
101
|
isInfiniteScroll?: boolean | "true" | undefined;
|
|
102
|
+
hiddenHeader?: boolean | "true" | undefined;
|
|
102
103
|
}, {
|
|
103
104
|
sm: "(min-width: 359px)";
|
|
104
105
|
md: "(min-width: 767px)";
|
|
@@ -1105,6 +1106,10 @@ export interface EmptyDataProps {
|
|
|
1105
1106
|
title: string | React.ReactNode;
|
|
1106
1107
|
description?: string | React.ReactNode;
|
|
1107
1108
|
}
|
|
1109
|
+
export interface Decoration {
|
|
1110
|
+
headerRender?: () => React.ReactNode;
|
|
1111
|
+
footerRender?: () => React.ReactNode;
|
|
1112
|
+
}
|
|
1108
1113
|
export interface TableProps {
|
|
1109
1114
|
/**
|
|
1110
1115
|
* The data array that you want to display on the table.
|
|
@@ -1152,6 +1157,10 @@ export interface TableProps {
|
|
|
1152
1157
|
* Table header css styling.
|
|
1153
1158
|
*/
|
|
1154
1159
|
headerCss?: CSS;
|
|
1160
|
+
/**
|
|
1161
|
+
* Hide table header.
|
|
1162
|
+
*/
|
|
1163
|
+
hideHeader?: boolean;
|
|
1155
1164
|
/**
|
|
1156
1165
|
* Callback fired when the selected rows are updated.
|
|
1157
1166
|
*/
|
|
@@ -1220,6 +1229,7 @@ export interface TableProps {
|
|
|
1220
1229
|
* }
|
|
1221
1230
|
*/
|
|
1222
1231
|
rowGroup?: RowGroup;
|
|
1232
|
+
decoration?: Decoration;
|
|
1223
1233
|
/**
|
|
1224
1234
|
* Array of hidden column id
|
|
1225
1235
|
*/
|
|
@@ -1254,7 +1264,7 @@ export interface TableProps {
|
|
|
1254
1264
|
*/
|
|
1255
1265
|
additionalExceptionIds?: string[];
|
|
1256
1266
|
}
|
|
1257
|
-
export declare function Table({ columns, data: rawData, keyId, pageIndex: controlledPageIndex, totalPage, totalData, fetchData, hideDataInfo, rowsPerPageOptions, emptyDataMessage, customEmptyDataProps: emptyDataProps, isLoading, css, headerCss, onSelectedChange, isInfiniteScroll, hasMoreItems, rowLimit, cellAlign, selectedIds, rowGroup, hiddenColumns, columnOrder, customRowsStyle, isMobileLayout, showDuplicatedData, onRowClick, hidePagination, searchQuery, additionalExceptionIds }: TableProps): JSX.Element;
|
|
1267
|
+
export declare function Table({ columns, data: rawData, keyId, pageIndex: controlledPageIndex, totalPage, totalData, fetchData, hideDataInfo, rowsPerPageOptions, emptyDataMessage, customEmptyDataProps: emptyDataProps, isLoading, css, headerCss, hideHeader, onSelectedChange, isInfiniteScroll, hasMoreItems, rowLimit, cellAlign, selectedIds, rowGroup, decoration, hiddenColumns, columnOrder, customRowsStyle, isMobileLayout, showDuplicatedData, onRowClick, hidePagination, searchQuery, additionalExceptionIds, }: TableProps): JSX.Element;
|
|
1258
1268
|
export interface TableColumnProps {
|
|
1259
1269
|
/**
|
|
1260
1270
|
* Required if accessor is a function<br/>
|
package/index.esm.js
CHANGED
|
@@ -16876,10 +16876,11 @@ const CalendarPicker = _a => {
|
|
|
16876
16876
|
selected,
|
|
16877
16877
|
disabled,
|
|
16878
16878
|
showTimePicker,
|
|
16879
|
+
timePickerProps,
|
|
16879
16880
|
minDate,
|
|
16880
16881
|
maxDate
|
|
16881
16882
|
} = _a,
|
|
16882
|
-
props = __rest(_a, ["isMultiDatePicker", "onChange", "onClose", "advanceView", "selected", "disabled", "showTimePicker", "minDate", "maxDate"]);
|
|
16883
|
+
props = __rest(_a, ["isMultiDatePicker", "onChange", "onClose", "advanceView", "selected", "disabled", "showTimePicker", "timePickerProps", "minDate", "maxDate"]);
|
|
16883
16884
|
const [dateValue, setDateValue] = useState();
|
|
16884
16885
|
const [calendarDate, setCalendarDate] = useState(selected !== null && selected !== void 0 ? selected : new Date());
|
|
16885
16886
|
const onDateSelected = selectedDate => {
|
|
@@ -16910,21 +16911,22 @@ const CalendarPicker = _a => {
|
|
|
16910
16911
|
onChange(dateValue);
|
|
16911
16912
|
}
|
|
16912
16913
|
}, [dateValue]);
|
|
16913
|
-
const
|
|
16914
|
+
const renderTimePicker = props => {
|
|
16914
16915
|
return jsx(Box, Object.assign({
|
|
16915
16916
|
css: {
|
|
16916
16917
|
padding: '40px 60px'
|
|
16917
16918
|
}
|
|
16918
16919
|
}, {
|
|
16919
|
-
children: jsx(NativeTimePicker, {
|
|
16920
|
+
children: jsx(NativeTimePicker, Object.assign({
|
|
16920
16921
|
size: "lg",
|
|
16921
16922
|
value: dateValue ? moment(dateValue) : moment(),
|
|
16922
16923
|
minDate: minDate,
|
|
16923
16924
|
maxDate: maxDate,
|
|
16925
|
+
disabled: disabled,
|
|
16924
16926
|
onChange: date => {
|
|
16925
16927
|
setDateValue(new Date(date));
|
|
16926
16928
|
}
|
|
16927
|
-
}, void 0)
|
|
16929
|
+
}, props), void 0)
|
|
16928
16930
|
}), void 0);
|
|
16929
16931
|
};
|
|
16930
16932
|
return jsx(CalendarBox, Object.assign({
|
|
@@ -16935,7 +16937,7 @@ const CalendarPicker = _a => {
|
|
|
16935
16937
|
disabled: disabled,
|
|
16936
16938
|
onCalendarDateChange: setCalendarDate,
|
|
16937
16939
|
showTimePicker: showTimePicker,
|
|
16938
|
-
renderTimePicker:
|
|
16940
|
+
renderTimePicker: () => renderTimePicker(timePickerProps),
|
|
16939
16941
|
minDate: minDate,
|
|
16940
16942
|
maxDate: maxDate
|
|
16941
16943
|
}, dayzedData), void 0);
|
|
@@ -17465,6 +17467,7 @@ function InputDatePicker({
|
|
|
17465
17467
|
placement = 'bottom-start',
|
|
17466
17468
|
css,
|
|
17467
17469
|
showTimePicker,
|
|
17470
|
+
timePickerProps,
|
|
17468
17471
|
minDate,
|
|
17469
17472
|
maxDate,
|
|
17470
17473
|
readOnly,
|
|
@@ -17602,6 +17605,7 @@ function InputDatePicker({
|
|
|
17602
17605
|
onChange: handleDatePickerChange,
|
|
17603
17606
|
onClose: () => setOpenPicker(false),
|
|
17604
17607
|
showTimePicker: showTimePicker,
|
|
17608
|
+
timePickerProps: timePickerProps,
|
|
17605
17609
|
minDate: minDate,
|
|
17606
17610
|
maxDate: maxDate,
|
|
17607
17611
|
allowReset: allowReset
|
|
@@ -18467,8 +18471,11 @@ const MobileTable = /*#__PURE__*/React__default.forwardRef(({
|
|
|
18467
18471
|
cellAlign,
|
|
18468
18472
|
renderContextMenu,
|
|
18469
18473
|
handleRowClick,
|
|
18470
|
-
additionalExceptionIds
|
|
18474
|
+
additionalExceptionIds,
|
|
18475
|
+
hideHeader,
|
|
18476
|
+
decoration
|
|
18471
18477
|
}, ref) => {
|
|
18478
|
+
var _a, _b;
|
|
18472
18479
|
const {
|
|
18473
18480
|
t
|
|
18474
18481
|
} = useTranslation('MajooUI/table');
|
|
@@ -18525,7 +18532,9 @@ const MobileTable = /*#__PURE__*/React__default.forwardRef(({
|
|
|
18525
18532
|
ref: ref
|
|
18526
18533
|
}, {
|
|
18527
18534
|
children: [infiniteScrollWrapper(jsxs(TableContent$3, Object.assign({}, getTableProps(), {
|
|
18528
|
-
children: [jsx(TableHead$3, {
|
|
18535
|
+
children: [jsx(TableHead$3, Object.assign({
|
|
18536
|
+
hiddenHeader: hideHeader
|
|
18537
|
+
}, {
|
|
18529
18538
|
children: headerGroups.map(headerGroup => jsx(TableHeadRow$4, Object.assign({}, headerGroup.getHeaderGroupProps(), {
|
|
18530
18539
|
children: headerGroup.headers.filter((column, index) => filterMobileHeader(column, index)).map(column => {
|
|
18531
18540
|
const headerRender = column.render('Header');
|
|
@@ -18552,8 +18561,8 @@ const MobileTable = /*#__PURE__*/React__default.forwardRef(({
|
|
|
18552
18561
|
}), void 0);
|
|
18553
18562
|
})
|
|
18554
18563
|
}), void 0))
|
|
18555
|
-
}, void 0),
|
|
18556
|
-
children: page.map((row, i) => {
|
|
18564
|
+
}), void 0), jsxs(TableBody$3, Object.assign({}, getTableBodyProps(), {
|
|
18565
|
+
children: [(_a = decoration === null || decoration === void 0 ? void 0 : decoration.headerRender) === null || _a === void 0 ? void 0 : _a.call(decoration), page.map((row, i) => {
|
|
18557
18566
|
var _a;
|
|
18558
18567
|
prepareRow(row);
|
|
18559
18568
|
const isContextMenu = (_a = row.cells.filter(cell => {
|
|
@@ -18681,7 +18690,7 @@ const MobileTable = /*#__PURE__*/React__default.forwardRef(({
|
|
|
18681
18690
|
}), void 0)
|
|
18682
18691
|
}, void 0) : null]
|
|
18683
18692
|
}, row.id);
|
|
18684
|
-
})
|
|
18693
|
+
}), (_b = decoration === null || decoration === void 0 ? void 0 : decoration.footerRender) === null || _b === void 0 ? void 0 : _b.call(decoration)]
|
|
18685
18694
|
}), void 0), !isInfiniteScroll && jsx(TableFoot$2, {
|
|
18686
18695
|
children: jsx(TableFootRow$2, {
|
|
18687
18696
|
children: jsx(TableFootCell$2, Object.assign({
|
|
@@ -18737,6 +18746,17 @@ const TableHead$3 = styled('thead', {
|
|
|
18737
18746
|
true: {
|
|
18738
18747
|
top: '-1px'
|
|
18739
18748
|
}
|
|
18749
|
+
},
|
|
18750
|
+
hiddenHeader: {
|
|
18751
|
+
true: {
|
|
18752
|
+
opacity: 0,
|
|
18753
|
+
'& > tr > th': {
|
|
18754
|
+
height: '0px !important',
|
|
18755
|
+
'& > div': {
|
|
18756
|
+
marginTop: '-50px'
|
|
18757
|
+
}
|
|
18758
|
+
}
|
|
18759
|
+
}
|
|
18740
18760
|
}
|
|
18741
18761
|
}
|
|
18742
18762
|
});
|
|
@@ -19065,6 +19085,7 @@ function Table({
|
|
|
19065
19085
|
isLoading = false,
|
|
19066
19086
|
css,
|
|
19067
19087
|
headerCss,
|
|
19088
|
+
hideHeader,
|
|
19068
19089
|
onSelectedChange,
|
|
19069
19090
|
isInfiniteScroll = false,
|
|
19070
19091
|
hasMoreItems = true,
|
|
@@ -19072,6 +19093,7 @@ function Table({
|
|
|
19072
19093
|
cellAlign = 'center',
|
|
19073
19094
|
selectedIds,
|
|
19074
19095
|
rowGroup,
|
|
19096
|
+
decoration,
|
|
19075
19097
|
hiddenColumns,
|
|
19076
19098
|
columnOrder,
|
|
19077
19099
|
customRowsStyle,
|
|
@@ -19082,6 +19104,7 @@ function Table({
|
|
|
19082
19104
|
searchQuery,
|
|
19083
19105
|
additionalExceptionIds = []
|
|
19084
19106
|
}) {
|
|
19107
|
+
var _a, _b;
|
|
19085
19108
|
const [limit, setLimit] = useState(rowLimit);
|
|
19086
19109
|
const [dataRow, setDataRow] = useState({});
|
|
19087
19110
|
const [tableScrollPosition, setTableScrollPosition] = useState('start');
|
|
@@ -19333,6 +19356,7 @@ function Table({
|
|
|
19333
19356
|
}, {
|
|
19334
19357
|
children: [renderInfiniteScrollWrapper(jsxs(TableContent$3, Object.assign({}, getTableProps(), {
|
|
19335
19358
|
children: [jsx(TableHead$3, Object.assign({
|
|
19359
|
+
hiddenHeader: hideHeader,
|
|
19336
19360
|
css: headerCss,
|
|
19337
19361
|
isInfiniteScroll: isInfiniteScroll
|
|
19338
19362
|
}, {
|
|
@@ -19370,8 +19394,8 @@ function Table({
|
|
|
19370
19394
|
})
|
|
19371
19395
|
}), void 0);
|
|
19372
19396
|
})
|
|
19373
|
-
}), void 0),
|
|
19374
|
-
children: page.map((row, i) => {
|
|
19397
|
+
}), void 0), jsxs(TableBody$3, Object.assign({}, getTableBodyProps(), {
|
|
19398
|
+
children: [(_a = decoration === null || decoration === void 0 ? void 0 : decoration.headerRender) === null || _a === void 0 ? void 0 : _a.call(decoration), page.map((row, i) => {
|
|
19375
19399
|
var _a, _b;
|
|
19376
19400
|
prepareRow(row);
|
|
19377
19401
|
const subRowCells = row.cells.filter(cell => cell.column.isSubRow);
|
|
@@ -19474,7 +19498,7 @@ function Table({
|
|
|
19474
19498
|
}, cell.column.id)]
|
|
19475
19499
|
}), cell.column.id)) : null, ((rowGroup === null || rowGroup === void 0 ? void 0 : rowGroup.showGroupingWhenSorted) || sortBy.length <= 0) && row.original['isBottomChild'] && !!(rowGroup === null || rowGroup === void 0 ? void 0 : rowGroup.footerRender) && (rowGroup === null || rowGroup === void 0 ? void 0 : rowGroup.footerRender(row))]
|
|
19476
19500
|
}, row.id);
|
|
19477
|
-
})
|
|
19501
|
+
}), (_b = decoration === null || decoration === void 0 ? void 0 : decoration.footerRender) === null || _b === void 0 ? void 0 : _b.call(decoration)]
|
|
19478
19502
|
}), void 0)]
|
|
19479
19503
|
}), void 0)), renderContextMenu()]
|
|
19480
19504
|
}), void 0), !isInfiniteScroll && jsx(Box, Object.assign({
|
|
@@ -19510,7 +19534,9 @@ function Table({
|
|
|
19510
19534
|
cellAlign: cellAlign,
|
|
19511
19535
|
renderContextMenu: renderContextMenu,
|
|
19512
19536
|
handleRowClick: handleRowClick,
|
|
19513
|
-
additionalExceptionIds: additionalExceptionIds
|
|
19537
|
+
additionalExceptionIds: additionalExceptionIds,
|
|
19538
|
+
hideHeader: hideHeader,
|
|
19539
|
+
decoration: decoration
|
|
19514
19540
|
}, void 0)]
|
|
19515
19541
|
}), void 0);
|
|
19516
19542
|
}
|
package/index.umd.js
CHANGED
|
@@ -17096,9 +17096,10 @@
|
|
|
17096
17096
|
selected = _a.selected,
|
|
17097
17097
|
disabled = _a.disabled,
|
|
17098
17098
|
showTimePicker = _a.showTimePicker,
|
|
17099
|
+
timePickerProps = _a.timePickerProps,
|
|
17099
17100
|
minDate = _a.minDate,
|
|
17100
17101
|
maxDate = _a.maxDate,
|
|
17101
|
-
props = __rest(_a, ["isMultiDatePicker", "onChange", "onClose", "advanceView", "selected", "disabled", "showTimePicker", "minDate", "maxDate"]);
|
|
17102
|
+
props = __rest(_a, ["isMultiDatePicker", "onChange", "onClose", "advanceView", "selected", "disabled", "showTimePicker", "timePickerProps", "minDate", "maxDate"]);
|
|
17102
17103
|
var _b = React.useState(),
|
|
17103
17104
|
dateValue = _b[0],
|
|
17104
17105
|
setDateValue = _b[1];
|
|
@@ -17133,21 +17134,22 @@
|
|
|
17133
17134
|
onChange(dateValue);
|
|
17134
17135
|
}
|
|
17135
17136
|
}, [dateValue]);
|
|
17136
|
-
var
|
|
17137
|
+
var renderTimePicker = function renderTimePicker(props) {
|
|
17137
17138
|
return jsxRuntime.jsx(Box, __assign({
|
|
17138
17139
|
css: {
|
|
17139
17140
|
padding: '40px 60px'
|
|
17140
17141
|
}
|
|
17141
17142
|
}, {
|
|
17142
|
-
children: jsxRuntime.jsx(NativeTimePicker, {
|
|
17143
|
+
children: jsxRuntime.jsx(NativeTimePicker, __assign({
|
|
17143
17144
|
size: "lg",
|
|
17144
17145
|
value: dateValue ? moment__default["default"](dateValue) : moment__default["default"](),
|
|
17145
17146
|
minDate: minDate,
|
|
17146
17147
|
maxDate: maxDate,
|
|
17148
|
+
disabled: disabled,
|
|
17147
17149
|
onChange: function (date) {
|
|
17148
17150
|
setDateValue(new Date(date));
|
|
17149
17151
|
}
|
|
17150
|
-
}, void 0)
|
|
17152
|
+
}, props), void 0)
|
|
17151
17153
|
}), void 0);
|
|
17152
17154
|
};
|
|
17153
17155
|
return jsxRuntime.jsx(CalendarBox, __assign({
|
|
@@ -17158,7 +17160,9 @@
|
|
|
17158
17160
|
disabled: disabled,
|
|
17159
17161
|
onCalendarDateChange: setCalendarDate,
|
|
17160
17162
|
showTimePicker: showTimePicker,
|
|
17161
|
-
renderTimePicker:
|
|
17163
|
+
renderTimePicker: function () {
|
|
17164
|
+
return renderTimePicker(timePickerProps);
|
|
17165
|
+
},
|
|
17162
17166
|
minDate: minDate,
|
|
17163
17167
|
maxDate: maxDate
|
|
17164
17168
|
}, dayzedData), void 0);
|
|
@@ -17696,6 +17700,7 @@
|
|
|
17696
17700
|
placement = _e === void 0 ? 'bottom-start' : _e,
|
|
17697
17701
|
css = _a.css,
|
|
17698
17702
|
showTimePicker = _a.showTimePicker,
|
|
17703
|
+
timePickerProps = _a.timePickerProps,
|
|
17699
17704
|
minDate = _a.minDate,
|
|
17700
17705
|
maxDate = _a.maxDate,
|
|
17701
17706
|
readOnly = _a.readOnly,
|
|
@@ -17839,6 +17844,7 @@
|
|
|
17839
17844
|
return setOpenPicker(false);
|
|
17840
17845
|
},
|
|
17841
17846
|
showTimePicker: showTimePicker,
|
|
17847
|
+
timePickerProps: timePickerProps,
|
|
17842
17848
|
minDate: minDate,
|
|
17843
17849
|
maxDate: maxDate,
|
|
17844
17850
|
allowReset: allowReset
|
|
@@ -18706,6 +18712,7 @@
|
|
|
18706
18712
|
color: '$textPrimary'
|
|
18707
18713
|
});
|
|
18708
18714
|
var MobileTable = /*#__PURE__*/React__default["default"].forwardRef(function (_a, ref) {
|
|
18715
|
+
var _b, _c;
|
|
18709
18716
|
var instance = _a.instance,
|
|
18710
18717
|
totalData = _a.totalData,
|
|
18711
18718
|
customEmptyDataProps = _a.customEmptyDataProps,
|
|
@@ -18720,7 +18727,9 @@
|
|
|
18720
18727
|
cellAlign = _a.cellAlign,
|
|
18721
18728
|
renderContextMenu = _a.renderContextMenu,
|
|
18722
18729
|
handleRowClick = _a.handleRowClick,
|
|
18723
|
-
additionalExceptionIds = _a.additionalExceptionIds
|
|
18730
|
+
additionalExceptionIds = _a.additionalExceptionIds,
|
|
18731
|
+
hideHeader = _a.hideHeader,
|
|
18732
|
+
decoration = _a.decoration;
|
|
18724
18733
|
var t = reactI18next.useTranslation('MajooUI/table').t;
|
|
18725
18734
|
var getTableProps = instance.getTableProps,
|
|
18726
18735
|
getTableBodyProps = instance.getTableBodyProps,
|
|
@@ -18771,7 +18780,9 @@
|
|
|
18771
18780
|
ref: ref
|
|
18772
18781
|
}, {
|
|
18773
18782
|
children: [infiniteScrollWrapper(jsxRuntime.jsxs(TableContent$3, __assign({}, getTableProps(), {
|
|
18774
|
-
children: [jsxRuntime.jsx(TableHead$3, {
|
|
18783
|
+
children: [jsxRuntime.jsx(TableHead$3, __assign({
|
|
18784
|
+
hiddenHeader: hideHeader
|
|
18785
|
+
}, {
|
|
18775
18786
|
children: headerGroups.map(function (headerGroup) {
|
|
18776
18787
|
return jsxRuntime.jsx(TableHeadRow$4, __assign({}, headerGroup.getHeaderGroupProps(), {
|
|
18777
18788
|
children: headerGroup.headers.filter(function (column, index) {
|
|
@@ -18802,8 +18813,8 @@
|
|
|
18802
18813
|
})
|
|
18803
18814
|
}), void 0);
|
|
18804
18815
|
})
|
|
18805
|
-
}, void 0), jsxRuntime.
|
|
18806
|
-
children: page.map(function (row, i) {
|
|
18816
|
+
}), void 0), jsxRuntime.jsxs(TableBody$3, __assign({}, getTableBodyProps(), {
|
|
18817
|
+
children: [(_b = decoration === null || decoration === void 0 ? void 0 : decoration.headerRender) === null || _b === void 0 ? void 0 : _b.call(decoration), page.map(function (row, i) {
|
|
18807
18818
|
var _a;
|
|
18808
18819
|
prepareRow(row);
|
|
18809
18820
|
var isContextMenu = (_a = row.cells.filter(function (cell) {
|
|
@@ -18945,7 +18956,7 @@
|
|
|
18945
18956
|
}), void 0)
|
|
18946
18957
|
}, void 0) : null]
|
|
18947
18958
|
}, row.id);
|
|
18948
|
-
})
|
|
18959
|
+
}), (_c = decoration === null || decoration === void 0 ? void 0 : decoration.footerRender) === null || _c === void 0 ? void 0 : _c.call(decoration)]
|
|
18949
18960
|
}), void 0), !isInfiniteScroll && jsxRuntime.jsx(TableFoot$2, {
|
|
18950
18961
|
children: jsxRuntime.jsx(TableFootRow$2, {
|
|
18951
18962
|
children: jsxRuntime.jsx(TableFootCell$2, __assign({
|
|
@@ -19001,6 +19012,17 @@
|
|
|
19001
19012
|
true: {
|
|
19002
19013
|
top: '-1px'
|
|
19003
19014
|
}
|
|
19015
|
+
},
|
|
19016
|
+
hiddenHeader: {
|
|
19017
|
+
true: {
|
|
19018
|
+
opacity: 0,
|
|
19019
|
+
'& > tr > th': {
|
|
19020
|
+
height: '0px !important',
|
|
19021
|
+
'& > div': {
|
|
19022
|
+
marginTop: '-50px'
|
|
19023
|
+
}
|
|
19024
|
+
}
|
|
19025
|
+
}
|
|
19004
19026
|
}
|
|
19005
19027
|
}
|
|
19006
19028
|
});
|
|
@@ -19319,60 +19341,63 @@
|
|
|
19319
19341
|
};
|
|
19320
19342
|
};
|
|
19321
19343
|
function Table(_a) {
|
|
19344
|
+
var _b, _c;
|
|
19322
19345
|
var columns = _a.columns,
|
|
19323
19346
|
rawData = _a.data,
|
|
19324
|
-
|
|
19325
|
-
keyId =
|
|
19326
|
-
|
|
19327
|
-
controlledPageIndex =
|
|
19347
|
+
_d = _a.keyId,
|
|
19348
|
+
keyId = _d === void 0 ? 'id' : _d,
|
|
19349
|
+
_e = _a.pageIndex,
|
|
19350
|
+
controlledPageIndex = _e === void 0 ? 0 : _e,
|
|
19328
19351
|
totalPage = _a.totalPage,
|
|
19329
|
-
|
|
19330
|
-
totalData =
|
|
19352
|
+
_f = _a.totalData,
|
|
19353
|
+
totalData = _f === void 0 ? 0 : _f,
|
|
19331
19354
|
fetchData = _a.fetchData,
|
|
19332
|
-
|
|
19333
|
-
hideDataInfo =
|
|
19334
|
-
|
|
19335
|
-
rowsPerPageOptions =
|
|
19355
|
+
_g = _a.hideDataInfo,
|
|
19356
|
+
hideDataInfo = _g === void 0 ? false : _g,
|
|
19357
|
+
_h = _a.rowsPerPageOptions,
|
|
19358
|
+
rowsPerPageOptions = _h === void 0 ? [10, 25, 50, 100] : _h;
|
|
19336
19359
|
_a.emptyDataMessage;
|
|
19337
19360
|
var emptyDataProps = _a.customEmptyDataProps,
|
|
19338
|
-
|
|
19339
|
-
isLoading =
|
|
19361
|
+
_k = _a.isLoading,
|
|
19362
|
+
isLoading = _k === void 0 ? false : _k,
|
|
19340
19363
|
css = _a.css,
|
|
19341
19364
|
headerCss = _a.headerCss,
|
|
19365
|
+
hideHeader = _a.hideHeader,
|
|
19342
19366
|
onSelectedChange = _a.onSelectedChange,
|
|
19343
|
-
|
|
19344
|
-
isInfiniteScroll =
|
|
19345
|
-
|
|
19346
|
-
hasMoreItems =
|
|
19347
|
-
|
|
19348
|
-
rowLimit =
|
|
19349
|
-
|
|
19350
|
-
cellAlign =
|
|
19367
|
+
_l = _a.isInfiniteScroll,
|
|
19368
|
+
isInfiniteScroll = _l === void 0 ? false : _l,
|
|
19369
|
+
_m = _a.hasMoreItems,
|
|
19370
|
+
hasMoreItems = _m === void 0 ? true : _m,
|
|
19371
|
+
_o = _a.rowLimit,
|
|
19372
|
+
rowLimit = _o === void 0 ? 10 : _o,
|
|
19373
|
+
_p = _a.cellAlign,
|
|
19374
|
+
cellAlign = _p === void 0 ? 'center' : _p,
|
|
19351
19375
|
selectedIds = _a.selectedIds,
|
|
19352
19376
|
rowGroup = _a.rowGroup,
|
|
19377
|
+
decoration = _a.decoration,
|
|
19353
19378
|
hiddenColumns = _a.hiddenColumns,
|
|
19354
19379
|
columnOrder = _a.columnOrder,
|
|
19355
19380
|
customRowsStyle = _a.customRowsStyle,
|
|
19356
19381
|
isMobileLayout = _a.isMobileLayout,
|
|
19357
19382
|
showDuplicatedData = _a.showDuplicatedData,
|
|
19358
19383
|
onRowClick = _a.onRowClick,
|
|
19359
|
-
|
|
19360
|
-
hidePagination =
|
|
19384
|
+
_q = _a.hidePagination,
|
|
19385
|
+
hidePagination = _q === void 0 ? false : _q,
|
|
19361
19386
|
searchQuery = _a.searchQuery,
|
|
19362
|
-
|
|
19363
|
-
additionalExceptionIds =
|
|
19364
|
-
var
|
|
19365
|
-
limit =
|
|
19366
|
-
setLimit =
|
|
19367
|
-
var
|
|
19368
|
-
dataRow =
|
|
19369
|
-
setDataRow =
|
|
19370
|
-
var
|
|
19371
|
-
tableScrollPosition =
|
|
19372
|
-
setTableScrollPosition =
|
|
19373
|
-
var
|
|
19374
|
-
scrollAreaWidth =
|
|
19375
|
-
setScrollAreaWidth =
|
|
19387
|
+
_r = _a.additionalExceptionIds,
|
|
19388
|
+
additionalExceptionIds = _r === void 0 ? [] : _r;
|
|
19389
|
+
var _s = React.useState(rowLimit),
|
|
19390
|
+
limit = _s[0],
|
|
19391
|
+
setLimit = _s[1];
|
|
19392
|
+
var _t = React.useState({}),
|
|
19393
|
+
dataRow = _t[0],
|
|
19394
|
+
setDataRow = _t[1];
|
|
19395
|
+
var _u = React.useState('start'),
|
|
19396
|
+
tableScrollPosition = _u[0],
|
|
19397
|
+
setTableScrollPosition = _u[1];
|
|
19398
|
+
var _v = React.useState(0),
|
|
19399
|
+
scrollAreaWidth = _v[0],
|
|
19400
|
+
setScrollAreaWidth = _v[1];
|
|
19376
19401
|
var t = reactI18next.useTranslation('MajooUI/table').t;
|
|
19377
19402
|
var isMobile = useMediaQuery(isMobileLayout === undefined ? '(max-width: 1024px)' : isMobileLayout ? '(max-width: 8000px)' : '(max-width: 0px)');
|
|
19378
19403
|
var customEmptyDataProps = searchQuery ? defaultEmptySearchProps(t, isMobile, searchQuery) : emptyDataProps || defaultEmptyDataProps(t, isMobile);
|
|
@@ -19419,11 +19444,11 @@
|
|
|
19419
19444
|
setPageSize = instance.setPageSize,
|
|
19420
19445
|
toggleRowSelected = instance.toggleRowSelected,
|
|
19421
19446
|
toggleAllRowsSelected = instance.toggleAllRowsSelected,
|
|
19422
|
-
|
|
19423
|
-
pageIndex =
|
|
19424
|
-
pageSize =
|
|
19425
|
-
sortBy =
|
|
19426
|
-
selectedRowIds =
|
|
19447
|
+
_w = instance.state,
|
|
19448
|
+
pageIndex = _w.pageIndex,
|
|
19449
|
+
pageSize = _w.pageSize,
|
|
19450
|
+
sortBy = _w.sortBy,
|
|
19451
|
+
selectedRowIds = _w.selectedRowIds,
|
|
19427
19452
|
setHiddenColumns = instance.setHiddenColumns,
|
|
19428
19453
|
setColumnOrder = instance.setColumnOrder;
|
|
19429
19454
|
var doFetchData = function doFetchData(pageIndex, pageSize, sortAccessor, sortDirection) {
|
|
@@ -19633,6 +19658,7 @@
|
|
|
19633
19658
|
}, {
|
|
19634
19659
|
children: [renderInfiniteScrollWrapper(jsxRuntime.jsxs(TableContent$3, __assign({}, getTableProps(), {
|
|
19635
19660
|
children: [jsxRuntime.jsx(TableHead$3, __assign({
|
|
19661
|
+
hiddenHeader: hideHeader,
|
|
19636
19662
|
css: headerCss,
|
|
19637
19663
|
isInfiniteScroll: isInfiniteScroll
|
|
19638
19664
|
}, {
|
|
@@ -19674,8 +19700,8 @@
|
|
|
19674
19700
|
})
|
|
19675
19701
|
}), void 0);
|
|
19676
19702
|
})
|
|
19677
|
-
}), void 0), jsxRuntime.
|
|
19678
|
-
children: page.map(function (row, i) {
|
|
19703
|
+
}), void 0), jsxRuntime.jsxs(TableBody$3, __assign({}, getTableBodyProps(), {
|
|
19704
|
+
children: [(_b = decoration === null || decoration === void 0 ? void 0 : decoration.headerRender) === null || _b === void 0 ? void 0 : _b.call(decoration), page.map(function (row, i) {
|
|
19679
19705
|
var _a, _b;
|
|
19680
19706
|
prepareRow(row);
|
|
19681
19707
|
var subRowCells = row.cells.filter(function (cell) {
|
|
@@ -19794,7 +19820,7 @@
|
|
|
19794
19820
|
}), cell.column.id);
|
|
19795
19821
|
}) : null, ((rowGroup === null || rowGroup === void 0 ? void 0 : rowGroup.showGroupingWhenSorted) || sortBy.length <= 0) && row.original['isBottomChild'] && !!(rowGroup === null || rowGroup === void 0 ? void 0 : rowGroup.footerRender) && (rowGroup === null || rowGroup === void 0 ? void 0 : rowGroup.footerRender(row))]
|
|
19796
19822
|
}, row.id);
|
|
19797
|
-
})
|
|
19823
|
+
}), (_c = decoration === null || decoration === void 0 ? void 0 : decoration.footerRender) === null || _c === void 0 ? void 0 : _c.call(decoration)]
|
|
19798
19824
|
}), void 0)]
|
|
19799
19825
|
}), void 0)), renderContextMenu()]
|
|
19800
19826
|
}), void 0), !isInfiniteScroll && jsxRuntime.jsx(Box, __assign({
|
|
@@ -19830,7 +19856,9 @@
|
|
|
19830
19856
|
cellAlign: cellAlign,
|
|
19831
19857
|
renderContextMenu: renderContextMenu,
|
|
19832
19858
|
handleRowClick: handleRowClick,
|
|
19833
|
-
additionalExceptionIds: additionalExceptionIds
|
|
19859
|
+
additionalExceptionIds: additionalExceptionIds,
|
|
19860
|
+
hideHeader: hideHeader,
|
|
19861
|
+
decoration: decoration
|
|
19834
19862
|
}, void 0)]
|
|
19835
19863
|
}), void 0);
|
|
19836
19864
|
}
|