Skip to main content
react-md
Table - Changelog

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

2.7.0 (2021-02-28)

Documentation

  • tsdoc: fixed remaining tsdoc syntax warnings (946f4dd)
  • tsdoc: fixed some tsdoc annotations and styling (0449b86)

Other Internal Changes

  • updated test coverage to not include conditional component PropTypes (24e5df1)

2.6.0 (2021-02-13)

Note: Version bump only for package @react-md/table

2.5.5 (2021-01-30)

Note: Version bump only for package @react-md/table

2.5.4 (2021-01-27)

Note: Version bump only for package @react-md/table

2.5.3 (2021-01-12)

Note: Version bump only for package @react-md/table

2.5.2 (2021-01-12)

Note: Version bump only for package @react-md/table

2.5.1 (2020-12-16)

Note: Version bump only for package @react-md/table

2.5.0 (2020-12-15)

Note: Version bump only for package @react-md/table

2.4.3 (2020-11-14)

Note: Version bump only for package @react-md/table

2.4.2 (2020-10-23)

Note: Version bump only for package @react-md/table

2.4.1 (2020-10-17)

Note: Version bump only for package @react-md/table

2.4.0 (2020-10-17)

Bug Fixes

Features

2.3.1 (2020-09-15)

Note: Version bump only for package @react-md/table

2.3.0 (2020-09-10)

Note: Version bump only for package @react-md/table

2.2.2 (2020-09-02)

Note: Version bump only for package @react-md/table

2.2.1 (2020-09-02)

Note: Version bump only for package @react-md/table

2.2.0 (2020-08-11)

Note: Version bump only for package @react-md/table

2.1.2 (2020-08-01)

Note: Version bump only for package @react-md/table

2.1.1 (2020-07-21)

Note: Version bump only for package @react-md/table

2.1.0 (2020-07-12)

Note: Version bump only for package @react-md/table

2.0.3 (2020-07-07)

Note: Version bump only for package @react-md/table

2.0.2 (2020-06-30)

Bug Fixes

  • LICENSE: Removed the time range from license since it was incorrect (50c9021)
  • Added sideEffects field to package.json (31820b9)
  • sideEffects formatting (78a7b6b)

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