Skip to content

chore: apply namespace pattern for component props (part 8)#773

Merged
kurtdoherty merged 1 commit intomainfrom
chore-apply-namespace-pattern-for-component-props-part-8
Sep 11, 2025
Merged

chore: apply namespace pattern for component props (part 8)#773
kurtdoherty merged 1 commit intomainfrom
chore-apply-namespace-pattern-for-component-props-part-8

Conversation

@kurtdoherty
Copy link
Contributor

Context

  • Some components currently export their prop interfaces, while others do not. This leads to an inconsistent experience for consumers.
  • Further, when exporting component props via a separate export to the component itself, this forces consumers to have two separate imports, one for the component and another for the component's props. This does provide any improvement over the use of React's ComponentProps.
  • To provide a consistent approach, and to help consumers avoid needing to separately import component props, the following pattern will be applied to all core components:
export namespace MyComponent {
  export Props extends ... {
    ...
  }
}

export function MyComponent(props: MyComponent.Props) {
  ...
}

This way, when consumers import MyComponent, they will automatically have access to its prop interface via MyComponent.Props.

Past PRs include:

This PR

Applies this namespace pattern for component props to the last group of components:

  • EmptyData subcomponents (these were missed originally)
  • CSSContainerQuery
  • MatchMedia
  • Popover

Also documents the interface pattern in a new guidelines/interface-pattern.md file.

@rpt-uk-github
Copy link

rpt-uk-github commented Sep 11, 2025

🎉 Snyk checks have passed. No issues have been found so far.

security/snyk check is complete. No issues have been found. (View Details)

license/snyk check is complete. No issues have been found. (View Details)

code/snyk check is complete. No issues have been found. (View Details)

@codacy-production
Copy link

codacy-production bot commented Sep 11, 2025

Coverage summary from Codacy

See diff coverage on Codacy

Coverage variation Diff coverage
Report missing for 7152bd11 92.16%
Coverage variation details
Coverable lines Covered lines Coverage
Common ancestor commit (7152bd1) Report Missing Report Missing Report Missing
Head commit (e711751) 9269 8575 92.51%

Coverage variation is the difference between the coverage for the head and common ancestor commits of the pull request branch: <coverage of head commit> - <coverage of common ancestor commit>

Diff coverage details
Coverable lines Covered lines Diff coverage
Pull request (#773) 51 47 92.16%

Diff coverage is the percentage of lines that are covered by tests out of the coverable lines that the pull request added or modified: <covered lines added or modified>/<coverable lines added or modified> * 100%

See your quality gate settings    Change summary preferences

Footnotes

  1. Codacy didn't receive coverage data for the commit, or there was an error processing the received data. Check your integration for errors and validate that your coverage setup is correct.

@kurtdoherty kurtdoherty marked this pull request as ready for review September 11, 2025 05:22
@kurtdoherty kurtdoherty force-pushed the chore-apply-namespace-pattern-for-component-props-part-8 branch from b43efcd to c7d7dd8 Compare September 11, 2025 05:24
@kurtdoherty kurtdoherty force-pushed the chore-apply-namespace-pattern-for-component-props-part-8 branch from c7d7dd8 to e711751 Compare September 11, 2025 05:26
@kurtdoherty kurtdoherty merged commit 39e01c3 into main Sep 11, 2025
6 checks passed
@kurtdoherty kurtdoherty deleted the chore-apply-namespace-pattern-for-component-props-part-8 branch September 11, 2025 05:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants