@mankindui/core/dist/components/Snackbar/index.js

- a react component library - you can see how @mankindui/core can be used via examples: [usage examples](https://github.com/clarklindev/mankindui-test)

import { j as s } from "../../_virtual/jsx-runtime.js";
import { useState as m, useEffect as r } from "react";
import f from "../../node_modules/styled-components/dist/styled-components.browser.esm.js";
const a = ({ setShowSnackbar: t, children: e }) => {
  const [i, o] = m(!1);
  return r(() => {
    o(!0);
    const n = setTimeout(() => {
      o(!1), t(!1);
    }, 2e3);
    return () => {
      clearTimeout(n);
    };
  }, [t]), /* @__PURE__ */ s.jsx(p, { "display-component": a.displayName, className: i ? "show" : "", children: e });
}, p = f.div`
  visibility: hidden;
  min-width: 250px;
  margin-left: -125px;
  background-color: #333;
  color: #fff;
  text-align: center;
  border-radius: 2px;
  padding: 16px;
  position: fixed;
  z-index: 1;
  left: 50%;
  bottom: 30px;

  &.show {
    visibility: visible;
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
  }

  /* Animations to fade the snackbar in and out */
  @-webkit-keyframes fadein {
    from {
      bottom: 0;
      opacity: 0;
    }
    to {
      bottom: 30px;
      opacity: 1;
    }
  }

  @keyframes fadein {
    from {
      bottom: 0;
      opacity: 0;
    }
    to {
      bottom: 30px;
      opacity: 1;
    }
  }

  @-webkit-keyframes fadeout {
    from {
      bottom: 30px;
      opacity: 1;
    }
    to {
      bottom: 0;
      opacity: 0;
    }
  }

  @keyframes fadeout {
    from {
      bottom: 30px;
      opacity: 1;
    }
    to {
      bottom: 0;
      opacity: 0;
    }
  }
`;
a.displayName = "Snackbar";
export {
  a as Snackbar
};
//# sourceMappingURL=index.js.map