Material-UI Framework in React plugin?


I am in the process of creating an XD plugin using React (very new to the community!). I have had trouble with some libraries, namely Material-UI among some others. I get errors when importing the libraries (eg “TypeError: window.getComputedStyle is not a function”).

A few comments/questions:

  • Per the documentation, I understand that “the XD plugin API environment is not a browser, nor is it Node.js”, and that I should not assume that APIs that work in other environments will work in XD. That alone may be evidence that this framework will not work in this environment. (Another part of the documentation that may suggest frameworks like this won’t work is where it says that “Npm packages that only depend on the core JavaScript language APIs can work in XD”).

  • I also noticed that the XD documentation provides guides on UX patterns and requirements - I assume this is to ensure that plugins conform to the native styling and experience in XD.

So, my questions: Are my assumptions correct - given the environment limitations + UX requirements, are design/styling frameworks generally off-limits in XD?

This question was originally posted here

I’m also interested in this topic. @ryanpfalz have you figured if this is possible?

@MattM Unfortunately, this is not possible - I ended up just using the native React elements. Since the XD plugin environment is not a browser nor is it Node.js, not all packages are supported - only those which depend on the core JS language APIs.
See these docs:

Hope this helps.

Thanks for getting back to me - it saved me a bunch of time.