diff --git a/src/lib/components/sidebar/SearchContent.svelte b/src/lib/components/sidebar/SearchContent.svelte index fa88ec55..4467fa5f 100644 --- a/src/lib/components/sidebar/SearchContent.svelte +++ b/src/lib/components/sidebar/SearchContent.svelte @@ -363,6 +363,7 @@ multiple={true} includeAny={true} contained={true} + showClear={true} /> diff --git a/src/lib/components/ui/element-picker/ElementPicker.svelte b/src/lib/components/ui/element-picker/ElementPicker.svelte index 1a5be14e..53bb2ca0 100644 --- a/src/lib/components/ui/element-picker/ElementPicker.svelte +++ b/src/lib/components/ui/element-picker/ElementPicker.svelte @@ -17,6 +17,7 @@ mode?: 'auto' | 'segmented' | 'dropdown' contained?: boolean size?: 'small' | 'medium' | 'large' + showClear?: boolean disabled?: boolean class?: string } @@ -29,10 +30,14 @@ mode = 'auto', contained = false, size = 'medium', + showClear = false, disabled = false, class: className = '' }: Props = $props() + // Map size to segmented control size (small stays small, medium/large become regular) + const segmentedSize = $derived(size === 'small' ? 'small' : 'regular') + // Responsive detection for auto mode let isMobile = $state(false) @@ -115,6 +120,8 @@ {multiple} {includeAny} {contained} + {showClear} + size={segmentedSize} disabled={disabled} class={className} />