Overview
tss-react is a library that supports Next.js 13 appDir and is intended to be a replacement for @material-ui v4 makeStyles and react-jss. It seamlessly integrates with Material UI, offers support for Server Side Rendering, and provides a type-safe equivalent of the JSS $ syntax. The library is built on top of @emotion/react and has minimal impact on bundle size. It is actively maintained and offers fast performance. Additionally, tss-react does not need to be added as a peerDependency for library authors.
Features
- Seamless integration with Material UI.
- Support for withStyles API.
- Server side rendering support, including Next.js and Gatsby.
- Type-safe equivalent of JSS $ syntax.
- Custom @emotion cache support.
- Small bundle size (~5kB minziped) when used alongside Material UI.
- Actively maintained with timely issue resolutions.
- Fast performance.
- Does not need to be added as a peerDependency for library authors.
- Support for MUI’s theme global styles overrides.
Installation
To install tss-react, you can follow the below steps:
- Run the following command to install tss-react:
npm install tss-react
- Import tss-react in your code:
import { ... } from 'tss-react';
- Start using the library within your application.
Summary
tss-react is a versatile library that offers seamless integration with Material UI, providing support for withStyles API and server side rendering. It has a small bundle size and offers a type-safe equivalent of JSS $ syntax. The library is actively maintained and performs well.