fix(design-sync): P1/P2 fixes from claude.ai/design review

[BigSimmo]

Summary

Implements Part 1 of the July 2026 design-side review (CLAUDE_CODE_FIXES.md): fixes to the design-sync inputs plus two small source fixes, then a verified re-sync to the Clinical KB Design System project.

• P1 — stub type declarations: all 10 synced components now ship real prop contracts via dtsPropsFor (was [key: string]: unknown)
• P1 — --text-hero misparse: added the Tailwind v4 --text-hero--line-height companion (1.15) so tooling can't read the clamp() size as a font-family; the only call site sets explicit leading-[1.05], so no visual change
• P2 — icon crash: PanelHeading/EmptyState icon is now optional (icon tile skipped when absent) + no-icon preview stories proving it renders
• P2 — no usable icons: the bundle re-exports a curated 35-icon lucide set; conventions header now tells the design agent to import icons from the package, never lucide-react
• P3 — non-self-contained example: AccessibleTable primary example inlines its data
• P2/P3 accepted findings (--tw-* scoped vars, pseudo theme scopes, README token-count difference) recorded in .design-sync/NOTES.md as validator heuristics, per the review's own audit

Verification

• verify:cheap green (lint, typecheck, 2197 vitest, type-scale/icon-scale/brand checks)
• Re-sync driver clean: render check 10/10, zero flags, all 29+2 preview cells graded good; changed components re-captured and re-verified
• Uploaded to the design project and re-anchored; .d.ts/icons/prompt.md fixes confirmed in the uploaded output

Part 2 of the review (E1–E6 design-elevation refactor) is deliberately not in this PR — it is an app-wide token migration program, assessed separately.

Clinical governance preflight

Not applicable — UI primitives + design-sync config only; no ingestion, answer generation, search/ranking, source governance, document access, privacy, or production env changes.

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features

  • Panel headings and empty states can now appear without icons for cleaner, more flexible layouts.
  • Added icon-free examples for recent searches and empty pinned-content states.
  • Expanded the available icon set for consistent use across the design system.

• Documentation

  • Updated icon usage guidance and clarified supported icons.
  • Documented accepted design validation findings and tooling compatibility guidance.

• Refactor

  • Simplified table preview data configuration without changing its visible content.

[supabase]

This pull request has been ignored for the connected project sjrfecxgysukkwxsowpy because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: dcbccd69-dddd-4214-9f18-2674e426a724

📥 Commits

Reviewing files that changed from the base of the PR and between abba3c7 and 8103c56.

📒 Files selected for processing (9)

• .design-sync/NOTES.md
• .design-sync/config.json
• .design-sync/conventions.md
• .design-sync/entry.tsx
• .design-sync/previews/AccessibleTable.tsx
• .design-sync/previews/EmptyState.tsx
• .design-sync/previews/PanelHeading.tsx
• src/app/globals.css
• src/components/ui-primitives.tsx

---

📝 Walkthrough

Walkthrough

The design sync bundle now exports curated icons, supports iconless PanelHeading and EmptyState usage, records explicit component prop metadata, updates previews and conventions, and adds a hero typography line-height companion token with validator notes.

Changes

Design sync component and tooling updates

Layer / File(s)	Summary
Icon API and previews .design-sync/entry.tsx, src/components/ui-primitives.tsx, .design-sync/previews/*, .design-sync/conventions.md	The bundle re-exports curated icons; PanelHeading and EmptyState accept optional icons; iconless previews and updated icon guidance are added.
Sync prop metadata and table preview .design-sync/config.json, .design-sync/previews/AccessibleTable.tsx	Component prop type metadata is added, and clinical table rows and columns are inlined into the preview.
Typography tooling compatibility src/app/globals.css, .design-sync/NOTES.md	A --text-hero--line-height companion token and accepted validator findings are documented.

Estimated code review effort: 2 (Simple) | ~10 minutes

Possibly related PRs

• BigSimmo/Database#517: Both changes update the shared --text-hero typography token in src/app/globals.css.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title is concise and accurately summarizes the main design-sync review fixes in the change set.
Description check	✅ Passed	The description includes the required Summary, Verification, and Notes sections and provides sufficient detail for the PR.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/design-sync-fixes-p1

---

_{Comment @coderabbitai help to get the list of available commands.}