Add tests for the empty state key value grid and pag heading layout primitives

[ekwe7]

closes #79

Add Test Coverage for EmptyState, KeyValueGrid, and PageHeading

Summary

This PR adds comprehensive test coverage for three shared presentational components:

• EmptyState
• KeyValueGrid
• PageHeading

These components are widely reused across list and detail pages but previously had no dedicated tests. The new test suite validates their rendering contracts, semantic structure, and optional prop behavior to prevent regressions.

Problem

The layout primitives currently lack test coverage, making it possible for changes to unintentionally break:

• Optional descriptions
• Optional action content
• Key-value row rendering
• Semantic HTML structure
• Accessibility expectations

Because these components are reused throughout the application, regressions could affect multiple pages without being detected.

Changes

EmptyState

Added tests to verify:

• Title renders correctly
• Description renders only when provided
• Action content renders only when provided
• Missing optional props do not produce unexpected output

KeyValueGrid

Added tests to verify:

• Each row renders a semantic <dt> / <dd> pair
• Labels and values are displayed correctly
• Empty row collections render no meaningful content
• Definition list structure remains valid

PageHeading

Added tests to verify:

• Title renders as an <h1>
• Optional description renders correctly
• Action slot content renders when provided
• Missing optional props are handled gracefully

Documentation

• Added JSDoc documentation to layout primitives where missing
• Improved component self-documentation for future contributors

Testing Approach

Tests use semantic queries such as:

• getByRole
• getByText
• queryByText

rather than implementation-specific class assertions.

This keeps tests resilient while validating actual user-visible behavior.

Accessibility and Semantics

Validated:

• Proper <h1> rendering for page headings
• Proper <dl>, <dt>, and <dd> structure for key-value content
• Accessible rendering of actions regardless of whether they are links or buttons

Edge Cases Covered

• Missing optional descriptions
• Missing optional actions
• Empty rows arrays
• Action rendered as a link
• Action rendered as a button

Validation

Executed:

npm run lint
npm run typecheck
npm test

Acceptance Criteria

• EmptyState title rendering verified
• Optional description and action rendering verified
• KeyValueGrid renders semantic dt/dd pairs
• Empty rows state covered
• PageHeading h1 rendering verified
• PageHeading description rendering verified
• PageHeading action slot rendering verified
• Semantic queries used throughout tests
• JSDoc added where missing
• High component test coverage achieved

[mikewheeleer]

well done — in it goes 🚀