Skip to content

feat(mcp-server-picker): add header-actions slot for custom actions - #274

Merged
hexqi merged 1 commit into
opentiny:developfrom
SonyLeo:feat/add-header-slot
Dec 30, 2025
Merged

feat(mcp-server-picker): add header-actions slot for custom actions#274
hexqi merged 1 commit into
opentiny:developfrom
SonyLeo:feat/add-header-slot

Conversation

@SonyLeo

@SonyLeo SonyLeo commented Dec 26, 2025

Copy link
Copy Markdown
Collaborator

McpServerPicker 增加头部操作插槽

Slots

插槽名称 描述 默认内容
header-actions 头部右侧操作区插槽

Summary by CodeRabbit

  • New Features

    • Added header-actions slot to mcp-server-picker component, enabling custom actions in the header.
  • Documentation

    • Updated component documentation with details about the new slot and its usage.

✏️ Tip: You can customize this high-level summary in your review settings.

@coderabbitai

coderabbitai Bot commented Dec 26, 2025

Copy link
Copy Markdown

Walkthrough

A new header-actions named slot is added to the mcp-server-picker component, enabling consumers to inject custom actions into the component's header area, alongside corresponding documentation describing the slot's purpose and default content.

Changes

Cohort / File(s) Summary
MCP Server Picker - Header Actions Slot
packages/components/src/mcp-server-picker/index.vue, docs/src/components/mcp-server-picker.md
Added new named slot header-actions to component header, enabling custom action injection. Documentation updated with new Slots subsection describing slot behavior and default content.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Poem

🐰 A header now listens for custom delight,
With actions to inject, the moment feels right,
A slot opens wide like a hoppy embrace,
For consumers to dance and find their own space!

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately and specifically describes the main change: adding a new header-actions slot to the mcp-server-picker component for custom actions.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
✨ 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

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

@coderabbitai coderabbitai Bot 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.

Actionable comments posted: 0

🧹 Nitpick comments (1)
docs/src/components/mcp-server-picker.md (1)

83-89: Documentation looks good!

The Slots section is well-structured and correctly documents the header-actions slot. The placement between Props and Events sections follows standard documentation conventions.

Optionally, consider adding a usage example to help developers understand how to use the slot:

Optional: Add usage example

After line 89, you could add a usage example section:

### 使用示例

```vue
<McpServerPicker v-model:visible="visible">
  <template #header-actions>
    <button class="custom-action-btn" @click="handleCustomAction">
      自定义操作
    </button>
  </template>
</McpServerPicker>

</details>

</blockquote></details>

</blockquote></details>

<details>
<summary>📜 Review details</summary>

**Configuration used**: Repository UI

**Review profile**: CHILL

**Plan**: Pro

<details>
<summary>📥 Commits</summary>

Reviewing files that changed from the base of the PR and between 77aa8b563271dfb5ade0663ca869fe79340b960c and 994aaf3b00d176a1ce47e9a26ed4fce8f8952969.

</details>

<details>
<summary>📒 Files selected for processing (2)</summary>

* `docs/src/components/mcp-server-picker.md`
* `packages/components/src/mcp-server-picker/index.vue`

</details>

<details>
<summary>⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)</summary>

* GitHub Check: build / build

</details>

<details>
<summary>🔇 Additional comments (1)</summary><blockquote>

<details>
<summary>packages/components/src/mcp-server-picker/index.vue (1)</summary><blockquote>

`306-306`: **LGTM! Clean slot implementation.**

The `header-actions` slot is correctly positioned in the header right area, allowing consumers to inject custom actions before the custom add button and close icon. The flexbox gap styling will properly space any slotted content.

</blockquote></details>

</blockquote></details>

</details>

<!-- This is an auto-generated comment by CodeRabbit for review status -->

@github-actions

github-actions Bot commented Dec 26, 2025

Copy link
Copy Markdown
Contributor

✅ Preview build completed successfully!

Click the image above to preview.
Preview will be automatically removed when this PR is closed.

@github-actions

Copy link
Copy Markdown
Contributor

@hexqi
hexqi merged commit c2f3755 into opentiny:develop Dec 30, 2025
4 checks passed
@github-actions

Copy link
Copy Markdown
Contributor

🧹 Preview Cleaned Up

The preview deployment has been removed.

gene9831 pushed a commit to gene9831/tiny-robot that referenced this pull request Dec 30, 2025
gene9831 pushed a commit to gene9831/tiny-robot that referenced this pull request Dec 30, 2025
gene9831 pushed a commit to gene9831/tiny-robot that referenced this pull request Dec 30, 2025
gene9831 pushed a commit to gene9831/tiny-robot that referenced this pull request Dec 30, 2025
@SonyLeo
SonyLeo deleted the feat/add-header-slot branch January 4, 2026 06:13
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.

2 participants