Conversation
WalkthroughGenerateApiDoc and its helpers were updated to accept and thread an ExampleReader; ExampleReader now returns ExampleResult objects (name+url). Tests and Storybook arg generation were updated to pass ExampleReader. Many API doc files were enriched with per-prop examples and top-level links metadata. Changes
Sequence Diagram(s)sequenceDiagram
participant Generator as generateApiDoc
participant Reader as ExampleReader
participant Project as ProjectDocReader
participant Output as ApiDoc
Note over Generator,Reader: New flow threads ExampleReader through link gathering
Generator->>Reader: request getExamples(component[, prop])
Reader-->>Generator: ExampleResult[] (name, url)
Generator->>Project: read JSDoc links for component/prop
Project-->>Generator: JSDoc links
Generator->>Generator: merge & dedupe JSDoc links + ExampleResult entries
Generator-->>Output: ApiDoc (props + examples + links)
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 minutes Possibly related PRs
Suggested reviewers
🚥 Pre-merge checks | ✅ 1 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (1 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 2
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
www/src/docs/api/ZAxisAPI.tsx (1)
106-131: Add examples tozAxisIdprop to match documentation pattern forxAxisIdandyAxisId.The
zAxisIdproperty (lines 172-184) lacks anexamplesarray, while the correspondingxAxisIdandyAxisIdproperties in XAxisAPI.tsx and YAxisAPI.tsx both include examples showing multi-axis scenarios. For consistency and to help users understand when multiple Z-axes are needed, add relevant example links (e.g., scatter chart examples that use multiple Z-axes).
🤖 Fix all issues with AI agents
In `@omnidoc/readExamples.ts`:
- Around line 70-83: The merge currently iterates implicitExamples into
explicitExamples causing implicit entries to overwrite explicit ones; change the
merge so explicitExamples take precedence by either (a) creating a new Map from
implicitExamples and then copying explicitExamples into it, or (b) iterating
explicitExamples and setting those into implicitExamples, then return the
combined map values; update the merge logic referencing the explicitExamples and
implicitExamples Maps accordingly so explicit examples override implicit when
URLs collide.
In `@www/src/docs/api/BarAPI.tsx`:
- Around line 327-330: The examples array in BarAPI.tsx contains duplicate
entries for the same demo with inconsistent URL formatting (one with trailing
slash and one without); update the data or dedupe logic to normalize URLs (e.g.,
trim trailing slashes) before comparison so duplicates are collapsed, or simply
remove one of the two entries in the examples array (the objects containing name
'Chart with min bar height' / 'Bar Chart With Min Height' and url
'/examples/BarChartWithMinHeight' vs '/examples/BarChartWithMinHeight/').
🧹 Nitpick comments (7)
www/src/docs/api/SectorAPI.tsx (1)
33-35: Consider extracting the repeated example object into a shared constant.This avoids duplication across multiple props and the top-level
links, making future edits safer.♻️ Proposed refactor
import { ApiDoc } from './types'; +const customActiveShapeExample = { + name: 'Custom Active Shape Pie Chart', + url: '/examples/CustomActiveShapePieChart/', + isExternal: false, +}; + export const SectorAPI: ApiDoc = { name: 'Sector', props: [ @@ - examples: [ - { name: 'Custom Active Shape Pie Chart', url: '/examples/CustomActiveShapePieChart/', isExternal: false }, - ], + examples: [customActiveShapeExample], @@ - examples: [ - { name: 'Custom Active Shape Pie Chart', url: '/examples/CustomActiveShapePieChart/', isExternal: false }, - ], + examples: [customActiveShapeExample], @@ - examples: [ - { name: 'Custom Active Shape Pie Chart', url: '/examples/CustomActiveShapePieChart/', isExternal: false }, - ], + examples: [customActiveShapeExample], @@ - examples: [ - { name: 'Custom Active Shape Pie Chart', url: '/examples/CustomActiveShapePieChart/', isExternal: false }, - ], + examples: [customActiveShapeExample], @@ - examples: [ - { name: 'Custom Active Shape Pie Chart', url: '/examples/CustomActiveShapePieChart/', isExternal: false }, - ], + examples: [customActiveShapeExample], @@ - examples: [ - { name: 'Custom Active Shape Pie Chart', url: '/examples/CustomActiveShapePieChart/', isExternal: false }, - ], + examples: [customActiveShapeExample], @@ - links: [{ name: 'Custom Active Shape Pie Chart', url: '/examples/CustomActiveShapePieChart/', isExternal: false }], + links: [customActiveShapeExample], };Also applies to: 49-51, 65-67, 94-96, 110-112, 126-128, 226-227
www/src/docs/api/RadialBarAPI.tsx (1)
444-444: LGTM!Root-level
linksarray correctly added to the API documentation.Consider extracting the repeated example object into a shared constant if these files are manually maintained. However, if this is auto-generated by the parser mentioned in the PR description, this suggestion can be disregarded.
www/src/docs/api/ErrorBarAPI.tsx (1)
100-108: Consider extracting repeated example object to a constant.The same example object is defined 4 times in this file. If this file is manually maintained (rather than fully auto-generated), extracting it to a constant would improve maintainability.
♻️ Optional refactor
+const candlestickExample = { name: 'Candlestick', url: '/examples/Candlestick/', isExternal: false }; + export const ErrorBarAPI: ApiDoc = { name: 'ErrorBar', props: [ { name: 'dataKey', // ... - examples: [{ name: 'Candlestick', url: '/examples/Candlestick/', isExternal: false }], + examples: [candlestickExample], }, // ... apply similarly to other occurrences ], - links: [{ name: 'Candlestick', url: '/examples/Candlestick/', isExternal: false }], + links: [candlestickExample], };www/src/docs/api/TooltipAPI.tsx (1)
154-170: Consider adding adescfield for consistency.The
defaultIndexprop is missing a description while most other props in this file have one. A brief explanation of what this prop controls (e.g., initial active tooltip index) and hownull,number, andstringvalues behave would help users understand its purpose.📝 Suggested addition
{ name: 'defaultIndex', type: 'null | number | string', isOptional: true, + desc: { + 'en-US': ( + <section> + <p> + Sets the initial active index for the tooltip. When set, the tooltip will display data for this index on mount. + </p> + </section> + ), + }, examples: [ { name: 'Population Pyramid', url: '/examples/PopulationPyramid/', isExternal: false },omnidoc/readExamples.ts (1)
280-291: Redundant type guard.The check
Node.isObjectLiteralExpression(element)at line 283 is redundant since the outer condition at line 258 already confirmselementis anObjectLiteralExpression.♻️ Simplify by removing redundant check
if (componentSourceFile) { const filePath = componentSourceFile.getFilePath(); // Try to find 'name' property in the object literal let name = 'Example'; - if (Node.isObjectLiteralExpression(element)) { - const nameProp = element.getProperty('name'); - if (nameProp && Node.isPropertyAssignment(nameProp)) { - const nameInitializer = nameProp.getInitializerIfKind(SyntaxKind.StringLiteral); - if (nameInitializer) { - name = nameInitializer.getLiteralValue(); - } + const nameProp = element.getProperty('name'); + if (nameProp && Node.isPropertyAssignment(nameProp)) { + const nameInitializer = nameProp.getInitializerIfKind(SyntaxKind.StringLiteral); + if (nameInitializer) { + name = nameInitializer.getLiteralValue(); } }www/src/docs/api/ComposedChartAPI.tsx (1)
216-225: Consider adding "Composed Responsive Container" example for consistency.The
responsiveprop examples list 8 Area Chart examples but omits the "Composed Responsive Container" example that appears in the top-levellinksarray (line 505) and other props likechildren,data, andmargin. Sinceresponsiveis directly related to responsive container behavior, this example seems particularly relevant here.Suggested addition
{ name: 'Target Price Chart with active Label', url: '/examples/TargetPriceChart/', isExternal: false }, + { name: 'Composed Responsive Container', url: '/examples/ComposedResponsiveContainer/', isExternal: false }, ],www/src/docs/api/AreaChartAPI.tsx (1)
208-218: Consider adding "Area Responsive Container" example.The
responsiveprop's examples list includes the "Chart sizing guide" but doesn't include the "Area Responsive Container" example that appears in the top-levellinksarray (line 492). Since this prop directly controls responsive behavior, the responsive container example would be highly relevant.Suggested addition
{ name: 'Area Chart Fill By Value', url: '/examples/AreaChartFillByValue/', isExternal: false }, + { name: 'Area Responsive Container', url: '/examples/AreaResponsiveContainer/', isExternal: false }, ],
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #6899 +/- ##
==========================================
+ Coverage 94.27% 94.43% +0.15%
==========================================
Files 565 565
Lines 53858 55259 +1401
Branches 5178 5178
==========================================
+ Hits 50777 52182 +1405
+ Misses 3072 3068 -4
Partials 9 9 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
|
Staging Deployment Details
These deployments will remain available for 30 days. To update snapshots: Comment |
Bundle ReportBundle size has no change ✅ |
Description
Reuses the parser from #6897 to automatically generate a link to relevant example for each component and each prop in the docs.
Related Issue
#6069
Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.