docs(cndocs): sync latest upstream docs#1028
Conversation
📝 WalkthroughWalkthroughThis PR enhances the React Native documentation website by introducing a new DocItem layout component for better document presentation, updating accessibility and linking documentation with clarifications and corrected examples, and adding scrollbar styling to prevent layout shifts. Supporting package dependencies are reordered and new CSS styling is added. ChangesDocumentation Updates
DocItem Layout Feature and Styling
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@cnwebsite/src/theme/DocItem/Layout/index.tsx`:
- Line 73: The class application currently uses !docTOC.hidden which can be true
even when there are no TOC items; update the condition on the div that builds
className (the clsx call where styles.docItemCol is applied) to only add
styles.docItemCol when a renderable TOC exists, e.g. require both !docTOC.hidden
and docTOC.toc?.length > 0 (or equivalent null-safe check) so the content column
isn't capped when toc is empty.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 89b2319a-bc37-4431-a0d8-4376dffb2167
📒 Files selected for processing (6)
cndocs/accessibility.mdcndocs/linking.mdcnwebsite/package.jsoncnwebsite/src/css/customTheme.scsscnwebsite/src/theme/DocItem/Layout/index.tsxcnwebsite/src/theme/DocItem/Layout/styles.module.css
| const {metadata} = useDoc(); | ||
| return ( | ||
| <div className="row"> | ||
| <div className={clsx('col', !docTOC.hidden && styles.docItemCol)}> |
There was a problem hiding this comment.
Apply .docItemCol only when TOC is actually renderable.
The current condition can cap content width to 75% on desktop even when no TOC column is rendered (e.g., toc.length === 0), leaving empty space.
💡 Proposed fix
- <div className={clsx('col', !docTOC.hidden && styles.docItemCol)}>
+ <div className={clsx('col', docTOC.canRender && styles.docItemCol)}>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <div className={clsx('col', !docTOC.hidden && styles.docItemCol)}> | |
| <div className={clsx('col', docTOC.canRender && styles.docItemCol)}> |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@cnwebsite/src/theme/DocItem/Layout/index.tsx` at line 73, The class
application currently uses !docTOC.hidden which can be true even when there are
no TOC items; update the condition on the div that builds className (the clsx
call where styles.docItemCol is applied) to only add styles.docItemCol when a
renderable TOC exists, e.g. require both !docTOC.hidden and docTOC.toc?.length >
0 (or equivalent null-safe check) so the content column isn't capped when toc is
empty.
1 participant
Summary
同步本轮
scripts/sync-translations.sh候选中确认存在实际上游漂移的中文文档，并同步上游 website 配置/样式更新到cnwebsite。翻译同步
cndocs/accessibility.mdincrement/decrementaccessibility action 在 Android TalkBack 旧版/新版中的触发说明。label字段说明，补充辅助技术如何使用标准动作 label 描述具体结果。cndocs/linking.mdAppDelegate示例，移除两个override。本轮脚本还列出了
checkbox、clipboard、colors、datepickerandroid、datepickerios、imagepickerios、modal、segmentedcontrolios、statusbarios、timepickerandroid；逐一比对后确认这些是已同步/短 stub 已翻译的 stale candidates，本 PR 未改动。cnwebsite 同步
cnwebsite/package.jsondocusaurus-plugin-copy-page-button。@docusaurus/theme-mermaid排序到与上游一致的位置。cnwebsite/src/css/customTheme.scsscnwebsite/src/theme/DocItem/Layout/*Verification
yarn installyarn --cwd cnwebsite build✅native-modules-android.md#register-the-module、No "p" element in scope等），与本次改动无关。Notes
sync-translations.sh在本分支改完后仍会列出同一批候选，因为脚本按production上的中文翻译时间戳判断；这些改动合并回production后列表才会更新。Summary by CodeRabbit
New Features
Bug Fixes
Documentation
Style