Skip to content

fix: do not expand React.CSSProperties in component API docs - #125

Merged
gethinwebster merged 2 commits into
mainfrom
do-not-expand-css-properties
Aug 28, 2026
Merged

fix: do not expand React.CSSProperties in component API docs#125
gethinwebster merged 2 commits into
mainfrom
do-not-expand-css-properties

Conversation

@gethinwebster

Copy link
Copy Markdown
Member

Problem

When a public component prop is typed as React.CSSProperties, getObjectDefinition falls through to the object-expansion branch and inlines every member of the interface (~825 properties) into the generated API definition. For a single such prop this bloats the documenter output to ~981KB per component part.

No shipped component currently exposes React.CSSProperties publicly (SplitPanel's is on an internal, non-exported interface), but an upcoming component (BasicTable) exposes style?: React.CSSProperties on its body and row parts for bring-your-own virtualization, which surfaces this.

Fix

Treat React.CSSProperties as an opaque type reference — exactly how React.ReactNode and HTMLElement are already handled in the same allowlist. The documenter now emits it as its type name (React.CSSProperties) with no inlineType expansion.

     realTypeName.split('.')[0] === 'Highcharts' ||
-    type === 'React.ReactNode'
+    type === 'React.ReactNode' ||
+    type === 'React.CSSProperties'
   ) {
     // do not expand built-in Javascript methods or primitive values
     return { type };

The match string 'React.CSSProperties' was confirmed empirically against @types/reactstringifyType (with UseFullyQualifiedType) produces exactly React.CSSProperties, matching the existing React.ReactNode convention.

Testing

  • New fixture fixtures/components/css-properties and snapshot test css-properties.test.ts asserting a style?: React.CSSProperties prop documents as { type: 'React.CSSProperties', inlineType: undefined } (before this change it expanded to 825 properties).
  • Full suite green (100 tests), npm run lint and npm run build clean.

React.CSSProperties is a large interface (~825 members). When a public
component prop is typed as React.CSSProperties, getObjectDefinition
expanded every member into the generated API definition, bloating the
documenter output (~981KB per part).

Treat React.CSSProperties as an opaque type reference, mirroring the
existing handling of React.ReactNode, so it is emitted as its type name
with no inlineType expansion.
@gethinwebster
gethinwebster requested a review from a team as a code owner August 28, 2026 10:07
@gethinwebster
gethinwebster requested review from avinashbot and removed request for a team August 28, 2026 10:07
@codecov

codecov Bot commented Aug 28, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 94.58%. Comparing base (7149c8c) to head (e123f06).

Additional details and impacted files
@@            Coverage Diff             @@
##             main     #125      +/-   ##
==========================================
+ Coverage   94.57%   94.58%   +0.01%     
==========================================
  Files          11       11              
  Lines         516      517       +1     
  Branches      142      143       +1     
==========================================
+ Hits          488      489       +1     
  Misses         28       28              

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR prevents React.CSSProperties from being expanded into a huge inline object definition in generated component API docs, keeping the output size manageable for components that expose style?: React.CSSProperties.

Changes:

  • Treat React.CSSProperties as an opaque type reference in getObjectDefinition, similar to existing handling for React.ReactNode.
  • Add a new fixture component that exposes a style?: React.CSSProperties prop.
  • Add a snapshot test to ensure the generated docs keep React.CSSProperties unexpanded (inlineType: undefined).

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
src/components/object-definition.ts Adds React.CSSProperties to the non-expansion allowlist so it remains a simple type reference in docs output.
fixtures/components/css-properties/tsconfig.json Adds a dedicated fixture project configuration for the new css-properties test case.
fixtures/components/css-properties/box/index.tsx Introduces a minimal fixture component with style?: React.CSSProperties to reproduce and validate the behavior.
test/components/css-properties.test.ts Adds a Vitest snapshot test covering the non-expansion behavior.
test/components/__snapshots__/css-properties.test.ts.snap Captures the expected output showing type: React.CSSProperties with no inlineType expansion.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment thread src/components/object-definition.ts
@gethinwebster
gethinwebster added this pull request to the merge queue Aug 28, 2026
Merged via the queue into main with commit 959978e Aug 28, 2026
78 of 79 checks passed
@gethinwebster
gethinwebster deleted the do-not-expand-css-properties branch August 28, 2026 12:37
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.

3 participants