Scrollable List

scrollable-list.tsx

const ScrollableList = ({ listItems }) => {
  return (
    <div className="c-scrollable-list">
      <ul className="c-scrollable-list__list">
        {listItems.map((item) => {
          return (
           <li key={item.title} className="c-scrollable-list__list-item">
            <a href="#" className="c-scrollable-list__link">
              {item.title}
            </a>
          </li>
          )
        })}
      </ul>
      <div className="c-scrollable-list__slide-buttons">
        <button
          className="c-scrollable-list__button is-show-less"
          type="button"
        >
          Previous
        </button>
        <button
          className="c-scrollable-list__button is-show-more"
          type="button"
        >
          Next
        </button>
      </div>
    </div>
  );
};