feat: make expand on data dictionary more obvious (#3036)

[frano-m]

Summary

Adds two visual affordances on data dictionary rows to indicate row-level expandability:

• Chevron icon on the LHS of FieldCell — KeyboardArrowRightRounded, rotates 90° on expand with a 150ms CSS transition. Wrapped in a new StyledFieldCell flex-row container; existing content moves into the inner StyledGrid.
• "Show More" / "Show Less" text at the bottom of DetailCell — always-visible textual affordance; label swaps based on row.getIsExpanded(). Rendered as styled Typography (not a <button>) since the row itself is the canonical click target.

Click behaviour is unchanged: findable-ui's handleToggleExpanded continues to handle row-level toggling.

Accessibility:

• Chevron is aria-hidden — purely decorative icon, conveys no information beyond what the row's expanded state already exposes.
• "Show More" / "Show Less" text is NOT hidden — it's a textual affordance label that screen readers should announce.

Closes #3036.

Files

• components/DataDictionary/components/TableCell/components/FieldCell/fieldCell.tsx
• components/DataDictionary/components/TableCell/components/FieldCell/fieldCell.styles.ts (added StyledFieldCell, StyledIconButton; trimmed StyledGrid layout responsibilities)
• components/DataDictionary/components/TableCell/components/DetailCell/detailCell.tsx
• components/DataDictionary/components/TableCell/components/DetailCell/detailCell.styles.ts (added StyledTypography for the Show More indicator)

Test plan

• npx tsc --noEmit, npm run lint, npm run check-format pass
• npm run build-dev:data-portal succeeds
• Visual check on /metadata/<dictionary> — chevron present on LHS of every row, rotates on expand; "Show More" / "Show Less" appears at the bottom of DetailCell and swaps based on state; clicking either the row or the indicators toggles expand
• Verify on narrow viewport (bpDownSm) — padding adjustments still apply via the outer StyledFieldCell

🤖 Generated with Claude Code

[Copilot]

Pull request overview

This PR improves the discoverability of row expand/collapse behavior in the Data Dictionary table by adding a left-side chevron indicator in FieldCell and a “Show more / Show less” textual affordance in DetailCell.

Changes:

• Added a rotating chevron icon to FieldCell that reflects expanded state.
• Added an always-present “Show more / Show less” label at the bottom of DetailCell.
• Refactored FieldCell layout from MUI Grid usage to CSS grid + MUI Stack.

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
components/DataDictionary/components/TableCell/components/FieldCell/fieldCell.tsx	Renders chevron indicator and updates layout wrappers for field rows.
components/DataDictionary/components/TableCell/components/FieldCell/fieldCell.styles.ts	Introduces grid-based layout, chevron styling/rotation, and Stack wrapper styling.
components/DataDictionary/components/TableCell/components/FieldCell/constants.ts	Replaces Grid props with Stack props for the location/name + required chips row.
components/DataDictionary/components/TableCell/components/DetailCell/detailCell.tsx	Adds “Show more / Show less” label that tracks expanded state.
components/DataDictionary/components/TableCell/components/DetailCell/detailCell.styles.ts	Styles the new label (underline) and applies responsive visibility rules.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.