mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-05-02 20:22:08 +00:00
feat(WidgetSelectDropdown): support mapped display names (#6602)
## Summary Add the ability for `WidgetSelectDropdown` to leverage `getOptionLabel` for custom display labels. ## Review Focus Will note inline. ## Screenshots https://github.com/user-attachments/assets/0167cc12-e23d-4b6d-8f7f-74fd97a18397 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6602-feat-WidgetSelectDropdown-support-mapped-display-names-2a26d73d365081709c56c846e3455339) by [Unito](https://www.unito.io)
This commit is contained in:
@@ -77,7 +77,7 @@ const theButtonStyle = computed(() =>
|
||||
{{ props.placeholder }}
|
||||
</span>
|
||||
<span v-else class="line-clamp-1 min-w-0 break-all">
|
||||
{{ selectedItems.map((item) => (item as any)?.name).join(', ') }}
|
||||
{{ selectedItems.map((item) => item.label ?? item.name).join(', ') }}
|
||||
</span>
|
||||
</span>
|
||||
<i class="icon-[lucide--chevron-down]" :class="chevronClass" />
|
||||
|
||||
@@ -86,6 +86,7 @@ const searchQuery = defineModel<string>('searchQuery')
|
||||
:selected="isSelected(item, index)"
|
||||
:media-src="item.mediaSrc"
|
||||
:name="item.name"
|
||||
:label="item.label"
|
||||
:metadata="item.metadata"
|
||||
:layout="layoutMode"
|
||||
@click="emit('item-click', item, index)"
|
||||
|
||||
@@ -12,6 +12,7 @@ interface Props {
|
||||
selected: boolean
|
||||
mediaSrc: string
|
||||
name: string
|
||||
label?: string
|
||||
metadata?: string
|
||||
layout?: LayoutMode
|
||||
}
|
||||
@@ -139,7 +140,7 @@ function handleVideoLoad(event: Event) {
|
||||
)
|
||||
"
|
||||
>
|
||||
{{ name }}
|
||||
{{ label ?? name }}
|
||||
</span>
|
||||
<!-- Meta Data -->
|
||||
<span class="block text-xs text-slate-400">{{
|
||||
|
||||
@@ -9,6 +9,7 @@ export interface DropdownItem {
|
||||
id: SelectedKey
|
||||
mediaSrc: string // URL for image, video, or other media
|
||||
name: string
|
||||
label?: string
|
||||
metadata: string
|
||||
}
|
||||
export interface SortOption {
|
||||
|
||||
Reference in New Issue
Block a user