Skip to content

Releases: mlaursen/react-md

v4.0.0

24 Nov 21:41
Compare
Choose a tag to compare

This release focused on updating the @react-md/transition package to no longer log errors in React.StrictMode because react-ransition-group was using ReactDOM.findDOMNode to handle transitions. All react-md packages will no longer use react-transition-group since all that functionality has been built into @react-md/transition with a slightly different API.

This release has also included my first attempt at automating upgrading to new major releases by introducing a new @react-md/codemod package that is similar to the react-codemod package. You can automate some of this release by running:

npx @react-md/codemod v3-to-v4/preset

Since I am still learning how to use jscodeshift, it will not be able to migrate everything but should still help with most changes.

You can check out the v4.0.0 and @react-md/codemod PRs for some additional information around these changes.

Bug Fixes

  • @react-md/menu: DropdownMenu and Menu portal by default (98a6a9f), closes #1264
  • @react-md/tooltip: cancel timer when element is clicked (5416554)
  • sass: Do not use legacy global functions (6159e16)

Features

  • Update to use new JSX Transform and latest eslint (8111cd3)
  • @react-md/portal: ConditionalPortal supports ReactNode children (c83d578)
  • @react-md/transition: No longer use findDOMNode for transitions (cb952da)
  • @react-md/typography: Renamed Text to Typography (30cf056)
  • @react-md/utils: Export additional positioning types (b50a04c)
  • codemod: Created a new @react-md/codemod package to help with new releases (41c1fa6)

Documentation

  • Hackily fix codesandbox.io not using sass resolutions in package.json (db22cde), closes #1261
  • @react-md/form: Updated hook overrides so documentation appears correctly (436fbff)
  • react-md.dev: Enable rust compiler by removing custom babelrc (796efd0)
  • react-md.dev: Fallback code language to markup instead of none (0efaf9b)
  • react-md.dev: Fix alert sandboxes (8f19297)
  • react-md.dev: Removed SwipeableTabs demo since it didn't really work (2d79f93)
  • react-md.dev: Separate Code and CodeBlock into separate folders (4c492b3)
  • react-md.dev: Try to allow custom Code/CodeBlock in sandboxes (5d494bf)
  • react-md.dev: update code components to use css modules (9bdf6ba)
  • react-md.dev: Use react-marked-renderer for markdown stuffs (93ebaa4)

Other Internal Changes

  • always skip lib check (229cef1)
  • Re-ran prettier (9632d82)
  • update workflows to include node 16 (f756b92)
  • updated branches for build, lint, and test (b5eeae9)
  • Updated remaining docs and tests for react-router-dom v6 (e012ef9)
  • @react-md/dev-utils: Added error message for combining styles (aa5ecfd)
  • @react-md/dev-utils: match quotation marks for sass files (98ffe40)
  • @react-md/dev-utils: Update sassdoc to not through uncaught exceptions (8bdf532)
  • @react-md/dev-utils: Update release for new major versions and legacy docs (86c5c02)
  • @react-md/format: ran prettier after upgrading to v2.4.0 (06110af)
  • codemod: Added comment about ignoring CodeQL alert (631d56c)
  • examples: enable strict mode by default for nextjs-typescript (83e4c44)
  • examples: added lint command to nextjs examples (788a8b8)
  • examples: bump nextjs examples from v11.1.2 to v12.0.2 (be45277)
  • examples: fixed prefers-color-scheme in examples (f799d3a)
  • examples: Updated create-react-app example to use react-router-dom v6 (3c4d1ea)
  • examples: Updated create-react-app-typescript example to use react-router-dom v6 (ae469ef)
  • examples: Updated examples to no longer import React (c0b8cb5)
  • react-md: Remove prop-types package and usage (2637a6f)
  • react-md.dev: Enable React.StrictMode (219937e)
  • react-md.dev: Updated some transition documentation (44bfa20)
  • stylelint: Updated to use stylelint (22d1598)
  • test: Update coverage for watch mode (74cee51)
  • typescript: Stopped using deprecated HTMLTable(Data|Header)CellElement (23ba342)

Breaking Changes

  • Minimum React version is now 16.14 instead of 16.8
  • @react-md/menu: The DropdownMenu and Menu components portal by
    default. This should really only affect snapshot tests
  • @react-md/typography: The Text component has been renamed to Typography to
    help with auto-imports conflicting with the Text element that exists in
    lib.d.ts
  • react-md: There will no longer be run-time prop validation with
    the prop-types package.

Library Size Changes

yarn dev-utils libsize

The gzipped UMD bundle sizes are:
 - dist/umd/react-md.production.min.js 85.92 kB (- 83 B)
 - dist/umd/react-md-with-font-icons.production.min.js 111.04 kB (+ 1 B)
 - dist/umd/react-md-with-svg-icons.production.min.js 178.53 kB (+ 170 B)

The min and max gzipped CSS bundle sizes are:
 - themes/react-md.grey-red-700-light.min.css 18.01 kB (+ 38 B)
 - themes/react-md.lime-teal-200-dark.min.css 18.08 kB (+ 38 B)

v3.1.1

12 Sep 01:45
Compare
Choose a tag to compare

Bug Fixes

  • typescript: added missing readonly prefix to TabsManager tabs prop (45d9458)

Library Size Changes

yarn dev-utils libsize

The gzipped UMD bundle sizes are:
 - dist/umd/react-md.production.min.js 86.75 KB
 - dist/umd/react-md-with-font-icons.production.min.js 111.03 KB
 - dist/umd/react-md-with-svg-icons.production.min.js 176.83 KB

The min and max gzipped CSS bundle sizes are:
 - themes/react-md.grey-red-700-light.min.css 17.63 KB
 - themes/react-md.lime-teal-200-dark.min.css 17.7 KB

v3.1.0

10 Sep 23:35
Compare
Choose a tag to compare

Bug Fixes

  • @react-md/dialog: DialogFooter align prop applies correct classes (644971d)
  • @react-md/form: TooManyFilesError is only used if all the other validation has passed (6ed3f54)
  • @react-md/form: ensure file names end with a period for useFileUpload extensions (9238140)
  • @react-md/form: prevent infinite rerenders when calling useFileUpload's reset in useEffect (b2875b1)
  • @react-md/utils: useDropzone fix around onDragLeave behavior (fdff9f2)
  • typescript: updated all array types to be readonly (8f71bcb)

Features

  • @react-md/form: add isValidFileName option to useFileUpload (dbd0375)
  • @react-md/typography: override default typography without globals (ce89374), closes #1239

Documentation

  • react-md.dev: updated sassdoc for new module system (4746d26)
  • react-md.dev: updated SortableColumns example to import SortOrder type (b629e3e)

Other Internal Changes

  • ran yarn format to include new files (48d3d7f)
  • Simplifying format and covering json and yml files (#1227) (045ba5e)
  • @react-md/dev-utils: fixed spelling of gzipped (baad174)
  • examples: updated nextjs examples to latest version of next (b50d745)
  • react-md.dev: added sassdoc hot-reloading (9d58e09)
  • react-md.dev: updated sassdoc examples to be linkable (9ed096e)
  • react-md.dev: Updated fonts for latest nextjs build optimizations (ca9ecbd)
  • typescript: support [email protected] (5a9dd72)

Library Size Changes

yarn dev-utils libsize

The gzipped UMD bundle sizes are:
 - dist/umd/react-md.production.min.js 86.75 KB (+ 34 B)
 - dist/umd/react-md-with-font-icons.production.min.js 111.03 KB (+ 35 B)
 - dist/umd/react-md-with-svg-icons.production.min.js 176.83 KB (+ 37 B)

The min and max gzipped CSS bundle sizes are:
 - themes/react-md.grey-red-700-light.min.css 17.63 KB
 - themes/react-md.lime-teal-200-dark.min.css 17.7 KB

v3.0.1

15 Aug 02:05
Compare
Choose a tag to compare

Bug Fixes

  • Updated peerDependencies to fix yarn berry peer requirements (250efcd), closes #1224

Other Internal Changes

  • Fixed link to v3.0.0 PR (ff221cc)

Library Size Changes

yarn dev-utils libsize

The gizipped UMD bundle sizes are:
 - dist/umd/react-md.production.min.js 86.41 KB
 - dist/umd/react-md-with-font-icons.production.min.js 110.68 KB
 - dist/umd/react-md-with-svg-icons.production.min.js 176.46 KB

The min and max gzipped CSS bundle sizes are:
 - themes/react-md.grey-red-700-light.min.css 17.63 KB
 - themes/react-md.lime-teal-200-dark.min.css 17.7 KB

v3.0.0

13 Aug 22:52
Compare
Choose a tag to compare

This release should be relatively simple for most consumers of this library since the main breaking change is dropping support for node-sass and requiring sass since node sass has been deprecated as well as removing deprecated variables, hooks, and components. Most users should be able to run the following commands to upgrade to v3.0.0:

npm update react-md
npm uninstall node-sass
npm install sass

or with yarn

yarn add react-md
yarn remove node-sass
yarn add sass

In addition, there is now partial support for the new Sass module system with the react-md package which also simplifies the import usage and has a slight build performance improvement for large projects. To start using the new module system, update all the @import statements as shown below:

-@import '~@react-md/theme/dist/mixins';
-@import '~@react-md/utils/dist/mixins';
-// other react-md imports
+@use 'react-md' as *;

 // No other changes required!

If you override variables within react-md:

-@import '~@react-md/theme/dist/color-palette';
-$rmd-theme-light: false;
-$rmd-theme-primary: $rmd-purple-500;
-$rmd-theme-secondary: $rmd-pink-a-200;
-
-@import '~react-md/dist/styles';
+@use '@react-md/theme/dist/color-palette' as color;
+@use 'react-md' as * with (
+  $rmd-theme-light: false,
+  $rmd-theme-primary: color.$rmd-theme-purple-500,
+  $rmd-theme-secondary: color.$rmd-theme-pink-a-200,
+);
+
+@include react-md-utils;

Check out the updated customizing your theme documentation, #1214, or 958f34f for more in-depth examples.

BREAKING CHANGES

  • @react-md/theme: $rmd-theme-dark-elevation now defaults to true instead of false
  • sass: node-sass is no longer supported and users must switch to sass
  • @react-md/utils: Removed InteractionModeListener since it was an alias for UserInteractionModeListener
  • @react-md/utils: Removed ResizeObserver component and useResizeObserverV1 implementation
  • @react-md/tooltip: Removed TooltipHoverModeConfig component
  • @react-md/card: Removed deprecated $rmd-card-dark-elevation-bordered-background-color variable
  • @react-md/tooltip: Removed deprecated props from Tooltipped component
  • @react-md/form: The second argument for useIndeterminateChecked is now an object of options

Bug Fixes

  • sass: drop node-sass in favor of sass since it's deprecated (126fb5a)
  • sass: use math.div instead of division since it's deprecated (d8c3f12)

Features

  • @react-md/theme: $rmd-theme-dark-elevation defaults to true (b371337)
  • react-md: Simplify sass usage with: @use 'react-md'; (787bfb5)

Documentation

  • react-md.dev: removed documentation around pre-compiling styles (29b5d74)
  • react-md.dev: Update Sass Documentation for @use (68e8c6b)
  • react-md.dev: Updated sandboxes for new Sass module system (095ae97)

Other Internal Changes

  • Added additional tests to bump test coverage (4d0371c)
  • @react-md/card: removed deprecated $rmd-card-dark-elevation-bordered-background-color variable (01c9350)
  • @react-md/dev-utils: Added simple sass-migrator command (a8e8df3)
  • @react-md/dev-utils: autoConfirm flag passed to initBlog (dec09b8)
  • @react-md/dev-utils: Combine all scss files into react-md/dist/_everything.scss (c7177e6)
  • @react-md/dev-utils: Update release script to hopefully work with prereleases (e0ef881)
  • @react-md/dev-utils: updated sassdoc and variables to use everything.scss (a0f0699)
  • @react-md/dev-utils: updated variables command to work with sass (5376be1)
  • @react-md/form: removed deprecated implementation in useIndeterminateChecked (6b7871f)
  • @react-md/tooltip: removed deprecated props from Tooltipped component (6dca9b1)
  • @react-md/tooltip: removed TooltipHoverModeConfig component (664ec30)
  • @react-md/utils: remove ResizeObserver component and useResizeObserverV1 implementation (6a6b109)
  • @react-md/utils: removed InteractionModeListener alias (216c8ef)
  • examples: updated examples to latest dependencies (f2eb07a)
  • react-md.dev: Each package includes a link to typedoc API in navigation tree (c388ba6)
  • react-md.dev: ran migrator for deprecated division (98d2c58)
  • react-md.dev: removed tilde from imports (6081e14)
  • react-md.dev: update all scss files for @use imports (958f34f)
  • react-md.dev: update all styles to use react-md/dist/everything (2da5033)
  • react-md.dev: Update links for previous versions (2d0a0e6)
  • react-md.dev: updated docs for new rmd-theme-dark-elevation defaults (b2269ff)
  • react-md.dev: updated examples to work with sass instead of node-sass (d8ddf51)
  • react-md.dev: updated sandboxes to use root react-md (c0f25f7)

Library Size Changes

yarn dev-utils libsize

The gizipped UMD bundle sizes are:
 - dist/umd/react-md.production.min.js 86.41 KB (- 57 B)
 - dist/umd/react-md-with-font-icons.production.min.js 110.68 KB (- 58 B)
 - dist/umd/react-md-with-svg-icons.production.min.js 176.46 KB (- 58 B)

The min and max gzipped CSS bundle sizes are:
 - themes/react-md.grey-red-700-light.min.css 17.63 KB (+ 6 B)
 - themes/react-md.lime-teal-200-dark.min.css 17.7 KB (+ 7 B)

v3.0.0-alpha.0

11 Aug 00:28
Compare
Choose a tag to compare
v3.0.0-alpha.0 Pre-release
Pre-release

Breaking Changes

  • @react-md/theme: $rmd-theme-dark-elevation now defaults to true instead of false
  • sass: node-sass is no longer supported and users must switch to sass
  • @react-md/utils: Removed InteractionModeListener since it was an alias for UserInteractionModeListener
  • @react-md/utils: Removed ResizeObserver component and useResizeObserverV1 implementation
  • @react-md/tooltip: Removed TooltipHoverModeConfig component
  • @react-md/card: Removed deprecated $rmd-card-dark-elevation-bordered-background-color variable
  • @react-md/tooltip: Removed deprecated props from Tooltipped component
  • @react-md/form: The second argument for useIndeterminateChecked is now an object of options

Bug Fixes

  • sass: drop node-sass in favor of sass since it's deprecated (1f2a1b0)
  • sass: use math.div instead of division since it's deprecated (f88aca2)

Features

  • @react-md/theme: $rmd-theme-dark-elevation defaults to true (709d34c)
  • react-md: Simplify sass usage with: @use 'react-md'; (8603d7f)

Other Internal Changes

  • Added additional tests to bump test coverage (e78f668)
  • @react-md/card: removed deprecated $rmd-card-dark-elevation-bordered-background-color variable (a99df44)
  • @react-md/dev-utils: Added simple sass-migrator command (68cd615)
  • @react-md/dev-utils: autoConfirm flag passed to initBlog (dec09b8)
  • @react-md/dev-utils: Combine all scss files into react-md/dist/_everything.scss (1ec6b3e)
  • @react-md/dev-utils: Examples correctly override variables (67ac5fb)
  • @react-md/dev-utils: fixed eslint error (ec30900)
  • @react-md/dev-utils: Update release script to hopefully work with prereleases (07d837e)
  • @react-md/dev-utils: updated sassdoc and variables to use everything.scss (4fbb9c8)
  • @react-md/dev-utils: updated variables command to work with sass (d95f55a)
  • @react-md/form: removed deprecated implementation in useIndeterminateChecked (5853b13)
  • @react-md/tooltip: removed deprecated props from Tooltipped component (9083171)
  • @react-md/tooltip: removed TooltipHoverModeConfig component (2ee53da)
  • @react-md/typography: fixed invalid font-family at compile time (3ef77a1)
  • @react-md/utils: remove ResizeObserver component and useResizeObserverV1 implementation (ce55dbc)
  • @react-md/utils: removed InteractionModeListener alias (5528589)
  • react-md.dev: ignore documentation for sass-lint (02ebd43)
  • react-md.dev: Each package includes a link to typedoc API in navigation tree (c388ba6)
  • react-md.dev: ran migrator for deprecated division (acb90a7)
  • react-md.dev: removed tilde from imports (f0e5dee)
  • react-md.dev: update all scss files for @use imports (3b66cfa)
  • react-md.dev: update all styles to use react-md/dist/everything (d7c7bbf)
  • react-md.dev: updated creating-a-new-app (d9b6819)
  • react-md.dev: updated docs for new rmd-theme-dark-elevation defaults (45ffc9d)
  • react-md.dev: updated examples to work with sass instead of node-sass (b2857b0)
  • react-md.dev: updated sandboxes to use root react-md (78a81a5)

v2.9.1

27 Jul 02:09
Compare
Choose a tag to compare

Bug Fixes

  • @react-md/layout: Do not unmount children when swapping to non-fixed appbar mini layouts (64103c8), closes #1207
  • @react-md/utils: useMediaQuery uses addEventListener/removeEventListener (b889a9e)

Other Internal Changes

  • fixed sass-lint error (58f614b)
  • install: slighly reduce install size by excluding tests in publish (9d01a44)
  • react-md.dev: fix links to form demos in blog (b1626b5)

Library Size Changes

yarn dev-utils libsize

The gizipped UMD bundle sizes are:
 - dist/umd/react-md.production.min.js 86.98 KB (+ 6 B)
 - dist/umd/react-md-with-font-icons.production.min.js 111.26 KB (+ 5 B)
 - dist/umd/react-md-with-svg-icons.production.min.js 177.04 KB (+ 5 B)

The min and max gzipped CSS bundle sizes are:
 - themes/react-md.grey-red-700-light.min.css 17.57 KB
 - themes/react-md.lime-teal-200-dark.min.css 17.63 KB

v2.9.0

18 Jul 05:48
Compare
Choose a tag to compare

This release is focused around the FileInput component in the @react-md/form package and implementing a useFileUpload hook to handle uploading/previewing files in the browser. However, there is a notable change in this release for the form documentation since the demos have been split into the following pages:

Bug Fixes

  • @react-md/form: FileInput correctly center the icon when children aren't provided (3a6ab33)
  • @react-md/layout: useLayoutNavigation possible perf fix (3d65e4e)

Features

  • @react-md/form: FileInput automatically swaps button type to text if children exist (e5585e1)
  • @react-md/form: FormMessageCounter component added to public API (1508812)
  • @react-md/form: Added a useFileUpload hook to upload files to the browser (efb3f2f), closes #1159
  • @react-md/utils: added useDropzone hook (bc07a1f)

Other Internal Changes

  • Added CodeQL Workflow for code analysis (9b4a279)
  • @react-md/form: Added tests for useFileUpload (49ce4d9)
  • @react-md/layout: Added additional test coverage (7c123ef)
  • react-md.dev: Added an endpoint for uploading files that acts like a /dev/null (9663ae8)
  • react-md.dev: Added examples for useFileUpload (8f9002e)
  • react-md.dev: fix eslint error after updating prettier (75a9b0f)
  • react-md.dev: Fixed rightAddon for Customizing Select Options Demo (367cc0d)
  • react-md.dev: Split form demos into separate pages (8594930)
  • react-md.dev: Use temporary layout on desktop in dev mode to get more screen space (53b20c4)

Library Size Changes

yarn dev-utils libsize

The gizipped UMD bundle sizes are:
 - dist/umd/react-md.production.min.js 86.92 KB (+ 268 B)
 - dist/umd/react-md-with-font-icons.production.min.js 111.21 KB (+ 273 B)
 - dist/umd/react-md-with-svg-icons.production.min.js 176.99 KB (+ 265 B)

The min and max gzipped CSS bundle sizes are:
 - themes/react-md.grey-red-700-light.min.css 17.57 KB
 - themes/react-md.lime-teal-200-dark.min.css 17.63 KB

v2.8.5

03 Jul 20:19
Compare
Choose a tag to compare

Bug Fixes

  • @react-md/form: MenuItemCheckbox added missing indeterminate state (aa2c552), closes #1186
  • @react-md/form: useIndeterminateChecked correctly uses readonly prefix (7f69a71)
  • @react-md/form: useIndeterminateChecked supports MenuItemCheckbox with new option (9ab67bf)
  • @react-md/form: MenuItemCheckbox, MenuItemRadio, and MenuItemSwitch styles on light themes (fc4dcd9)

Documentation

  • @react-md/form: Updated documentation for useIndeterminateChecked (8646c28)

Other Internal Changes

  • @react-md/dev-utils: Updated release script to allow custom CHANGELOG updates (dde151b)
  • @react-md/form: Added tests for useIndeterminateChecked (cc2a422)
  • react-md.dev: Updated MenuWithFormControls example for indeterminate checkboxes (2d20848)

Library Size Changes

yarn dev-utils libsize

The gizipped UMD bundle sizes are:
 - dist/umd/react-md.production.min.js 84.24 KB (+ 12 B)
 - dist/umd/react-md-with-font-icons.production.min.js 108.48 KB (+ 12 B)
 - dist/umd/react-md-with-svg-icons.production.min.js 174.34 KB (+ 13 B)

The min and max gzipped CSS bundle sizes are:
 - themes/react-md.grey-red-700-light.min.css 17.57 KB (+ 1 B)
 - themes/react-md.lime-teal-200-dark.min.css 17.63 KB

v2.8.4

10 Jun 22:38
Compare
Choose a tag to compare

Bug Fixes

  • @react-md/form: Pass checked prop to component (bffae6f)
  • @react-md/form: Fixed controlled behavior for Switch components (8c65df6), closes #1175
  • @react-md/utils: omit uses readonly prefix for key list (d3e1ee8)
  • @react-md/utils: Slightly better tooltip behavior after clicking somewhere on the page (4d3fc16)

Documentation

  • react-md.dev: Updated general documentation (9bc8a0d)
  • react-md.dev: Update next and build deps to fix font loading issues (e528617)

Other Internal Changes

  • updated doc tsconfig for better autocompletion (7fb8b94)
  • Renamed contrast check function (97c1ad7)
  • add website alias to changelog config (d98bf51)
  • ran prettier after upgrading to v2.3.0 (3ce236a)

Library Size Changes

yarn dev-utils libsize

The gizipped UMD bundle sizes are:
 - dist/umd/react-md.production.min.js 84.12 KB (+ 111 B)
 - dist/umd/react-md-with-font-icons.production.min.js 108.36 KB (+ 115 B)
 - dist/umd/react-md-with-svg-icons.production.min.js 174.21 KB (+ 109 B)

The min and max gzipped CSS bundle sizes are:
 - themes/react-md.grey-red-700-light.min.css 17.56 KB
 - themes/react-md.lime-teal-200-dark.min.css 17.63 KB