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:
Arjan Singh
2025-11-05 13:12:59 -08:00
committed by GitHub
parent 3c11226fdd
commit 35d53c2c75
7 changed files with 199 additions and 2 deletions

View File

@@ -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" />

View File

@@ -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)"

View File

@@ -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">{{

View File

@@ -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 {