@purpurds/table 6.12.5 → 7.0.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/LICENSE.txt +16 -16
- package/dist/cell-types/body-text-cell.d.ts.map +1 -1
- package/dist/cell-types/link-cell.d.ts.map +1 -1
- package/dist/story-utils/column-def.d.ts.map +1 -1
- package/dist/story-utils/table-data.d.ts +2 -4
- package/dist/story-utils/table-data.d.ts.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/table-action-bar.d.ts.map +1 -1
- package/dist/table-export-drawer.d.ts +3 -2
- package/dist/table-export-drawer.d.ts.map +1 -1
- package/dist/table-row-cell.d.ts.map +1 -1
- package/dist/table-settings-drawer.d.ts +2 -1
- package/dist/table-settings-drawer.d.ts.map +1 -1
- package/dist/table-toolbar.d.ts +6 -4
- package/dist/table-toolbar.d.ts.map +1 -1
- package/dist/table.cjs.js +63 -63
- package/dist/table.cjs.js.map +1 -1
- package/dist/table.d.ts +2 -1
- package/dist/table.d.ts.map +1 -1
- package/dist/table.es.js +3930 -3932
- package/dist/table.es.js.map +1 -1
- package/dist/test-utils/helpers.d.ts +2 -1
- package/dist/test-utils/helpers.d.ts.map +1 -1
- package/dist/types.d.ts +1 -1
- package/dist/types.d.ts.map +1 -1
- package/dist/use-truncated-hook.d.ts +3 -5
- package/dist/use-truncated-hook.d.ts.map +1 -1
- package/package.json +23 -23
- package/src/cell-types/body-text-cell.tsx +7 -8
- package/src/cell-types/link-cell.tsx +13 -6
- package/src/story-utils/column-def.ts +2 -0
- package/src/story-utils/table-data.tsx +10 -8
- package/src/table-action-bar.tsx +3 -2
- package/src/table-column-header-cell.tsx +16 -6
- package/src/table-export-drawer.test.tsx +1 -0
- package/src/table-export-drawer.tsx +5 -3
- package/src/table-kitchen-sink.test.tsx +5 -18
- package/src/table-row-cell.tsx +1 -30
- package/src/table-settings-drawer.test.tsx +4 -0
- package/src/table-settings-drawer.tsx +46 -41
- package/src/table-toolbar.test.tsx +3 -0
- package/src/table-toolbar.tsx +12 -7
- package/src/table.module.scss +27 -18
- package/src/table.stories.tsx +10 -9
- package/src/table.tsx +32 -26
- package/src/test-utils/helpers.ts +2 -1
- package/src/types.ts +1 -1
- package/src/use-truncated-hook.tsx +16 -60
|
@@ -56,6 +56,7 @@ export declare const Selectors: {
|
|
|
56
56
|
PAGINATION: {
|
|
57
57
|
ROOT: string;
|
|
58
58
|
PAGE_SIZE_SELECT: string;
|
|
59
|
+
PAGE_BUTTON: (pageNumber: number) => string;
|
|
59
60
|
};
|
|
60
61
|
SKELETON: string;
|
|
61
62
|
};
|
|
@@ -74,7 +75,7 @@ export declare const copy: {
|
|
|
74
75
|
};
|
|
75
76
|
exportDrawer: {
|
|
76
77
|
bodyText: string;
|
|
77
|
-
|
|
78
|
+
closeButtonAriaLabel: string;
|
|
78
79
|
link: string;
|
|
79
80
|
title: string;
|
|
80
81
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../src/test-utils/helpers.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,YAAY,UAAW,WAAW,KAAG,WAIjD,CAAC;AAEF,eAAO,MAAM,YAAY,UAAW,WAAW,KAAG,WAIjD,CAAC;AAEF,eAAO,MAAM,0BAA0B,UAC9B,WAAW,gBACJ,MAAM,KACnB,WAKF,CAAC;AAEF,eAAO,MAAM,mBAAmB,UACvB,gBAAgB,SAChB,MAAM,gBACC,MAAM,KACnB,oBAQF,CAAC;AAEF,eAAO,MAAM,eAAe,UAAW,gBAAgB,qBAAc,mBAEpE,CAAC;AAEF,eAAO,MAAM,eAAe,UAAW,gBAAgB,SAAS,MAAM,KAAG,mBAExE,CAAC;AAGF,eAAO,MAAM,0BAA0B,UAC9B,gBAAgB,SAChB,MAAM,KACZ,iBAEF,CAAC;AAEF,eAAO,MAAM,6BAA6B,UACjC,gBAAgB,SAChB,MAAM,KACZ,iBAEF,CAAC;AAGF,eAAO,MAAM,4BAA4B,UAChC,gBAAgB,qBAEtB,iBAEF,CAAC;AAEF,eAAO,MAAM,uBAAuB,UAAW,gBAAgB,UAAU,MAAM,gBAG9E,CAAC;AAEF,eAAO,MAAM,cAAc,UAClB,gBAAgB,UACf,MAAM,eACD,MAAM,kBAOpB,CAAC;AAEF,eAAO,MAAM,0BAA0B,UAAW,gBAAgB,UAAU,MAAM,gBAGjF,CAAC;AAEF,eAAO,MAAM,cAAc,UAClB,gBAAgB,UACf,MAAM,eACD,MAAM,kBAIpB,CAAC;AAEF,eAAO,MAAM,SAAS
|
|
1
|
+
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../src/test-utils/helpers.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,YAAY,UAAW,WAAW,KAAG,WAIjD,CAAC;AAEF,eAAO,MAAM,YAAY,UAAW,WAAW,KAAG,WAIjD,CAAC;AAEF,eAAO,MAAM,0BAA0B,UAC9B,WAAW,gBACJ,MAAM,KACnB,WAKF,CAAC;AAEF,eAAO,MAAM,mBAAmB,UACvB,gBAAgB,SAChB,MAAM,gBACC,MAAM,KACnB,oBAQF,CAAC;AAEF,eAAO,MAAM,eAAe,UAAW,gBAAgB,qBAAc,mBAEpE,CAAC;AAEF,eAAO,MAAM,eAAe,UAAW,gBAAgB,SAAS,MAAM,KAAG,mBAExE,CAAC;AAGF,eAAO,MAAM,0BAA0B,UAC9B,gBAAgB,SAChB,MAAM,KACZ,iBAEF,CAAC;AAEF,eAAO,MAAM,6BAA6B,UACjC,gBAAgB,SAChB,MAAM,KACZ,iBAEF,CAAC;AAGF,eAAO,MAAM,4BAA4B,UAChC,gBAAgB,qBAEtB,iBAEF,CAAC;AAEF,eAAO,MAAM,uBAAuB,UAAW,gBAAgB,UAAU,MAAM,gBAG9E,CAAC;AAEF,eAAO,MAAM,cAAc,UAClB,gBAAgB,UACf,MAAM,eACD,MAAM,kBAOpB,CAAC;AAEF,eAAO,MAAM,0BAA0B,UAAW,gBAAgB,UAAU,MAAM,gBAGjF,CAAC;AAEF,eAAO,MAAM,cAAc,UAClB,gBAAgB,UACf,MAAM,eACD,MAAM,kBAIpB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kCA6CQ,MAAM;;;CAGnC,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2EhB,CAAC"}
|
package/dist/types.d.ts
CHANGED
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AACpD,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAErF,OAAO,EAAE,uBAAuB,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AACpF,OAAO,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AACnE,OAAO,EAAE,4BAA4B,EAAE,MAAM,yBAAyB,CAAC;AAEvE,MAAM,MAAM,QAAQ,GAChB,OAAO,GACP,UAAU,GACV,QAAQ,GACR,aAAa,GACb,SAAS,GACT,MAAM,GACN,OAAO,GACP,mBAAmB,GACnB,UAAU,GACV,UAAU,GACV,MAAM,GACN,QAAQ,GACR,cAAc,GACd,WAAW,GACX,QAAQ,GACR,qBAAqB,CAAC;AAE1B,OAAO,QAAQ,uBAAuB,CAAC;IAIrC,UAAU,UAAU,CAAC,KAAK,SAAS,OAAO,EAAE,MAAM;QAChD;;;;WAIG;QACH,aAAa,CAAC,EAAE,cAAc,CAAC;QAE/B;;WAEG;QACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;QAE3B;;WAEG;QACH,eAAe,CAAC,EAAE,MAAM,CAAC;QAEzB;;;;WAIG;QACH,SAAS,CAAC,EAAE,MAAM,CAAC;QAEnB;;;;;;;;;;;;;;;;;;;;WAoBG;QACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;QAEpB;;WAEG;QACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;QAEvC;;;WAGG;QACH,WAAW,CAAC,EAAE,WAAW,CAAC;QAE1B;;;WAGG;QACH,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG;YAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;SAAE,KAAK,IAAI,CAAC;QAEvE;;;WAGG;QACH,QAAQ,CAAC,EAAE,OAAO,CAAC;QAEnB;;;WAGG;QACH,sBAAsB,CAAC,EAAE;YACvB,MAAM,EAAE,MAAM,CAAC;YACf,GAAG,EAAE,MAAM,CAAC;SACb,CAAC;KACH;IAED,UAAU,SAAS;QACjB;;;;WAIG;QACH,iBAAiB,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;KACtC;IAED,UAAU,UAAU;QAClB;;WAEG;QACH,kBAAkB,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;QAEvC;;WAEG;QACH,gBAAgB,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;KACtC;CACF;AAED;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;OAEG;IACH,aAAa,EAAE,uBAAuB,CAAC;IAEvC;;OAEG;IACH,eAAe,EAAE,IAAI,CAAC;IAEtB;;OAEG;IACH,sBAAsB,EAAE,MAAM,CAAC;IAE/B;;OAEG;IACH,oBAAoB,EAAE,MAAM,IAAI,CAAC;IAEjC;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;CACrC,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,eAAe,CAAC,EAAE,KAAK,GAAG,SAAS,CAAC;IACpC,sBAAsB,CAAC,EAAE,KAAK,CAAC;IAC/B,oBAAoB,CAAC,EAAE,KAAK,CAAC;IAC7B,sBAAsB,CAAC,EAAE,KAAK,CAAC;CAChC,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC;;OAEG;IACH,cAAc,EAAE;QACd,KAAK,EAAE,MAAM,CAAC;QACd,WAAW,EAAE,MAAM,CAAC;KACrB,CAAC;IAEF;;OAEG;IACH,oBAAoB,EAAE,cAAc,CAAC;IAErC;;OAEG;IACH,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,10 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
divRef: import('react').RefObject<HTMLParagraphElement | null>;
|
|
1
|
+
declare const useTruncatedTooltip: () => {
|
|
2
|
+
showPopover: boolean;
|
|
3
|
+
containerRef: import('react').RefObject<HTMLDivElement | null>;
|
|
5
4
|
onMouseEnter: () => void;
|
|
6
5
|
onMouseLeave: () => void;
|
|
7
|
-
showPopover: boolean;
|
|
8
6
|
};
|
|
9
7
|
export default useTruncatedTooltip;
|
|
10
8
|
//# sourceMappingURL=use-truncated-hook.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-truncated-hook.d.ts","sourceRoot":"","sources":["../src/use-truncated-hook.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-truncated-hook.d.ts","sourceRoot":"","sources":["../src/use-truncated-hook.tsx"],"names":[],"mappings":"AAEA,QAAA,MAAM,mBAAmB;;;;;CAyBxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@purpurds/table",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "7.0.0",
|
|
4
4
|
"license": "AGPL-3.0-only",
|
|
5
5
|
"main": "./dist/table.cjs.js",
|
|
6
6
|
"types": "./dist/table.d.ts",
|
|
@@ -17,22 +17,22 @@
|
|
|
17
17
|
"dependencies": {
|
|
18
18
|
"@tanstack/react-table": "~8.21.2",
|
|
19
19
|
"classnames": "~2.5.0",
|
|
20
|
-
"@purpurds/badge": "
|
|
21
|
-
"@purpurds/
|
|
22
|
-
"@purpurds/
|
|
23
|
-
"@purpurds/
|
|
24
|
-
"@purpurds/
|
|
25
|
-
"@purpurds/
|
|
26
|
-
"@purpurds/
|
|
27
|
-
"@purpurds/
|
|
28
|
-
"@purpurds/
|
|
29
|
-
"@purpurds/
|
|
30
|
-
"@purpurds/
|
|
31
|
-
"@purpurds/
|
|
32
|
-
"@purpurds/tooltip": "
|
|
33
|
-
"@purpurds/
|
|
34
|
-
"@purpurds/
|
|
35
|
-
"@purpurds/
|
|
20
|
+
"@purpurds/badge": "7.0.0",
|
|
21
|
+
"@purpurds/cta-link": "7.0.0",
|
|
22
|
+
"@purpurds/button": "7.0.0",
|
|
23
|
+
"@purpurds/checkbox": "7.0.0",
|
|
24
|
+
"@purpurds/drawer": "7.0.0",
|
|
25
|
+
"@purpurds/heading": "7.0.0",
|
|
26
|
+
"@purpurds/icon": "7.0.0",
|
|
27
|
+
"@purpurds/link": "7.0.0",
|
|
28
|
+
"@purpurds/paragraph": "7.0.0",
|
|
29
|
+
"@purpurds/skeleton": "7.0.0",
|
|
30
|
+
"@purpurds/select": "7.0.0",
|
|
31
|
+
"@purpurds/text-field": "7.0.0",
|
|
32
|
+
"@purpurds/tooltip": "7.0.0",
|
|
33
|
+
"@purpurds/tokens": "7.0.0",
|
|
34
|
+
"@purpurds/visually-hidden": "7.0.0",
|
|
35
|
+
"@purpurds/toggle": "7.0.0"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
38
|
"@rushstack/eslint-patch": "~1.10.0",
|
|
@@ -57,13 +57,13 @@
|
|
|
57
57
|
"vitest": "^3.1.2",
|
|
58
58
|
"vitest-axe": "~0.1.0",
|
|
59
59
|
"vitest-canvas-mock": "~0.3.3",
|
|
60
|
-
"@purpurds/autocomplete": "
|
|
60
|
+
"@purpurds/autocomplete": "7.0.0",
|
|
61
61
|
"@purpurds/component-rig": "1.0.0",
|
|
62
|
-
"@purpurds/grid": "
|
|
63
|
-
"@purpurds/illustrative-icon": "
|
|
64
|
-
"@purpurds/
|
|
65
|
-
"@purpurds/
|
|
66
|
-
"@purpurds/
|
|
62
|
+
"@purpurds/grid": "7.0.0",
|
|
63
|
+
"@purpurds/illustrative-icon": "7.0.0",
|
|
64
|
+
"@purpurds/listbox": "7.0.0",
|
|
65
|
+
"@purpurds/pagination": "7.0.0",
|
|
66
|
+
"@purpurds/label": "7.0.0"
|
|
67
67
|
},
|
|
68
68
|
"scripts": {
|
|
69
69
|
"build:dev": "vite",
|
|
@@ -16,26 +16,25 @@ export type BodyTextCellProps<TData> = {
|
|
|
16
16
|
|
|
17
17
|
export const BodyTextCell = <TData extends RowData>({ cell }: BodyTextCellProps<TData>) => {
|
|
18
18
|
const value = cell.getValue<string>();
|
|
19
|
-
const {
|
|
19
|
+
const { showPopover, containerRef, onMouseEnter, onMouseLeave } = useTruncatedTooltip();
|
|
20
20
|
|
|
21
21
|
if (!value) {
|
|
22
22
|
return <EmptyCell />;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
const
|
|
25
|
+
const minWidthInRemString = pxToRemString(cell.column.getSize());
|
|
26
26
|
|
|
27
27
|
const content = (
|
|
28
28
|
<div
|
|
29
|
-
ref={
|
|
30
|
-
className={cx("purpur-table-row-cell__truncate")}
|
|
29
|
+
ref={containerRef}
|
|
30
|
+
className={cx("purpur-table-row-cell__truncate-wrapper")}
|
|
31
31
|
style={{
|
|
32
|
-
|
|
33
|
-
minWidth: widthInRemString,
|
|
32
|
+
minWidth: minWidthInRemString,
|
|
34
33
|
}}
|
|
35
34
|
onMouseEnter={onMouseEnter}
|
|
36
35
|
onMouseLeave={onMouseLeave}
|
|
37
36
|
>
|
|
38
|
-
<Paragraph>{value}</Paragraph>
|
|
37
|
+
<Paragraph className={cx("purpur-table-row-cell__truncate")}>{value}</Paragraph>
|
|
39
38
|
</div>
|
|
40
39
|
);
|
|
41
40
|
|
|
@@ -46,7 +45,7 @@ export const BodyTextCell = <TData extends RowData>({ cell }: BodyTextCellProps<
|
|
|
46
45
|
triggerElement={content}
|
|
47
46
|
// @ts-expect-error open does not exist on tooltip but gets passed down to radix tooltip with ...props
|
|
48
47
|
open={showPopover}
|
|
49
|
-
contentClassName={cx("purpur-table-row-
|
|
48
|
+
contentClassName={cx("purpur-table-row-cell__tooltip-content")}
|
|
50
49
|
>
|
|
51
50
|
{value}
|
|
52
51
|
</Tooltip>
|
|
@@ -16,7 +16,7 @@ export type LinkCellProps<TData> = {
|
|
|
16
16
|
|
|
17
17
|
export const LinkCell = <TData extends RowData>({ cell }: LinkCellProps<TData>) => {
|
|
18
18
|
const value = cell.getValue<LinkProps>();
|
|
19
|
-
const {
|
|
19
|
+
const { showPopover, containerRef, onMouseEnter, onMouseLeave } = useTruncatedTooltip();
|
|
20
20
|
|
|
21
21
|
if (!value) {
|
|
22
22
|
return <EmptyCell />;
|
|
@@ -28,21 +28,28 @@ export const LinkCell = <TData extends RowData>({ cell }: LinkCellProps<TData>)
|
|
|
28
28
|
|
|
29
29
|
const content = (
|
|
30
30
|
<div
|
|
31
|
-
ref={
|
|
32
|
-
className={cx("purpur-table-row-cell__truncate")}
|
|
31
|
+
ref={containerRef}
|
|
32
|
+
className={cx("purpur-table-row-cell__truncate-wrapper")}
|
|
33
33
|
style={{
|
|
34
34
|
minWidth: widthInRemString,
|
|
35
|
-
maxWidth: widthInRemString,
|
|
36
35
|
}}
|
|
37
36
|
onMouseEnter={onMouseEnter}
|
|
38
37
|
onMouseLeave={onMouseLeave}
|
|
39
38
|
>
|
|
40
|
-
<Link
|
|
39
|
+
<Link
|
|
40
|
+
className={cx("purpur-table-row-cell__truncate")}
|
|
41
|
+
variant={variant ?? "text"}
|
|
42
|
+
href={href}
|
|
43
|
+
onClick={(e) => {
|
|
44
|
+
// Stop event propagation to prevent Tooltip from blocking link navigation
|
|
45
|
+
e.stopPropagation();
|
|
46
|
+
}}
|
|
47
|
+
{...props}
|
|
48
|
+
>
|
|
41
49
|
{children}
|
|
42
50
|
</Link>
|
|
43
51
|
</div>
|
|
44
52
|
);
|
|
45
|
-
|
|
46
53
|
return (
|
|
47
54
|
<Tooltip
|
|
48
55
|
position="top"
|
|
@@ -4,6 +4,7 @@ import { ButtonProps } from "@purpurds/button";
|
|
|
4
4
|
import { IconDownload } from "@purpurds/icon/download";
|
|
5
5
|
import { IconMoreVertical } from "@purpurds/icon/more-vertical";
|
|
6
6
|
import { IconRemove } from "@purpurds/icon/remove";
|
|
7
|
+
import { LinkProps } from "@purpurds/link";
|
|
7
8
|
|
|
8
9
|
import { ButtonGroupButtonProp } from "../cell-types/button-group-cell";
|
|
9
10
|
|
|
@@ -30,10 +31,7 @@ export type TableData = {
|
|
|
30
31
|
export type SimpleTableData = {
|
|
31
32
|
id: number;
|
|
32
33
|
name: string;
|
|
33
|
-
link:
|
|
34
|
-
href: string;
|
|
35
|
-
children: React.ReactNode;
|
|
36
|
-
};
|
|
34
|
+
link: LinkProps;
|
|
37
35
|
longString: string;
|
|
38
36
|
};
|
|
39
37
|
|
|
@@ -95,25 +93,29 @@ export const simpleTableData: SimpleTableData[] = [
|
|
|
95
93
|
{
|
|
96
94
|
id: 12345,
|
|
97
95
|
name: "Name 1",
|
|
98
|
-
link: { href: "
|
|
96
|
+
link: { href: "www.telia.se", children: "Link 2", variant: "text" },
|
|
99
97
|
longString: "Some really long string",
|
|
100
98
|
},
|
|
101
99
|
{
|
|
102
100
|
id: 67890,
|
|
103
101
|
name: "Name 7",
|
|
104
|
-
link: { href: "
|
|
102
|
+
link: { href: "https://www.telia.se/", children: "Link 9", variant: "text" },
|
|
105
103
|
longString: "Lorem, ipsum dolor sit amet consectetur adipisicing elit.",
|
|
106
104
|
},
|
|
107
105
|
{
|
|
108
106
|
id: 12346,
|
|
109
107
|
name: "Name 5",
|
|
110
|
-
link: { href: "#", children: "Link 1" },
|
|
108
|
+
link: { href: "#", children: "Link 1", variant: "text" },
|
|
111
109
|
longString: "Some really long string",
|
|
112
110
|
},
|
|
113
111
|
{
|
|
114
112
|
id: 98463,
|
|
115
113
|
name: "Name 9",
|
|
116
|
-
link: {
|
|
114
|
+
link: {
|
|
115
|
+
href: "#",
|
|
116
|
+
children: "Link 9",
|
|
117
|
+
variant: "text",
|
|
118
|
+
},
|
|
117
119
|
longString: "Some really long string",
|
|
118
120
|
},
|
|
119
121
|
];
|
package/src/table-action-bar.tsx
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from "react";
|
|
1
|
+
import React, { useId } from "react";
|
|
2
2
|
import { Button } from "@purpurds/button";
|
|
3
3
|
import { Paragraph } from "@purpurds/paragraph";
|
|
4
4
|
import { Toggle } from "@purpurds/toggle";
|
|
@@ -46,6 +46,7 @@ export const TableActionBar = ({
|
|
|
46
46
|
onSecondaryButtonClick,
|
|
47
47
|
}: TableActionBarProps) => {
|
|
48
48
|
const { isLgOrSmaller } = useScreenSize();
|
|
49
|
+
const uid = useId();
|
|
49
50
|
|
|
50
51
|
return (
|
|
51
52
|
<div
|
|
@@ -60,7 +61,7 @@ export const TableActionBar = ({
|
|
|
60
61
|
|
|
61
62
|
<Toggle
|
|
62
63
|
data-testid={`${rootTestId}-toggle-selected`}
|
|
63
|
-
id=
|
|
64
|
+
id={`${uid}-toggle-selected`}
|
|
64
65
|
label={copy.buttons.toggleSelected}
|
|
65
66
|
onChange={onToggleSelected}
|
|
66
67
|
/>
|
|
@@ -178,7 +178,7 @@ const HeaderContent = <TData extends RowData>({
|
|
|
178
178
|
<HeaderCheckBox
|
|
179
179
|
id={header.id}
|
|
180
180
|
tanstackTable={tanstackTable}
|
|
181
|
-
|
|
181
|
+
aria-label={header.column.columnDef.meta?.rowSelectionAriaLabels?.header ?? ""}
|
|
182
182
|
/>
|
|
183
183
|
);
|
|
184
184
|
}
|
|
@@ -205,18 +205,18 @@ const HeaderContent = <TData extends RowData>({
|
|
|
205
205
|
);
|
|
206
206
|
}
|
|
207
207
|
|
|
208
|
-
return <HeaderParagraph header={header} />;
|
|
208
|
+
return <HeaderParagraph className={cx(`${rootClassName}__title--default`)} header={header} />;
|
|
209
209
|
};
|
|
210
210
|
|
|
211
211
|
type HeaderCheckboxProps<TData> = {
|
|
212
212
|
id: string;
|
|
213
|
-
|
|
213
|
+
["aria-label"]: string;
|
|
214
214
|
tanstackTable: Table<TData>;
|
|
215
215
|
};
|
|
216
216
|
|
|
217
217
|
const HeaderCheckBox = <TData extends RowData>({
|
|
218
218
|
id,
|
|
219
|
-
ariaLabel,
|
|
219
|
+
["aria-label"]: ariaLabel,
|
|
220
220
|
tanstackTable,
|
|
221
221
|
}: HeaderCheckboxProps<TData>) => {
|
|
222
222
|
const checked: CheckedState = tanstackTable.getIsSomeRowsSelected()
|
|
@@ -233,8 +233,18 @@ const HeaderCheckBox = <TData extends RowData>({
|
|
|
233
233
|
);
|
|
234
234
|
};
|
|
235
235
|
|
|
236
|
-
const HeaderParagraph = <TData extends RowData>({
|
|
237
|
-
|
|
236
|
+
const HeaderParagraph = <TData extends RowData>({
|
|
237
|
+
header,
|
|
238
|
+
className,
|
|
239
|
+
}: {
|
|
240
|
+
header: Header<TData, unknown>;
|
|
241
|
+
className?: string;
|
|
242
|
+
}) => (
|
|
243
|
+
<Paragraph
|
|
244
|
+
data-testid="purpur-table-column-header-cell-title"
|
|
245
|
+
variant="paragraph-100-bold"
|
|
246
|
+
className={className}
|
|
247
|
+
>
|
|
238
248
|
{flexRender(header.column.columnDef.header, header.getContext())}
|
|
239
249
|
</Paragraph>
|
|
240
250
|
);
|
|
@@ -9,10 +9,11 @@ export type TableExportDrawerCopyProps = {
|
|
|
9
9
|
link: string;
|
|
10
10
|
title: string;
|
|
11
11
|
bodyText: string;
|
|
12
|
-
|
|
12
|
+
closeButtonAriaLabel: string;
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
export type TableExportDrawerProps = {
|
|
16
|
+
id: string;
|
|
16
17
|
isOpen: boolean;
|
|
17
18
|
exportFormats: string[];
|
|
18
19
|
copy: TableExportDrawerCopyProps;
|
|
@@ -25,20 +26,21 @@ const cx = c.bind(styles);
|
|
|
25
26
|
const rootTestId = "purpur-table-export-drawer";
|
|
26
27
|
|
|
27
28
|
export const TableExportDrawer = ({
|
|
29
|
+
id,
|
|
28
30
|
exportFormats,
|
|
29
31
|
isOpen,
|
|
30
32
|
copy,
|
|
31
33
|
onExportData,
|
|
32
34
|
setDrawerIsOpen,
|
|
33
35
|
}: TableExportDrawerProps) => (
|
|
34
|
-
<div id=
|
|
36
|
+
<div id={id}>
|
|
35
37
|
<Drawer data-testid={rootTestId} open={isOpen} onOpenChange={setDrawerIsOpen}>
|
|
36
38
|
<Drawer.Content
|
|
37
39
|
data-testid={`${rootTestId}-content`}
|
|
38
40
|
zIndex={6}
|
|
39
41
|
title={copy.title}
|
|
40
42
|
bodyText={copy.bodyText}
|
|
41
|
-
|
|
43
|
+
closeButtonAriaLabel={copy.closeButtonAriaLabel}
|
|
42
44
|
>
|
|
43
45
|
<div className={cx(`${rootClassName}__content`)}>
|
|
44
46
|
{exportFormats.map((format) => (
|
|
@@ -5,7 +5,7 @@ import { cleanup, fireEvent, render, screen, within } from "@testing-library/rea
|
|
|
5
5
|
import userEvent from "@testing-library/user-event";
|
|
6
6
|
import { axe } from "vitest-axe";
|
|
7
7
|
|
|
8
|
-
import { PaginationState,Table } from "./table.tsx";
|
|
8
|
+
import { PaginationState, Table } from "./table.tsx";
|
|
9
9
|
import { createColumnDefKitchenSink } from "./test-utils/column-def.ts";
|
|
10
10
|
import {
|
|
11
11
|
copy,
|
|
@@ -78,8 +78,7 @@ const TestComponent = ({
|
|
|
78
78
|
nextButtonAriaLabel="Go to next page"
|
|
79
79
|
nextButtonText="Next"
|
|
80
80
|
outOfLabel="of"
|
|
81
|
-
|
|
82
|
-
pageSelectorNoOptionsText="Page does not exist"
|
|
81
|
+
pageSelectorLabel="Select a page"
|
|
83
82
|
pageSizeLabel="Items per page"
|
|
84
83
|
previousButtonAriaLabel="Go to previous page"
|
|
85
84
|
previousButtonText="Previous"
|
|
@@ -587,8 +586,7 @@ describe("Data Table - Kitchen sink", () => {
|
|
|
587
586
|
describe("Paginating table", () => {
|
|
588
587
|
describe("When selecting page 3", () => {
|
|
589
588
|
beforeEach(async () => {
|
|
590
|
-
const page3Button =
|
|
591
|
-
|
|
589
|
+
const page3Button = await screen.findByTestId(Selectors.PAGINATION.PAGE_BUTTON(3));
|
|
592
590
|
await userEvent.click(page3Button);
|
|
593
591
|
});
|
|
594
592
|
|
|
@@ -992,7 +990,7 @@ describe("Data Table - Kitchen sink", () => {
|
|
|
992
990
|
});
|
|
993
991
|
});
|
|
994
992
|
|
|
995
|
-
// TODO:
|
|
993
|
+
// TODO: Skipping this test since its failing on multiple issues, see Violations at bottom of file.
|
|
996
994
|
describe.skip("Accessibility", () => {
|
|
997
995
|
it("is accessible", async () => {
|
|
998
996
|
const { container } = render(<TestComponent enableMultiRowSelection={true} />);
|
|
@@ -1016,7 +1014,7 @@ describe("Data Table - Kitchen sink", () => {
|
|
|
1016
1014
|
}
|
|
1017
1015
|
}
|
|
1018
1016
|
|
|
1019
|
-
|
|
1017
|
+
console.log("Violations", results.violations);
|
|
1020
1018
|
|
|
1021
1019
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
1022
1020
|
// @ts-ignore
|
|
@@ -1127,17 +1125,6 @@ describe("With row toggle", () => {
|
|
|
1127
1125
|
});
|
|
1128
1126
|
});
|
|
1129
1127
|
|
|
1130
|
-
// TODO: Impement this around certain sections of the table
|
|
1131
|
-
describe.skip("Accessibility", () => {
|
|
1132
|
-
it("is accessible", async () => {
|
|
1133
|
-
const { container } = render(<TestComponent enableMultiRowSelection={false} />);
|
|
1134
|
-
const results = await axe(container);
|
|
1135
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
1136
|
-
// @ts-ignore TODO fix this
|
|
1137
|
-
expect(results).toHaveNoViolations();
|
|
1138
|
-
});
|
|
1139
|
-
});
|
|
1140
|
-
|
|
1141
1128
|
// Violations [
|
|
1142
1129
|
// {
|
|
1143
1130
|
// id: 'aria-allowed-role',
|
package/src/table-row-cell.tsx
CHANGED
|
@@ -18,7 +18,6 @@ import { RowToggleCell } from "./cell-types/row-toggle-cell";
|
|
|
18
18
|
import { ToggleCell } from "./cell-types/toggle-cell";
|
|
19
19
|
import { WarningAlertMessageCell } from "./cell-types/warning-message-cell";
|
|
20
20
|
import styles from "./table.module.scss";
|
|
21
|
-
import { pxToRemString } from "./utils/unit-conversions";
|
|
22
21
|
|
|
23
22
|
const cx = c.bind(styles);
|
|
24
23
|
|
|
@@ -60,7 +59,7 @@ const TableRowCell = <TData extends RowData>({
|
|
|
60
59
|
isLastCell,
|
|
61
60
|
}: TableRowCellProps<TData>) => {
|
|
62
61
|
const [isVisible, setIsVisible] = useState(false);
|
|
63
|
-
const elementRef = useRef<HTMLTableCellElement>(null);
|
|
62
|
+
const elementRef = useRef<HTMLTableCellElement | null>(null);
|
|
64
63
|
|
|
65
64
|
useEffect(() => {
|
|
66
65
|
const currentElement = elementRef.current;
|
|
@@ -99,12 +98,6 @@ const TableRowCell = <TData extends RowData>({
|
|
|
99
98
|
},
|
|
100
99
|
]);
|
|
101
100
|
|
|
102
|
-
const styles = cell
|
|
103
|
-
? {
|
|
104
|
-
width: pxToRemString(cell.column.getSize()),
|
|
105
|
-
}
|
|
106
|
-
: {};
|
|
107
|
-
|
|
108
101
|
const cellContent = cell ? getCellContent(cell) : children;
|
|
109
102
|
|
|
110
103
|
return (
|
|
@@ -113,7 +106,6 @@ const TableRowCell = <TData extends RowData>({
|
|
|
113
106
|
data-testid={dataTestId}
|
|
114
107
|
className={classes}
|
|
115
108
|
key={cell?.column.columnDef?.id}
|
|
116
|
-
style={styles}
|
|
117
109
|
colSpan={colSpan}
|
|
118
110
|
>
|
|
119
111
|
{cellContent}
|
|
@@ -126,9 +118,6 @@ export default TableRowCell;
|
|
|
126
118
|
const getCellContent = <TData extends RowData>(cell: Cell<TData, unknown>) => {
|
|
127
119
|
const { cellType } = cell.column.columnDef.meta ?? {};
|
|
128
120
|
|
|
129
|
-
// Define which cell types should have guaranteed truncation
|
|
130
|
-
const needsTruncation = ["bodyText", "iconText", "leadText", "link"].includes(cellType || "");
|
|
131
|
-
|
|
132
121
|
const content = (() => {
|
|
133
122
|
switch (cellType) {
|
|
134
123
|
case "badge":
|
|
@@ -166,23 +155,5 @@ const getCellContent = <TData extends RowData>(cell: Cell<TData, unknown>) => {
|
|
|
166
155
|
}
|
|
167
156
|
})();
|
|
168
157
|
|
|
169
|
-
// If the cell type needs guaranteed truncation, wrap it with a truncation container
|
|
170
|
-
if (needsTruncation && cell) {
|
|
171
|
-
const widthInRemString = pxToRemString(cell.column.getSize());
|
|
172
|
-
|
|
173
|
-
return (
|
|
174
|
-
<div
|
|
175
|
-
className={cx(`${rootClassName}__truncate`)}
|
|
176
|
-
style={{
|
|
177
|
-
width: "100%",
|
|
178
|
-
maxWidth: widthInRemString,
|
|
179
|
-
minWidth: widthInRemString,
|
|
180
|
-
}}
|
|
181
|
-
>
|
|
182
|
-
{content}
|
|
183
|
-
</div>
|
|
184
|
-
);
|
|
185
|
-
}
|
|
186
|
-
|
|
187
158
|
return content;
|
|
188
159
|
};
|
|
@@ -45,6 +45,7 @@ describe("Data Table - Settings drawer", () => {
|
|
|
45
45
|
beforeEach(() => {
|
|
46
46
|
container = render(
|
|
47
47
|
<TableSettingsDrawer
|
|
48
|
+
id="purpur-table-settings-drawer"
|
|
48
49
|
isDrawerOpen={true}
|
|
49
50
|
columnFiltersEnabled={true}
|
|
50
51
|
showColumnFilters={true}
|
|
@@ -204,6 +205,7 @@ describe("Data Table - Settings drawer", () => {
|
|
|
204
205
|
beforeEach(() => {
|
|
205
206
|
render(
|
|
206
207
|
<TableSettingsDrawer
|
|
208
|
+
id="purpur-table-settings-drawer"
|
|
207
209
|
isDrawerOpen={true}
|
|
208
210
|
showColumnFilters={false}
|
|
209
211
|
columnFiltersEnabled={false}
|
|
@@ -262,6 +264,7 @@ describe("Data Table - Settings drawer", () => {
|
|
|
262
264
|
beforeEach(() => {
|
|
263
265
|
render(
|
|
264
266
|
<TableSettingsDrawer
|
|
267
|
+
id="purpur-table-settings-drawer"
|
|
265
268
|
isDrawerOpen={true}
|
|
266
269
|
columnFiltersEnabled={true}
|
|
267
270
|
showColumnFilters={true}
|
|
@@ -315,6 +318,7 @@ describe("Data Table - Settings drawer", () => {
|
|
|
315
318
|
beforeEach(() => {
|
|
316
319
|
render(
|
|
317
320
|
<TableSettingsDrawer
|
|
321
|
+
id="purpur-table-settings-drawer"
|
|
318
322
|
isDrawerOpen={true}
|
|
319
323
|
columnFiltersEnabled={true}
|
|
320
324
|
showColumnFilters={true}
|