Eliminate scss imports from WordPress npm packages

[renatho]

We should remove style imports from WordPress npm packages, especially from @wordpress/components. See https://github.com/Automattic/sensei/blob/2abdef91d6b8efa6db41e42db4efc13fc62152e4/assets/shared/styles/wp-components.scss#L9

It's very complicated to maintain because it's very risky to break things when we update the dependencies, and it is also very easy to break when Gutenberg is updated. Example of issue caused by this: https://github.com/Automattic/sensei/issues/6123

It's important to notice that @wordpress/... dependencies are imported directly from the installed WordPress, while the imported styles are built into Sensei assets.

I'm not totally sure about the imports from ~@wordpress/base-styles. I suspect we should also avoid them, but it's worth some more exploration and thoughts in case it's complicated to be removed.

Sensei Pro

Keep in mind that Sensei Pro can also be importing this for some features, so we also need to test the effects there.

Sensei Pro has also some imports from ~@wordpress/base-styles, so please, consider this as part of this exploration to identify if we also need to update it there and open an issue if it's the case.

[Imran92]

Agreed. Looks like this particular style is pretty commonly imported like this all over calypso, jetpack and many other repos 🤔 https://github.com/search?q=org%3AAutomattic+%40wordpress%2Fcomponents%2Fbuild-style%2Fstyle.css&type=code&p=1 Maybe there's something we need to do which will remove the need for doing it altogether

[renatho]

Good find! But maybe those cases are more isolated cases that wouldn't suffer from conflicts with the original dependency from WordPress? Maybe it's worth checking the approaches when working on this issue. :)