feat: code preview page add scroll to top button

[btea]

🔗 Linked issue

/

🧭 Context

When previewing code, some files contain a lot of code. Scrolling back to the top of the code after scrolling through a lot of content can be time-consuming.

Adding a keyboard shortcut button to scroll to the top of the code would be much more convenient. Refer to the implementation on the GitHub page.

📚 Description

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
npmx.dev	Ready	Preview, Comment	Feb 27, 2026 9:09am

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
docs.npmx.dev	Ignored	Preview	Feb 27, 2026 9:09am
npmx-lunaria	Ignored		Feb 27, 2026 9:09am

[github-actions]

Lunaria Status Overview

🌕 This pull request will trigger status changes.

Learn more

By default, every PR changing files present in the Lunaria configuration's files property will be considered and trigger status changes accordingly.

You can change this by adding one of the keywords present in the ignoreKeywords property in your Lunaria configuration file in the PR's title (ignoring all files) or by including a tracker directive in the merged commit's description.

Tracked Files

File	Note
lunaria/files/en-GB.json	Localization changed, will be marked as complete.
lunaria/files/en-US.json	Source changed, localizations will be marked as outdated.
lunaria/files/zh-CN.json	Localization changed, will be marked as complete.

Warnings reference

Icon	Description
🔄️	The source for this localization has been updated since the creation of this pull request, make sure all changes in the source have been applied.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between edea541 and 3dcf047.

📒 Files selected for processing (1)

• app/pages/package-code/[[org]]/[packageName]/v/[version]/[...filePath].vue

🚧 Files skipped from review as they are similar to previous changes (1)

• app/pages/package-code/[[org]]/[packageName]/v/[version]/[...filePath].vue

---

📝 Walkthrough

Walkthrough

Adds a scroll-to-top feature to the package code viewer page: a scrollToTop function and a contentContainer template ref are introduced and the main file content container is bound to that ref. Two scroll-to-top buttons (toolbar and header) were added to trigger the function. i18n schema was extended with scroll_to_top and corresponding English and Chinese translation entries were added/updated across locale files.

Suggested reviewers

• danielroe

🚥 Pre-merge checks | ✅ 1

✅ Passed checks (1 passed)

Check name	Status	Explanation
Description check	✅ Passed	The pull request description clearly relates to the changeset: it explains the motivation for adding a scroll-to-top button to the code preview page and references the implementation approach. The description addresses the problem being solved.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

---

ℹ️ Review info

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 4ed4254 and d64a7fd.

📒 Files selected for processing (7)

• app/pages/package-code/[[org]]/[packageName]/v/[version]/[...filePath].vue
• i18n/locales/en.json
• i18n/locales/zh-CN.json
• i18n/schema.json
• lunaria/files/en-GB.json
• lunaria/files/en-US.json
• lunaria/files/zh-CN.json

[RYGRIT]

Hi @btea , I think we no longer need to implement the scrollToTop function. There is already a usable composable function available in the project for you to use, see app/composables/useScrollToTop.ts.

[btea]

Thank you for reviewing. However, that function is for window page scrolling, which is not suitable for this scenario.

[RYGRIT]

Sorry, I overlooked that detail. Confirmed it's meant for window scrolling/touch devices and doesn't fit here. My mistake!