[Feature Branch]feat: Add new Ranger

[linhf123]

📦 Modified package

• [ ] @oceanbase/design
• [x] @oceanbase/ui
• [ ] @oceanbase/icons
• [ ] @oceanbase/charts
• [ ] @oceanbase/util
• [ ] @oceanbase/codemod
• [ ] Other (about what?)

🤔 This is a ...

• [x] New feature
• [ ] Bug fix
• [ ] Site / documentation update
• [ ] Demo update
• [ ] Component style update
• [ ] TypeScript definition update
• [ ] Bundle size optimization
• [ ] Performance optimization
• [ ] Enhancement feature
• [ ] Internationalization
• [ ] Refactoring
• [ ] Code style optimization
• [ ] Test Case
• [ ] Branch merge
• [ ] Workflow
• [ ] Other (about what?)

🔗 Related issue link

💡 Background and solution

📝 Changelog

Language	Changelog
🇺🇸 English
🇨🇳 Chinese

☑️ Self-Check before Merge

⚠️ Please check all items below before requesting a reviewing. ⚠️

• [ ] Doc is updated/provided or not needed
• [ ] Demo is updated/provided or not needed
• [ ] TypeScript definition is updated/provided or not needed
• [ ] Tests is updated/provided or not needed
• [ ] Changelog is provided or not needed

[CLAassistant]

Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you all sign our Contributor License Agreement before we can accept your contribution.
1 out of 2 committers have signed the CLA.

:white_check_mark: linhf123
:x: linhf

---

linhf seems not to be a GitHub user. You need a GitHub account to be able to sign the CLA. If you have already a GitHub account, please add the email address used for this commit to your account.
_{You have signed the CLA already but the status is still pending? Let us recheck it.}

[github-actions[bot]]

[dengfuping]

TS 错误导致 CI 失败，需要修复下:

[linhf123]

文档截图