GitBook: [#3] No subject

README.md

@@ -84,6 +84,10 @@ Even if you never use it explicitly, it's a peer dependency of `@mui/material`.
 {% endhint %}
 {% endtab %}
 
+{% tab title="With MUI & theme augmentation" %}
+
+{% endtab %}
+
 {% tab title="Standalone" %}
 ```
 yarn add tss-react @emotion/react

page-1/README.md

@@ -6,7 +6,12 @@
 import {
     createMakeAndWithStyles, //<- Create an instance of makeStyles() and withStyles() for your theme.
     keyframes, //<- The function as defined in @emotion/react and @emotion/css
-    GlobalStyles, //<- A component to define global styles. 
+    GlobalStyles, //<- A component to define global styles.
+    TssCacheProvider, //<- Provider to specify the emotion cache tss should use.
+    useCssAndCx, //<- Access css and cx directly.
+    //   (Usually you'll use useStyles returned by makeStyles or createMakeStyles for that purpose
+    //    but if you have no theme in your project, it can come in handy.)
+    useMergedClasses //<- Merge the internal classes an the one provided as props into a single classes object.
 } from "tss-react";
 ```
 
@@ -26,6 +31,6 @@ import {
 [keyframes.md](keyframes.md)
 {% endcontent-ref %}
 
-{% content-ref url="broken-reference" %}
-[Broken link](broken-reference)
+{% content-ref url="usemergedclasses.md" %}
+[usemergedclasses.md](usemergedclasses.md)
 {% endcontent-ref %}

readme-1-1.md

@@ -28,7 +28,20 @@ render(
 ### Specify the cache at inception
 
 ```typescript
+//src/tss.ts
 import createCache from "@emotion/cache";
+// This is assuming you are using MUI, the useTheme function can be any hook that returns an object.
+import { useTheme } from "@mui/material/styles";
+import { createMakeAndWithStyles } from "tss-react";
+
+const cache = createCache({
+  "key": "custom"
+});
+
+export const { makeStyles, withStyles, useStyles } = createMakeAndWithStyles({
+    useTheme,
+    cache
+});
 ```
 
 ###