React Generic List Component Implementation

//*Example
//Where ( listOfItems ) is an array of items
<List items={listOfItems} dir="vertical">
  {(listOfItem) => (
    <dl>
      <dt>Name</dt>
      <dd>{listOfItem.name}</dd>

      <dt>Created</dt>
      <dd>{listOfItem.since}</dd>

      <dt>Author</dt>
      <dd>{listOfItem.author}</dd>
    </dl>
  )}
</List>

React Generic List Component v1

import React from 'react';

interface Props<T> {
  children: (item: T) => React.ReactNode,
  items: T[],
  dir?: 'horizontal' | 'vertical',
  dividers?: boolean,
  windowing?: boolean
}

interface IdObj {
  id: string | number
}

const List = <T extends IdObj>({ children, dir, dividers, items, windowing }: Props<T>) => {

  return (
    <div>
      {items.map((item, idx) => (
        <div key={idx} className="item">
          {children(item)}
        </div>
      ))}
    </div>
  )
}
export default List;