Export clsx util to use with the withStyles API

src/mui/index.ts

@@ -1,3 +1,3 @@
-export { tss, makeStyles, useStyles, withStyles } from "./mui";
+export { tss, makeStyles, useStyles, withStyles, clsx } from "./mui";
 export { useMuiThemeStyleOverridesPlugin } from "./themeStyleOverridesPlugin";
 export type { MuiThemeStyleOverridesPluginParams } from "./themeStyleOverridesPlugin";

src/mui/mui.ts

@@ -2,12 +2,15 @@ import { useTheme } from "@mui/material/styles";
 import { createMakeAndWithStyles } from "../index";
 import { createTss } from "../tss";
 import { useMuiThemeStyleOverridesPlugin } from "./themeStyleOverridesPlugin";
+import { clsx } from "../tools/clsx";
 
 /** @see <https://docs.tss-react.dev/setup> */
 export const { makeStyles, withStyles } = createMakeAndWithStyles({
     useTheme
 });
 
+export { clsx };
+
 export const { tss } = createTss({
     "useContext": function useContext() {
         const theme = useTheme();

src/tools/clsx.ts

@@ -0,0 +1,24 @@
+import { classnames } from "./classnames";
+
+export type ClassValue =
+    | ClassArray
+    | ClassDictionary
+    | string
+    | null
+    | boolean
+    | undefined;
+
+export interface ClassDictionary {
+    [id: string]: any;
+}
+
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface ClassArray extends Array<ClassValue> {}
+
+/**
+ * Polyfill for cslx.
+ * This is indended to be used ONLY with the withStyles API.
+ * Otherwise use `const { cx } = useStyles();` instead.
+ */
+export const clsx: (...classes: ClassValue[]) => string = (...classes) =>
+    classnames(classes);