How to use smooth-scroll-into-view-if-needed - 8 common examples

useEffect(() => {
        // scroll into view if selected
        if (isSelected) {
            scrollIntoView(elRef.current, {
                behavior: 'smooth',
                block: 'start',
                inline: 'nearest',
                scrollMode: 'if-needed',
            })
        }
    }, [isSelected])

(async () => {
          // https://www.npmjs.com/package/smooth-scroll-into-view-if-needed
          await scrollIntoView(el, {
            scrollMode: 'if-needed',
            // block: 'nearest',
            // inline: 'nearest',
            behavior: 'smooth',
          });
        })();
      }

Turbolinks.ScrollManager.prototype.scrollToElement = function(element) {
  let classes = element.classList;
  if (classes.contains("highlightable")) {
    classes.add("highlight");
  }
  scrollIntoView(element, {
    behavior: 'smooth',
    scrollMode: 'if-needed',
  });
}

scrollTop = () => {
        const root = document.getElementById('root')

        if (root) {
            scrollIntoView(root, {
                behavior: 'smooth',
                block: 'start',
                inline: 'nearest',
            })
        }
    }

scrollToHash() {
    const hashNode = document.getElementById(this.hash);
    if (hashNode) {
      this.setState({ smoothScroll: true });
      scrollIntoView(hashNode, { behavior: 'smooth', block: 'start' }).then(() => {
        this.setState({ smoothScroll: false });
      });
    } else {
      this.props.setHash(this.props.hlist[0].id);
    }
  }
  componentDidUpdate() {

scroll = (urlHash?: string) => {
        const root = document.getElementById('root')
        const { isModalOpen } = this.context

        if (urlHash) {
            const elementId = urlHash.substr(1)
            const hashReference = document.getElementById(elementId)

            if (hashReference) {
                scrollIntoView(hashReference, {
                    behavior: 'smooth',
                    block: 'start',
                    inline: 'nearest',
                })
            }
        } else if (root && !isModalOpen && window.pageYOffset > 2000) {
            window.scrollTo(0, 0)
        } else if (root && !isModalOpen) {
            scrollIntoView(root, {
                behavior: 'smooth',
                block: 'start',
                inline: 'nearest',
            })
        }
    }

scrollToTop() {
    smoothScrollIntoView(document.querySelector('.appInfo'), {
      block: 'start',
    });
  }
}

useEffect(() => {
    if (isVisible) {
      smoothScrollIntoView(document.getElementById('opt_container'), { behavior: 'smooth' });

      disableBodyScroll(modal.current);
    }
  }, [isVisible]);
  return isVisible ? (