@ballistix.digital/react-components 0.5.9 → 0.5.10
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/index.d.ts +9 -8
- package/dist/index.esm.js +12 -12
- package/dist/index.js +12 -12
- package/dist/lib/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -414,6 +414,7 @@ type TTableListProps<TData> = {
|
|
|
414
414
|
options?: {
|
|
415
415
|
defaultOrder?: string[];
|
|
416
416
|
defaultVisibility?: string[];
|
|
417
|
+
defaultSorting?: SortingState;
|
|
417
418
|
emptyComponent?: ReactNode;
|
|
418
419
|
isStriped?: boolean;
|
|
419
420
|
hasStickyHeader?: boolean;
|
|
@@ -841,14 +842,14 @@ type TProps$1 = {
|
|
|
841
842
|
};
|
|
842
843
|
declare const TableColumnOptionsCustom: FC<TProps$1>;
|
|
843
844
|
|
|
844
|
-
type TProps = {
|
|
845
|
-
table: Table<
|
|
845
|
+
type TProps<TData> = {
|
|
846
|
+
table: Table<TData>;
|
|
846
847
|
fileName: string;
|
|
847
|
-
children: ({ handleExport }: {
|
|
848
|
-
handleExport: () => void;
|
|
848
|
+
children: ({ handleExport, }: {
|
|
849
|
+
handleExport: (exportData?: TData[]) => void;
|
|
849
850
|
}) => ReactNode;
|
|
850
851
|
};
|
|
851
|
-
declare const TableExcelExportCustom:
|
|
852
|
+
declare const TableExcelExportCustom: <TData extends object>(props: TProps<TData>) => react_jsx_runtime.JSX.Element;
|
|
852
853
|
|
|
853
854
|
type TSelectMenuFormProps = {
|
|
854
855
|
name: string;
|
|
@@ -1157,10 +1158,10 @@ type TExcelSheet = {
|
|
|
1157
1158
|
type TOptions = {
|
|
1158
1159
|
fileName: string;
|
|
1159
1160
|
};
|
|
1160
|
-
type TReturn = {
|
|
1161
|
-
generate: (
|
|
1161
|
+
type TReturn<TData> = {
|
|
1162
|
+
generate: (table: Table<TData>, exportData?: TData[]) => TExcelSheet[];
|
|
1162
1163
|
write: (sheets: TExcelSheet[], options: TOptions) => void;
|
|
1163
1164
|
};
|
|
1164
|
-
declare const useExcel: () => TReturn
|
|
1165
|
+
declare const useExcel: <TData extends object>() => TReturn<TData>;
|
|
1165
1166
|
|
|
1166
1167
|
export { AddressInputGroupForm, BadgeElement$1 as AlertElement, AvatarElement, BadgeElement, BreadcrumbsNavigation, ButtonElement, ButtonGroupElement, CheckboxInputGroupForm, ContainerLayout, DateMenuForm, DividerLayout, DropdownElement, FileInputGroupForm, IconElement, InputGroupForm, ListContainerLayout, MediaObjectLayout, ModalOverlay, NotificationOverlay, OpeningsHourInputGroupForm, PagePaginationNavigation, LayoutPanel as PanelLayout, PanelPaginationNavigation, SelectMenuForm, SlideOverOverlay, type TAddressInputGroupFormProps, type TAddressInputGroupFormStyles, type TAddressInputGroupFormValue, type TButtonElementProps, type TCheckboxInputGroupFormProps, type TCheckboxInputGroupFormStyles, type TDateMenuFormProps, type TDateMenuFormStyles, type TExcelCell, type TExcelRow, type TExcelSheet, type TFileInputGroupFormProps, type TFileInputGroupFormStyles, type TInputGroupFormProps, type TInputGroupStyles, type TModalOverlayProps, type TOpeningsHourInputGroupFormProps, type TOpeningsHourInputGroupFormStyles, type TSelectMenuFormProps, type TSelectMenuFormStyles, type TTableListProps as TTableList2Props, type TTableListProps$1 as TTableListProps, type TTableListStyles$1 as TTableListStyles, TabNavigation, TableColumnOptionsCustom, TableExcelExportCustom as TableExportCustom, TableList, TableList2, VerticalNavigation, useExcel };
|
package/dist/index.esm.js
CHANGED
|
@@ -1102,11 +1102,11 @@ var useExcel = function () {
|
|
|
1102
1102
|
});
|
|
1103
1103
|
});
|
|
1104
1104
|
};
|
|
1105
|
-
var generate = function (table) {
|
|
1105
|
+
var generate = function (table, exportData) {
|
|
1106
1106
|
var _a, _b, _c, _d;
|
|
1107
1107
|
var sheets = [];
|
|
1108
1108
|
var columns = table.getAllColumns();
|
|
1109
|
-
var rows = (_b = (_a = table.getRowModel()) === null || _a === void 0 ? void 0 : _a.flatRows) === null || _b === void 0 ? void 0 : _b.map(function (row) { return row.original; });
|
|
1109
|
+
var rows = exportData !== null && exportData !== void 0 ? exportData : (_b = (_a = table.getRowModel()) === null || _a === void 0 ? void 0 : _a.flatRows) === null || _b === void 0 ? void 0 : _b.map(function (row) { return row.original; });
|
|
1110
1110
|
var order = table.getState().columnOrder;
|
|
1111
1111
|
var headerNames = (_d = (_c = columns === null || columns === void 0 ? void 0 : columns.sort(function (a, b) {
|
|
1112
1112
|
var _a, _b;
|
|
@@ -1154,7 +1154,7 @@ var useExcel = function () {
|
|
|
1154
1154
|
})
|
|
1155
1155
|
.forEach(function (key) {
|
|
1156
1156
|
var _a, _b;
|
|
1157
|
-
var cell = (_b = (_a = columns === null || columns === void 0 ? void 0 : columns.find(function (column) { return column.id === key; })) === null || _a === void 0 ? void 0 : _a.columnDef.meta) === null || _b === void 0 ? void 0 : _b.excel(row
|
|
1157
|
+
var cell = (_b = (_a = columns === null || columns === void 0 ? void 0 : columns.find(function (column) { return column.id === key; })) === null || _a === void 0 ? void 0 : _a.columnDef.meta) === null || _b === void 0 ? void 0 : _b.excel(get(row, key));
|
|
1158
1158
|
result[key] = cell;
|
|
1159
1159
|
});
|
|
1160
1160
|
return result;
|
|
@@ -1556,11 +1556,11 @@ var isValidState = function (state) {
|
|
|
1556
1556
|
};
|
|
1557
1557
|
|
|
1558
1558
|
var TableList2 = function (props) {
|
|
1559
|
-
var _a, _b, _c, _d;
|
|
1559
|
+
var _a, _b, _c, _d, _e, _f;
|
|
1560
1560
|
var id = props.id, config = props.table, head = props.head, foot = props.foot, isLoading = props.isLoading, onRowClick = props.onRowClick, onChange = props.onChange, stylesOverrides = props.styles;
|
|
1561
|
-
var
|
|
1562
|
-
var
|
|
1563
|
-
var
|
|
1561
|
+
var _g = useState((_b = (_a = config.options) === null || _a === void 0 ? void 0 : _a.defaultSorting) !== null && _b !== void 0 ? _b : []), sorting = _g[0], setSorting = _g[1];
|
|
1562
|
+
var _h = useState({}), columnVisibility = _h[0], setColumnVisibility = _h[1];
|
|
1563
|
+
var _j = useState([]), columnOrder = _j[0], setColumnOrder = _j[1];
|
|
1564
1564
|
var handleGenerateStyle = function () {
|
|
1565
1565
|
var result = deepCopyObject(styles$f.base);
|
|
1566
1566
|
var keys = calculateNestedKeys(styles$f.base);
|
|
@@ -1632,7 +1632,7 @@ var TableList2 = function (props) {
|
|
|
1632
1632
|
}
|
|
1633
1633
|
setColumnVisibility(visibility_1);
|
|
1634
1634
|
}
|
|
1635
|
-
}, [(
|
|
1635
|
+
}, [(_c = config === null || config === void 0 ? void 0 : config.options) === null || _c === void 0 ? void 0 : _c.defaultVisibility, id, table]);
|
|
1636
1636
|
useEffect(function () {
|
|
1637
1637
|
var _a, _b, _c;
|
|
1638
1638
|
var savedOrder = (_a = getTableState(id)) === null || _a === void 0 ? void 0 : _a.columnOrder;
|
|
@@ -1645,7 +1645,7 @@ var TableList2 = function (props) {
|
|
|
1645
1645
|
else if (some(config.columns, function (column) { return (column === null || column === void 0 ? void 0 : column.id) || get(column, 'accessorKey'); })) {
|
|
1646
1646
|
setColumnOrder(map(config.columns, function (column) { var _a; return ((_a = column === null || column === void 0 ? void 0 : column.id) !== null && _a !== void 0 ? _a : get(column, 'accessorKey')); }));
|
|
1647
1647
|
}
|
|
1648
|
-
}, [config.columns, (
|
|
1648
|
+
}, [config.columns, (_d = config === null || config === void 0 ? void 0 : config.options) === null || _d === void 0 ? void 0 : _d.defaultOrder, id]);
|
|
1649
1649
|
// Write state to local storage when it changes
|
|
1650
1650
|
useEffect(function () {
|
|
1651
1651
|
if (state) {
|
|
@@ -1686,7 +1686,7 @@ var TableList2 = function (props) {
|
|
|
1686
1686
|
((_c = (_b = table === null || table === void 0 ? void 0 : table.getState()) === null || _b === void 0 ? void 0 : _b.pagination) === null || _c === void 0 ? void 0 : _c.pageSize) - 1 &&
|
|
1687
1687
|
'border-b border-gray-200'), children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
|
|
1688
1688
|
}) }, row.id));
|
|
1689
|
-
}) }))] }), isEmpty(table === null || table === void 0 ? void 0 : table.getRowModel().rows) && !isLoading && (jsx(Fragment$1, { children: ((
|
|
1689
|
+
}) }))] }), isEmpty(table === null || table === void 0 ? void 0 : table.getRowModel().rows) && !isLoading && (jsx(Fragment$1, { children: ((_e = config === null || config === void 0 ? void 0 : config.options) === null || _e === void 0 ? void 0 : _e.emptyComponent) ? ((_f = config === null || config === void 0 ? void 0 : config.options) === null || _f === void 0 ? void 0 : _f.emptyComponent) : (jsx("div", { className: "w-full flex justify-center my-2", children: "There is no data to show..." })) })), isLoading && (jsx("div", { className: "flex flex-col gap-y-2 w-full pt-5", children: new Array(8).fill(undefined).map(function (index) { return (jsxs("div", { className: "flex gap-2", children: [jsx("div", { className: "w-20 h-12 rounded-md bg-gray-100 animate-pulse" }), jsx("div", { className: "w-full h-12 rounded-md bg-gray-100 animate-pulse" })] }, index)); }) }))] }) }) }) }), jsx("div", { className: styles.foot, children: foot && foot(state) })] }));
|
|
1690
1690
|
};
|
|
1691
1691
|
|
|
1692
1692
|
var base$c = {
|
|
@@ -2455,8 +2455,8 @@ var styles$7 = {
|
|
|
2455
2455
|
var TableExcelExportCustom = function (props) {
|
|
2456
2456
|
var table = props.table, fileName = props.fileName, children = props.children;
|
|
2457
2457
|
var _a = useExcel(), generate = _a.generate, write = _a.write;
|
|
2458
|
-
var handleExport = function () {
|
|
2459
|
-
var sheets = generate(table);
|
|
2458
|
+
var handleExport = function (exportData) {
|
|
2459
|
+
var sheets = generate(table, exportData);
|
|
2460
2460
|
write(sheets, { fileName: fileName });
|
|
2461
2461
|
};
|
|
2462
2462
|
return jsx("div", { children: children({ handleExport: handleExport }) });
|
package/dist/index.js
CHANGED
|
@@ -1104,11 +1104,11 @@ var useExcel = function () {
|
|
|
1104
1104
|
});
|
|
1105
1105
|
});
|
|
1106
1106
|
};
|
|
1107
|
-
var generate = function (table) {
|
|
1107
|
+
var generate = function (table, exportData) {
|
|
1108
1108
|
var _a, _b, _c, _d;
|
|
1109
1109
|
var sheets = [];
|
|
1110
1110
|
var columns = table.getAllColumns();
|
|
1111
|
-
var rows = (_b = (_a = table.getRowModel()) === null || _a === void 0 ? void 0 : _a.flatRows) === null || _b === void 0 ? void 0 : _b.map(function (row) { return row.original; });
|
|
1111
|
+
var rows = exportData !== null && exportData !== void 0 ? exportData : (_b = (_a = table.getRowModel()) === null || _a === void 0 ? void 0 : _a.flatRows) === null || _b === void 0 ? void 0 : _b.map(function (row) { return row.original; });
|
|
1112
1112
|
var order = table.getState().columnOrder;
|
|
1113
1113
|
var headerNames = (_d = (_c = columns === null || columns === void 0 ? void 0 : columns.sort(function (a, b) {
|
|
1114
1114
|
var _a, _b;
|
|
@@ -1156,7 +1156,7 @@ var useExcel = function () {
|
|
|
1156
1156
|
})
|
|
1157
1157
|
.forEach(function (key) {
|
|
1158
1158
|
var _a, _b;
|
|
1159
|
-
var cell = (_b = (_a = columns === null || columns === void 0 ? void 0 : columns.find(function (column) { return column.id === key; })) === null || _a === void 0 ? void 0 : _a.columnDef.meta) === null || _b === void 0 ? void 0 : _b.excel(row
|
|
1159
|
+
var cell = (_b = (_a = columns === null || columns === void 0 ? void 0 : columns.find(function (column) { return column.id === key; })) === null || _a === void 0 ? void 0 : _a.columnDef.meta) === null || _b === void 0 ? void 0 : _b.excel(lodash.get(row, key));
|
|
1160
1160
|
result[key] = cell;
|
|
1161
1161
|
});
|
|
1162
1162
|
return result;
|
|
@@ -1558,11 +1558,11 @@ var isValidState = function (state) {
|
|
|
1558
1558
|
};
|
|
1559
1559
|
|
|
1560
1560
|
var TableList2 = function (props) {
|
|
1561
|
-
var _a, _b, _c, _d;
|
|
1561
|
+
var _a, _b, _c, _d, _e, _f;
|
|
1562
1562
|
var id = props.id, config = props.table, head = props.head, foot = props.foot, isLoading = props.isLoading, onRowClick = props.onRowClick, onChange = props.onChange, stylesOverrides = props.styles;
|
|
1563
|
-
var
|
|
1564
|
-
var
|
|
1565
|
-
var
|
|
1563
|
+
var _g = React.useState((_b = (_a = config.options) === null || _a === void 0 ? void 0 : _a.defaultSorting) !== null && _b !== void 0 ? _b : []), sorting = _g[0], setSorting = _g[1];
|
|
1564
|
+
var _h = React.useState({}), columnVisibility = _h[0], setColumnVisibility = _h[1];
|
|
1565
|
+
var _j = React.useState([]), columnOrder = _j[0], setColumnOrder = _j[1];
|
|
1566
1566
|
var handleGenerateStyle = function () {
|
|
1567
1567
|
var result = deepCopyObject(styles$f.base);
|
|
1568
1568
|
var keys = calculateNestedKeys(styles$f.base);
|
|
@@ -1634,7 +1634,7 @@ var TableList2 = function (props) {
|
|
|
1634
1634
|
}
|
|
1635
1635
|
setColumnVisibility(visibility_1);
|
|
1636
1636
|
}
|
|
1637
|
-
}, [(
|
|
1637
|
+
}, [(_c = config === null || config === void 0 ? void 0 : config.options) === null || _c === void 0 ? void 0 : _c.defaultVisibility, id, table]);
|
|
1638
1638
|
React.useEffect(function () {
|
|
1639
1639
|
var _a, _b, _c;
|
|
1640
1640
|
var savedOrder = (_a = getTableState(id)) === null || _a === void 0 ? void 0 : _a.columnOrder;
|
|
@@ -1647,7 +1647,7 @@ var TableList2 = function (props) {
|
|
|
1647
1647
|
else if (lodash.some(config.columns, function (column) { return (column === null || column === void 0 ? void 0 : column.id) || lodash.get(column, 'accessorKey'); })) {
|
|
1648
1648
|
setColumnOrder(lodash.map(config.columns, function (column) { var _a; return ((_a = column === null || column === void 0 ? void 0 : column.id) !== null && _a !== void 0 ? _a : lodash.get(column, 'accessorKey')); }));
|
|
1649
1649
|
}
|
|
1650
|
-
}, [config.columns, (
|
|
1650
|
+
}, [config.columns, (_d = config === null || config === void 0 ? void 0 : config.options) === null || _d === void 0 ? void 0 : _d.defaultOrder, id]);
|
|
1651
1651
|
// Write state to local storage when it changes
|
|
1652
1652
|
React.useEffect(function () {
|
|
1653
1653
|
if (state) {
|
|
@@ -1688,7 +1688,7 @@ var TableList2 = function (props) {
|
|
|
1688
1688
|
((_c = (_b = table === null || table === void 0 ? void 0 : table.getState()) === null || _b === void 0 ? void 0 : _b.pagination) === null || _c === void 0 ? void 0 : _c.pageSize) - 1 &&
|
|
1689
1689
|
'border-b border-gray-200'), children: reactTable.flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
|
|
1690
1690
|
}) }, row.id));
|
|
1691
|
-
}) }))] }), lodash.isEmpty(table === null || table === void 0 ? void 0 : table.getRowModel().rows) && !isLoading && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: ((
|
|
1691
|
+
}) }))] }), lodash.isEmpty(table === null || table === void 0 ? void 0 : table.getRowModel().rows) && !isLoading && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: ((_e = config === null || config === void 0 ? void 0 : config.options) === null || _e === void 0 ? void 0 : _e.emptyComponent) ? ((_f = config === null || config === void 0 ? void 0 : config.options) === null || _f === void 0 ? void 0 : _f.emptyComponent) : (jsxRuntime.jsx("div", { className: "w-full flex justify-center my-2", children: "There is no data to show..." })) })), isLoading && (jsxRuntime.jsx("div", { className: "flex flex-col gap-y-2 w-full pt-5", children: new Array(8).fill(undefined).map(function (index) { return (jsxRuntime.jsxs("div", { className: "flex gap-2", children: [jsxRuntime.jsx("div", { className: "w-20 h-12 rounded-md bg-gray-100 animate-pulse" }), jsxRuntime.jsx("div", { className: "w-full h-12 rounded-md bg-gray-100 animate-pulse" })] }, index)); }) }))] }) }) }) }), jsxRuntime.jsx("div", { className: styles.foot, children: foot && foot(state) })] }));
|
|
1692
1692
|
};
|
|
1693
1693
|
|
|
1694
1694
|
var base$c = {
|
|
@@ -2457,8 +2457,8 @@ var styles$7 = {
|
|
|
2457
2457
|
var TableExcelExportCustom = function (props) {
|
|
2458
2458
|
var table = props.table, fileName = props.fileName, children = props.children;
|
|
2459
2459
|
var _a = useExcel(), generate = _a.generate, write = _a.write;
|
|
2460
|
-
var handleExport = function () {
|
|
2461
|
-
var sheets = generate(table);
|
|
2460
|
+
var handleExport = function (exportData) {
|
|
2461
|
+
var sheets = generate(table, exportData);
|
|
2462
2462
|
write(sheets, { fileName: fileName });
|
|
2463
2463
|
};
|
|
2464
2464
|
return jsxRuntime.jsx("div", { children: children({ handleExport: handleExport }) });
|