bcgov / bcgov/zeva2

ZEVA 2 - Implement standardized Table component based on Design System

Open
#279 1 comment 0 reactions 1 assignee View on GitHub

@dallascrichmond is already working on this.

Since Mar 3, 2026.

Medium Task
Dominant language
TypeScript
Stars
1
Forks
6
Avg merge
8h 52m
Merged PRs (30d)
33

Description

Describe the task
Implement a standardized Table component across the system based on the approved Table Design in the Design System.

Purpose
This task aims to:

  1. establish a single, reusable Table component aligned with the Design System
  2. ensure visual and interaction consistency across all pages

Prototype Page level design reference
A full-page prototype has been added to illustrate how the table component appears within a real layout (eg Admin page) - in relation to page header, tabs, and surrounding actions.

Acceptance Criteria

  • Table styling (spacing, typography, borders, colors, states) matches the Design System (see Figma)
  • A single base Table component is implemented and reused across the system
  • The following features are optional and enabled when required: pagination, column sorting ,text-based, search / filtering, row-level copy action
  • Copy action behavior: only the copy icon is clickable - clicking the icon copies the corresponding cell value (e.g. email) to the clipboard
  • All enabled features follow the visual and interaction patterns defined in the Design System

Additional context
Table layouts, states, and feature examples are documented in the Design System (see Figma reference)
This task focuses on UI styling and interaction behavior, not on changing existing data logic
Different tables may require different feature combinations, but all must reuse the same base Table component
If additional or advanced filtering is required (e.g. dropdown filters, multi-selects, or table-specific logic), this will be defined in separate supporting tickets for specific use cases

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.