react-clickable-row-table

A minimal table with clickable rows that will open the desired url in a new tab.

Example

Usage

import React from 'react'
import './App.css';
import ClickableRowTable from 'react-clickable-row-table'



function App() {

  const table = {
    header: {id: 0, data : ['Char', 'Int', "Num"]},
    rows : [{id: 1, data : ['a', '1', "one"],  url: "https://www.npmjs.com/"},
            {id: 2, data : ['b', '2', "two"],  url: "https://www.npmjs.com/"},
            {id: 3, data : ['c', '3', "three"],  url: "https://www.npmjs.com/"}],
  }

  return (
    <div className="App">
      <ClickableRowTable table= {table} style={{border: "1px solid black;", width: "100%"}}/>
    </div>
  );
}

export default App;

Sample Props

const table = {
    header: {id: 0, data : ['Char', 'Int', "Num"]},
    rows : [{id: 1, data : ['a', '1', "one"],  url: "https://www.npmjs.com/"},
            {id: 2, data : ['b', '2', "two"],  url: "https://www.npmjs.com/"},
            {id: 3, data : ['c', '3', "three"],  url: "https://www.npmjs.com/"}],
  }