SWELL│投稿リストを自動で横スクロール・スライドする方法

.waza-column-auto > .waza-column-play {
  min-height: 44px;
  margin-top: 1rem;
  padding: .6em 1em;
  border: 1px solid #888;
  border-radius: 4px;
  background: #fff;
  color: #333;
  font: inherit;
  cursor: pointer;
}
.waza-column-auto > .waza-column-play:focus-visible { outline: 3px solid #245bba; outline-offset: 3px; }
.waza-column-auto > .waza-column-play:disabled { opacity: .7; cursor: default; }

(function () {
  function initColumns() {
    document.querySelectorAll('.waza-column-auto').forEach(function (root) {
      if (root.dataset.wazaReady) return;
      const track = root.querySelector('.swell-block-columns__inner');
      if (!track || track.children.length < 2) return;
      root.dataset.wazaReady = '1';
      const button = document.createElement('button');
      button.type = 'button';
      button.className = 'waza-column-play';
      root.appendChild(button);
      const reduced = window.matchMedia('(prefers-reduced-motion: reduce)');
      let timer = null;
      function stop() {
        if (timer !== null) window.clearInterval(timer);
        timer = null;
        button.textContent = '自動スクロールを開始';
        button.setAttribute('aria-pressed', 'false');
      }
      function update() {
        stop();
        button.disabled = reduced.matches || track.scrollWidth <= track.clientWidth + 2;
        if (reduced.matches) button.textContent = '動きを抑える設定のため自動再生は無効';
        else if (button.disabled) button.textContent = 'すべての項目を表示しています';
      }
      function advance() {
        const max = track.scrollWidth - track.clientWidth;
        const first = track.children[0].getBoundingClientRect().left;
        const positions = Array.from(track.children).map(function (el) {
          return el.getBoundingClientRect().left - first;
        });
        const next = positions.find(function (left) { return left > track.scrollLeft + 2; });
        const target = track.scrollLeft >= max - 2 ? 0 : Math.min(next === undefined ? max : next, max);
        track.scrollTo({ left: target, behavior: 'smooth' });
      }
      button.addEventListener('click', function () {
        if (timer !== null) { stop(); return; }
        if (reduced.matches || track.scrollWidth <= track.clientWidth + 2) { update(); return; }
        button.textContent = '自動スクロールを停止';
        button.setAttribute('aria-pressed', 'true');
        timer = window.setInterval(advance, 3500);
      });
      track.addEventListener('pointerdown', stop);
      track.addEventListener('focusin', stop);
      track.addEventListener('wheel', stop, { passive: true });
      document.addEventListener('visibilitychange', function () { if (document.hidden) stop(); });
      window.addEventListener('resize', update);
      reduced.addEventListener('change', update);
      update();
    });
  }
  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', initColumns, { once: true });
  else initColumns();
})();