mirror of
https://github.com/windmill-labs/windmill.git
synced 2026-09-11 00:06:06 +00:00
* rename all multiselects to Legacy * move Select * Separate SelectDropdown * fix click outside for select with portal * multiselect v0 * multiselect clear btn * move filterText logic to SelectDropdown * ui nits * console.log * draggable * Draggable multiselect * multiselect search * nit refacto * autofocus multiselect input * Replace in AppMultiSelectV2 * search icon * app multi select nits * arginput update multiselect * fix autofocus scrolling up * replace High priority tags multiselect * autoscaling config editor multiselect replace * fix clear btn not in border * replace multiselect in cron input * replace multiselect in savedinputs * replace EventHandlerItem multiselect * select dropdown shadow * more multiselect migration * hover opacity on drag * TokensTable UI fixes + replace multiselect * ai settings replace multiselect * DefaultTags Multiselect replace * prevent multiselect from opening on drag * nit * app multiselect css + simplify * console log * safeSelectItems cleanup * Remove svelte-multiselect * clip when wrap not allowed * hide duplicate app components * CSS works better with multiselect in app editor * allowOverflow * allowClear * fix custom createText messed up with search
52 lines
1.2 KiB
Svelte
52 lines
1.2 KiB
Svelte
<script lang="ts">
|
|
import Select from './select/Select.svelte'
|
|
|
|
interface ChannelItem {
|
|
channel_id?: string
|
|
channel_name?: string
|
|
}
|
|
|
|
interface Props {
|
|
disabled?: boolean
|
|
placeholder?: string
|
|
selectedChannel?: ChannelItem | undefined
|
|
containerClass?: string
|
|
minWidth?: string
|
|
channels?: ChannelItem[]
|
|
}
|
|
|
|
let {
|
|
disabled = false,
|
|
placeholder = 'Select channel',
|
|
selectedChannel = $bindable(undefined),
|
|
containerClass = 'w-64',
|
|
minWidth = '160px',
|
|
channels = []
|
|
}: Props = $props()
|
|
</script>
|
|
|
|
<div class={containerClass}>
|
|
<div class="flex items-center gap-2">
|
|
<div class="flex-grow" style="min-width: {minWidth};">
|
|
<Select
|
|
containerStyle={'min-width: ' + minWidth}
|
|
items={channels.map((channel) => ({
|
|
label: channel.channel_name ?? 'Unknown Channel',
|
|
value: channel.channel_id ?? ''
|
|
}))}
|
|
{placeholder}
|
|
bind:value={
|
|
() => selectedChannel?.channel_id,
|
|
(value) => (selectedChannel = channels.find((channel) => channel.channel_id === value))
|
|
}
|
|
clearable
|
|
disabled={disabled || channels.length === 0}
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
{#if channels.length === 0 && !disabled}
|
|
<div class="text-xs text-tertiary mt-1">No channels available</div>
|
|
{/if}
|
|
</div>
|