Toast component(part of post - https://aibolik.github.io/blog/creating-toast-api-with-react-hooks)

Toast.jsx

const Wrapper = styled.div`
  margin-right: 16px;
  margin-top: 16px;
  width: 200px;

  position: relative;
  padding: 16px;
  border: 1px solid #d7d7d7;
  border-radius: 3px;
  background: white;
  box-shadow: 0px 4px 10px 0px #d7d7d7;
  color: #494e5c;
`;

const Toast = ({ children }) => (
  <Wrapper>{children}</Wrapper>
);