Table

Last Update : 14 August, 2023 | Published : 01 July, 2023 | 1 Min Read

Tables - used to organize data in rows and columns and when you need to organize data. Tables also allow users to look up a specific information.

Import

import Table from '@intelops/intelops_ui/packages/react/components/Table/src';

Create a Table

<Table 
    title ="Intelops"
    className="table"
    columns={[
        {Header:"Name", accessor:"userName"},
        {Header:"Status", accessor:"status"},
        { Header: "Actions", accessor: "actions" },
        ]}
    tabledata={[
        {
            userName: "TJ",
            role: "Manager",
            actions: "Edit", 
        },
        {
            userName: "Ron",
            role: "Developer",
            actions: "Edit", 
        }
        ]}
/>

Props

Name Type Description
id string Unique to each element can be used to lookup an element getElementById( )
className string To add new or to override the applied styles
title string Title of the table
columns list of array elements Names of the columns and the accessor to add data into the respective columns
tabledata list of array elements Data that needs to appear in the table - json format

Looking for Cloud-Native Implementation?

Finding the right talent is pain. More so, keeping up with concepts, culture, technology and tools. We all have been there. Our AI-based automated solutions helps eliminate these issues, making your teams lives easy.

Contact Us