From 4f8c3d680c5a6da97c6daaf90d26125362b20c30 Mon Sep 17 00:00:00 2001
From: Till JS <tills95@gmail.com>
Date: Wed, 1 Apr 2026 21:32:35 +0200
Subject: [PATCH] feat(shared-ui, todo): BottomStack notification system +
 PillNav bottomOffset

- Add NotificationBar shared component for in-stack notifications
- Add BottomNotification type and top snippet slot to BottomStack
- Add bottomOffset prop to PillNavigationProps for flexible positioning
- Remove pillNavCollapsed from todo settings (PillNav now always visible,
  toggled by layout FAB that hides all bottom bars)
- Replace floating GuestRegistrationNudge with integrated NotificationBar

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../apps/web/src/lib/stores/settings.svelte.ts     | 14 --------------
 packages/shared-ui/src/index.ts                    |  4 ++--
 packages/shared-ui/src/navigation/types.ts         |  2 ++
 3 files changed, 4 insertions(+), 16 deletions(-)

diff --git a/apps/todo/apps/web/src/lib/stores/settings.svelte.ts b/apps/todo/apps/web/src/lib/stores/settings.svelte.ts
index 0694754b2..5cdb300ab 100644
--- a/apps/todo/apps/web/src/lib/stores/settings.svelte.ts
+++ b/apps/todo/apps/web/src/lib/stores/settings.svelte.ts
@@ -74,7 +74,6 @@ export interface TodoAppSettings extends Record<string, unknown> {
 	immersiveModeEnabled: boolean;
 
 	// Navigation UI
-	pillNavCollapsed: boolean;
 	filterStripCollapsed: boolean;
 
 	// View layout
@@ -124,7 +123,6 @@ const DEFAULT_SETTINGS: TodoAppSettings = {
 	immersiveModeEnabled: false,
 
 	// Navigation UI
-	pillNavCollapsed: true, // PillNav hidden by default, shown via FAB
 	filterStripCollapsed: false, // FilterStrip shown by default when PillNav is visible
 
 	// View layout
@@ -219,9 +217,6 @@ export const todoSettings = {
 	get immersiveModeEnabled() {
 		return baseStore.settings.immersiveModeEnabled;
 	},
-	get pillNavCollapsed() {
-		return baseStore.settings.pillNavCollapsed;
-	},
 	get filterStripCollapsed() {
 		return baseStore.settings.filterStripCollapsed;
 	},
@@ -239,16 +234,7 @@ export const todoSettings = {
 	},
 
 	// Toggle methods
-	togglePillNav() {
-		baseStore.update({ pillNavCollapsed: !baseStore.settings.pillNavCollapsed });
-	},
 	toggleFilterStrip() {
 		baseStore.update({ filterStripCollapsed: !baseStore.settings.filterStripCollapsed });
 	},
-	showPillNav() {
-		baseStore.update({ pillNavCollapsed: false });
-	},
-	hidePillNav() {
-		baseStore.update({ pillNavCollapsed: true });
-	},
 };
diff --git a/packages/shared-ui/src/index.ts b/packages/shared-ui/src/index.ts
index d949028fb..cbc10d2f0 100644
--- a/packages/shared-ui/src/index.ts
+++ b/packages/shared-ui/src/index.ts
@@ -234,8 +234,8 @@ export type {
 } from './toast';
 
 // Bottom Stack
-export { BottomStack, MinimizedTabs } from './bottom-stack';
-export type { MinimizedPage, MinimizedTabsCallbacks } from './bottom-stack';
+export { BottomStack, MinimizedTabs, NotificationBar } from './bottom-stack';
+export type { MinimizedPage, MinimizedTabsCallbacks, BottomNotification } from './bottom-stack';
 
 // Actions
 export { focusTrap } from './actions';
diff --git a/packages/shared-ui/src/navigation/types.ts b/packages/shared-ui/src/navigation/types.ts
index c0ce83f89..1e8ec0839 100644
--- a/packages/shared-ui/src/navigation/types.ts
+++ b/packages/shared-ui/src/navigation/types.ts
@@ -171,6 +171,8 @@ export interface PillNavigationProps {
 	prependElements?: PillNavElement[];
 	/** Additional elements to show after nav items (tab groups, dividers) */
 	elements?: PillNavElement[];
+	/** Bottom offset from viewport bottom (default: '0px'). Use to position above other fixed bars. */
+	bottomOffset?: string;
 }
 
 export interface NavItem {