feat(cascader): add popupHeader and popupFooter slot#6297
feat(cascader): add popupHeader and popupFooter slot#6297
popupHeader and popupFooter slot#6297Conversation
RSS1102
requested review from
Cat1007,
PengYYYYY,
Wesley-0808,
chaishi,
liweijie0812,
uyarn,
zhangpaopao0609 and
zydemail
as code owners
TDesign Component Site Preview Open
|
commit: |
RSS1102
force-pushed
the
rss1102/feat/cascader/panel-header
branch
2 times, most recently
from
1420255 to
096acca
Compare
RSS1102
force-pushed
the
rss1102/feat/cascader/panel-header
branch
from
096acca to
2e85fa6
Compare
There was a problem hiding this comment.
Pull request overview
This PR adds panelHeader and panelFooter slot support to the Cascader component, enabling per-panel filtering/search functionality with both basic and cascade modes. Basic mode filters each panel independently, while cascade mode hides subsequent panels when searching and only shows children of matched items.
Changes:
- Added
panelHeaderandpanelFooterTNode type definitions with onFilter callback support - Implemented panel-level filtering state management with cascade mode support
- Modified Panel component to render header/footer slots and handle filtering logic
- Replaced base example to demonstrate the new filtering functionality
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 13 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/components/cascader/type.ts | Added TypeScript type definitions for panelHeader and panelFooter slots with onFilter callback supporting both string and function filters |
| packages/components/cascader/props.ts | Added prop definitions for panelHeader and panelFooter |
| packages/components/cascader/components/Panel.tsx | Implemented filtering logic, state management, and slot rendering for panel headers/footers |
| packages/components/cascader/cascader.tsx | Passed panelHeader and panelFooter slots to Panel component |
| packages/components/cascader/_example/base.vue | Replaced original base example with comprehensive filtering demonstrations |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 5 out of 5 changed files in this pull request and generated 6 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 8 out of 8 changed files in this pull request and generated 18 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| onFilter: ( | ||
| filter: string | ((node: CascaderOption, panelIndex: number) => boolean), | ||
| options?: { cascade?: boolean }, | ||
| ) => void; |
There was a problem hiding this comment.
The type definition references TreeOptionData in the onFilter callback parameters but the import shows TreeOptionData comes from @tdesign/common-js/common. However, in the type definition (line 145, 165), the parameter is documented as filtering nodes, but CascaderOption which extends TreeOptionData is what's actually used throughout the cascader. This could cause type confusion. Consider using CascaderOption explicitly or clarifying that it's the same as TreeOptionData.
RSS1102
changed the title
panelHeader and panelFooter slotpopupHeader and popupFooter slot
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 8 out of 8 changed files in this pull request and generated 4 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
API 命名还是不太好 popupXX 不太能表达这个位置的感觉 甚至比panelTopContent/BottomContent更外层的感觉 |
🤔 这个 PR 的性质是？
🔗 相关 Issue
💡 需求背景和解决方案
Cascader Panel 搜索功能
基础搜索
每级面板独立过滤，互不影响。
级联搜索
约束：展开方式由
trigger（click/hover）决定，不可展开非匹配节点的子级。📝 更新日志
tdesign-vue-next
@tdesign-vue-next/chat
@tdesign-vue-next/auto-import-resolver
☑️ 请求合并前的自查清单