@react-md/table
Version:
Create responsive data tables and accessible fixed tables
529 lines (268 loc) • 18 kB
Markdown
# Change Log
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [5.1.6](https://github.com/mlaursen/react-md/compare/v5.1.5...v5.1.6) (2023-12-11)
**Note:** Version bump only for package @react-md/table
## [5.1.4](https://github.com/mlaursen/react-md/compare/v5.1.3...v5.1.4) (2022-06-16)
### Bug Fixes
* add missing dependencies ([5329812](https://github.com/mlaursen/react-md/commit/532981291e7c30018a151400cb891b693255ed78))
## [5.1.3](https://github.com/mlaursen/react-md/compare/v5.1.2...v5.1.3) (2022-05-07)
### Other Internal Changes
* **typos:** fix additional typos throughout repo ([ef20132](https://github.com/mlaursen/react-md/commit/ef2013288ce8649b9fddba9bc23c71df72ea03a1))
## [5.1.2](https://github.com/mlaursen/react-md/compare/v5.1.1...v5.1.2) (2022-04-02)
**Note:** Version bump only for package @react-md/table
## [5.1.1](https://github.com/mlaursen/react-md/compare/v5.1.0...v5.1.1) (2022-04-01)
**Note:** Version bump only for package @react-md/table
# [5.1.0](https://github.com/mlaursen/react-md/compare/v5.0.0...v5.1.0) (2022-03-18)
### Other Internal Changes
* run lint-scripts --fix for consistent-type-imports ([42d839d](https://github.com/mlaursen/react-md/commit/42d839d359922e0a8ee3775a75162b9755a2c2b6))
# [5.0.0](https://github.com/mlaursen/react-md/compare/v4.0.3...v5.0.0) (2022-01-31)
**Note:** Version bump only for package @react-md/table
## [4.0.3](https://github.com/mlaursen/react-md/compare/v4.0.2...v4.0.3) (2021-12-31)
### Bug Fixes
* **@react-md/table:** Sortable Column Alignment ([e447cc5](https://github.com/mlaursen/react-md/commit/e447cc507e31c2b23fe57f90c536f01f68735999)), closes [#1321](https://github.com/mlaursen/react-md/issues/1321)
### Other Internal Changes
* Updated all packages' peerDependenciesMeta ([60fcd71](https://github.com/mlaursen/react-md/commit/60fcd719ac785c2f0b9d27cda82baa3c773c0e5a)), closes [#1319](https://github.com/mlaursen/react-md/issues/1319)
## [4.0.2](https://github.com/mlaursen/react-md/compare/v4.0.1...v4.0.2) (2021-11-30)
**Note:** Version bump only for package @react-md/table
## [4.0.1](https://github.com/mlaursen/react-md/compare/v4.0.0...v4.0.1) (2021-11-27)
**Note:** Version bump only for package @react-md/table
# [4.0.0](https://github.com/mlaursen/react-md/compare/v3.1.1...v4.0.0) (2021-11-24)
### Features
* Update to use new JSX Transform and latest `eslint` ([8111cd3](https://github.com/mlaursen/react-md/commit/8111cd31e45bf60c1b92509264af1b71dfba5696))
### Other Internal Changes
* always skip lib check ([229cef1](https://github.com/mlaursen/react-md/commit/229cef1e3d338ea362c1a2eaac06204c84ff21a6))
* **react-md:** Remove prop-types package and usage ([2637a6f](https://github.com/mlaursen/react-md/commit/2637a6f43d681a06054e3a4518f692cf51baf997))
* **stylelint:** Updated to use `stylelint` ([22d1598](https://github.com/mlaursen/react-md/commit/22d15985061df76d827d4ca9319198526e320f11))
* **typescript:** Stopped using deprecated HTMLTable(Data|Header)CellElement ([23ba342](https://github.com/mlaursen/react-md/commit/23ba342ca0d461d08cd649513e7d05216647bd17))
### Breaking Changes
* Minimum React version is now 16.14 instead of 16.8
* **react-md:** There will no longer be run-time prop validation with
the `prop-types` package.
# [3.1.0](https://github.com/mlaursen/react-md/compare/v3.0.1...v3.1.0) (2021-09-10)
### Other Internal Changes
* ran `yarn format` to include new files ([48d3d7f](https://github.com/mlaursen/react-md/commit/48d3d7fddb0435edf7dec9d0ba38cf3f0f251709))
## [3.0.1](https://github.com/mlaursen/react-md/compare/v3.0.0...v3.0.1) (2021-08-15)
### Bug Fixes
* Updated peerDependencies to fix yarn berry peer requirements ([250efcd](https://github.com/mlaursen/react-md/commit/250efcdd81ea39c06b08eb30109589c89d9b8e0f)), closes [#1224](https://github.com/mlaursen/react-md/issues/1224)
# [3.0.0](https://github.com/mlaursen/react-md/compare/v2.9.1...v3.0.0) (2021-08-13)
### Other Internal Changes
* Added additional tests to bump test coverage ([4d0371c](https://github.com/mlaursen/react-md/commit/4d0371c9e21ab8449a5036a001d302e14a076b7c))
## [2.9.1](https://github.com/mlaursen/react-md/compare/v2.9.0...v2.9.1) (2021-07-27)
### Other Internal Changes
* **install:** slighly reduce install size by excluding tests in publish ([9d01a44](https://github.com/mlaursen/react-md/commit/9d01a44b81b619d6ac1c4d458005c99838fc6894))
# [2.9.0](https://github.com/mlaursen/react-md/compare/v2.8.5...v2.9.0) (2021-07-18)
**Note:** Version bump only for package @react-md/table
## [2.8.5](https://github.com/mlaursen/react-md/compare/v2.8.4...v2.8.5) (2021-07-03)
**Note:** Version bump only for package @react-md/table
## [2.8.4](https://github.com/mlaursen/react-md/compare/v2.8.3...v2.8.4) (2021-06-10)
### Other Internal Changes
* ran `prettier` after upgrading to v2.3.0 ([3ce236a](https://github.com/mlaursen/react-md/commit/3ce236a6008ff3d57f16cf3f6ab8e85fcce1dd4d))
## [2.8.3](https://github.com/mlaursen/react-md/compare/v2.8.2...v2.8.3) (2021-05-18)
### Documentation
* **react-md.dev:** updated tsdoc to work with `typedoc` ([cf54c35](https://github.com/mlaursen/react-md/commit/cf54c359268332245d1dad8a8d91e0476cd8cb33))
## [2.8.2](https://github.com/mlaursen/react-md/compare/v2.8.1...v2.8.2) (2021-04-23)
**Note:** Version bump only for package @react-md/table
## [2.8.1](https://github.com/mlaursen/react-md/compare/v2.8.0...v2.8.1) (2021-04-23)
**Note:** Version bump only for package @react-md/table
# [2.8.0](https://github.com/mlaursen/react-md/compare/v2.7.1...v2.8.0) (2021-04-22)
### Other Internal Changes
* **tsconfig:** separate tsconfig by package instead of a single root ([b278230](https://github.com/mlaursen/react-md/commit/b2782303b2a2db07eeaa25b6a3d04337976cffaa))
## [2.7.1](https://github.com/mlaursen/react-md/compare/v2.7.0...v2.7.1) (2021-03-23)
**Note:** Version bump only for package @react-md/table
# [2.7.0](https://github.com/mlaursen/react-md/compare/v2.6.0...v2.7.0) (2021-02-28)
### Documentation
* **tsdoc:** fixed remaining tsdoc syntax warnings ([946f4dd](https://github.com/mlaursen/react-md/commit/946f4dddf380b9f2313fb76d54d969aa2adbff53))
* **tsdoc:** fixed some tsdoc annotations and styling ([0449b86](https://github.com/mlaursen/react-md/commit/0449b86e4e51793710b35a452b7ebcbb6e7b5b2e))
### Other Internal Changes
* updated test coverage to not include conditional component PropTypes ([24e5df1](https://github.com/mlaursen/react-md/commit/24e5df14c731411d7691253383435036326407b5))
# [2.6.0](https://github.com/mlaursen/react-md/compare/v2.5.5...v2.6.0) (2021-02-13)
**Note:** Version bump only for package @react-md/table
## [2.5.5](https://github.com/mlaursen/react-md/compare/v2.5.4...v2.5.5) (2021-01-30)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.5.4](https://github.com/mlaursen/react-md/compare/v2.5.3...v2.5.4) (2021-01-27)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.5.3](https://github.com/mlaursen/react-md/compare/v2.5.2...v2.5.3) (2021-01-12)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.5.2](https://github.com/mlaursen/react-md/compare/v2.5.1...v2.5.2) (2021-01-12)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.5.1](https://github.com/mlaursen/react-md/compare/v2.5.0...v2.5.1) (2020-12-16)
**Note:** Version bump only for package [@react-md/table](../table)
# [2.5.0](https://github.com/mlaursen/react-md/compare/v2.4.3...v2.5.0) (2020-12-15)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.4.3](https://github.com/mlaursen/react-md/compare/v2.4.2...v2.4.3) (2020-11-14)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.4.2](https://github.com/mlaursen/react-md/compare/v2.4.1...v2.4.2) (2020-10-23)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.4.1](https://github.com/mlaursen/react-md/compare/v2.4.0...v2.4.1) (2020-10-17)
**Note:** Version bump only for package [@react-md/table](../table)
# [2.4.0](https://github.com/mlaursen/react-md/compare/v2.3.1...v2.4.0) (2020-10-17)
### Bug Fixes
- [@react-md/table](../table): table border color uses hex values to fix chrome
colSpan rendering issue
([#982](https://github.com/mlaursen/react-md/issues/982))
([2138284](https://github.com/mlaursen/react-md/commit/213828454b15cee8d257ee82182e5869127f7661))
### Features
- [@react-md/theme](../theme): Better Contrast Colors by Default and dev-utils
refactor ([#955](https://github.com/mlaursen/react-md/issues/955))
([519b128](https://github.com/mlaursen/react-md/commit/519b128522de944d55ff96a1e1125447665ed586))
## [2.3.1](https://github.com/mlaursen/react-md/compare/v2.2.0...v2.3.1) (2020-09-15)
**Note:** Version bump only for package [@react-md/table](../table)
# [2.3.0](https://github.com/mlaursen/react-md/compare/v2.2.0...v2.3.0) (2020-09-10)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.2.2](https://github.com/mlaursen/react-md/compare/v2.2.1...v2.2.2) (2020-09-02)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.2.1](https://github.com/mlaursen/react-md/compare/v2.2.0...v2.2.1) (2020-09-02)
**Note:** Version bump only for package [@react-md/table](../table)
# [2.2.0](https://github.com/mlaursen/react-md/compare/v2.1.2...v2.2.0) (2020-08-11)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.1.2](https://github.com/mlaursen/react-md/compare/v2.1.1...v2.1.2) (2020-08-01)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.1.1](https://github.com/mlaursen/react-md/compare/v2.1.0...v2.1.1) (2020-07-21)
**Note:** Version bump only for package [@react-md/table](../table)
# [2.1.0](https://github.com/mlaursen/react-md/compare/v2.0.4...v2.1.0) (2020-07-12)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.0.3](https://github.com/mlaursen/react-md/compare/v2.0.2...v2.0.3) (2020-07-07)
**Note:** Version bump only for package [@react-md/table](../table)
## [2.0.2](https://github.com/mlaursen/react-md/compare/v2.0.1...v2.0.2) (2020-06-30)
### Bug Fixes
- **LICENSE:** Removed the time range from license since it was incorrect
([50c9021](https://github.com/mlaursen/react-md/commit/50c9021cedc0d642758b9fd541bb6c93d2fe1786))
- Added `sideEffects` field to `package.json`
([31820b9](https://github.com/mlaursen/react-md/commit/31820b9b43705e5849664500a17b6849eb6dc2a9))
- `sideEffects` formatting
([78a7b6b](https://github.com/mlaursen/react-md/commit/78a7b6b0e40c7daefb749835670705f21bd21720))
## v2.0.1
No changes.
## v2.0.0
This release focused on updating the tables to be more customizable, easier to
style, and better for accessibility with sticky cells. To create a table within
v2, you'll have access to the following components:
- `TableContainer`
- `Table`
- `TableHeader`
- `TableBody`
- `TableFooter`
- `TableRow`
- `TableCell`
- `Caption`
- `TableCheckbox`
### New Features / Behavior
- the table components no longer use the `React.cloneElement` API so "gotchas"
with custom wrappers should no longer happen
- the `DataTable` component was removed and separated into `TableContainer` and
`Table` components for additional customization
- the sticky table headers and footers now use `position: sticky` instead of the
ugly multiple div/table wrapper behavior
- now supports sticky cells within the `<tbody>` that can be fixed to the right
or left
- should now be able to render any popout component (like menus and dialogs)
without some weird hacks behind the scenes
- added a configurable `dense` spec for tables
- tables no longer need to be full width and can be rendered inline with other
content
- added additional table configuration props/API to change the built-in styles
- the table styles should be easier to configure since all nesting and
additional precedence have been removed with the re-write
- fixed the accessibility for the sortable header cells so that they are
keyboard focusable as well as providing the correct `aria-sort` and `scope`
### Breaking Changes
- no longer supports automatically rendering checkboxes in each row since it
never really worked as expected anyways
- removed the `DropdownMenuColumn`, `SelectFieldColumn`, `EditDialogColumn`,
`MenuButtonColumn` components since they are no longer required
- removed the `TablePagination` and `TableCardHeader` components since they are
not supported anymore. this might be added in for a later release
- `TableColumn` has been reworked and renamed to `TableCell`
- the `TableCell` no longer supports tooltips by default but can be quickly
added back with the `Tooltipped` component from [@react-md/tooltip]
#### New SCSS Variables, Functions, and Mixins
- `$rmd-table-cell-vertical-padding: 0.375rem !default` - the amount of padding
to apply to the top or bottom of each cell when the vertical alignment is set
to `"top"` or `"bottom"`
- `$rmd-table-cell-sticky-position: 0 !default` - The default position for a
sticky cell that appears within the `<tbody>` (this will be used as the `left`
value)
- `$rmd-table-footer-sticky-position: 0 !default` - The default position for a
sticky cell that appears within the `<tfoot>` (this will be used as the
`bottom` value)
- `$rmd-table-cell-sticky-z-index: 2 !default` - The z-index to use for all
sticky cells within a table
- `$rmd-table-cell-dense-height: 2rem !default` - The height to use for each
cell when the dense spec is enabled
- `$rmd-table-cell-color: rmd-theme-var(text-primary-on-background) !default` -
The text color to use for cells within the `<tbody>`
- `$rmd-table-checkbox-padding: 0.5rem !default` - The amount of padding to
apply to a `TableCheckbox`
- `@function rmd-table-theme` - gets one of the theme values and validates that
the theme name is valid
- `@function rmd-table-theme-var` - gets one of the theme values as a css
variable with a fallback value and validates that the theme name is valid
- `@mixin rmd-table-theme` - applies one of the theme values to a css property
as a css variable
- `@mixin rmd-table-theme-update-var` - updates one of the theme values as a css
variable
#### Renamed SCSS Variables, Functions, and Mixins
- renamed `$md-data-table-padding` to `$rmd-table-cell-horizontal-padding` and
changed the default value from `24px` to `1rem`
- renamed `$md-data-table-header-height` to `$rmd-table-header-cell-height` and
changed the default value from `56px` to `3.5rem`
- renamed `$md-data-table-column-height` to `$rmd-table-cell-height` and changed
the default value from `48px` to `3.25rem`
- renamed `$md-data-table-light-theme-hover-color` and
`$md-data-table-dark-theme-hover-color` into a single
`$rmd-table-row-hover-color` and changed the default value to
`rgba($rmd-black-base, 0.12)`
- renamed `$md-data-table-light-theme-selected-color` and
`$md-data-table-dark-theme-selected-color` into a single
`$rmd-table-row-selected-color` that now defaults to
`rmd-states-theme-var(selected-color)`
#### Removed SCSS Variables, Placeholders, and Mixins
- removed `$md-data-table-include-plain` and
`$md-data-table-plain-column-height` since there is no concept of a "data
table" versus a "plain table"
- removed `$md-data-table-include-checkboxes` since it is no longer supported
out of the box
- removed `$md-data-table-include-edit-dialog`, `$md-edit-dialog-min-width`,
`$md-edit-dialog-width`, `$md-edit-dialog-label-width`,
`$md-edit-dialog-label-padding`, `$md-edit-dialog-padding`,
`$md-edit-dialog-padding-bottom`, and
`$md-data-table-edit-dialog-mobile-right` since edit dialogs are no longer
supported out of the box (can be re-implemented with the `FixedDialog` and
`TextField` components)
- removed `$md-data-table-include-select-fields` since this hacky workaround is
no longer needed in v2
- removed `$md-data-table-include-fixed-headers-footers` since it will always be
included for now
- removed `$md-data-table-include-pagination`,
`$md-data-table-pagination-mobile-shrinking`, and
`$md-data-table-pagination-mobile-label-hidden` since it is no longer
supported
- removed `$md-data-table-include-table-card-headers`.
`$md-data-table-card-header-z-index`, `$md-data-table-card-header-font-size`,
`$md-data-table-card-header-height`, and
`$md-data-table-contextual-fallback-color` since they are no longer supported
- removed `$md-data-table-selected-over-hover` since it's no longer needed
- removed `$md-data-table-fixed-include-headers`,
`$md-data-table-fixed-include-footers`, and
`$md-data-table-fixed-use-view-height` since the
`@mixin react-md-make-fixed-table` no longer exists and isn't required for
fixed tables
- removed `$md-data-table-min-padding` since I don't remember what it was really
supposed to accomplish and doesn't exist in v2
- removed `$md-data-table-content-font-size` and
`$md-data-table-header-font-size` since they are no longer configurable with
SCSS variables
- removed `$md-data-table-border-size` since it is now configurable with the
[@react-md/divider] package
- removed `$md-data-table-fixed-wrapper-min-width` since there is no longer a
table wrapper
- removed `%md-table-column--plain` placeholder since it's no longer used
- removed `@mixin react-md-theme-data-tables` since it is now handled with the
new theming API
- removed `@mixin react-md-make-fixed-table` since it's no longer required with
the new sticky cells API/styles
[@react-md/divider]:
https://github.com/mlaursen/react-md/tree/main/packages/divider
[@react-md/tooltip]:
https://github.com/mlaursen/react-md/tree/main/packages/tooltip