data-component adr part 3

[llastflowers]

Relates to https://github.com/github/primer/issues/6497

Changelog

New

Add data-component attributes and associated tests for Details, Flash, FormControl (+ update InputValidation to forward from FormControl.Validation), Header, and Heading.

Rollout strategy

• Patch release
• Minor release
• Major release; if selected, include a written rollout or migration plan
• None; if selected, include a brief description as to why

Testing & Reviewing

Merge checklist

• Added/updated tests
• Added/updated documentation
• Added/updated previews (Storybook)
• Changes are SSR compatible
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge
• (GitHub staff only) Integration tests pass at github/github-ui (Learn more about how to run integration tests)

[changeset-bot]

🦋 Changeset detected

Latest commit: f20de1d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@primer/react	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

⚠️ Action required

👋 Hi, this pull request contains changes to the source code that github/github-ui depends on. If you are GitHub staff, test these changes with github/github-ui using the integration workflow. Check the integration testing docs for step-by-step instructions. Or, apply the integration-tests: skipped manually label to skip these checks.

To publish a canary release for integration testing, apply the Canary Release label to this PR.

[Copilot]

Pull request overview

Adds stable data-component attributes (per ADR rollout) to several Primer React components and introduces unit tests to verify those attributes are rendered.

Changes:

• Add data-component markers to Details, Flash, FormControl (and related slots), Header, and Heading.
• Extend internal InputValidation to accept/pass through a data-component value for FormControl.Validation.
• Add/extend unit tests asserting data-component attributes for the updated components.

Show a summary per file

File	Description
packages/react/src/internal/components/InputValidation.tsx	Adds optional data-component prop and applies it to the rendered Text.
packages/react/src/Heading/Heading.tsx	Adds data-component="Heading" to the root element.
packages/react/src/Heading/tests/Heading.test.tsx	Adds a test asserting Heading renders the data-component attribute.
packages/react/src/Header/Header.tsx	Adds data-component to Header, Header.Item, and Header.Link.
packages/react/src/Header/Header.test.tsx	Adds tests asserting data-component attributes for Header and subcomponents.
packages/react/src/FormControl/FormControlLeadingVisual.tsx	Adds data-component="FormControl.LeadingVisual".
packages/react/src/FormControl/FormControlLabel.tsx	Adds data-component="FormControl.Label" to the label render.
packages/react/src/FormControl/FormControlCaption.tsx	Adds data-component="FormControl.Caption".
packages/react/src/FormControl/FormControl.tsx	Adds data-component="FormControl" to the layout wrapper elements.
packages/react/src/FormControl/_FormControlValidation.tsx	Passes data-component="FormControl.Validation" into InputValidation.
packages/react/src/FormControl/tests/FormControl.test.tsx	Adds tests for FormControl/slot data-component attributes (one test currently has a lint-breaking unused variable).
packages/react/src/Flash/Flash.tsx	Adds data-component="Flash" to the root element.
packages/react/src/Flash/tests/Flash.test.tsx	Adds a test asserting Flash renders the data-component attribute.
packages/react/src/Details/Details.tsx	Adds data-component to Details root and Details.Summary.
packages/react/src/Details/tests/Details.test.tsx	Adds tests asserting Details and Details.Summary render data-component attributes.

Copilot's findings

• Files reviewed: 16/16 changed files
• Comments generated: 1

[primer]

🤖 Lint issues have been automatically fixed and committed to this PR.

[primer-integration]

👋 Hi from github/github-ui! Your integration PR is ready: https://github.com/github/github-ui/pull/20313

[primer-integration]

Integration test results from github/github-ui:

CI Passed
VRT Passed
Projects Passed

All checks passed!