From bc0db4d87ee9ac2a2765e88aea5cdb28b88fd81b Mon Sep 17 00:00:00 2001
From: Till-JS <101404291+Till-JS@users.noreply.github.com>
Date: Sun, 14 Dec 2025 21:32:03 +0100
Subject: [PATCH] feat(shared-ui): add FilterDropdown export and InputBar FAB
 support
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Export FilterDropdown and FilterDropdownOption from molecules
- Add hasFabLeft prop to InputBar for left-side FAB spacing
- Minor ThemePage formatting fix

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 packages/shared-theme-ui/src/pages/ThemePage.svelte | 7 ++++++-
 packages/shared-ui/src/index.ts                     | 4 ++--
 packages/shared-ui/src/quick-input/InputBar.svelte  | 7 +++++++
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/packages/shared-theme-ui/src/pages/ThemePage.svelte b/packages/shared-theme-ui/src/pages/ThemePage.svelte
index b9993f060..1c30b5413 100644
--- a/packages/shared-theme-ui/src/pages/ThemePage.svelte
+++ b/packages/shared-theme-ui/src/pages/ThemePage.svelte
@@ -1,5 +1,10 @@
 <script lang="ts">
-	import type { ThemeVariant, ThemeMode, A11yStore } from '@manacore/shared-theme';
+	import type {
+		ThemeVariant,
+		ThemeMode,
+		A11yStore,
+		UserSettingsStore,
+	} from '@manacore/shared-theme';
 	import { ArrowLeft, Sun, Moon, Desktop } from '@manacore/shared-icons';
 	import type { ThemeCardData, ThemePageTranslations, A11yTranslations } from '../types';
 	import { defaultTranslations, defaultA11yTranslations } from '../types';
diff --git a/packages/shared-ui/src/index.ts b/packages/shared-ui/src/index.ts
index 0d6674a79..b0bbce572 100644
--- a/packages/shared-ui/src/index.ts
+++ b/packages/shared-ui/src/index.ts
@@ -2,8 +2,8 @@
 export { Text, Button, Badge, Card } from './atoms';
 
 // Molecules
-export { Toggle, Input, Select, Textarea, Checkbox } from './molecules';
-export type { SelectOption } from './molecules';
+export { Toggle, Input, Select, Textarea, Checkbox, FilterDropdown } from './molecules';
+export type { SelectOption, FilterDropdownOption } from './molecules';
 
 // Stats
 export { GlassCard, StatRow } from './molecules';
diff --git a/packages/shared-ui/src/quick-input/InputBar.svelte b/packages/shared-ui/src/quick-input/InputBar.svelte
index 0dbbc52a4..2cef1997f 100644
--- a/packages/shared-ui/src/quick-input/InputBar.svelte
+++ b/packages/shared-ui/src/quick-input/InputBar.svelte
@@ -60,6 +60,8 @@
 		bottomOffset?: string;
 		/** Whether to leave space for a FAB button on the right side on mobile (default: false) */
 		hasFabRight?: boolean;
+		/** Whether to leave space for a FAB button on the left side on mobile (default: false) */
+		hasFabLeft?: boolean;
 	}
 
 	let {
@@ -76,6 +78,7 @@
 		autoFocus = true,
 		bottomOffset = '70px',
 		hasFabRight = false,
+		hasFabLeft = false,
 	}: Props = $props();
 
 	let searchQuery = $state('');
@@ -246,6 +249,7 @@
 <div
 	class="quick-input-bar"
 	class:has-fab-right={hasFabRight}
+	class:has-fab-left={hasFabLeft}
 	style="--bottom-offset: {bottomOffset}"
 >
 	<!-- Results Panel (above input) -->
@@ -435,6 +439,9 @@
 		.quick-input-bar.has-fab-right {
 			padding-right: calc(54px + 1rem + 0.75rem); /* FAB width + FAB right margin + gap */
 		}
+		.quick-input-bar.has-fab-left {
+			padding-left: calc(54px + 1rem + 0.75rem); /* FAB width + FAB left margin + gap */
+		}
 	}
 
 	.input-container,