Fix(sistent): Added Table component documentation by kanishksingh23 · Pull Request #7692 · layer5io/layer5

kanishksingh23 · 2026-05-02T07:24:41Z

Description
Adds documentation for the Table component to the Sistent components page.

This PR fixes #7607

Changes

Added index.mdx — Overview, anatomy, variants, and accessibility guidance
Added guidance.mdx — Best practices and do's/don'ts for using the Table component
Added code.mdx — Code examples for Basic, Sortable, Selectable Rows, and Paginated tables

Notes for Reviewers
Documentation follows the same structure as the Button component.
Preview deployment will show the rendered pages at /projects/sistent/components/table.

Signed commits

Yes, I signed my commits.

github-actions · 2026-05-02T07:43:12Z

PR Preview Action v1.6.3
Preview removed because the pull request was closed.
2026-05-16 12:51 UTC

rishiraj38

Fix all these

rishiraj38 · 2026-05-02T08:06:40Z

Where is the code part ?

rishiraj38 · 2026-05-02T08:07:21Z

+- Hard-code hex colour values — always use Sistent theme tokens.
+- Rely on colour alone to convey row status; supplement with text or icons.
+
+## Row Density


Please fix this

rishiraj38 · 2026-05-02T08:07:39Z

+
+The **Table** component organizes information into rows and columns, making it easy for users to read, compare, and analyze data. Use a Table when displaying multiple records with consistent attributes such as services, users, or deployments, when users need to compare values across rows or columns, or when data needs sorting, filtering, or pagination for large data sets.
+
+## Anatomy


Fix here also

kanishksingh23 · 2026-05-02T08:49:59Z

@rishiraj38, I have addressed all the feedback.

rishiraj38 · 2026-05-02T16:18:08Z

You’ve added the code part but where’s the preview or example? Please check the other component’s code part and fix it.

@rishiraj38, I have addressed all the feedback.
Preview: https://layer5.io/pr-preview/pr-7692/projects/sistent/components/table/code

Bhumikagarggg · 2026-05-03T13:53:23Z

@kanishksingh23 Thank you for your contribution! Let's discuss this during the website call tomorrow at 5:30 PM IST | 7 AM CST Add it as an agenda item to the meeting minutes, if you would 🙂

rishiraj38

Could you provide a better example of paginated table code preview for your reference.

kanishksingh23 · 2026-05-04T14:01:31Z

@rishiraj38, I have addressed your comment.

Rajesh-Nagarajan-11 · 2026-05-04T14:34:57Z

+---
+
+import { useState } from "react";
+import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow, TableSortLabel, Paper, Checkbox, Toolbar, Typography } from "@sistent/sistent";


Instead of this please use ResponsiveDataTable which is available in sistent

Hi @Rajesh-Nagarajan-11, I have been looking into this, and while ResponsiveDataTable is in the compiled bundle for @sistent/sistent, it doesn't seem to be exported in the index.d.ts definitions. I also could not find any existing usage of it within the layer5 src directory to use as a reference. Could you point me to an example of where this is currently implemented?

@kanishksingh23 It’s extensively used in meshery.

Thank you @rishiraj38, I will look into it.

@Rajesh-Nagarajan-11, @rishiraj38, I have updated all four table demos to use ResponsiveDataTable from @sistent/sistent.

kanishksingh23 · 2026-05-06T10:37:34Z

@saurabhraghuvanshii, please take a look.

kanishksingh23 · 2026-05-07T13:38:38Z

@Rajesh-Nagarajan-11 and @rishiraj38, gentle ping

rishiraj38

@kanishksingh23 Please don't use maintainer names use something generic and also selectable Rows table are not working

rishiraj38 · 2026-05-07T15:00:12Z

@Rajesh-Nagarajan-11 One confusion here we have used Responsive DataTables here then do we need still need this issue #7681

Rajesh-Nagarajan-11 · 2026-05-07T15:04:38Z

Yep we can close that issue @rishiraj38

kanishksingh23 · 2026-05-08T07:42:54Z

@kanishksingh23 Please don't use maintainer names use something generic and also selectable Rows table are not working

@rishiraj38, names are fixed, and I tried selectable rows also, but still it's not clickable.

Bhumikagarggg · 2026-05-10T16:35:32Z

@kanishksingh23 Thank you for your contribution! Let's discuss this during the website call tomorrow at 5:30 PM IST | 7 AM CST Add it as an agenda item to the meeting minutes, if you would 🙂

rishiraj38

Please try applying those fixes and let’s see if they resolve the issue.

rishiraj38 · 2026-05-14T19:33:37Z

+  if (!mounted) return null;
+  return (
+    <ResponsiveDataTable
+      columns={columns}


Suggested change

columns={columns}

columns={tableCols}

rishiraj38 · 2026-05-14T19:34:50Z

+    ["Charlie", "development"],
+  ], []);
+  const [tableCols, updateCols] = useState(columns);
+  const [columnVisibility, setColumnVisibility] = useState({});


It may need default visibility values for the columns, otherwise the selectable table behavior might not work correctly.

rishiraj38 · 2026-05-16T12:36:23Z

@kanishksingh23, are you available to undertake this task, or should it be reassigned?

kanishksingh23 · 2026-05-16T12:37:02Z

@kanishksingh23, are you available to undertake this task, or should it be reassigned?

I am working on it.

rishiraj38 · 2026-05-16T12:47:41Z

@kanishksingh23 Please open a new PR for this.

Signed-off-by: kanishksingh23 <kanishksingh763@gmail.com>

rishiraj38 suggested changes May 2, 2026

View reviewed changes

kanishksingh23 force-pushed the fix/sistent-table-docs branch 2 times, most recently from 9f9988f to a839e49 Compare May 2, 2026 13:33

rishiraj38 reviewed May 2, 2026

View reviewed changes

rishiraj38 requested review from Rajesh-Nagarajan-11 and saurabhraghuvanshii May 3, 2026 13:01

rishiraj38 suggested changes May 4, 2026

View reviewed changes

Rajesh-Nagarajan-11 reviewed May 4, 2026

View reviewed changes

kanishksingh23 force-pushed the fix/sistent-table-docs branch 2 times, most recently from 1a7608f to da58a9a Compare May 6, 2026 07:02

kanishksingh23 requested review from Rajesh-Nagarajan-11 and rishiraj38 May 6, 2026 10:59

rishiraj38 mentioned this pull request May 7, 2026

feat(sistent): add Table component documentation #7610

Closed

rishiraj38 suggested changes May 7, 2026

View reviewed changes

rishiraj38 mentioned this pull request May 7, 2026

[Sistent] Add Data Table component to the Sistent components page #7681

Closed

kanishksingh23 force-pushed the fix/sistent-table-docs branch 4 times, most recently from 513ca26 to 7149e0e Compare May 7, 2026 20:38

rishiraj38 suggested changes May 14, 2026

View reviewed changes

kanishksingh23 force-pushed the fix/sistent-table-docs branch 2 times, most recently from 84b0ba5 to b303f41 Compare May 16, 2026 11:33

github-actions Bot added project/meshery area/community area/careers project/kanvas area/site-config labels May 16, 2026

kanishksingh23 closed this May 16, 2026

kanishksingh23 force-pushed the fix/sistent-table-docs branch from 6a96841 to b042e0d Compare May 16, 2026 12:16

kanishksingh23 reopened this May 16, 2026

kanishksingh23 closed this May 16, 2026

kanishksingh23 force-pushed the fix/sistent-table-docs branch from 6d0f3c6 to b042e0d Compare May 16, 2026 12:46

fix(sistent): add Table component documentation

c263dec

Signed-off-by: kanishksingh23 <kanishksingh763@gmail.com>

kanishksingh23 reopened this May 16, 2026

Merge branch 'master' into fix/sistent-table-docs

fd5403f

rishiraj38 closed this May 16, 2026

kanishksingh23 mentioned this pull request May 16, 2026

Fix(sistent): Added Table component documentation #7737

Open

1 task


		The Table component organizes information into rows and columns, making it easy for users to read, compare, and analyze data. Use a Table when displaying multiple records with consistent attributes such as services, users, or deployments, when users need to compare values across rows or columns, or when data needs sorting, filtering, or pagination for large data sets.

		## Anatomy

Conversation

kanishksingh23 commented May 2, 2026

Changes

Uh oh!

github-actions Bot commented May 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

rishiraj38 left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

kanishksingh23 commented May 2, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Bhumikagarggg commented May 3, 2026

Uh oh!

rishiraj38 left a comment

Choose a reason for hiding this comment

Uh oh!

kanishksingh23 commented May 4, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

kanishksingh23 commented May 6, 2026

Uh oh!

kanishksingh23 commented May 7, 2026

Uh oh!

rishiraj38 left a comment

Choose a reason for hiding this comment

Uh oh!

rishiraj38 commented May 7, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Rajesh-Nagarajan-11 commented May 7, 2026

Uh oh!

kanishksingh23 commented May 8, 2026

Uh oh!

Bhumikagarggg commented May 10, 2026

Uh oh!

rishiraj38 left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

rishiraj38 commented May 16, 2026

Uh oh!

kanishksingh23 commented May 16, 2026

Uh oh!

rishiraj38 commented May 16, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

github-actions Bot commented May 2, 2026 •

edited

Loading

rishiraj38 commented May 7, 2026 •

edited

Loading