@bwp-web/components 2.0.0-alpha.0 → 2.0.0-alpha.1
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/BiampTable/BiampTable.d.ts +23 -2
- package/dist/BiampTable/BiampTable.d.ts.map +1 -1
- package/dist/index.cjs +130 -24
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +131 -24
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type BoxProps, type TableBodyProps as MuiTableBodyProps, type TableCellProps as MuiTableCellProps, type TableHeadProps as MuiTableHeadProps, type TableProps as MuiTableProps, type TableRowProps as MuiTableRowProps } from '@mui/material';
|
|
1
|
+
import { type BoxProps, type TableBodyProps as MuiTableBodyProps, type TableCellProps as MuiTableCellProps, type TableFooterProps as MuiTableFooterProps, type TableHeadProps as MuiTableHeadProps, type TableProps as MuiTableProps, type TableRowProps as MuiTableRowProps } from '@mui/material';
|
|
2
2
|
import { type Cell, type Header, type Row, type Table } from '@tanstack/react-table';
|
|
3
3
|
import { type ReactNode } from 'react';
|
|
4
4
|
import { type SlotPropsOrFn } from '../slotProps';
|
|
@@ -23,6 +23,14 @@ export type BiampTableSlotProps<TData> = {
|
|
|
23
23
|
cell?: SlotPropsOrFn<MuiTableCellProps, {
|
|
24
24
|
cell: Cell<TData, unknown>;
|
|
25
25
|
}>;
|
|
26
|
+
/** Props merged onto the `<TableFooter>`. `sx` composes with defaults. */
|
|
27
|
+
footer?: MuiTableFooterProps;
|
|
28
|
+
/** Props merged onto the footer `<TableRow>`. `sx` composes with defaults. */
|
|
29
|
+
footerRow?: MuiTableRowProps;
|
|
30
|
+
/** Props merged onto each footer `<TableCell>`. Pass a function for per-column overrides. `sx` composes with defaults. */
|
|
31
|
+
footerCell?: SlotPropsOrFn<MuiTableCellProps, {
|
|
32
|
+
header: Header<TData, unknown>;
|
|
33
|
+
}>;
|
|
26
34
|
};
|
|
27
35
|
type RowClickProps<TData> = {
|
|
28
36
|
/** Called when a clickable body row is clicked. Receives the row's original data. */
|
|
@@ -78,7 +86,20 @@ export type BiampTableProps<TData> = BoxProps & RowClickProps<TData> & Selection
|
|
|
78
86
|
* avoid breaking row memoization.
|
|
79
87
|
*/
|
|
80
88
|
slotProps?: BiampTableSlotProps<TData>;
|
|
89
|
+
/**
|
|
90
|
+
* Keeps the footer row pinned to the bottom of the table's scroll area,
|
|
91
|
+
* the way the header is pinned to the top. Only applies when a column
|
|
92
|
+
* defines a `footer`. @default false
|
|
93
|
+
*/
|
|
94
|
+
stickyFooter?: boolean;
|
|
95
|
+
/**
|
|
96
|
+
* Stretches the table to its container's full height, so the footer row
|
|
97
|
+
* sits at the bottom even when there are too few rows to fill it. Rows
|
|
98
|
+
* keep their height; an invisible filler row takes up the space left
|
|
99
|
+
* over. @default false
|
|
100
|
+
*/
|
|
101
|
+
fitHeight?: boolean;
|
|
81
102
|
};
|
|
82
|
-
export declare function BiampTable<TData>({ table, onRowClick, isRowClickable, loading, error, empty, enableRowSelection, enableExpanding, alwaysExpanded, hideSelectAll, selectChildrenWithParent, showExpandGuidelines, getRowLabel, setRowColor, slotProps, sx, ...boxProps }: BiampTableProps<TData>): import("react").JSX.Element;
|
|
103
|
+
export declare function BiampTable<TData>({ table, onRowClick, isRowClickable, loading, error, empty, enableRowSelection, enableExpanding, alwaysExpanded, hideSelectAll, selectChildrenWithParent, showExpandGuidelines, getRowLabel, setRowColor, slotProps, stickyFooter, fitHeight, sx, ...boxProps }: BiampTableProps<TData>): import("react").JSX.Element;
|
|
83
104
|
export {};
|
|
84
105
|
//# sourceMappingURL=BiampTable.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BiampTable.d.ts","sourceRoot":"","sources":["../../src/BiampTable/BiampTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,QAAQ,EAIb,KAAK,cAAc,IAAI,iBAAiB,EAExC,KAAK,cAAc,IAAI,iBAAiB,EAGxC,KAAK,cAAc,IAAI,iBAAiB,EACxC,KAAK,UAAU,IAAI,aAAa,EAEhC,KAAK,aAAa,IAAI,gBAAgB,EAGvC,MAAM,eAAe,CAAC;AAKvB,OAAO,EAEL,KAAK,IAAI,EACT,KAAK,MAAM,EACX,KAAK,GAAG,EACR,KAAK,KAAK,EACX,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,KAAK,SAAS,EAAqB,MAAM,OAAO,CAAC;AAK1D,OAAO,EAAwB,KAAK,aAAa,EAAE,MAAM,cAAc,CAAC;AAKxE,MAAM,MAAM,mBAAmB,CAAC,KAAK,IAAI;IACvC,wEAAwE;IACxE,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,wEAAwE;IACxE,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB,wEAAwE;IACxE,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB,8EAA8E;IAC9E,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,0HAA0H;IAC1H,UAAU,CAAC,EAAE,aAAa,CACxB,iBAAiB,EACjB;QAAE,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA;KAAE,CACnC,CAAC;IACF,oHAAoH;IACpH,GAAG,CAAC,EAAE,aAAa,CAAC,gBAAgB,EAAE;QAAE,GAAG,EAAE,GAAG,CAAC,KAAK,CAAC,CAAA;KAAE,CAAC,CAAC;IAC3D,sHAAsH;IACtH,IAAI,CAAC,EAAE,aAAa,CAAC,iBAAiB,EAAE;QAAE,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA;KAAE,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"BiampTable.d.ts","sourceRoot":"","sources":["../../src/BiampTable/BiampTable.tsx"],"names":[],"mappings":"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"}
|
package/dist/index.cjs
CHANGED
|
@@ -2489,6 +2489,33 @@ var headerSelectionCellSx = {
|
|
|
2489
2489
|
bgcolor: ({ palette }) => palette.mode === "dark" ? palette.grey[900] : palette.background.paper
|
|
2490
2490
|
};
|
|
2491
2491
|
var checkboxHiddenHeaderSx = { visibility: "hidden" };
|
|
2492
|
+
var footerBg = ({ palette }) => palette.mode === "dark" ? palette.grey[900] : palette.grey[100];
|
|
2493
|
+
var footerRowSx = { bgcolor: footerBg };
|
|
2494
|
+
var footerCellSx = {
|
|
2495
|
+
height: 44,
|
|
2496
|
+
color: "text.primary",
|
|
2497
|
+
fontSize: 14,
|
|
2498
|
+
fontWeight: 600,
|
|
2499
|
+
lineHeight: 1.5,
|
|
2500
|
+
borderTop: ({ palette }) => `0.6px solid ${palette.divider}`,
|
|
2501
|
+
borderBottom: "none"
|
|
2502
|
+
};
|
|
2503
|
+
var footerPinnedCellSx = { bgcolor: footerBg };
|
|
2504
|
+
var stickyFooterSx = {
|
|
2505
|
+
position: "sticky",
|
|
2506
|
+
bottom: 0,
|
|
2507
|
+
zIndex: 2,
|
|
2508
|
+
filter: "drop-shadow(0px -1px 3.5px rgba(0, 0, 0, 0.05))"
|
|
2509
|
+
};
|
|
2510
|
+
var fillerRowSx = { height: "100%" };
|
|
2511
|
+
var fitHeightBodySx = {
|
|
2512
|
+
"& > tr:nth-last-of-type(2) > td": { borderBottom: "none" }
|
|
2513
|
+
};
|
|
2514
|
+
var fillerCellSx = {
|
|
2515
|
+
height: "auto",
|
|
2516
|
+
p: 0,
|
|
2517
|
+
border: "none"
|
|
2518
|
+
};
|
|
2492
2519
|
function BiampTable({
|
|
2493
2520
|
table,
|
|
2494
2521
|
onRowClick,
|
|
@@ -2505,6 +2532,8 @@ function BiampTable({
|
|
|
2505
2532
|
getRowLabel,
|
|
2506
2533
|
setRowColor,
|
|
2507
2534
|
slotProps,
|
|
2535
|
+
stickyFooter = false,
|
|
2536
|
+
fitHeight = false,
|
|
2508
2537
|
sx,
|
|
2509
2538
|
...boxProps
|
|
2510
2539
|
}) {
|
|
@@ -2531,6 +2560,10 @@ function BiampTable({
|
|
|
2531
2560
|
const hasExpandableRows = enableExpanding && rows.some((r) => r.getCanExpand());
|
|
2532
2561
|
const showError = !!error && !loading;
|
|
2533
2562
|
const showEmpty = !showError && !loading && rows.length === 0;
|
|
2563
|
+
const footerGroup = table.getFooterGroups()[0];
|
|
2564
|
+
const hasFooter = table.getVisibleLeafColumns().some((col) => col.columnDef.footer !== void 0);
|
|
2565
|
+
const { sx: userFooterSx, ...restFooterSlotProps } = slotProps?.footer ?? {};
|
|
2566
|
+
const { sx: userFooterRowSx, ...restFooterRowSlotProps } = slotProps?.footerRow ?? {};
|
|
2534
2567
|
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
2535
2568
|
import_material13.TableContainer,
|
|
2536
2569
|
{
|
|
@@ -2553,7 +2586,11 @@ function BiampTable({
|
|
|
2553
2586
|
"aria-busy": showLoading || void 0,
|
|
2554
2587
|
...restTableSlotProps,
|
|
2555
2588
|
sx: mergeSx(
|
|
2556
|
-
{
|
|
2589
|
+
{
|
|
2590
|
+
minWidth: tableMinWidth,
|
|
2591
|
+
tableLayout: "auto",
|
|
2592
|
+
...fitHeight && { height: "100%" }
|
|
2593
|
+
},
|
|
2557
2594
|
userTableSx
|
|
2558
2595
|
),
|
|
2559
2596
|
children: [
|
|
@@ -2618,33 +2655,102 @@ function BiampTable({
|
|
|
2618
2655
|
},
|
|
2619
2656
|
headerGroup.id
|
|
2620
2657
|
)) }),
|
|
2621
|
-
/* @__PURE__ */ (0, import_jsx_runtime15.
|
|
2658
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
2622
2659
|
import_material13.TableBody,
|
|
2623
2660
|
{
|
|
2624
2661
|
...restBodySlotProps,
|
|
2625
|
-
sx: mergeSx(
|
|
2626
|
-
|
|
2627
|
-
|
|
2662
|
+
sx: mergeSx(
|
|
2663
|
+
{ opacity: showLoading ? 0.3 : 1 },
|
|
2664
|
+
fitHeight && !showError ? fitHeightBodySx : void 0,
|
|
2665
|
+
userBodySx
|
|
2666
|
+
),
|
|
2667
|
+
children: [
|
|
2668
|
+
!showError && rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
2669
|
+
BiampTableRow,
|
|
2670
|
+
{
|
|
2671
|
+
row,
|
|
2672
|
+
visibleColumnsKey,
|
|
2673
|
+
isExpanded: row.getIsExpanded(),
|
|
2674
|
+
isSelected: row.getIsSelected(),
|
|
2675
|
+
onRowClick,
|
|
2676
|
+
isRowClickable,
|
|
2677
|
+
enableRowSelection,
|
|
2678
|
+
enableExpanding,
|
|
2679
|
+
alwaysExpanded,
|
|
2680
|
+
selectChildrenWithParent,
|
|
2681
|
+
showExpandGuidelines,
|
|
2682
|
+
getRowLabel,
|
|
2683
|
+
hasExpandableRows,
|
|
2684
|
+
customColor: setRowColor?.(row.original),
|
|
2685
|
+
rowSlotProps: slotProps?.row,
|
|
2686
|
+
cellSlotProps: slotProps?.cell
|
|
2687
|
+
},
|
|
2688
|
+
row.id
|
|
2689
|
+
)),
|
|
2690
|
+
fitHeight && !showError && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_material13.TableRow, { "aria-hidden": true, sx: fillerRowSx, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
2691
|
+
import_material13.TableCell,
|
|
2692
|
+
{
|
|
2693
|
+
colSpan: table.getVisibleLeafColumns().length + (enableRowSelection ? 1 : 0),
|
|
2694
|
+
sx: fillerCellSx
|
|
2695
|
+
}
|
|
2696
|
+
) })
|
|
2697
|
+
]
|
|
2698
|
+
}
|
|
2699
|
+
),
|
|
2700
|
+
hasFooter && footerGroup && !showError && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
2701
|
+
import_material13.TableFooter,
|
|
2702
|
+
{
|
|
2703
|
+
...restFooterSlotProps,
|
|
2704
|
+
sx: mergeSx(
|
|
2705
|
+
stickyFooter ? stickyFooterSx : void 0,
|
|
2706
|
+
userFooterSx
|
|
2707
|
+
),
|
|
2708
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
2709
|
+
import_material13.TableRow,
|
|
2628
2710
|
{
|
|
2629
|
-
|
|
2630
|
-
|
|
2631
|
-
|
|
2632
|
-
|
|
2633
|
-
|
|
2634
|
-
|
|
2635
|
-
|
|
2636
|
-
|
|
2637
|
-
|
|
2638
|
-
|
|
2639
|
-
|
|
2640
|
-
|
|
2641
|
-
|
|
2642
|
-
|
|
2643
|
-
|
|
2644
|
-
|
|
2645
|
-
|
|
2646
|
-
|
|
2647
|
-
|
|
2711
|
+
...restFooterRowSlotProps,
|
|
2712
|
+
sx: mergeSx(footerRowSx, userFooterRowSx),
|
|
2713
|
+
children: [
|
|
2714
|
+
enableRowSelection && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
2715
|
+
import_material13.TableCell,
|
|
2716
|
+
{
|
|
2717
|
+
padding: "checkbox",
|
|
2718
|
+
sx: mergeSx(footerCellSx, footerPinnedCellSx, {
|
|
2719
|
+
position: "sticky",
|
|
2720
|
+
left: 0,
|
|
2721
|
+
zIndex: 1
|
|
2722
|
+
})
|
|
2723
|
+
}
|
|
2724
|
+
),
|
|
2725
|
+
footerGroup.headers.map((header) => {
|
|
2726
|
+
const sticky = header.column.columnDef.meta?.sticky;
|
|
2727
|
+
const resolvedFooterCell = resolveSlot(slotProps?.footerCell, {
|
|
2728
|
+
header
|
|
2729
|
+
});
|
|
2730
|
+
const { sx: userFooterCellSx, ...restFooterCellProps } = resolvedFooterCell ?? {};
|
|
2731
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
2732
|
+
import_material13.TableCell,
|
|
2733
|
+
{
|
|
2734
|
+
...restFooterCellProps,
|
|
2735
|
+
"data-sticky": sticky || void 0,
|
|
2736
|
+
sx: mergeSx(
|
|
2737
|
+
cellSx(sticky, header.column.columnDef.meta?.minWidth, 3),
|
|
2738
|
+
footerCellSx,
|
|
2739
|
+
sticky ? footerPinnedCellSx : void 0,
|
|
2740
|
+
sticky ? { zIndex: 1 } : void 0,
|
|
2741
|
+
userFooterCellSx
|
|
2742
|
+
),
|
|
2743
|
+
children: header.isPlaceholder ? null : (0, import_react_table2.flexRender)(
|
|
2744
|
+
header.column.columnDef.footer,
|
|
2745
|
+
header.getContext()
|
|
2746
|
+
)
|
|
2747
|
+
},
|
|
2748
|
+
header.id
|
|
2749
|
+
);
|
|
2750
|
+
})
|
|
2751
|
+
]
|
|
2752
|
+
}
|
|
2753
|
+
)
|
|
2648
2754
|
}
|
|
2649
2755
|
)
|
|
2650
2756
|
]
|