Table Component

Data table with headers, cells, pagination, tree hierarchy, and expandable rows. Based on OPS Design Library (Figma).

Standard Table with Tree Hierarchy

Full-size table with sortable headers, tree-level cells, badges, actions, and footer with metrics.

Resource Name
Category
Region
Cost
Status
Actions
U
Cloud Infrastructure
All providers

Root

Multi-cloud
Global
$12,450
AWS Services
Category
Database
EU West
$856
EC2 Instances
Resource
Storage
Asia Pacific
$432
S3 Buckets
Resource
Compute
US West
$267
Azure Services
Category
Container
EU North
$1,890
Virtual Machines
Resource
Analytics
US Central
$654
GCP Services
Resource
Storage
US East
$189
Total Resources:84
Total Cost Spent:$84
Overall Variance:12%
1
of 60

Compact Table

Dense table with smaller headers (40px) and cells, suitable for data-heavy dashboards.

Resource
Type
Region
CPU
Memory
Actions
ec2-prod-01
t3.large
us-east-1
45%
72%
rds-main-db
db.r5.xlarge
us-east-1
28%
65%
lambda-api
128MB
us-west-2
12%
34%
s3-data-lake
Standard
us-east-1
N/A
N/A
eks-cluster-01

Warning

m5.2xlarge
eu-west-1
67%
81%
cloudfront-cdn
Distribution
Global
N/A
N/A
sqs-queue-main
Standard
us-east-1
N/A
N/A
dynamodb-users
On-Demand
us-east-1
N/A
N/A
elasticache-01
r6g.large
us-east-1
35%
58%
alb-prod
Application
us-east-1
N/A
N/A
ecs-service-api
Fargate
us-west-2
52%
44%
Showing 1-11 of 100

Table with Expandable Rows

Standard table with a dedicated expand chevron per row. Click the chevron to toggle the expanded content slot.

Primary key of the Table
Text
Highlight
Tag
Status
Actions
U
AWS EC2 Instance
Compute
$1,234
US East

Active

Expandable row content slot
U
Azure SQL Database
Database
$856
EU West

Active

U
GCP Cloud Storage
Storage
$432
Asia Pacific

Warning

U
AWS Lambda Functions
Compute
$267
US West

Active

U
Azure Kubernetes
Container
$1,890
EU North

Active

U
GCP BigQuery
Analytics
$654
US Central

Warning

U
AWS S3 Buckets
Storage
$189
US East

Active

Total Resources:84
Total Cost Spent:$84
Overall Variance:12%
1
of 60