mi6 / mi6/ic-ui-kit

Skeleton rows for data tables

Open
#1,004 1 comment 0 reactions 0 assignees View on GitHub
data-table component data-table V1
Dominant language
TypeScript
Stars
53
Forks
63
Avg merge
2d 4h
Merged PRs (30d)
15

Description

## Summary
An option to show a skeleton representation of a row in a data table is needed so that individual rows can be set to a loading status, new content structure can be displayed whilst loading.

## 💰 User value
Provides option to display rows in a data table that have yet to load or are updating.

## 📚 User Stories
If relevant, describe the high-level functionality as user stories.

*As an* ICDS user:
*I need* a skeleton representation of a data table row
*So that* the row structure can be displayed whilst loading or updating.

## 📝 Acceptance Criteria
If relevant, describe in full detail the different interactions and edge cases that the component or patterns needs to fulfil.

*Given* that a table row exists
*When* setting its properties
*Then* an option exists to show it as a skeleton.

*Given* that a table exists
*When* setting the table properties
*Then* it can be set to show as skeleton which displays all rows as skeletons.

## ✏ Designs
If there's a Figma design file (or other mock-up), include it here.

## 🧾 Guidance
If there's written guidance or documentation, include it here.

Contributor guide

Open the contributing guide

Research direction

No file or test is named in the issue. Start by locating the data table component and its existing row and table property tests, then confirm how component properties are exposed. Done means a row can render as a skeleton independently and the table can render all rows as skeletons, with tests covering both options.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.