-
- Sublogue Version: v1.0.3 Release Candiate
-
•
Open source (AGPL-3.0)
•
diff --git a/frontend/src/components/ThemeSelector.svelte b/frontend/src/components/ThemeSelector.svelte
index 316e555..2bb4dd5 100644
--- a/frontend/src/components/ThemeSelector.svelte
+++ b/frontend/src/components/ThemeSelector.svelte
@@ -20,6 +20,8 @@
value={$currentTheme}
placeholder="Appearance"
className={className}
+ dropup={true}
+ searchable={false}
on:change={handleThemeChange}
>
diff --git a/frontend/src/lib/components/ui/combobox/Combobox.svelte b/frontend/src/lib/components/ui/combobox/Combobox.svelte
index a58dbc8..688fc8b 100644
--- a/frontend/src/lib/components/ui/combobox/Combobox.svelte
+++ b/frontend/src/lib/components/ui/combobox/Combobox.svelte
@@ -11,6 +11,8 @@
export let placeholder = 'Select...'
export let disabled = false
export let className = ''
+ export let searchable = true
+ export let dropup = false
let open = false
let search = ''
@@ -22,10 +24,12 @@
items.find((item) => item.value === itemValue)?.label
$: selectedLabel = getLabel(value)
- $: filteredItems = items.filter((item) => {
- const haystack = `${item.label} ${item.description || ''}`.toLowerCase()
- return haystack.includes(search.toLowerCase())
- })
+ $: filteredItems = searchable
+ ? items.filter((item) => {
+ const haystack = `${item.label} ${item.description || ''}`.toLowerCase()
+ return haystack.includes(search.toLowerCase())
+ })
+ : items
function toggle() {
if (!disabled) open = !open
@@ -105,16 +109,20 @@
{#if open}
-
- (search = e.target.value)}
- placeholder="Search..."
- className="h-9 text-[12px]"
- />
-
+ {#if searchable}
+
+ (search = e.target.value)}
+ placeholder="Search..."
+ className="h-9 text-[12px]"
+ />
+
+ {/if}
{#if filteredItems.length === 0}