iamhosseindhv / notistack

Highly customizable notification snackbars (toasts) that can be stacked on top of each other
https://notistack.com
Other
3.94k stars 298 forks source link

Notistack without Material-UI? [POLL] 👍👎 #184

Closed iamhosseindhv closed 3 years ago

iamhosseindhv commented 5 years ago

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 commented 5 years ago

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 commented 5 years ago

Some news about this issue?

andrewmclagan commented 5 years ago

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 commented 4 years ago

@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 https://github.com/mui-org/material-ui/issues/18098 and https://github.com/mui-org/material-ui/issues/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 commented 4 years ago

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

vizardkill commented 4 years ago

any news, about integrating material ui?.

I would love to see this package in material ui

icharge commented 4 years ago

Any update about this?

jazithedev commented 4 years ago

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

jameswilson commented 3 years ago

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 commented 3 years ago

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

I second that.

iamhosseindhv commented 3 years ago

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 commented 3 years ago

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

adam-pheedloop commented 3 years ago

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

ibrahimawadhamid commented 3 years ago

+1 for use without material UI

apevesting commented 3 years ago

Any updates on this? This poll was open over 2 years ago...

jsdaniell commented 3 years ago

+1 for use without Material-UI

carlospence commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

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.