Horizontal scroll not working

[nautilor]

version: 2.2.0 (stable)
react: 18.3.1

Code to reproduce

Page.tsx

const Page = () => {
  const numbers = new Array(100).fill(0).map((_, index) => index);
  return (
    <div>
      <ScrollContainer className="container">
        {numbers.map((el) => (
          <div key={el} className="row">
            {el}
          </div>
        ))}
      </ScrollContainer>
    </div>
  );
}
export default Page;

Page.css

.row {
  height: 65px;
  width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-family: sans-serif;
  font-weight: bold;
  font-size: 24px;
}

.row:nth-child(1n) {
  background: #7b7;
}

.row:nth-child(2n) {
  background: #7c7;
}

.container {
  height: calc(100vh - 20px);
  display: flex;
  flex-direction: row;
}

if I change flex-direction to column the vertical scroll is working fine