Notistack without Material-UI? [POLL] 👍👎

[iamhosseindhv]

This is not the first time I get asked this.

Is there any way to use notistack without material-ui dependency?

People reached out to me in github issues, Instagram DMs and email, saying that they'd love to use notistack but their app is not built on Material-ui and therefore are not willing to add it as a dependency just for notistack.

Upvote 👍 this issue if you think notistack's target audience should be anyone that uses React, and not just material-ui users. Or let me know if you think otherwise.

Worth mentioning that in both cases the API will remain untouched.

[hrafaelveloso]

Given the simplicity of integration, I think this package could be open to the whole React community. Regarding Material-UI dependency, is there a need to support Material-UI v3? This would reduce the bundle size according to the comment of @oliviertassinari

[FabianoLothor]

Some news about this issue?

[andrewmclagan]

A suggestion would be to create a mono repo with multiple packages under a new organisation with "drivers" for other UI libraries:

yarn add @notistack/core @notistack/material-ui

OR

yarn add @notistack/core @notistack/antd

This abstraction could even be projected further and have drivers for UI rendering libraries:

yarn add @notistack/core @notistack/vue @notistack/vuetify

---

EDIT: This would also have the side effect of reducing package size considerably.

[oliviertassinari]

@iamhosseindhv It would be awesome to see it used without the Material Design specification! Material-UI is working on building unstyled/hook only components and implementing a second theme that has a great aesthetic (not Material Design based). Material-UI stands for Materials to build UIs, we might rename the project MUI so it's not confused with Material Design.

See mui/material-ui#18098 and mui/material-ui#1824 that we use to remove the dependency on notistack to build our own notification system.

Would you be interested in integrating the component in Material-UI directly?

[NathTech]

+1 Yes please. sans material-ui would be lovely. I'm using react-bootstrap...

[vizardkill]

any news, about integrating material ui?.

I would love to see this package in material ui

[icharge]

Any update about this?

[jazithedev]

Are there any plans on removing Material UI dependency from this project? This issue exists for 1 year now...

[jameswilson]

We're in the same boat as others here. We've rolled our own UI, but wanted to outsource this one component, because it is a fairly self-contained problem space, and one that nearly any decoupled app would need when communicating with backends, to notify of asynchronous errors and such. Sadly the peerDependencies are not mentioned on npmjs.com project page nor on github project page.

Adding this to our project added 96kb for Material-ui + 27kb for this package (gzipped). Thus we've opted for react-toastify instead which is 9kb gzipped. 😿

Update: So, we were checking the dev build, not production build, where tree shaking minimize the effects of the size requirements to +26kb (this was indicated by @iamhosseindhv here )

[tim-bloxsome]

Sadly the peerDependencies are not mentioned on npmjs.com project page nor on github project page.

I second that.

[iamhosseindhv]

Definitely this is a work in progress. You can track the progress in alpha branch. Downloadable from npm i notistack@alpha. which will be published as v2 as there are some breaking changes. With alpha version you'll have absolute control over the appearance of your snackbars.

Currently the only thing we're dependent on is Transition components (Slide, Grow, ...) from MUI. Once those are re-used or reimplemented, you'll be able to use notistack without MUI.

Any help with that is appreciated.

[Jammar]

I'd use this package if it worked w/o Material. big up!

[adam-pheedloop]

+1 for an option to use without the Material UI dependency

[ibrahimawadhamid]

+1 for use without material UI

[jsdaniell]

+1 for use without Material-UI

[carlospence]

I would have loved to use this package for a new project but because of the dependency on MUI which was not even stated on github or npmjs. I have been using react-toastify but wanted something more beautiful. I will be using react-hot-toast for this particular project and might check out notistack in later project.

+1 vote for use without Material-UI

[ibrahimawadhamid]

I would have loved to use this package for a new project but because of the dependency on MUI which was not even stated on github or npmjs. I have been using react-toastify but wanted something more beautiful. I will be using react-hot-toast for this particular project and might check out notistack in later project.

+1 vote for use without Material-UI

@carlospence Thanks for mentioning a few other options out there, I think i will use react-hot-toast from now on.

[iamhosseindhv]

Thanks everyone for the upvotes. You can track the progress here #421. I am looking for contributors to help the only remaining task of v2.