@bwp-web/components 0.13.4 → 0.13.6
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 +0 -1
- package/dist/BiampTable/BiampTable.d.ts.map +1 -1
- package/dist/BiampTable/BiampTableTruncatedCell.d.ts.map +1 -1
- package/dist/BiampTable/tanstack-meta.d.ts +2 -0
- package/dist/BiampTable/tanstack-meta.d.ts.map +1 -1
- package/dist/index.cjs +46 -36
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +57 -45
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { type BoxProps } from '@mui/material';
|
|
2
2
|
import { type Table } from '@tanstack/react-table';
|
|
3
3
|
import { type ReactNode } from 'react';
|
|
4
|
-
import './tanstack-meta';
|
|
5
4
|
type RowClickProps<TData> = {
|
|
6
5
|
/** Called when a clickable body row is clicked. Receives the row's original data. */
|
|
7
6
|
onRowClick: (row: TData) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BiampTable.d.ts","sourceRoot":"","sources":["../../src/BiampTable/BiampTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,QAAQ,
|
|
1
|
+
{"version":3,"file":"BiampTable.d.ts","sourceRoot":"","sources":["../../src/BiampTable/BiampTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,QAAQ,EAWd,MAAM,eAAe,CAAC;AAOvB,OAAO,EAAwB,KAAK,KAAK,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAc,EAAE,KAAK,SAAS,EAAU,MAAM,OAAO,CAAC;AAOtD,KAAK,aAAa,CAAC,KAAK,IACpB;IACE,qFAAqF;IACrF,UAAU,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,OAAO,CAAC;CAC1C,GACD;IACE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,cAAc,CAAC,EAAE,KAAK,CAAC;CACxB,CAAC;AAGN,KAAK,uBAAuB,GACxB;IACE,8DAA8D;IAC9D,kBAAkB,EAAE,IAAI,CAAC;IACzB,uFAAuF;IACvF,eAAe,EAAE,IAAI,CAAC;IACtB,iGAAiG;IACjG,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,4FAA4F;IAC5F,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC,GACD;IACE,8DAA8D;IAC9D,kBAAkB,EAAE,IAAI,CAAC;IACzB,eAAe,CAAC,EAAE,KAAK,CAAC;IACxB,iGAAiG;IACjG,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,wBAAwB,CAAC,EAAE,KAAK,CAAC;CAClC,GACD;IACE,kBAAkB,CAAC,EAAE,KAAK,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,wBAAwB,CAAC,EAAE,KAAK,CAAC;CAClC,CAAC;AAEN,MAAM,MAAM,eAAe,CAAC,KAAK,IAAI,QAAQ,GAC3C,aAAa,CAAC,KAAK,CAAC,GACpB,uBAAuB,GAAG;IACxB,6CAA6C;IAC7C,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IACpB,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,wKAAwK;IACxK,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,SAAS,CAAC;IACpC,6IAA6I;IAC7I,KAAK,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,gIAAgI;IAChI,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,MAAM,CAAC;CACtC,CAAC;AAiRJ,wBAAgB,UAAU,CAAC,KAAK,EAAE,EAChC,KAAK,EACL,UAAU,EACV,cAAc,EACd,OAAO,EACP,KAAK,EACL,KAAK,EACL,kBAA0B,EAC1B,eAAuB,EACvB,aAAa,EACb,wBAAgC,EAChC,WAAW,EACX,EAAE,EACF,GAAG,QAAQ,EACZ,EAAE,eAAe,CAAC,KAAK,CAAC,2CAyJxB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BiampTableTruncatedCell.d.ts","sourceRoot":"","sources":["../../src/BiampTable/BiampTableTruncatedCell.tsx"],"names":[],"mappings":"AACA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAE7D;;;;;GAKG;AACH,wBAAgB,uBAAuB,CAAC,EACtC,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,
|
|
1
|
+
{"version":3,"file":"BiampTableTruncatedCell.d.ts","sourceRoot":"","sources":["../../src/BiampTable/BiampTableTruncatedCell.tsx"],"names":[],"mappings":"AACA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAE7D;;;;;GAKG;AACH,wBAAgB,uBAAuB,CAAC,EACtC,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,2CAuCA"}
|
|
@@ -11,6 +11,8 @@ declare module '@tanstack/react-table' {
|
|
|
11
11
|
columnLabel?: string;
|
|
12
12
|
/** Server-side order field name associated with this column (used by `useBiampServerSideTable`). */
|
|
13
13
|
orderField?: string;
|
|
14
|
+
/** Set to `false` on columns with custom cell renderers (buttons, badges, etc.) to skip text truncation. Defaults to `true`. */
|
|
15
|
+
truncate?: boolean;
|
|
14
16
|
}
|
|
15
17
|
}
|
|
16
18
|
//# sourceMappingURL=tanstack-meta.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tanstack-meta.d.ts","sourceRoot":"","sources":["../../src/BiampTable/tanstack-meta.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAErD,OAAO,QAAQ,uBAAuB,CAAC;IACrC,UAAU,UAAU,CAAC,KAAK,SAAS,OAAO,EAAE,MAAM;QAChD,0DAA0D;QAC1D,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAC3B,sEAAsE;QACtE,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;QAC1B,+EAA+E;QAC/E,cAAc,CAAC,EAAE,OAAO,CAAC;QACzB,6FAA6F;QAC7F,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,oGAAoG;QACpG,UAAU,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"tanstack-meta.d.ts","sourceRoot":"","sources":["../../src/BiampTable/tanstack-meta.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAErD,OAAO,QAAQ,uBAAuB,CAAC;IACrC,UAAU,UAAU,CAAC,KAAK,SAAS,OAAO,EAAE,MAAM;QAChD,0DAA0D;QAC1D,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;QAC3B,sEAAsE;QACtE,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;QAC1B,+EAA+E;QAC/E,cAAc,CAAC,EAAE,OAAO,CAAC;QACzB,6FAA6F;QAC7F,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,oGAAoG;QACpG,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,gIAAgI;QAChI,QAAQ,CAAC,EAAE,OAAO,CAAC;KACpB;CACF"}
|
package/dist/index.cjs
CHANGED
|
@@ -621,6 +621,7 @@ function BiampTableTruncatedCell({
|
|
|
621
621
|
children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
622
622
|
import_material6.Box,
|
|
623
623
|
{
|
|
624
|
+
"data-truncate": true,
|
|
624
625
|
ref: textRef,
|
|
625
626
|
onMouseEnter: handleMouseEnter,
|
|
626
627
|
onMouseLeave: handleMouseLeave,
|
|
@@ -700,7 +701,11 @@ function cellSx(sticky, minWidth, zIndex) {
|
|
|
700
701
|
};
|
|
701
702
|
}
|
|
702
703
|
const mw = minWidth ?? 40;
|
|
703
|
-
return {
|
|
704
|
+
return {
|
|
705
|
+
minWidth: mw,
|
|
706
|
+
whiteSpace: "nowrap",
|
|
707
|
+
"&:has([data-truncate])": { maxWidth: mw, whiteSpace: "normal" }
|
|
708
|
+
};
|
|
704
709
|
}
|
|
705
710
|
var rowCursorPointerSx = { cursor: "pointer" };
|
|
706
711
|
var selectionCellSx = {
|
|
@@ -714,25 +719,9 @@ var checkboxHiddenSx = { visibility: "hidden" };
|
|
|
714
719
|
var expandCellBaseSx = {
|
|
715
720
|
display: "flex",
|
|
716
721
|
alignItems: "center",
|
|
717
|
-
gap:
|
|
718
|
-
};
|
|
719
|
-
var chevronExpandedSx = {
|
|
720
|
-
color: ({ palette }) => palette.text.secondary,
|
|
721
|
-
transition: "transform 150ms ease",
|
|
722
|
-
transform: "rotate(90deg)",
|
|
723
|
-
width: 16,
|
|
724
|
-
height: 16,
|
|
725
|
-
cursor: "pointer"
|
|
722
|
+
gap: "2px"
|
|
726
723
|
};
|
|
727
|
-
var
|
|
728
|
-
color: ({ palette }) => palette.text.secondary,
|
|
729
|
-
transition: "transform 150ms ease",
|
|
730
|
-
transform: "rotate(0deg)",
|
|
731
|
-
width: 16,
|
|
732
|
-
height: 16,
|
|
733
|
-
cursor: "pointer"
|
|
734
|
-
};
|
|
735
|
-
var expandPlaceholderSx = { width: 16 };
|
|
724
|
+
var expandPlaceholderSx = { width: 28 };
|
|
736
725
|
var headerSelectionCellSx = {
|
|
737
726
|
position: "sticky",
|
|
738
727
|
left: 0,
|
|
@@ -742,6 +731,8 @@ var headerSelectionCellSx = {
|
|
|
742
731
|
var checkboxHiddenHeaderSx = { visibility: "hidden" };
|
|
743
732
|
function BiampTableRowInner({
|
|
744
733
|
row,
|
|
734
|
+
isExpanded,
|
|
735
|
+
isSelected,
|
|
745
736
|
onRowClick,
|
|
746
737
|
isRowClickable,
|
|
747
738
|
enableRowSelection,
|
|
@@ -755,7 +746,7 @@ function BiampTableRowInner({
|
|
|
755
746
|
import_material7.TableRow,
|
|
756
747
|
{
|
|
757
748
|
hover: clickable,
|
|
758
|
-
selected: enableRowSelection ?
|
|
749
|
+
selected: enableRowSelection ? isSelected : void 0,
|
|
759
750
|
role: clickable ? "button" : void 0,
|
|
760
751
|
tabIndex: clickable ? 0 : void 0,
|
|
761
752
|
sx: clickable ? rowCursorPointerSx : void 0,
|
|
@@ -770,7 +761,7 @@ function BiampTableRowInner({
|
|
|
770
761
|
enableRowSelection && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_material7.TableCell, { padding: "checkbox", sx: selectionCellSx, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
771
762
|
import_material7.Checkbox,
|
|
772
763
|
{
|
|
773
|
-
checked:
|
|
764
|
+
checked: isSelected,
|
|
774
765
|
disabled: !row.getCanSelect(),
|
|
775
766
|
onChange: (e) => row.toggleSelected(e.target.checked, {
|
|
776
767
|
selectChildren: selectChildrenWithParent
|
|
@@ -787,19 +778,22 @@ function BiampTableRowInner({
|
|
|
787
778
|
row.getVisibleCells().map((cell, cellIndex, cells) => {
|
|
788
779
|
const sticky = cell.column.columnDef.meta?.sticky;
|
|
789
780
|
const isExpandCell = enableExpanding && !sticky && cellIndex === cells.findIndex((c) => !c.column.columnDef.meta?.sticky);
|
|
781
|
+
const content = (0, import_react_table.flexRender)(
|
|
782
|
+
cell.column.columnDef.cell,
|
|
783
|
+
cell.getContext()
|
|
784
|
+
);
|
|
790
785
|
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
791
786
|
import_material7.TableCell,
|
|
792
787
|
{
|
|
793
788
|
"data-sticky": sticky || void 0,
|
|
794
|
-
sx:
|
|
789
|
+
sx: {
|
|
790
|
+
...cellSx(sticky, cell.column.columnDef.meta?.minWidth, 2),
|
|
791
|
+
pl: isExpandCell ? "6px" : "12px"
|
|
792
|
+
},
|
|
795
793
|
children: (() => {
|
|
796
|
-
const content = (0, import_react_table.flexRender)(
|
|
797
|
-
cell.column.columnDef.cell,
|
|
798
|
-
cell.getContext()
|
|
799
|
-
);
|
|
800
794
|
if (sticky) return content;
|
|
801
|
-
const
|
|
802
|
-
const truncated =
|
|
795
|
+
const truncate = cell.column.columnDef.meta?.truncate ?? true;
|
|
796
|
+
const truncated = truncate ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(BiampTableTruncatedCell, { children: content }) : content;
|
|
803
797
|
if (!isExpandCell) return truncated;
|
|
804
798
|
const rowLabel = getRowLabel ? getRowLabel(row.original) : `row ${row.index + 1}`;
|
|
805
799
|
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
|
|
@@ -808,16 +802,32 @@ function BiampTableRowInner({
|
|
|
808
802
|
sx: row.depth > 0 ? { ...expandCellBaseSx, pl: `${row.depth * 12}px` } : expandCellBaseSx,
|
|
809
803
|
children: [
|
|
810
804
|
row.getCanExpand() ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
811
|
-
|
|
805
|
+
import_material7.IconButton,
|
|
812
806
|
{
|
|
807
|
+
variant: "none",
|
|
813
808
|
onClick: (e) => {
|
|
814
809
|
e.stopPropagation();
|
|
815
810
|
row.toggleExpanded();
|
|
816
811
|
},
|
|
817
|
-
"aria-label":
|
|
818
|
-
"aria-expanded":
|
|
819
|
-
|
|
820
|
-
|
|
812
|
+
"aria-label": isExpanded ? `Collapse ${rowLabel}` : `Expand ${rowLabel}`,
|
|
813
|
+
"aria-expanded": isExpanded,
|
|
814
|
+
children: isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
815
|
+
import_assets5.ChevronDownIcon,
|
|
816
|
+
{
|
|
817
|
+
variant: "xs",
|
|
818
|
+
sx: {
|
|
819
|
+
color: ({ palette }) => palette.text.secondary
|
|
820
|
+
}
|
|
821
|
+
}
|
|
822
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
823
|
+
import_assets5.ChevronRightIcon,
|
|
824
|
+
{
|
|
825
|
+
variant: "xs",
|
|
826
|
+
sx: {
|
|
827
|
+
color: ({ palette }) => palette.text.secondary
|
|
828
|
+
}
|
|
829
|
+
}
|
|
830
|
+
)
|
|
821
831
|
}
|
|
822
832
|
) : hasExpandableRows ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_material7.Box, { sx: expandPlaceholderSx }) : null,
|
|
823
833
|
truncated
|
|
@@ -835,7 +845,7 @@ function BiampTableRowInner({
|
|
|
835
845
|
);
|
|
836
846
|
}
|
|
837
847
|
function biampTableRowPropsAreEqual(prev, next) {
|
|
838
|
-
return prev.row.id === next.row.id && prev.row.original === next.row.original && prev.
|
|
848
|
+
return prev.row.id === next.row.id && prev.row.original === next.row.original && prev.isSelected === next.isSelected && prev.isExpanded === next.isExpanded && prev.row.getVisibleCells().length === next.row.getVisibleCells().length && prev.enableRowSelection === next.enableRowSelection && prev.enableExpanding === next.enableExpanding && prev.hasExpandableRows === next.hasExpandableRows && prev.selectChildrenWithParent === next.selectChildrenWithParent && prev.onRowClick === next.onRowClick && prev.isRowClickable === next.isRowClickable && prev.getRowLabel === next.getRowLabel;
|
|
839
849
|
}
|
|
840
850
|
var BiampTableRow = import_react4.default.memo(
|
|
841
851
|
BiampTableRowInner,
|
|
@@ -879,8 +889,6 @@ function BiampTable({
|
|
|
879
889
|
display: "flex",
|
|
880
890
|
flexDirection: "column",
|
|
881
891
|
height: "100%",
|
|
882
|
-
overflow: "auto",
|
|
883
|
-
overscrollBehavior: "none",
|
|
884
892
|
position: "relative",
|
|
885
893
|
...sx
|
|
886
894
|
},
|
|
@@ -944,6 +952,8 @@ function BiampTable({
|
|
|
944
952
|
BiampTableRow,
|
|
945
953
|
{
|
|
946
954
|
row,
|
|
955
|
+
isExpanded: row.getIsExpanded(),
|
|
956
|
+
isSelected: row.getIsSelected(),
|
|
947
957
|
onRowClick,
|
|
948
958
|
isRowClickable,
|
|
949
959
|
enableRowSelection,
|