Getting type error (not assignable to type 'StylisPlugin') for rtlPlugin

[omareg94]

Current Behavior 😯

When I use rtlPlugin from stylis-plugin-rtl, I get type error:
Type '(element: Element, index: number, children: (string | Element)[], callback: Middleware) => string | void' is not assignable to type 'StylisPlugin'.

Expected Behavior 🤔

Not having this type (TypeScript) error.

To Reproduce 🕹

Live Example (codesandbox/eager-tereshkova-lx74s)

Context 🔦

I'm trying to use rtlPlugin in order to display mui components in rtl direction.

Environment information 🌎

Simple React/Next.js. Also check Live Example above for more detailed.

• react version: 17.0.2
• stylis version: 4.0.10
• stylis-plugin-rtl version: 2.1.0
• @emotion/react version: 11.4.1
• @emotion/styled version: 11.3.0

I have previously posted this issue at material-ui, but they reported that the bug is either within @emotion/cache or stylis-plugin-rtl (comment).
Also there's an exact issue opened at emotion-js/emotion in case the bug is there.

[amirrivand]

just edit return type on stylisRTLPlugin function in ~/node_modules/stylis-plugin-rtl/dist/stylis-rtl.d.ts like below:
declare function stylisRTLPlugin(element: MiddlewareParams[0], index: MiddlewareParams[1], children: MiddlewareParams[2], callback: MiddlewareParams[3]): string | undefined;

it works!

[iquabius]

I patched it like this:

diff --git a/node_modules/stylis-plugin-rtl/types/stylis-rtl.d.ts b/node_modules/stylis-plugin-rtl/types/stylis-rtl.d.ts
index acb55fd..f7f8791 100644
--- a/node_modules/stylis-plugin-rtl/types/stylis-rtl.d.ts
+++ b/node_modules/stylis-plugin-rtl/types/stylis-rtl.d.ts
@@ -1,3 +1,10 @@
-declare function stylisRTLPlugin(context: number, content: string): string | undefined;
+import { StylisElement, StylisPluginCallback } from "@emotion/cache";
+
+declare function stylisRTLPlugin(
+  element: StylisElement,
+  index: number,
+  children: Array<StylisElement>,
+  callback: StylisPluginCallback
+): string | void
 
 export default stylisRTLPlugin;

File in patches/stylis-plugin-rtl+2.0.2.patch

I copied the function definition from node_modules/@emotion/cache/types/index.d.ts.