MUI v5: Как создавать классы стилей для взаимодействия с другими библиотеками?

#reactjs #material-ui #jss #emotion

#реагирует на #материал-пользовательский интерфейс #jss #эмоция

Вопрос:

Я использую MUI v5 вместе с Quill в React.

Я могу передать реквизит имени класса компоненту ReactQuill и изменить его стиль:

 const useStyles = makeStyles((theme) =gt; ({  editor: {  'amp; .ql-editor': {  border: 'none',  // and so on...  }  } }))  lt;ReactQuill className={classes.editor} ... /gt;  

Теперь, с MUIv5 и его переходом на эмоции, это больше невозможно. В настоящее время мой обходной путь заключается в том, чтобы обернуть ReactQuill элемент внутри div следующим образом:

 const ReactQuillContainer = styled('div')(({theme}) =gt; ({  'amp; .ql-editor': {  border: 'none',  // and so on...  } }))  lt;ReactQuillContainergt;  lt;ReactQuill ... /gt; lt;/ReactQuillContainergt;  

Но это меняет базовую структуру DOM.

Есть ли способ достичь старого результата по-новому? Я знаю об этой css функции, однако мне нужна тема для оформления, и я не думаю, что это возможно.

Я также не хочу встраивать все эти стили.