Detect Scrollbar hide

[MyNameTony1000]

Hello, tell me, is it possible to track when an element no longer scrolls? For example, when there is only 1 element in a block and the scrollbar disappears because scrolling is not needed, how can you track this particular state during initialization?
Initialization occurs like this:

<script src='/js/smooth-scrollbar-develop/dist/smooth-scrollbar.js'></script>
    <script>
      [...document.querySelectorAll('[data-scrollbar-select="true"]')].forEach((el) => {
        var Scrollbar = window.Scrollbar.init(el, {
          renderByPixels: true,
          alwaysShowTracks: true,
        });

        let v = el.querySelectorAll('ul li');
        
        console.log(Scrollbar);
        console.log(Scrollbar.limit);
        console.log(Scrollbar.isVisible(v[v.length - 1]));

        // if (Scrollbar.isVisible(el.querySelector('ul li:last-child'))) {
        //   console.log('VISIBLE LAST');
        // } else {
        //   console.log('LAST NOT VISIBLE');
        // }

        // if (Scrollbar.limit.y === 0) {
        //   console.log('LIMIT IS 0');
        // }

        Scrollbar.addListener((status) => {
          if (status.offset.y === status.limit.y) {
            el.classList.add('scroll-end');
          } else {
            el.classList.remove('scroll-end');
          }
        })
      });
    </script>

console.log outputs the following

[sadeghbarati]

Hi, Can you try this code?

var scrollbars = []

[...document.querySelectorAll('[data-scrollbar-select="true"]')].forEach((el) => {
  var scrollbarInstance = window.Scrollbar.init(el, {
    renderByPixels: true,
    alwaysShowTracks: true,
  });
  
  scrollbars.push(scrollbarInstance)
});


scrollbars.forEach((scrollbarItem, _index) => {

  let v = scrollbarItem.containerEl.querySelectorAll('ul li');
        
  console.log(scrollbarItem);
  console.log(scrollbarItem.limit);
  console.log(scrollbarItem.isVisible(v[v.length - 1]));

  scrollbarItem.addListener((status) => {
    if (status.offset.y === status.limit.y) {
      scrollbarItem.containerEl.classList.add('scroll-end');
    } else {
      scrollbarItem.containerEl.classList.remove('scroll-end');
    }
  });

});

[MyNameTony1000]

@sadeghbarati, everything remains the same)

[sadeghbarati]

Can you share your repo or live site?

[MyNameTony1000]

@sadeghbarati,
actually I never did) Can be problematic. But it is not necessary to use exactly my example - it is as standard as possible. It is enough to take any other standard example where this plugin is available and leave 1 element in the block so that the overflow goes away and the scrollbar disappears. I just need to find out a working method by which it is possible to track this moment, because I don’t know how exactly it can be done and whether it’s possible at all.