Loading indicator causes layout jumps

[ilyakonrad]

Hoopit-GoogleChrome2024-04-0113-30-17-ezgif.com-video-to-gif-converter.mp4

It's easily fixable with CSS

.str-chat__message-list-scroll {
  // Make room for the loading indicator.
  padding-top: 20px !important;

  stream-loading-indicator {
    // Avoid UI shift.
    height: 0;
    display: block;
    // Move it on the parent's top padding.
    translate: 0 -16px;
  }
}

P. S. Also weird that the scroll up triggers loading every time even after you loaded everything already.

[szuperaz]

I can't play the video, but I think I know what you mean.

The problem is that since the loading indicator can be customized, we'd most likely need to use CSS variables to solve this issue, so I don't think it will be solved in the near future.

As for loading is triggered after everything is loaded: that will be solved as part of this issue: #566

[github-actions]

🎉 This issue has been resolved in version 5.1.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀