React Strawberry Toast
  • Getting Started
  • Guides
      Show ToastCustomizeStylingPositioningMulti ContainerHeadless Hook
  • API
      toastContainertoastuseToasts
  • Getting Started
  • Guides
      Show ToastCustomizeStylingPositioningMulti ContainerHeadless Hook
  • API
      toastContainertoastuseToasts

Positioning

Toast target option

Toasts can be displayed at a relative position to a specific element, similar to a tooltip, using the target option.


optiondescriptiontyperequired
elementTarget element where toast will be locatedHTMLElementtrue
offsetOffset away from element[number, number]false


toast('toast target', {
  target: {
    element: element.current,
    offset: [30, 30],
  },
});
@Created by dkpark10