@purpurds/table 6.12.4 → 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.
Files changed (48) hide show
  1. package/dist/LICENSE.txt +16 -16
  2. package/dist/cell-types/body-text-cell.d.ts.map +1 -1
  3. package/dist/cell-types/link-cell.d.ts.map +1 -1
  4. package/dist/story-utils/column-def.d.ts.map +1 -1
  5. package/dist/story-utils/table-data.d.ts +2 -4
  6. package/dist/story-utils/table-data.d.ts.map +1 -1
  7. package/dist/styles.css +1 -1
  8. package/dist/table-action-bar.d.ts.map +1 -1
  9. package/dist/table-export-drawer.d.ts +3 -2
  10. package/dist/table-export-drawer.d.ts.map +1 -1
  11. package/dist/table-row-cell.d.ts.map +1 -1
  12. package/dist/table-settings-drawer.d.ts +2 -1
  13. package/dist/table-settings-drawer.d.ts.map +1 -1
  14. package/dist/table-toolbar.d.ts +6 -4
  15. package/dist/table-toolbar.d.ts.map +1 -1
  16. package/dist/table.cjs.js +63 -63
  17. package/dist/table.cjs.js.map +1 -1
  18. package/dist/table.d.ts +2 -1
  19. package/dist/table.d.ts.map +1 -1
  20. package/dist/table.es.js +3930 -3932
  21. package/dist/table.es.js.map +1 -1
  22. package/dist/test-utils/helpers.d.ts +2 -1
  23. package/dist/test-utils/helpers.d.ts.map +1 -1
  24. package/dist/types.d.ts +1 -1
  25. package/dist/types.d.ts.map +1 -1
  26. package/dist/use-truncated-hook.d.ts +3 -5
  27. package/dist/use-truncated-hook.d.ts.map +1 -1
  28. package/package.json +24 -24
  29. package/src/cell-types/body-text-cell.tsx +7 -8
  30. package/src/cell-types/link-cell.tsx +13 -6
  31. package/src/story-utils/column-def.ts +2 -0
  32. package/src/story-utils/table-data.tsx +10 -8
  33. package/src/table-action-bar.tsx +3 -2
  34. package/src/table-column-header-cell.tsx +16 -6
  35. package/src/table-export-drawer.test.tsx +1 -0
  36. package/src/table-export-drawer.tsx +5 -3
  37. package/src/table-kitchen-sink.test.tsx +5 -18
  38. package/src/table-row-cell.tsx +1 -30
  39. package/src/table-settings-drawer.test.tsx +4 -0
  40. package/src/table-settings-drawer.tsx +46 -41
  41. package/src/table-toolbar.test.tsx +3 -0
  42. package/src/table-toolbar.tsx +12 -7
  43. package/src/table.module.scss +27 -18
  44. package/src/table.stories.tsx +10 -9
  45. package/src/table.tsx +32 -26
  46. package/src/test-utils/helpers.ts +2 -1
  47. package/src/types.ts +1 -1
  48. 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
- closeButtonText: string;
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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+CrB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2EhB,CAAC"}
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
@@ -150,7 +150,7 @@ export type WithEmptyTableProps = {
150
150
  /**
151
151
  * Icon to display in the empty table state.
152
152
  */
153
- emptyTableIcon: React.ReactNode;
153
+ emptyTableIcon?: React.ReactNode;
154
154
  };
155
155
  export type WithoutEmptyTableProps = {
156
156
  emptyTableCopy?: never;
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}
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,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,oBAAoB,CAAC,EAAE,KAAK,CAAC;IAC7B,cAAc,CAAC,EAAE,KAAK,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,YAAY,CAAC,EAAE,KAAK,CAAC;CACtB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,qBAAqB,CAAC,KAAK,IAAI;IACzC;;OAEG;IACH,kBAAkB,EAAE,IAAI,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,KAAK,CAAC,KAAK,OAAO,CAAC,CAAC;IAE1D;;OAEG;IACH,sBAAsB,EAAE;QACtB,MAAM,EAAE,MAAM,CAAC;QACf,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IAEF;;OAEG;IACH,oBAAoB,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,uBAAuB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;CACxE,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,kBAAkB,CAAC,EAAE,KAAK,GAAG,SAAS,CAAC;IACvC,sBAAsB,CAAC,EAAE,KAAK,CAAC;IAC/B,oBAAoB,CAAC,EAAE,KAAK,CAAC;IAC7B,uBAAuB,CAAC,EAAE,KAAK,CAAC;CACjC,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;OAEG;IACH,aAAa,EAAE,IAAI,CAAC;IAEpB;;OAEG;IACH,iBAAiB,EAAE,iBAAiB,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,aAAa,CAAC,EAAE,KAAK,GAAG,SAAS,CAAC;IAClC,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;OAEG;IACH,aAAa,EAAE,IAAI,CAAC;IAKpB,WAAW,CAAC,EAAE;QACZ,QAAQ,CAAC,EAAE;YACT,OAAO,EAAE,MAAM,CAAC;YAChB,EAAE,EAAE,MAAM,CAAC;YACX,IAAI,EAAE,MAAM,CAAC;SACd,CAAC;KACH,CAAC;IAEF;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,GAAG,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,GAC1C,CAAC,uBAAuB,GAAG,0BAA0B,CAAC,GACtD,CAAC,CAAC,qBAAqB,GAAG,2BAA2B,CAAC,GAAG,kBAAkB,CAAC,GAC5E,CAAC,qBAAqB,GAAG,wBAAwB,CAAC,CAAC;AAErD,MAAM,MAAM,mBAAmB,GAAG;IAChC;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,GAAG,SAAS,CAAC;IAClC,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,kBAAkB,CAAC,EAAE,KAAK,CAAC;IAC3B,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,oBAAoB,CAAC,EAAE,KAAK,CAAC;IAC7B,gBAAgB,CAAC,EAAE,KAAK,CAAC;CAC1B,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,aAAa,EAAE,IAAI,CAAC;IACpB;;OAEG;IACH,WAAW,EAAE;QACX,OAAO,EAAE;YACP,YAAY,EAAE,MAAM,CAAC;SACtB,CAAC;QACF,UAAU,EAAE;YACV,YAAY,EAAE,MAAM,CAAC;SACtB,CAAC;KACH,CAAC;CACH,CAAC;AAEF;;GAEG;AACH,KAAK,qBAAqB,GAAG;IAC3B;;OAEG;IACH,cAAc,EAAE,MAAM,IAAI,CAAC;IAE3B;;OAEG;IACH,WAAW,EAAE;QACX,OAAO,EAAE;YACP,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;QACF,UAAU,EAAE;YACV,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;KACH,CAAC;CACH,CAAC;AAEF;;GAEG;AACH,KAAK,qBAAqB,GAAG;IAC3B;;OAEG;IACH,aAAa,EAAE,MAAM,EAAE,CAAC;IAExB;;OAEG;IACH,gBAAgB,EAAE,0BAA0B,CAAC;IAE7C;;;OAGG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAEvC;;OAEG;IACH,WAAW,EAAE;QACX,OAAO,EAAE;YACP,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;QACF,UAAU,EAAE;YACV,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;KACH,CAAC;CACH,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,gBAAgB,CAAC,EAAE,KAAK,CAAC;IACzB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,WAAW,CAAC,EAAE;QACZ,OAAO,EAAE;YACP,MAAM,CAAC,EAAE,KAAK,CAAC;SAChB,CAAC;QACF,UAAU,CAAC,EAAE;YACX,MAAM,CAAC,EAAE,KAAK,CAAC;SAChB,CAAC;KACH,CAAC;CACH,CAAC;AAEF,KAAK,wBAAwB,GAAG;IAC9B,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,WAAW,CAAC,EAAE;QACZ,OAAO,CAAC,EAAE;YACR,MAAM,CAAC,EAAE,KAAK,CAAC;SAChB,CAAC;QACF,UAAU,CAAC,EAAE;YACX,MAAM,CAAC,EAAE,KAAK,CAAC;SAChB,CAAC;KACH,CAAC;CACH,CAAC;AAEF,KAAK,mBAAmB,GAAG;IACzB,aAAa,CAAC,EAAE,KAAK,GAAG,SAAS,CAAC;IAClC;;OAEG;IACH,WAAW,CAAC,EAAE;QACZ,OAAO,CAAC,EAAE;YACR,YAAY,CAAC,EAAE,KAAK,CAAC;SACtB,CAAC;QACF,UAAU,CAAC,EAAE;YACX,YAAY,CAAC,EAAE,KAAK,CAAC;SACtB,CAAC;KACH,CAAC;CACH,CAAC;AAEF;;GAEG;AACH,KAAK,uBAAuB,GAAG;IAC7B;;OAEG;IACH,kBAAkB,EAAE,4BAA4B,CAAC;IACjD,WAAW,EAAE;QACX,OAAO,EAAE;YACP,QAAQ,EAAE,MAAM,CAAC;SAClB,CAAC;QACF,UAAU,EAAE;YACV,QAAQ,EAAE,MAAM,CAAC;SAClB,CAAC;KACH,CAAC;CACH,CAAC;AAEF;;GAEG;AACH,KAAK,2BAA2B,GAAG;IACjC;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IAEtB;;;OAGG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAEvC;;OAEG;IACH,WAAW,EAAE;QACX,OAAO,EAAE;YACP,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;QACF,UAAU,EAAE;YACV,MAAM,EAAE,MAAM,CAAC;SAChB,CAAC;KACH,CAAC;IAEF,gBAAgB,CAAC,EAAE,KAAK,CAAC;CAC1B,CAAC;AAEF,KAAK,0BAA0B,GAAG;IAChC;;OAEG;IACH,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,WAAW,CAAC,EAAE;QACZ,OAAO,CAAC,EAAE;YACR,QAAQ,CAAC,EAAE,SAAS,CAAC;SACtB,CAAC;QACF,UAAU,CAAC,EAAE;YACX,QAAQ,CAAC,EAAE,SAAS,CAAC;SACtB,CAAC;KACH,CAAC;CACH,CAAC"}
@@ -1,10 +1,8 @@
1
- import { Cell, RowData } from '@tanstack/react-table';
2
-
3
- declare const useTruncatedTooltip: <TData extends RowData>(cell: Cell<TData, unknown> | undefined) => {
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":"AACA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAEtD,QAAA,MAAM,mBAAmB,GAAI,KAAK,SAAS,OAAO,QAAQ,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG,SAAS;;;;;CAoEzF,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
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": "6.12.4",
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": "6.12.4",
21
- "@purpurds/button": "6.12.4",
22
- "@purpurds/checkbox": "6.12.4",
23
- "@purpurds/cta-link": "6.12.4",
24
- "@purpurds/drawer": "6.12.4",
25
- "@purpurds/heading": "6.12.4",
26
- "@purpurds/link": "6.12.4",
27
- "@purpurds/icon": "6.12.4",
28
- "@purpurds/select": "6.12.4",
29
- "@purpurds/paragraph": "6.12.4",
30
- "@purpurds/skeleton": "6.12.4",
31
- "@purpurds/text-field": "6.12.4",
32
- "@purpurds/toggle": "6.12.4",
33
- "@purpurds/tooltip": "6.12.4",
34
- "@purpurds/visually-hidden": "6.12.4",
35
- "@purpurds/tokens": "6.12.4"
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": "6.12.4",
61
- "@purpurds/grid": "6.12.4",
62
- "@purpurds/illustrative-icon": "6.12.4",
63
- "@purpurds/label": "6.12.4",
64
- "@purpurds/listbox": "6.12.4",
65
- "@purpurds/pagination": "6.12.4",
66
- "@purpurds/component-rig": "1.0.0"
60
+ "@purpurds/autocomplete": "7.0.0",
61
+ "@purpurds/component-rig": "1.0.0",
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 { divRef, showPopover, onMouseLeave, onMouseEnter } = useTruncatedTooltip(cell);
19
+ const { showPopover, containerRef, onMouseEnter, onMouseLeave } = useTruncatedTooltip();
20
20
 
21
21
  if (!value) {
22
22
  return <EmptyCell />;
23
23
  }
24
24
 
25
- const widthInRemString = pxToRemString(cell.column.getSize());
25
+ const minWidthInRemString = pxToRemString(cell.column.getSize());
26
26
 
27
27
  const content = (
28
28
  <div
29
- ref={divRef}
30
- className={cx("purpur-table-row-cell__truncate")}
29
+ ref={containerRef}
30
+ className={cx("purpur-table-row-cell__truncate-wrapper")}
31
31
  style={{
32
- maxWidth: widthInRemString,
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-cell___tooltip-content")}
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 { divRef, showPopover, onMouseLeave, onMouseEnter } = useTruncatedTooltip(cell);
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={divRef}
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 variant={variant ?? "text"} href={href} {...props}>
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"
@@ -122,6 +122,8 @@ export const simpleColumnDef = [
122
122
  size: 120,
123
123
  meta: {
124
124
  cellType: "leadText",
125
+ filterVariant: "string",
126
+ filterPlaceholder: "Search by name",
125
127
  },
126
128
  }),
127
129
  simpleColumnHelper.accessor("id", {
@@ -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: "#", children: "Link 2" },
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: "#", children: "Link 9" },
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: { href: "#", children: "Link 9" },
114
+ link: {
115
+ href: "#",
116
+ children: "Link 9",
117
+ variant: "text",
118
+ },
117
119
  longString: "Some really long string",
118
120
  },
119
121
  ];
@@ -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="toggle-selected"
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
- ariaLabel={header.column.columnDef.meta?.rowSelectionAriaLabels?.header ?? ""}
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
- ariaLabel: string;
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>({ header }: { header: Header<TData, unknown> }) => (
237
- <Paragraph data-testid="purpur-table-column-header-cell-title" variant="paragraph-100-bold">
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
  );
@@ -14,6 +14,7 @@ describe("Data table - Export drawer", () => {
14
14
  beforeEach(() => {
15
15
  container = render(
16
16
  <TableExportDrawer
17
+ id="purpur-table-export-drawer"
17
18
  copy={copy.exportDrawer}
18
19
  exportFormats={["csv", "xlxs"]}
19
20
  isOpen={true}
@@ -9,10 +9,11 @@ export type TableExportDrawerCopyProps = {
9
9
  link: string;
10
10
  title: string;
11
11
  bodyText: string;
12
- closeButtonText: string;
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="purpur-table-export-drawer">
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
- closeButtonText={copy.closeButtonText}
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
- pageSelectorListBoxLabel="Select a page"
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 = within(screen.getByTestId(Selectors.PAGINATION.ROOT)).getByText("3");
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: Impement this around certain sections of the table
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
- // console.log("Violations", results.violations[2].nodes[0]);
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',
@@ -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}