RxJs Is it possible to solve this kind of pivot table problem

I'm new to RxJs. Is it possible to solve this type of pivot table problem.

Suppose I have a stream with any number of items.

• Each item is a number between 0 and 999.

• I'd like to make a table from this stream. A table with 10 columns.

• The column number for an item is equal to the item divided by 10. So number 654 will go to column 6.

Because we have a random number of items and because the numbers arrive in a random order, the columns will have different heights.

How can I operarate on the stream to generate the rows of the table one by one to show the table?

Update

With the Fan Cheung solution (described below) it was easy to generate the columns with RxJs. But would it also be possible to subsequently generate the rows (the rows array) with RxJs to be able to render the table as shown below?

The colums have different heights.

More like an array question

items.reduce((acc,curr)=>{
const key=Math.floor(curr/10);
if(!acc[key])
  acc[key]=[]
acc[key].push(curr)
return acc
},[])

You should then get an array (columns) of arrays (rows)

if you have items from a stream, just change to pipe()

items.pipe(reduce((acc,curr)=>{
const key=Math.floor(curr/10);
if(!acc[key])
  acc[key]=[]
acc[key].push(curr)
return acc
},[]))