β¨ Dynamic CSS-in-TS solution, based on Emotion β¨
Home - Documentation - Playground
You can think of tss-react
as @emotion/jss
.
It's, in essence, a type-safe equivalent of the JSS API but powered by Emotion,
just like @emotion/styled
is the styled-components API but powered by Emotion.
$
syntax.@emotion
cache.withStyles
API featured, to help you migrate away from @material-ui v4.@emotion/react
, it has very little impact on the bundle size alongside mui (~5kB minziped).'tss-react'
can be used as an advantageous replacement for @material-ui v4 makeStyles
and 'react-jss'
.tss-react
wonβt be yet another entry in your peerDependencies
.While this module is written in TypeScript, using TypeScript in your application is optional (but recommended as it comes with outstanding benefits to both you and your codebase).
The more βοΈ the project gets, the more time I spend improving and maintaining it. Thank you for your support π
Needless to mention, this library is heavily inspired by JSS, the OG CSS-in-JS solution.
Running the demo apps:
git clone https://github.com/garronej/tss-react
cd tss-react
yarn
yarn build
npx tsc -w & npx tsc --module es2015 --outDir dist/esm -w
# Open another Terminal
yarn start_spa # For testing in in a Create React App setup
yarn start_ssr # For testing in a Next.js setup
yarn start_appdir # Next.js 13 setup in App directory mode
To report a security vulnerability, please use the Tidelift security contact. Tidelift will coordinate the fix and disclosure.