@flickfyi/flkr 0.0.141 → 0.0.153

package/node_modules/@flickfyi/core/tests/kowalski-features.test.tsx

@@ -0,0 +1,2158 @@
+// @vitest-environment happy-dom
+import {
+	BillSplit,
+	Bookmark,
+	Budget,
+	Calculator,
+	Checklist,
+	ColorPalette,
+	Contact,
+	Countdown,
+	Event,
+	Expense,
+	Goal,
+	Habit,
+	Ledger,
+	Note,
+	Poll,
+	RandomPicker,
+	Rating,
+	Recipe,
+	Reminder,
+	Rotation,
+	Scoreboard,
+	ShoppingList,
+	TaskBoard,
+	Timer,
+	TimeZone,
+	Trip,
+	UnitConverter,
+} from '@flickfyi/core/kowalski'
+import { act, cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react'
+import * as React from 'react'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+import { kowalskiCatalog } from '~/kowalski/catalog'
+
+vi.mock('@flickfyi/photon', async () => {
+	const { Children, createElement, isValidElement } = await import('react')
+	function Host({ children }: React.PropsWithChildren) {
+		return createElement('div', {}, children)
+	}
+	return {
+		Button: ({
+			accessibilityLabel,
+			children,
+			disabled,
+			href,
+			onClick,
+		}: React.PropsWithChildren<{
+			accessibilityLabel?: string
+			disabled?: boolean
+			href?: string
+			onClick?: () => void
+		}>) =>
+			createElement(
+				href === undefined ? 'button' : 'a',
+				{ 'aria-label': accessibilityLabel, disabled, href, onClick },
+				children
+			),
+		Flex: Host,
+		Icon: ({ name }: { name: string }) => createElement('span', { 'data-icon': name }),
+		Input: ({
+			multiline,
+			value,
+			onChange,
+			placeholder,
+		}: {
+			value: string
+			multiline?: boolean
+			onChange: (text: string) => void
+			placeholder?: string
+		}) =>
+			createElement(multiline ? 'textarea' : 'input', {
+				onChange: (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) =>
+					onChange(event.target.value),
+				placeholder,
+				value,
+			}),
+		Picker: ({
+			children,
+			label,
+			onChange,
+			value,
+		}: React.PropsWithChildren<{
+			label?: string
+			onChange: (value: string) => void
+			value: string
+		}>) =>
+			createElement(
+				'select',
+				{
+					'aria-label': label,
+					onChange: (event: React.ChangeEvent<HTMLSelectElement>) =>
+						onChange(event.target.value),
+					value,
+				},
+				Children.map(children, child =>
+					isValidElement<React.PropsWithChildren<{ value: string }>>(child)
+						? createElement('option', { value: child.props.value }, child.props.children)
+						: null
+				)
+			),
+		Text: Host,
+	}
+})
+
+const stores = new Map<string, ReturnType<typeof nativeStore>>()
+beforeEach(() => {
+	vi.stubGlobal('_CRAYONCORE_$REACT', React)
+	vi.stubGlobal('Quantum', {
+		async openStore({
+			name,
+			initialState,
+			scope,
+		}: {
+			name: string
+			initialState: object
+			scope: string
+		}) {
+			const key = `${scope}:${name}`
+			if (!stores.has(key)) {
+				stores.set(key, nativeStore(initialState))
+			}
+			return stores.get(key)?.store
+		},
+	})
+})
+afterEach(() => {
+	cleanup()
+	stores.clear()
+	vi.unstubAllGlobals()
+	vi.useRealTimers()
+})
+
+describe('Kowalski authored features', () => {
+	it.each(['invalid', 'rejected'])(
+		'replaces a %s people draft when the user explicitly steps the count',
+		async kind => {
+			const native = nativeStore(
+				kowalskiCatalog.billSplit.storeSchema.parse({ people: 3, total: 20 })
+			)
+			const setAsync = vi
+				.fn()
+				.mockImplementation(native.store.setAsync.bind(native.store))
+			if (kind === 'rejected') {
+				setAsync.mockRejectedValueOnce(new Error('Rejected'))
+			}
+			vi.stubGlobal('Quantum', { openStore: async () => ({ ...native.store, setAsync }) })
+			render(<BillSplit total={20} people={3} />)
+			await waitFor(() =>
+				expect(
+					screen
+						.getByRole('button', { exact: true, name: 'More people' })
+						.hasAttribute('disabled')
+				).toBe(false)
+			)
+			fireEvent.change(screen.getByPlaceholderText('People'), {
+				target: { value: kind === 'invalid' ? '-' : '7' },
+			})
+			if (kind === 'rejected') {
+				await waitFor(() =>
+					expect(
+						screen.getByText('Could not save this change. Please try again.')
+					).toBeTruthy()
+				)
+			}
+			fireEvent.click(screen.getByRole('button', { exact: true, name: 'More people' }))
+			await waitFor(() => expect(native.value().people).toBe(4))
+			expect(screen.getByPlaceholderText<HTMLInputElement>('People').value).toBe('4')
+		}
+	)
+	it.each(['Bill total', 'People', 'Tip percent', 'Value'])(
+		'retains the latest repeated %s draft after an old acknowledgement and final rejection',
+		async label => {
+			const native = nativeStore(
+				label === 'Value'
+					? kowalskiCatalog.unitConverter.storeSchema.parse({
+							from: { value: 'm' },
+							to: { value: 'km' },
+							value: 3,
+						})
+					: kowalskiCatalog.billSplit.storeSchema.parse({
+							people: 3,
+							tipPercent: 0,
+							total: 20,
+						})
+			)
+			const writes: {
+				patch: object
+				pending: ReturnType<
+					typeof Promise.withResolvers<{ rawValue: unknown; version: number }>
+				>
+			}[] = []
+			vi.stubGlobal('Quantum', {
+				openStore: async () => ({
+					...native.store,
+					setAsync(patch: object) {
+						const pending = Promise.withResolvers<{
+							rawValue: unknown
+							version: number
+						}>()
+						writes.push({ patch, pending })
+						return pending.promise
+					},
+				}),
+			})
+			render(
+				label === 'Value'
+					? React.createElement(UnitConverter, { from: 'm', to: 'km', value: 3 })
+					: React.createElement(BillSplit, { people: 3, total: 20 })
+			)
+			if (label !== 'Value') {
+				await waitFor(() =>
+					expect(screen.getByText('Custom').closest('button')?.disabled).toBe(false)
+				)
+				if (label === 'Tip percent') {
+					fireEvent.click(screen.getByText('Custom'))
+				}
+			}
+			await waitFor(() => expect(screen.getByPlaceholderText(label)).toBeTruthy())
+			for (const value of ['1', '12', '1']) {
+				fireEvent.change(screen.getByPlaceholderText(label), { target: { value } })
+			}
+			expect(writes.length).toBe(3)
+			for (const write of writes.slice(0, 2)) {
+				await act(async () => {
+					native.store.set(write.patch)
+					write.pending.resolve({ rawValue: native.value(), version: 0 })
+				})
+			}
+			await act(async () => writes[2].pending.reject(new Error('Rejected latest write')))
+			expect(screen.getByPlaceholderText<HTMLInputElement>(label).value).toBe('1')
+		}
+	)
+
+	it.each([
+		{ expected: 86.75, field: 'total', label: 'Bill total', typed: '$86.750' },
+		{ expected: 7, field: 'people', label: 'People', typed: '7' },
+		{ expected: 12.5, field: 'tipPercent', label: 'Tip percent', typed: '12.50' },
+	])(
+		'retains and retries a rejected $label draft',
+		async ({ label, typed, field, expected }) => {
+			const native = nativeStore(
+				kowalskiCatalog.billSplit.storeSchema.parse({
+					people: 3,
+					tipPercent: 0,
+					total: 20,
+				})
+			)
+			const pending = Promise.withResolvers<{ rawValue: unknown; version: number }>()
+			const setAsync = vi
+				.fn()
+				.mockImplementationOnce(() => pending.promise)
+				.mockImplementation(native.store.setAsync.bind(native.store))
+			vi.stubGlobal('Quantum', { openStore: async () => ({ ...native.store, setAsync }) })
+			render(<BillSplit total={20} people={3} />)
+			await waitFor(() =>
+				expect(screen.getByText('Custom').closest('button')?.disabled).toBe(false)
+			)
+			if (label === 'Tip percent') {
+				fireEvent.click(screen.getByText('Custom'))
+			}
+			fireEvent.change(screen.getByPlaceholderText(label), { target: { value: typed } })
+			await act(async () => {
+				pending.reject(new Error('Rejected'))
+			})
+			expect(screen.getByPlaceholderText<HTMLInputElement>(label).value).toBe(typed)
+			expect(
+				screen.getByText('Could not save this change. Please try again.')
+			).toBeTruthy()
+			fireEvent.click(
+				screen.getByRole('button', { name: `Retry ${label.toLowerCase()}` })
+			)
+			await waitFor(() => expect(native.value()[field]).toBe(expected))
+			expect(screen.getByPlaceholderText<HTMLInputElement>(label).value).toBe(typed)
+			expect(
+				screen.queryByText('Could not save this change. Please try again.')
+			).toBeNull()
+		}
+	)
+	it.each(
+		[
+			{ expected: 86.75, field: 'total', label: 'Bill total', typed: '$86.750' },
+			{ expected: 7, field: 'people', label: 'People', typed: '7' },
+			{ expected: 12.5, field: 'tipPercent', label: 'Tip percent', typed: '12.50' },
+		].flatMap(input => [
+			{ ...input, rejects: false },
+			{ ...input, rejects: true },
+		])
+	)(
+		'preserves newer invalid $label text when an older write settles (rejects=$rejects)',
+		async ({ label, typed, field, expected, rejects }) => {
+			const native = nativeStore(
+				kowalskiCatalog.billSplit.storeSchema.parse({
+					people: 3,
+					tipPercent: 0,
+					total: 20,
+				})
+			)
+			const pending = Promise.withResolvers<{ rawValue: unknown; version: number }>()
+			vi.stubGlobal('Quantum', {
+				openStore: async () => ({ ...native.store, setAsync: () => pending.promise }),
+			})
+			render(<BillSplit total={20} people={3} />)
+			await waitFor(() =>
+				expect(screen.getByText('Custom').closest('button')?.disabled).toBe(false)
+			)
+			if (label === 'Tip percent') {
+				fireEvent.click(screen.getByText('Custom'))
+			}
+			fireEvent.change(screen.getByPlaceholderText(label), { target: { value: typed } })
+			fireEvent.change(screen.getByPlaceholderText(label), { target: { value: '-' } })
+			await act(async () => {
+				if (rejects) {
+					pending.reject(new Error('Rejected'))
+				} else {
+					native.store.set({ [field]: expected })
+					pending.resolve({ rawValue: native.value(), version: 0 })
+				}
+			})
+			expect(screen.getByPlaceholderText<HTMLInputElement>(label).value).toBe('-')
+		}
+	)
+	it('attempts a rejected picker domain reset once and allows a new user pick', async () => {
+		const native = nativeStore(
+			kowalskiCatalog.randomPicker.storeSchema.parse({
+				result: {
+					domain: { mode: 'list', options: ['Old'] },
+					value: 'Old',
+				},
+			})
+		)
+		const setAsync = vi
+			.fn()
+			.mockRejectedValueOnce(new Error('Rejected'))
+			.mockImplementation(native.store.setAsync.bind(native.store))
+		vi.stubGlobal('Quantum', { openStore: async () => ({ ...native.store, setAsync }) })
+		render(<RandomPicker mode="list" options={['New']} />)
+		await waitFor(() =>
+			expect(
+				screen.getByText('Could not save this change. Please try again.')
+			).toBeTruthy()
+		)
+		expect(setAsync).toHaveBeenCalledTimes(1)
+		expect(screen.queryByText('Old')).toBeNull()
+		fireEvent.click(screen.getByRole('button'))
+		await waitFor(() => expect(screen.getByText('New')).toBeTruthy())
+		expect(setAsync).toHaveBeenCalledTimes(2)
+	})
+	it('retains custom tip decimal digits when its numeric value is acknowledged', async () => {
+		render(<BillSplit total={86.5} people={3} />)
+		await waitFor(() =>
+			expect(screen.getByText('Custom').closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.click(screen.getByText('Custom'))
+		fireEvent.change(screen.getByPlaceholderText('Tip percent'), {
+			target: { value: '12.50' },
+		})
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiBillSplit')?.value().tipPercent).toBe(12.5)
+		)
+		expect(screen.getByPlaceholderText<HTMLInputElement>('Tip percent').value).toBe(
+			'12.50'
+		)
+		fireEvent.change(screen.getByPlaceholderText('Tip percent'), {
+			target: { value: '12.36' },
+		})
+		await waitFor(() => expect(screen.getByText('Tip (12.36%)')).toBeTruthy())
+	})
+	it('opens grouped converter values and preserves the typed decimal draft through acknowledgement', async () => {
+		render(<UnitConverter value={1234.5} from="m" to="ft" />)
+		await waitFor(() =>
+			expect(screen.getByPlaceholderText<HTMLInputElement>('Value').value).toBe('1,234.5')
+		)
+		fireEvent.change(screen.getByPlaceholderText('Value'), {
+			target: { value: '1,234.00' },
+		})
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiUnitConverter')?.value().value).toBe(1234)
+		)
+		expect(screen.getByPlaceholderText<HTMLInputElement>('Value').value).toBe('1,234.00')
+	})
+	it.each(['BillSplit', 'Expense'])(
+		'parses formatted currency in $name and rejects malformed numeric input',
+		async name => {
+			const bill = name === 'BillSplit'
+			render(
+				bill ? <BillSplit total={10} people={2} /> : <Expense title="Lunch" amount={10} />
+			)
+			const field = bill ? 'Bill total' : 'Amount'
+			if (!bill) {
+				await waitFor(() =>
+					expect(
+						screen.getByRole('button', { name: 'Edit expense' }).closest('button')
+							?.disabled
+					).toBe(false)
+				)
+				fireEvent.click(screen.getByRole('button', { name: 'Edit expense' }))
+			}
+			await screen.findByPlaceholderText(field)
+			for (const value of [
+				'',
+				'$',
+				'€12.50',
+				'0x10',
+				'1e3',
+				'12.3.4',
+				'1,23.50',
+				'1,,234',
+			]) {
+				fireEvent.change(screen.getByPlaceholderText(field), { target: { value } })
+				if (bill) {
+					expect(screen.getByText('Enter a valid bill total.')).toBeTruthy()
+					expect(stores.get('private:KowalskiBillSplit')?.value().total).toBe(10)
+				} else {
+					expect(screen.getByText('Save changes').closest('button')?.disabled).toBe(true)
+				}
+			}
+			const typed = '\u200E$1,234.50'
+			fireEvent.change(screen.getByPlaceholderText(field), {
+				target: { value: typed },
+			})
+			if (!bill) {
+				fireEvent.click(screen.getByText('Save changes'))
+				await waitFor(() => expect(screen.queryByPlaceholderText(field)).toBeNull())
+			}
+			await waitFor(() =>
+				expect(
+					stores.get(`private:Kowalski${name}`)?.value()[bill ? 'total' : 'amount']
+				).toBe(1234.5)
+			)
+			if (!bill) {
+				fireEvent.click(screen.getByRole('button', { name: 'Edit expense' }))
+			}
+			expect(screen.getByPlaceholderText<HTMLInputElement>(field).value).toBe(
+				bill ? typed : '$1,234.50'
+			)
+		}
+	)
+	it('keeps very small currency amounts readable without rounding to zero', async () => {
+		render(<Expense title="Precise amount" amount={1e-21} />)
+		await waitFor(() =>
+			expect(
+				screen.getByRole('button', { name: 'Edit expense' }).closest('button')?.disabled
+			).toBe(false)
+		)
+		expect(screen.getByText('$0.000000000000000000001')).toBeTruthy()
+		fireEvent.click(screen.getByRole('button', { name: 'Edit expense' }))
+		expect(screen.getByPlaceholderText<HTMLInputElement>('Amount').value).toBe(
+			'$0.000000000000000000001'
+		)
+	})
+	it('opens small converter values as standard decimals', async () => {
+		render(<UnitConverter value={1e-7} from="k" to="k" />)
+		await waitFor(() =>
+			expect(screen.getByPlaceholderText<HTMLTextAreaElement>('Value').value).toBe(
+				'0.0000001'
+			)
+		)
+	})
+	it('keeps newer invalid converter input when an older retry is acknowledged', async () => {
+		const native = nativeStore(
+			kowalskiCatalog.unitConverter.storeSchema.parse({
+				from: { value: 'm' },
+				to: { value: 'km' },
+				value: 1,
+			})
+		)
+		const retry = Promise.withResolvers<{ rawValue: unknown; version: number }>()
+		let submitted: object = {}
+		let attempts = 0
+		vi.stubGlobal('Quantum', {
+			openStore: async () => ({
+				...native.store,
+				async setAsync(patch: object) {
+					if (++attempts === 1) {
+						throw new Error('Rejected')
+					}
+					submitted = patch
+					return retry.promise
+				},
+			}),
+		})
+		render(<UnitConverter value={1} from="m" to="km" />)
+		await waitFor(() =>
+			expect(
+				screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Value')
+			).toBeTruthy()
+		)
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Value'),
+			{ target: { value: '2' } }
+		)
+		await waitFor(() => expect(screen.getByText('Retry saving value')).toBeTruthy())
+		fireEvent.click(screen.getByText('Retry saving value'))
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Value'),
+			{ target: { value: '-' } }
+		)
+		await act(async () => {
+			native.store.set(submitted)
+			retry.resolve({ rawValue: native.value(), version: 0 })
+		})
+		expect(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Value').value
+		).toBe('-')
+		expect(screen.getByText('Enter a valid number.')).toBeTruthy()
+		expect(native.value().value).toBe(2)
+	})
+	it('retains rejected note text across an unrelated successful title save and retries it', async () => {
+		const native = nativeStore(
+			kowalskiCatalog.note.storeSchema.parse({
+				body: { value: 'Old body' },
+				title: { value: 'Old title' },
+			})
+		)
+		let rejectBody = true
+		vi.stubGlobal('Quantum', {
+			openStore: async () => ({
+				...native.store,
+				async setAsync(patch: object) {
+					if ('body' in patch && rejectBody) {
+						rejectBody = false
+						throw new Error('Rejected')
+					}
+					native.store.set(patch)
+					return { rawValue: native.value(), version: 0 }
+				},
+			}),
+		})
+		const component = <Note title="Old title" body="Old body" />
+		const view = render(component)
+		await waitFor(() => expect(screen.getByText('Saved')).toBeTruthy())
+		const body = '  Keep this\nexact text 👩🏽‍💻  '
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(
+				'Start writing…'
+			),
+			{
+				target: { value: body },
+			}
+		)
+		await waitFor(() => expect(screen.getByText('Not saved')).toBeTruthy())
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(
+				'Untitled note'
+			),
+			{
+				target: { value: '  New title  ' },
+			}
+		)
+		await waitFor(() => expect(native.value().title).toEqual({ value: '  New title  ' }))
+		await waitFor(() => expect(screen.getByText('Not saved')).toBeTruthy())
+		expect(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(
+				'Start writing…'
+			).value
+		).toBe(body)
+		fireEvent.click(screen.getByText('Retry save'))
+		await waitFor(() => expect(screen.getByText('Saved')).toBeTruthy())
+		view.unmount()
+		render(component)
+		await waitFor(() =>
+			expect(
+				screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(
+					'Start writing…'
+				).value
+			).toBe(body)
+		)
+	})
+	it('does not clear an invalid note draft when an older write is acknowledged', async () => {
+		const native = nativeStore(kowalskiCatalog.note.storeSchema.parse({}))
+		const ack = Promise.withResolvers<{ rawValue: unknown; version: number }>()
+		let submitted: object = {}
+		vi.stubGlobal('Quantum', {
+			openStore: async () => ({
+				...native.store,
+				setAsync(patch: object) {
+					submitted = patch
+					return ack.promise
+				},
+			}),
+		})
+		render(<Note title="" body="" />)
+		await waitFor(() => expect(screen.getByText('Saved')).toBeTruthy())
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(
+				'Start writing…'
+			),
+			{
+				target: { value: 'Valid' },
+			}
+		)
+		const invalid = 'x'.repeat(20_001)
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(
+				'Start writing…'
+			),
+			{
+				target: { value: invalid },
+			}
+		)
+		await act(async () => {
+			native.store.set(submitted)
+			ack.resolve({ rawValue: native.value(), version: 0 })
+		})
+		expect(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(
+				'Start writing…'
+			).value
+		).toBe(invalid)
+		expect(screen.getByText('Not saved')).toBeTruthy()
+		expect(native.value().body).toEqual({ value: 'Valid' })
+	})
+	it.each([
+		{ body: 'hello world', count: '2 words' },
+		{ body: '123 45', count: '2 words' },
+		{ body: '👩🏽‍💻 !!! —', count: '0 words' },
+		{ body: 'word '.repeat(1000), count: '1,000 words' },
+	])('counts readable note words in $count', async ({ body, count }) => {
+		render(<Note title="Words" body={body} />)
+		await waitFor(() => expect(screen.getByText('Saved')).toBeTruthy())
+		expect(screen.getByText(count)).toBeTruthy()
+	})
+	it.each([
+		{ expected: 0.3, progress: 0.2, step: 0.1 },
+		{ expected: 1e12 + 1, progress: 1e12, step: 1 },
+	])(
+		'increments goal $progress by $step without display arithmetic errors',
+		async ({ progress, step, expected }) => {
+			render(<Goal title="Progress" progress={progress} target={1e12} step={step} />)
+			await waitFor(() =>
+				expect(screen.getByText(`+${step}`).closest('button')?.disabled).toBe(false)
+			)
+			fireEvent.click(screen.getByText(`+${step}`))
+			await waitFor(() =>
+				expect(stores.get('private:KowalskiGoal')?.value().progress).toBe(expected)
+			)
+		}
+	)
+	it('does not round nonzero poll shares to zero or a nonunanimous result to 100%', async () => {
+		stores.set(
+			'private:KowalskiPoll',
+			nativeStore(
+				Object.fromEntries(
+					Array.from({ length: 2000 }, (_, index) => [
+						`vote_${index}`,
+						index === 0 ? 'a' : 'b',
+					])
+				)
+			)
+		)
+		render(
+			<Poll
+				question="Choose"
+				options={[
+					{ id: 'a', label: 'A' },
+					{ id: 'b', label: 'B' },
+				]}
+			/>
+		)
+		await waitFor(() => expect(screen.getByText('2,000 votes')).toBeTruthy())
+		expect(screen.getByText('1 vote · <0.1%')).toBeTruthy()
+		expect(screen.getByText('1,999 votes · >99.9%')).toBeTruthy()
+	})
+	it('shows singular countdown units without clock-style leading zeroes', async () => {
+		vi.setSystemTime(new Date('2026-10-15T00:00:00Z'))
+		render(<Countdown title="Arriving" target="2026-10-16T01:01:01Z" />)
+		await waitFor(() => expect(screen.getByText('day to go')).toBeTruthy())
+		for (const unit of ['hour', 'minute', 'second']) {
+			expect(screen.getByText(unit).parentElement?.textContent).toBe(`1${unit}`)
+		}
+	})
+	it('applies both trip date drafts before saving and discards outer canceled changes', async () => {
+		render(
+			<Trip
+				origin="Paris"
+				destination="Rome"
+				startDate="2026-10-15"
+				endDate="2026-10-20"
+			/>
+		)
+		await waitFor(() =>
+			expect(
+				screen.getByRole('button', { name: 'Edit trip' }).closest('button')?.disabled
+			).toBe(false)
+		)
+		fireEvent.click(screen.getByRole('button', { name: 'Edit trip' }))
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('From'),
+			{
+				target: { value: '  London  ' },
+			}
+		)
+		fireEvent.change(screen.getAllByPlaceholderText('MM/DD/YYYY')[0], {
+			target: { value: '10/' },
+		})
+		expect(screen.getByText('Save changes').closest('button')?.disabled).toBe(true)
+		fireEvent.change(screen.getAllByPlaceholderText('MM/DD/YYYY')[0], {
+			target: { value: '10/16/2026' },
+		})
+		fireEvent.change(screen.getAllByPlaceholderText('MM/DD/YYYY')[1], {
+			target: { value: '10/21/2026' },
+		})
+		expect(screen.getByText('Save changes').closest('button')?.disabled).toBe(false)
+		expect(stores.get('private:KowalskiTrip')?.value().startDate).toEqual({
+			value: '2026-10-15',
+		})
+		fireEvent.click(screen.getByText('Cancel'))
+		fireEvent.click(screen.getByRole('button', { name: 'Edit trip' }))
+		expect(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('From').value
+		).toBe('Paris')
+		fireEvent.change(screen.getAllByPlaceholderText('MM/DD/YYYY')[0], {
+			target: { value: '10/16/2026' },
+		})
+		fireEvent.click(screen.getByText('Save changes'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiTrip')?.value().startDate).toEqual({
+				value: '2026-10-16',
+			})
+		)
+	})
+	it('preserves negative fractional input while switching compatible conversion units', async () => {
+		render(<UnitConverter value={20} from="c" to="f" />)
+		await waitFor(() =>
+			expect(
+				screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Value')
+			).toBeTruthy()
+		)
+		for (const value of ['-', '-0', '-0.', '-0.5']) {
+			fireEvent.change(
+				screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Value'),
+				{ target: { value } }
+			)
+			await act(async () => {})
+			expect(
+				screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Value').value
+			).toBe(value)
+		}
+		expect(stores.get('private:KowalskiUnitConverter')?.value().value).toBe(-0.5)
+		fireEvent.change(screen.getByLabelText('To unit'), { target: { value: 'Kelvin' } })
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiUnitConverter')?.value().to).toEqual({
+				value: 'k',
+			})
+		)
+		fireEvent.click(screen.getByText('Weight'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiUnitConverter')?.value()).toMatchObject({
+				from: { value: 'kg' },
+				to: { value: 'lb' },
+			})
+		)
+		expect(screen.queryByRole('option', { name: 'Kelvin' })).toBeNull()
+	})
+	it('saves a readable time-zone comparison, reopens it, and returns to live time', async () => {
+		vi.setSystemTime(new Date('2026-11-01T00:00:00Z'))
+		const component = <TimeZone zones={['UTC', 'Europe/London']} />
+		const view = render(component)
+		await waitFor(() =>
+			expect(screen.getByText('Compare another time').closest('button')?.disabled).toBe(
+				false
+			)
+		)
+		fireEvent.click(screen.getByText('Compare another time'))
+		fireEvent.change(screen.getByPlaceholderText('MM/DD/YYYY'), {
+			target: { value: '12/01/2026' },
+		})
+		fireEvent.change(screen.getByPlaceholderText('h:mm AM/PM'), {
+			target: { value: '12:00 AM' },
+		})
+		fireEvent.click(screen.getByText('Compare this time'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiTimeZone')?.value().at).toEqual({
+				value: '2026-12-01T00:00:00.000Z',
+			})
+		)
+		view.unmount()
+		render(component)
+		await waitFor(() => expect(screen.getByText('Fixed time')).toBeTruthy())
+		fireEvent.click(screen.getByText('Return to live'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiTimeZone')?.value().at).toEqual({ value: null })
+		)
+	})
+	it('shows note saving status until the authoritative acknowledgement arrives', async () => {
+		const pending: {
+			patch: object
+			resolve: (value: { rawValue: unknown; version: number }) => void
+		}[] = []
+		const native = nativeStore(
+			kowalskiCatalog.note.storeSchema.parse({
+				body: { value: 'Old body' },
+				title: { value: 'Draft' },
+			})
+		)
+		vi.stubGlobal('Quantum', {
+			openStore: async () => ({
+				...native.store,
+				setAsync: (patch: object) =>
+					new Promise<{ rawValue: unknown; version: number }>(resolve =>
+						pending.push({ patch, resolve })
+					),
+			}),
+		})
+		render(<Note title="Draft" body="Old body" />)
+		await waitFor(() => expect(screen.getByText('Saved')).toBeTruthy())
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(
+				'Start writing…'
+			),
+			{
+				target: { value: 'New body' },
+			}
+		)
+		expect(screen.getByText('Saving…')).toBeTruthy()
+		expect(native.value().body).toEqual({ value: 'Old body' })
+		await act(async () => {
+			native.store.set(pending[0].patch)
+			pending[0].resolve({ rawValue: native.value(), version: 0 })
+		})
+		await waitFor(() => expect(screen.getByText('Saved')).toBeTruthy())
+		expect(native.value().body).toEqual({ value: 'New body' })
+	})
+	it('restarts a completed timer and pauses a running stopwatch', async () => {
+		vi.setSystemTime(new Date('2026-10-15T12:00:00Z'))
+		const view = render(<Timer durationSeconds={1} />)
+		await waitFor(() =>
+			expect(screen.getByText('Start').closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.click(screen.getByText('Start'))
+		view.unmount()
+		vi.setSystemTime(new Date('2026-10-15T12:00:02Z'))
+		const complete = render(<Timer durationSeconds={1} />)
+		await waitFor(() => expect(screen.getByText('Time’s up')).toBeTruthy())
+		fireEvent.click(screen.getByText('Start again'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiTimer')?.value().startedAt).toBe(Date.now())
+		)
+		complete.unmount()
+		stores.clear()
+		const stopwatch = render(<Timer mode="stopwatch" />)
+		await waitFor(() =>
+			expect(screen.getByText('Start').closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.click(screen.getByText('Start'))
+		stopwatch.unmount()
+		vi.setSystemTime(new Date('2026-10-15T12:00:12Z'))
+		render(<Timer mode="stopwatch" />)
+		await waitFor(() => expect(screen.getByText('00:10')).toBeTruthy())
+		fireEvent.click(screen.getByText('Pause'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiTimer')?.value()).toMatchObject({
+				elapsedSeconds: 10,
+				startedAt: null,
+			})
+		)
+	})
+	it.each([
+		{ component: <Event title="Old" />, editor: 'event', field: 'Title' },
+		{ component: <Reminder title="Old" />, editor: 'reminder', field: 'Reminder' },
+		{
+			component: <Trip origin="Old" destination="Rome" />,
+			editor: 'trip',
+			field: 'From',
+		},
+		{ component: <Contact name="Old" />, editor: 'contact', field: 'Name' },
+		{
+			component: <Bookmark title="Old" url="https://example.com" />,
+			editor: 'bookmark',
+			field: 'Title',
+		},
+		{
+			component: <Expense title="Old" amount={10} />,
+			editor: 'expense',
+			field: 'Description',
+		},
+	])(
+		'retains a rejected $editor draft for retry',
+		async ({ component, editor, field }) => {
+			let reject = true
+			vi.stubGlobal('Quantum', {
+				async openStore({ initialState }: { initialState: object }) {
+					const native = nativeStore(initialState)
+					return {
+						...native.store,
+						async setAsync(patch: object) {
+							if (reject) {
+								throw new Error('Local write rejected')
+							}
+							return native.store.setAsync(patch)
+						},
+					}
+				},
+			})
+			render(component)
+			await waitFor(() =>
+				expect(
+					screen.getByRole('button', { name: `Edit ${editor}` }).closest('button')
+						?.disabled
+				).toBe(false)
+			)
+			fireEvent.click(screen.getByRole('button', { name: `Edit ${editor}` }))
+			fireEvent.change(
+				screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(field),
+				{
+					target: { value: 'Keep this draft' },
+				}
+			)
+			fireEvent.click(screen.getByText('Save changes'))
+			await waitFor(() =>
+				expect(
+					screen.getByText('Could not save this change. Please try again.')
+				).toBeTruthy()
+			)
+			expect(
+				screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(field).value
+			).toBe('Keep this draft')
+			reject = false
+			fireEvent.click(screen.getByText('Save changes'))
+			await waitFor(() => expect(screen.queryByPlaceholderText(field)).toBeNull())
+			expect(screen.getByText('Keep this draft')).toBeTruthy()
+		}
+	)
+	it('keeps the submitted editor closed to further input until a delayed save finishes', async () => {
+		let acknowledge: (() => void) | undefined
+		vi.stubGlobal('Quantum', {
+			async openStore({ initialState }: { initialState: object }) {
+				const native = nativeStore(initialState)
+				return {
+					...native.store,
+					setAsync: (patch: object) =>
+						new Promise<{ rawValue: unknown; version: number }>(resolve => {
+							acknowledge = () => {
+								native.store.set(patch)
+								resolve({ rawValue: native.value(), version: 0 })
+							}
+						}),
+				}
+			},
+		})
+		render(<Event title="Original" />)
+		await waitFor(() =>
+			expect(
+				screen.getByRole('button', { name: 'Edit event' }).closest('button')?.disabled
+			).toBe(false)
+		)
+		fireEvent.click(screen.getByRole('button', { name: 'Edit event' }))
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Title'),
+			{
+				target: { value: 'Submitted title' },
+			}
+		)
+		fireEvent.click(screen.getByText('Save changes'))
+		expect(screen.getByText('Saving changes…')).toBeTruthy()
+		expect(screen.queryByPlaceholderText('Title')).toBeNull()
+		expect(screen.queryByText('Cancel')).toBeNull()
+		expect(screen.queryByRole('button', { name: 'Edit event' })).toBeNull()
+		await act(async () => acknowledge?.())
+		await waitFor(() => expect(screen.queryByText('Saving changes…')).toBeNull())
+		fireEvent.click(screen.getByRole('button', { name: 'Edit event' }))
+		expect(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Title').value
+		).toBe('Submitted title')
+	})
+	it('retains rapid keypad input and a pending decimal operation through reopen', async () => {
+		const component = <Calculator left={1} right={2} />
+		const view = render(component)
+		await waitFor(() =>
+			expect(
+				screen.getByRole('button', { exact: true, name: 'AC' }).hasAttribute('disabled')
+			).toBe(false)
+		)
+		act(() => {
+			for (const name of ['AC', '1', '2', '+', '3', '.']) {
+				fireEvent.click(screen.getByRole('button', { exact: true, name }))
+			}
+		})
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiCalculator')?.value()).toMatchObject({
+				calculation: { entry: '3.', left: 12, phase: 'right' },
+			})
+		)
+		view.unmount()
+		render(component)
+		await waitFor(() => expect(screen.getByText('3.')).toBeTruthy())
+		fireEvent.click(screen.getByRole('button', { exact: true, name: '5' }))
+		fireEvent.click(screen.getByRole('button', { exact: true, name: '=' }))
+		await waitFor(() => expect(screen.getByText('15.5')).toBeTruthy())
+	})
+	it('edits a countdown through calendar controls and retains its target after reopening', async () => {
+		const component = (
+			<Countdown title="Launch" target="2026-11-01T00:00:00Z" timeZone="UTC" />
+		)
+		const view = render(component)
+		await waitFor(() =>
+			expect(screen.getByText('Change date & time').closest('button')?.disabled).toBe(
+				false
+			)
+		)
+		expect(screen.queryByRole('textbox')).toBeNull()
+		fireEvent.click(screen.getByText('Change date & time'))
+		fireEvent.change(screen.getByPlaceholderText('MM/DD/YYYY'), {
+			target: { value: '12/01/2026' },
+		})
+		fireEvent.click(screen.getByText('Save date'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiCountdown')?.value()).toMatchObject({
+				target: { value: '2026-12-01T00:00:00.000Z' },
+			})
+		)
+		view.unmount()
+		render(component)
+		await waitFor(() => expect(screen.getByText('Tue, December 1, 2026')).toBeTruthy())
+	})
+	it('cancels contact drafts, validates edits, and preserves an untouched live field on save', async () => {
+		const component = <Contact name="Alex" phone="555-0100" email="old@example.com" />
+		const view = render(component)
+		await waitFor(() =>
+			expect(
+				screen.getByRole('button', { name: 'Edit contact' }).closest('button')?.disabled
+			).toBe(false)
+		)
+		expect(screen.queryByRole('textbox')).toBeNull()
+		expect(screen.getByRole('link', { name: 'Call Alex' }).getAttribute('href')).toBe(
+			'tel:5550100'
+		)
+		expect(screen.getByRole('link', { name: 'Email Alex' }).getAttribute('href')).toBe(
+			'mailto:old%40example.com'
+		)
+		fireEvent.click(screen.getByRole('button', { name: 'Edit contact' }))
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Name'),
+			{
+				target: { value: 'Unsaved name' },
+			}
+		)
+		fireEvent.click(screen.getByText('Cancel'))
+		expect(stores.get('private:KowalskiContact')?.value()).toMatchObject({
+			name: { value: 'Alex' },
+		})
+		fireEvent.click(screen.getByRole('button', { name: 'Edit contact' }))
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Email'),
+			{
+				target: { value: 'invalid' },
+			}
+		)
+		expect(screen.getByText('Save changes').closest('button')?.disabled).toBe(true)
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Email'),
+			{
+				target: { value: 'new@example.com' },
+			}
+		)
+		act(() =>
+			stores.get('private:KowalskiContact')?.store.set({ phone: { value: '555-0199' } })
+		)
+		fireEvent.click(screen.getByText('Save changes'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiContact')?.value()).toMatchObject({
+				email: { value: 'new@example.com' },
+				phone: { value: '555-0199' },
+			})
+		)
+		view.unmount()
+		render(component)
+		await waitFor(() => expect(screen.getByText('new@example.com')).toBeTruthy())
+		expect(screen.getByText('555-0199')).toBeTruthy()
+	})
+	it('cancels every staged event edit and preserves the exact instant on title-only saves', async () => {
+		const startsAt = '2026-11-05T18:30:42-08:00'
+		render(
+			<Event
+				title="Talk"
+				location="Lobby"
+				startsAt={startsAt}
+				timeZone="America/Los_Angeles"
+			/>
+		)
+		await waitFor(() =>
+			expect(
+				screen.getByRole('button', { name: 'Edit event' }).closest('button')?.disabled
+			).toBe(false)
+		)
+		fireEvent.click(screen.getByRole('button', { name: 'Edit event' }))
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Title'),
+			{
+				target: { value: 'Unsaved title' },
+			}
+		)
+		fireEvent.change(screen.getByPlaceholderText('MM/DD/YYYY'), {
+			target: { value: '12/05/2026' },
+		})
+		fireEvent.click(screen.getByText('Cancel'))
+		expect(stores.get('private:KowalskiEvent')?.value()).toMatchObject({
+			startsAt: { value: startsAt },
+			title: { value: 'Talk' },
+		})
+		fireEvent.click(screen.getByRole('button', { name: 'Edit event' }))
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('Title'),
+			{
+				target: { value: 'New title' },
+			}
+		)
+		fireEvent.click(screen.getByText('Save changes'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiEvent')?.value()).toMatchObject({
+				startsAt: { value: startsAt },
+				title: { value: 'New title' },
+			})
+		)
+	})
+	it.each(
+		['BillSplit', 'Expense'].flatMap(name => [
+			{ amount: 86.5, currency: 'USD', expected: '$86.50', name },
+			{ amount: 1000, currency: 'JPY', expected: '¥1,000', name },
+			{ amount: 1.2, currency: 'KWD', expected: 'KWD\u00A01.200', name },
+			{ amount: 123.4, currency: 'XCG', expected: 'Cg.\u00A0123.40', name },
+			{ amount: 0.004, currency: 'USD', expected: '$0.004', name },
+		])
+	)(
+		'preserves $name $currency precision and formatting in its amount field',
+		async ({ name, currency, amount, expected }) => {
+			const bill = name === 'BillSplit'
+			render(
+				bill ? (
+					<BillSplit total={amount} people={3} currency={currency} />
+				) : (
+					<Expense title="Lunch" amount={amount} currency={currency} />
+				)
+			)
+			if (!bill) {
+				await waitFor(() =>
+					expect(
+						screen.getByRole('button', { name: 'Edit expense' }).closest('button')
+							?.disabled
+					).toBe(false)
+				)
+				fireEvent.click(screen.getByRole('button', { name: 'Edit expense' }))
+			}
+			const field = bill ? 'Bill total' : 'Amount'
+			expect((await screen.findByPlaceholderText<HTMLInputElement>(field)).value).toBe(
+				expected
+			)
+			fireEvent.change(screen.getByPlaceholderText(field), { target: { value: '' } })
+			if (bill) {
+				expect(screen.getByText('Enter a valid bill total.')).toBeTruthy()
+				expect(stores.get('private:KowalskiBillSplit')?.value().total).toBe(amount)
+			} else {
+				expect(screen.getByText('Save changes').closest('button')?.disabled).toBe(true)
+			}
+			await act(async () => {
+				fireEvent.change(screen.getByPlaceholderText(field), {
+					target: { value: expected },
+				})
+			})
+			if (bill) {
+				expect(screen.queryByText('Enter a valid bill total.')).toBeNull()
+				expect(screen.getByPlaceholderText<HTMLInputElement>(field).value).toBe(expected)
+			} else {
+				fireEvent.change(screen.getByPlaceholderText('Description'), {
+					target: { value: 'Updated lunch' },
+				})
+				fireEvent.click(screen.getByText('Save changes'))
+				await waitFor(() => expect(screen.queryByPlaceholderText(field)).toBeNull())
+			}
+			const state = stores
+				.get(bill ? 'private:KowalskiBillSplit' : 'private:KowalskiExpense')
+				?.value()
+			expect(state?.[bill ? 'total' : 'amount']).toBe(amount)
+		}
+	)
+	it.each([
+		{
+			component: (
+				<Event
+					title="  Design night  "
+					startsAt="2026-11-05T18:30:42.125-08:00"
+					timeZone="America/Los_Angeles"
+				/>
+			),
+			name: 'Event',
+			storedField: 'startsAt',
+			titleField: 'Title',
+		},
+		{
+			component: <Reminder title="  Water plants  " dueAt="2026-11-06T17:00:42.125Z" />,
+			name: 'Reminder',
+			storedField: 'dueAt',
+			titleField: 'Reminder',
+		},
+	])(
+		'blocks outer $name Save for an invalid date draft and retains subsecond precision',
+		async ({ component, name, titleField, storedField }) => {
+			render(component)
+			await waitFor(() =>
+				expect(
+					screen
+						.getByRole('button', { name: `Edit ${name.toLowerCase()}` })
+						.closest('button')?.disabled
+				).toBe(false)
+			)
+			const original = stores.get(`private:Kowalski${name}`)?.value()[storedField]
+			fireEvent.click(screen.getByRole('button', { name: `Edit ${name.toLowerCase()}` }))
+			fireEvent.change(
+				screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(titleField),
+				{
+					target: { value: '  Keep these spaces  ' },
+				}
+			)
+			fireEvent.change(screen.getByPlaceholderText('MM/DD/YYYY'), {
+				target: { value: '12/' },
+			})
+			expect(screen.getByText('Save changes').closest('button')?.disabled).toBe(true)
+			expect(stores.get(`private:Kowalski${name}`)?.value()[storedField]).toEqual(
+				original
+			)
+			fireEvent.change(screen.getByPlaceholderText('MM/DD/YYYY'), {
+				target: { value: '12/06/2026' },
+			})
+			expect(screen.getByText('Save changes').closest('button')?.disabled).toBe(false)
+			fireEvent.click(screen.getByText('Save changes'))
+			await waitFor(() => expect(screen.queryByPlaceholderText(titleField)).toBeNull())
+			expect(stores.get(`private:Kowalski${name}`)?.value().title).toEqual({
+				value: '  Keep these spaces  ',
+			})
+			expect(
+				JSON.stringify(stores.get(`private:Kowalski${name}`)?.value()[storedField])
+			).toContain('42.125')
+		}
+	)
+	it('autosaves the inline bill total while preserving typed decimals and saved values on reopen', async () => {
+		const component = <BillSplit total={86.5} people={3} tipPercent={20} />
+		const view = render(component)
+		const amount = await screen.findByPlaceholderText<HTMLInputElement>('Bill total')
+		expect(amount.value).toBe('$86.50')
+		expect(screen.queryByRole('button', { name: 'Edit' })).toBeNull()
+		expect(screen.queryByRole('button', { exact: true, name: 'Save' })).toBeNull()
+		expect(screen.queryByRole('button', { name: 'Cancel' })).toBeNull()
+		for (const value of ['86.', '86.7', '86.750']) {
+			fireEvent.change(amount, { target: { value } })
+			await waitFor(() =>
+				expect(stores.get('private:KowalskiBillSplit')?.value().total).toBe(Number(value))
+			)
+			expect(screen.getByPlaceholderText('Bill total')).toBe(amount)
+			expect(amount.value).toBe(value)
+		}
+		await waitFor(() => expect(screen.getByText('$34.70')).toBeTruthy())
+		view.unmount()
+		render(component)
+		await waitFor(() =>
+			expect(screen.getByPlaceholderText<HTMLInputElement>('Bill total').value).toBe(
+				'$86.75'
+			)
+		)
+	})
+	it('uses the currency’s minor digits in the inline bill total', async () => {
+		render(<BillSplit total={1000} people={3} currency="JPY" />)
+		expect(
+			(await screen.findByPlaceholderText<HTMLInputElement>('Bill total')).value
+		).toBe('¥1,000')
+		expect(screen.queryByDisplayValue('¥1,000.00')).toBeNull()
+	})
+	it('keeps bill steppers bounded and retains direct edits and tip presets after reopening', async () => {
+		const component = <BillSplit title="Dinner" total={100} people={1} tipPercent={0} />
+		const view = render(component)
+		await waitFor(() =>
+			expect(
+				screen
+					.getByRole('button', { exact: true, name: 'More people' })
+					.hasAttribute('disabled')
+			).toBe(false)
+		)
+		expect(
+			screen
+				.getByRole('button', { exact: true, name: 'Fewer people' })
+				.hasAttribute('disabled')
+		).toBe(true)
+		act(() => {
+			fireEvent.click(screen.getByRole('button', { exact: true, name: 'More people' }))
+			fireEvent.click(screen.getByRole('button', { exact: true, name: 'More people' }))
+		})
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiBillSplit')?.value().people).toBe(3)
+		)
+		fireEvent.click(screen.getByRole('button', { exact: true, name: '20%' }))
+		await waitFor(() =>
+			expect(screen.getByText('Total with tip').parentElement?.textContent).toContain(
+				'$120.00'
+			)
+		)
+		fireEvent.change(
+			screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('People'),
+			{ target: { value: '1000' } }
+		)
+		await waitFor(() =>
+			expect(
+				screen
+					.getByRole('button', { exact: true, name: 'More people' })
+					.hasAttribute('disabled')
+			).toBe(true)
+		)
+		view.unmount()
+		render(component)
+		await waitFor(() =>
+			expect(
+				screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>('People')
+					.value
+			).toBe('1,000')
+		)
+		expect(stores.get('private:KowalskiBillSplit')?.value().tipPercent).toBe(20)
+	})
+	it('writes independent completion fields for checklist items', async () => {
+		render(
+			<Checklist
+				title="Packing"
+				items={[
+					{ id: 'tent', label: 'Tent' },
+					{ id: 'water', label: 'Water' },
+				]}
+			/>
+		)
+		await waitFor(() =>
+			expect(screen.getAllByRole('button')[0].hasAttribute('disabled')).toBe(false)
+		)
+		fireEvent.click(screen.getByRole('button', { name: 'Tent' }))
+		await waitFor(() =>
+			expect(screen.getAllByRole('button').map(button => button.textContent)).toEqual([
+				'Water',
+				'Tent',
+			])
+		)
+		fireEvent.click(screen.getByRole('button', { name: 'Water' }))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiChecklist')?.value()).toMatchObject({
+				completed_tent: true,
+				completed_water: true,
+			})
+		)
+	})
+	it('preserves a picker result for title edits and clears it for a changed choice domain', async () => {
+		const sample = vi.spyOn(Math, 'random').mockReturnValue(0)
+		try {
+			const view = render(
+				<RandomPicker
+					id="Picker"
+					revision={1}
+					title="Choose"
+					mode="list"
+					options={['Tea', 'Coffee']}
+				/>
+			)
+			await waitFor(() =>
+				expect(screen.getByRole('button').hasAttribute('disabled')).toBe(false)
+			)
+			fireEvent.click(screen.getByRole('button'))
+			await waitFor(() => expect(screen.getByText('Tea')).toBeTruthy())
+			view.rerender(
+				<RandomPicker
+					id="Picker"
+					revision={2}
+					title="New title"
+					mode="list"
+					options={['Tea', 'Coffee']}
+				/>
+			)
+			await waitFor(() =>
+				expect(stores.get('private:Picker')?.value().configurationRevision).toBe(2)
+			)
+			expect(screen.getByText('Tea')).toBeTruthy()
+			view.rerender(<RandomPicker id="Picker" revision={3} title="Roll" mode="dice" />)
+			await waitFor(() => expect(stores.get('private:Picker')?.value().result).toBeNull())
+			expect(screen.queryByText('Tea')).toBeNull()
+		} finally {
+			sample.mockRestore()
+		}
+	})
+	it.each([
+		{
+			after: { mode: 'list', options: ['Coffee'] },
+			before: { mode: 'list', options: ['Tea', 'Coffee'] },
+		},
+		{
+			after: { maximum: 10, minimum: 5, mode: 'range' },
+			before: { maximum: 10, minimum: 1, mode: 'range' },
+		},
+	] as const)(
+		'clears a picker result after its choice is removed (%#)',
+		async ({ before, after }) => {
+			const sample = vi.spyOn(Math, 'random').mockReturnValue(0)
+			try {
+				const view = render(<RandomPicker id="ChangedPicker" revision={1} {...before} />)
+				await waitFor(() =>
+					expect(screen.getByRole('button').hasAttribute('disabled')).toBe(false)
+				)
+				fireEvent.click(screen.getByRole('button'))
+				await waitFor(() =>
+					expect(stores.get('private:ChangedPicker')?.value().result).not.toBeNull()
+				)
+				view.rerender(<RandomPicker id="ChangedPicker" revision={2} {...after} />)
+				await waitFor(() =>
+					expect(stores.get('private:ChangedPicker')?.value().result).toBeNull()
+				)
+			} finally {
+				sample.mockRestore()
+			}
+		}
+	)
+	it('rejects identity-free custom checklist and poll data before opening stores', () => {
+		// @ts-expect-error Custom source must supply stable item IDs; composition assigns them before rendering.
+		expect(() => render(<Checklist title="Pack" items={[{ label: 'Tent' }]} />)).toThrow()
+		// @ts-expect-error Custom source must supply stable option IDs.
+		expect(() =>
+			render(
+				<Poll question="Lunch?" options={[{ label: 'Pizza' }, { label: 'Tacos' }]} />
+			)
+		).toThrow()
+		expect(stores.size).toBe(0)
+	})
+	it.each([
+		{
+			component: <Event title="Talk" location="Lobby" />,
+			expected: { location: { value: 'Main hall' } },
+			label: 'Location',
+			name: 'Event',
+			text: 'Main hall',
+		},
+		{
+			component: <Reminder title="Water" />,
+			expected: { title: { value: 'Water plants' } },
+			label: 'Reminder',
+			name: 'Reminder',
+			text: 'Water plants',
+		},
+		{
+			component: <Trip origin="Paris" destination="Rome" />,
+			expected: { destination: { value: 'Berlin' } },
+			label: 'To',
+			name: 'Trip',
+			text: 'Berlin',
+		},
+
+		{
+			component: <ColorPalette color="#123456" />,
+			expected: { color: { value: '#ABCDEF' } },
+			label: 'Hex color',
+			name: 'ColorPalette',
+			text: '#abcdef',
+		},
+		{
+			component: <BillSplit total={10} people={2} />,
+			expected: { people: 3 },
+			label: 'People',
+			name: 'BillSplit',
+			text: '3',
+		},
+		{
+			component: <Expense title="Lunch" amount={10} />,
+			expected: { amount: 12.5 },
+			label: 'Amount',
+			name: 'Expense',
+			text: '12.5',
+		},
+		{
+			component: <UnitConverter from="m" to="km" value={10} />,
+			expected: { value: 2000 },
+			label: 'Value',
+			name: 'UnitConverter',
+			text: '2000',
+		},
+
+		{
+			component: <Contact name="Alex" />,
+			expected: { email: { value: 'alex@example.com' } },
+			label: 'Email',
+			name: 'Contact',
+			text: 'alex@example.com',
+		},
+		{
+			component: <Bookmark title="Reference" url="https://example.com" />,
+			expected: { url: { value: 'https://example.org' } },
+			label: 'Web address',
+			name: 'Bookmark',
+			text: 'https://example.org',
+		},
+	])(
+		'persists $name edits through an authoritative save and reopen',
+		async ({ component, name, label, text, expected }) => {
+			const view = render(component)
+			if (
+				['Contact', 'Event', 'Reminder', 'Trip', 'Expense', 'Bookmark'].includes(name)
+			) {
+				await waitFor(() =>
+					expect(
+						screen
+							.getByRole('button', { name: `Edit ${name.toLowerCase()}` })
+							.closest('button')?.disabled
+					).toBe(false)
+				)
+				fireEvent.click(
+					screen.getByRole('button', { name: `Edit ${name.toLowerCase()}` })
+				)
+			}
+			if (name === 'ColorPalette') {
+				await waitFor(() =>
+					expect(screen.getByText('Edit hex').closest('button')?.disabled).toBe(false)
+				)
+				fireEvent.click(screen.getByText('Edit hex'))
+			}
+			await waitFor(() =>
+				expect(
+					screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(label)
+				).toBeTruthy()
+			)
+			fireEvent.change(
+				screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(label),
+				{ target: { value: text } }
+			)
+			if (name === 'ColorPalette') {
+				fireEvent.click(screen.getByText('Done'))
+			}
+			if (
+				['Contact', 'Event', 'Reminder', 'Trip', 'Expense', 'Bookmark'].includes(name)
+			) {
+				fireEvent.click(screen.getByText('Save changes'))
+			}
+			await waitFor(() =>
+				expect(stores.get(`private:Kowalski${name}`)?.value()).toMatchObject(expected)
+			)
+			view.unmount()
+			render(component)
+			if (
+				['Contact', 'Event', 'Reminder', 'Trip', 'Expense', 'Bookmark'].includes(name)
+			) {
+				await waitFor(() =>
+					expect(
+						screen
+							.getByRole('button', { name: `Edit ${name.toLowerCase()}` })
+							.closest('button')?.disabled
+					).toBe(false)
+				)
+				fireEvent.click(
+					screen.getByRole('button', { name: `Edit ${name.toLowerCase()}` })
+				)
+			}
+			if (name === 'ColorPalette') {
+				await waitFor(() =>
+					expect(screen.getByText('Edit hex').closest('button')?.disabled).toBe(false)
+				)
+				fireEvent.click(screen.getByText('Edit hex'))
+			}
+			await waitFor(() =>
+				expect(
+					screen.getByPlaceholderText<HTMLInputElement | HTMLTextAreaElement>(label).value
+				).toBe(
+					name === 'Expense'
+						? '$12.50'
+						: name === 'ColorPalette'
+							? 'ABCDEF'
+							: name === 'UnitConverter'
+								? '2,000'
+								: text
+				)
+			)
+		}
+	)
+	it('retains today’s habit completion after reopening', async () => {
+		vi.setSystemTime(new Date('2026-10-15T12:00:00Z'))
+		const component = <Habit title="Read" timeZone="UTC" weekdays={['thursday']} />
+		const view = render(component)
+		await waitFor(() =>
+			expect(screen.getByText('Complete today').closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.click(screen.getByText('Complete today'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiHabit')?.value()['completed_2026-10-15']).toBe(
+				true
+			)
+		)
+		view.unmount()
+		render(component)
+		await waitFor(() => expect(screen.getByText('Undo')).toBeTruthy())
+	})
+	it('persists a valid random choice after reopening', async () => {
+		const component = <RandomPicker mode="list" options={['Tea', 'Coffee']} />
+		const view = render(component)
+		await waitFor(() =>
+			expect(screen.getByRole('button').hasAttribute('disabled')).toBe(false)
+		)
+		fireEvent.click(screen.getByRole('button'))
+		await waitFor(() =>
+			expect(['Tea', 'Coffee']).toContain(
+				kowalskiCatalog.randomPicker.storeSchema.parse(
+					stores.get('private:KowalskiRandomPicker')?.value()
+				).result?.value
+			)
+		)
+		const result = kowalskiCatalog.randomPicker.storeSchema.parse(
+			stores.get('private:KowalskiRandomPicker')?.value()
+		).result?.value
+		view.unmount()
+		render(component)
+		await waitFor(() => expect(screen.getByText(String(result))).toBeTruthy())
+	})
+	it.each([
+		{ component: <UnitConverter value={0.1} from="m" to="km" /> },
+		{
+			component: <Goal title="Small goal" progress={0.0001} target={1} unit="steps" />,
+		},
+	])(
+		'displays valid small numbers without rounding them to zero (%#)',
+		async ({ component }) => {
+			render(component)
+			await waitFor(() => expect(screen.getByText('0.0001')).toBeTruthy())
+		}
+	)
+	it('retains a representable small goal increment', async () => {
+		render(
+			<Goal title="Precise goal" progress={10_000} target={20_000} step={0.00000001} />
+		)
+		const button = screen.getByText('+0.00000001').closest('button')
+		await waitFor(() => expect(button?.disabled).toBe(false))
+		fireEvent.click(screen.getByText('+0.00000001'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiGoal')?.value().progress).toBe(10_000.00000001)
+		)
+	})
+	it('shows the final countdown second until it has elapsed', async () => {
+		vi.setSystemTime(new Date('2026-10-15T12:00:00Z'))
+		const view = render(<Timer durationSeconds={1} />)
+		await waitFor(() =>
+			expect(screen.getByText('Start').closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.click(screen.getByText('Start'))
+		view.unmount()
+		vi.setSystemTime(new Date('2026-10-15T12:00:00.999Z'))
+		render(<Timer durationSeconds={1} />)
+		await waitFor(() => expect(screen.getByText('Pause')).toBeTruthy())
+		expect(screen.getByText('00:01')).toBeTruthy()
+	})
+	it('treats prototype-like item IDs as unchecked until explicitly completed', async () => {
+		render(<Checklist title="Packing" items={[{ id: 'constructor', label: 'Tent' }]} />)
+		await waitFor(() =>
+			expect(screen.getByRole('button').hasAttribute('disabled')).toBe(false)
+		)
+		expect(screen.getByText('0 of 1 complete')).toBeTruthy()
+		expect(screen.getByRole('button').querySelector('[data-icon=checkmark]')).toBeNull()
+		fireEvent.click(screen.getByRole('button'))
+		await waitFor(() => expect(screen.getByText('1 of 1 complete')).toBeTruthy())
+		expect(
+			screen.getByRole('button').querySelector('[data-icon=checkmark]')
+		).not.toBeNull()
+	})
+	it('keeps duplicate-label item identity when the list reorders', async () => {
+		const first = { id: 'one', label: 'Tent' }
+		const second = { id: 'two', label: 'Tent' }
+		const view = render(<Checklist title="Packing" items={[first, second]} />)
+		await waitFor(() =>
+			expect(screen.getAllByRole('button')[0].hasAttribute('disabled')).toBe(false)
+		)
+		fireEvent.click(screen.getAllByRole('button')[0])
+		view.rerender(<Checklist title="Packing" items={[second, first]} />)
+		expect(
+			screen.getAllByRole('button')[0].querySelector('[data-icon=checkmark]')
+		).toBeNull()
+		expect(
+			screen.getAllByRole('button')[1].querySelector('[data-icon=checkmark]')
+		).not.toBeNull()
+	})
+	it('keeps repeated feature IDs independent across reopen', async () => {
+		const view = render(
+			<>
+				<Goal id="One" title="One" target={10} />
+				<Goal id="Two" title="Two" target={10} />
+			</>
+		)
+		await waitFor(() =>
+			expect(screen.getAllByText('+1')[0].closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.click(screen.getAllByText('+1')[0])
+		await waitFor(() => expect(stores.get('private:One')?.value().progress).toBe(1))
+		expect(stores.get('private:Two')?.value().progress).toBe(0)
+		expect([...stores.keys()].toSorted()).toEqual(['private:One', 'private:Two'])
+		view.unmount()
+		render(<Goal id="One" title="One" target={10} />)
+		await waitFor(() => expect(screen.getByText('1')).toBeTruthy())
+	})
+	it('persists editable note text through unmount and reopen', async () => {
+		const view = render(<Note title="Notes" body="Seed" />)
+		await waitFor(() =>
+			expect(
+				screen.getAllByRole<HTMLInputElement | HTMLTextAreaElement>('textbox')
+			).toHaveLength(2)
+		)
+		fireEvent.change(
+			screen.getAllByRole<HTMLInputElement | HTMLTextAreaElement>('textbox')[1],
+			{
+				target: { value: 'My saved writing' },
+			}
+		)
+		view.unmount()
+		render(<Note title="Notes" body="Seed" />)
+		await waitFor(() =>
+			expect(
+				screen.getAllByRole<HTMLInputElement | HTMLTextAreaElement>('textbox')[1].value
+			).toBe('My saved writing')
+		)
+	})
+	it('changes one personal vote without counting the same voter twice', async () => {
+		render(
+			<Poll
+				question="Lunch?"
+				options={[
+					{ id: 'a', label: 'Pizza' },
+					{ id: 'b', label: 'Tacos' },
+				]}
+			/>
+		)
+		await waitFor(() =>
+			expect(screen.getAllByRole('button')[0].hasAttribute('disabled')).toBe(false)
+		)
+		fireEvent.click(screen.getAllByRole('button')[0])
+		fireEvent.click(screen.getAllByRole('button')[1])
+		await waitFor(() => expect(screen.getByText('1 vote')).toBeTruthy())
+		expect(
+			Object.entries(stores.get('private:KowalskiPoll')?.value() ?? {})
+				.filter(([key]) => key.startsWith('vote_'))
+				.map(([, value]) => value)
+		).toEqual(['b'])
+	})
+	it('restores a running timer from its saved wall-clock anchor', async () => {
+		vi.setSystemTime(new Date('2026-10-15T12:00:00Z'))
+		const view = render(<Timer durationSeconds={60} />)
+		await waitFor(() =>
+			expect(screen.getByText('Start').closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.click(screen.getByText('Start'))
+		view.unmount()
+		vi.setSystemTime(new Date('2026-10-15T12:00:20Z'))
+		render(<Timer durationSeconds={60} />)
+		await waitFor(() => expect(screen.getByText('00:40')).toBeTruthy())
+		await act(async () => fireEvent.click(screen.getByText('Pause')))
+		expect(stores.get('private:KowalskiTimer')?.value().startedAt).toBeNull()
+	})
+	it('adds spending to a budget category and keeps the running total', async () => {
+		render(
+			<Budget
+				categories={[
+					{ id: 'groceries', label: 'Groceries', limit: 400 },
+					{ id: 'transport', label: 'Transport', limit: 100 },
+				]}
+			/>
+		)
+		fireEvent.change(screen.getByPlaceholderText('Amount'), {
+			target: { value: '12.50' },
+		})
+		await waitFor(() =>
+			expect(screen.getByText('Add to Groceries').closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.click(screen.getByText('Add to Groceries'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiBudget')?.value().spent_groceries).toBe(12.5)
+		)
+		expect(screen.getByText('$12.50 of $400.00')).toBeTruthy()
+		expect(screen.getByText('$487.50 left')).toBeTruthy()
+	})
+	it('keeps score per player and names the leader', async () => {
+		render(
+			<Scoreboard
+				players={[
+					{ id: 'maya', label: 'Maya' },
+					{ id: 'theo', label: 'Theo' },
+				]}
+			/>
+		)
+		await waitFor(() =>
+			expect(
+				screen.getByRole('button', { name: 'Raise Theo' }).hasAttribute('disabled')
+			).toBe(false)
+		)
+		fireEvent.click(screen.getByRole('button', { name: 'Raise Theo' }))
+		fireEvent.click(screen.getByRole('button', { name: 'Raise Theo' }))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiScoreboard')?.value().score_theo).toBe(2)
+		)
+		expect(screen.getByText('Theo leads')).toBeTruthy()
+	})
+	it('moves a task from To do to Doing', async () => {
+		render(<TaskBoard tasks={[{ id: 'invite', label: 'Send the invitations' }]} />)
+		const start = await screen.findByRole('button', {
+			name: 'Start: Send the invitations',
+		})
+		await waitFor(() => expect(start.hasAttribute('disabled')).toBe(false))
+		fireEvent.click(start)
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiTaskBoard')?.value().status_invite).toBe('doing')
+		)
+		fireEvent.click(screen.getByText('Doing 1'))
+		expect(
+			screen.getByRole('button', { name: 'Finish: Send the invitations' })
+		).toBeTruthy()
+	})
+	it('scales recipe ingredient quantities with servings', async () => {
+		render(
+			<Recipe
+				ingredients={[
+					{ amount: 200, id: 'pasta', label: 'Spaghetti', unit: 'g' },
+					{ amount: 1.5, id: 'water', label: 'Water', unit: 'cups' },
+					{ id: 'salt', label: 'Salt', unit: 'a pinch' },
+				]}
+				servings={2}
+				title="Pasta"
+				steps={[{ id: 'cook', instruction: 'Cook it.' }]}
+			/>
+		)
+		await waitFor(() =>
+			expect(
+				screen.getByRole('button', { name: 'More servings' }).hasAttribute('disabled')
+			).toBe(false)
+		)
+		fireEvent.click(screen.getByRole('button', { name: 'More servings' }))
+		await waitFor(() => expect(screen.getByText('300 g')).toBeTruthy())
+		expect(screen.getByText('2¼ cups')).toBeTruthy()
+		expect(screen.getByText('a pinch')).toBeTruthy()
+		expect(stores.get('private:KowalskiRecipe')?.value().servings).toBe(3)
+	})
+	it('cooks an RGF recipe through waits, timers, and doneness', async () => {
+		render(
+			<Recipe
+				ingredients={[{ amount: 200, id: 'spaghetti', label: 'Spaghetti', unit: 'g' }]}
+				servings={2}
+				title="Pasta"
+				steps={[
+					{
+						id: 'water',
+						instruction: 'Boil the water.',
+						outputs: [{ id: 'boiling', name: 'boiling water' }],
+					},
+					{
+						doneness: 'al dente',
+						duration: { minMinutes: 9, raw: '9 min' },
+						id: 'pasta',
+						instruction: 'Cook the pasta.',
+						label: 'pasta',
+						outputs: [{ id: 'pot', name: 'pasta in its water' }],
+						uses: [
+							{ id: 'u-water', source: { kind: 'output', outputId: 'boiling' } },
+							{
+								id: 'u-pasta',
+								source: { ingredientId: 'spaghetti', kind: 'ingredient' },
+							},
+						],
+					},
+					{
+						id: 'drain',
+						instruction: 'Drain the pasta.',
+						uses: [{ id: 'u-pot', source: { kind: 'output', outputId: 'pot' } }],
+					},
+				]}
+			/>
+		)
+		const button = (name: string | RegExp) => screen.getByRole('button', { name })
+		await waitFor(() =>
+			expect(button('Start cooking').hasAttribute('disabled')).toBe(false)
+		)
+		expect(screen.getByText('9 min total, 9 min hands-on')).toBeTruthy()
+		fireEvent.click(button('Start cooking'))
+		await waitFor(() => expect(button('Done').hasAttribute('disabled')).toBe(false))
+		expect(stores.get('private:KowalskiRecipe')?.value().cooking).toBe(true)
+		expect(screen.getByText('2 servings · 1 ingredient')).toBeTruthy()
+		expect(button('Drain the pasta.').hasAttribute('disabled')).toBe(true)
+		fireEvent.click(button('Done'))
+		await waitFor(() =>
+			expect(button('Start 9 min').hasAttribute('disabled')).toBe(false)
+		)
+		fireEvent.click(button('Start 9 min'))
+		await waitFor(() => expect(screen.getByText('9:00')).toBeTruthy())
+		act(() =>
+			stores
+				.get('private:KowalskiRecipe')
+				?.store.set({ step_pasta: { done: false, endsAt: Date.now() - 60_000 } })
+		)
+		await waitFor(() => expect(button('+1 min')).toBeTruthy())
+		expect(screen.getByText('Time’s up. Done when al dente.')).toBeTruthy()
+		expect(button('Drain the pasta.').hasAttribute('disabled')).toBe(true)
+		fireEvent.click(button('Done'))
+		await waitFor(() => expect(screen.getByText('2 of 3 done')).toBeTruthy())
+		expect(screen.queryByRole('button', { name: 'Drain the pasta.' })).toBeNull()
+		expect(button('Done').hasAttribute('disabled')).toBe(false)
+	})
+	it('rejects RGF steps that use later outputs or unknown ingredients', () => {
+		const recipe = (steps: unknown[]) =>
+			kowalskiCatalog.recipe.props.safeParse({
+				ingredients: [{ id: 'salt', label: 'Salt' }],
+				steps,
+				title: 'Broken',
+			}).success
+		expect(recipe([{ id: 'a', instruction: 'A', uses: [] }])).toBe(true)
+		expect(
+			recipe([
+				{ after: ['b'], id: 'a', instruction: 'A' },
+				{ id: 'b', instruction: 'B' },
+			])
+		).toBe(false)
+		expect(
+			recipe([
+				{
+					id: 'a',
+					instruction: 'A',
+					uses: [{ id: 'u', source: { ingredientId: 'sugar', kind: 'ingredient' } }],
+				},
+			])
+		).toBe(false)
+	})
+	it('passes a rotation turn on and counts completed turns', async () => {
+		render(
+			<Rotation
+				people={[
+					{ id: 'ava', label: 'Ava' },
+					{ id: 'ben', label: 'Ben' },
+					{ id: 'cleo', label: 'Cleo' },
+				]}
+				task="Recycling"
+			/>
+		)
+		await waitFor(() =>
+			expect(screen.getByText('Done').closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.click(screen.getByText('Done'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiRotation')?.value()).toMatchObject({
+				completed: 1,
+				turn: 'ben',
+			})
+		)
+		// Ben is now up: named in the card and marked in the order.
+		expect(screen.getAllByText('Ben')).toHaveLength(2)
+	})
+	it('totals the checked items of a shopping list', async () => {
+		render(
+			<ShoppingList
+				items={[
+					{ id: 'eggs', label: 'Eggs', price: 4.5 },
+					{ id: 'apples', label: 'Apples', price: 0.8, quantity: 6 },
+				]}
+			/>
+		)
+		const eggs = await screen.findByRole('button', { name: 'Eggs. $4.50' })
+		await waitFor(() => expect(eggs.hasAttribute('disabled')).toBe(false))
+		expect(eggs.querySelector('[data-icon="checkmark"]')).toBeNull()
+		fireEvent.click(eggs)
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiShoppingList')?.value().got_eggs).toBe(true)
+		)
+		expect(screen.getByText('In the cart of $9.30')).toBeTruthy()
+		expect(screen.getByText('1 of 2')).toBeTruthy()
+		expect(eggs.querySelector('[data-icon="checkmark"]')).not.toBeNull()
+		expect(
+			screen
+				.getByRole('button', { name: 'Apples. 6 × $0.80' })
+				.querySelector('[data-icon="checkmark"]')
+		).toBeNull()
+	})
+	it('rates with stars and clears a repeated star', async () => {
+		render(<Rating subject="Dinner" />)
+		await waitFor(() =>
+			expect(
+				screen.getByRole('button', { name: '4 stars' }).hasAttribute('disabled')
+			).toBe(false)
+		)
+		fireEvent.click(screen.getByRole('button', { name: '4 stars' }))
+		await waitFor(() => expect(screen.getByText('Great')).toBeTruthy())
+		fireEvent.click(screen.getByRole('button', { name: '4 stars' }))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiRating')?.value().stars).toBe(0)
+		)
+	})
+	it('splits a shared cost evenly and settles the tab', async () => {
+		render(
+			<Ledger
+				people={[
+					{ id: 'sam', label: 'Sam' },
+					{ id: 'riley', label: 'Riley' },
+				]}
+			/>
+		)
+		await waitFor(() => expect(screen.getByPlaceholderText('Amount')).toBeTruthy())
+		fireEvent.change(screen.getByPlaceholderText('What for'), {
+			target: { value: 'Groceries' },
+		})
+		fireEvent.change(screen.getByPlaceholderText('Amount'), { target: { value: '30' } })
+		fireEvent.click(screen.getByText('Add to the tab'))
+		await waitFor(() => expect(screen.getByText('Riley owes Sam')).toBeTruthy())
+		expect(screen.getByText('$15.00')).toBeTruthy()
+		fireEvent.click(screen.getByText('Settle up'))
+		await waitFor(() => expect(screen.getByText('All square')).toBeTruthy())
+	})
+})
+
+describe('new feature input boundaries', () => {
+	const categories = [
+		{ id: 'first', label: 'Food', limit: 100 },
+		{ id: 'second', label: 'Food', limit: 100 },
+	]
+	const people = [
+		{ id: 'sam', label: 'Sam' },
+		{ id: 'riley', label: 'Riley' },
+	]
+	it.each(['budget', 'ledger'] as const)(
+		'preserves the next %s draft across a delayed save',
+		async component => {
+			const native = nativeStore(kowalskiCatalog[component].storeSchema.parse({}))
+			const ack = Promise.withResolvers<void>()
+			const save = native.store.setAsync.bind(native.store)
+			vi.spyOn(native.store, 'setAsync').mockImplementation(async patch => {
+				await ack.promise
+				return save(patch)
+			})
+			stores.set(
+				component === 'budget' ? 'private:KowalskiBudget' : 'private:KowalskiLedger',
+				native
+			)
+			render(
+				component === 'budget' ? (
+					<Budget categories={categories} />
+				) : (
+					<Ledger people={people} />
+				)
+			)
+			const add = screen.getByText(
+				component === 'budget' ? 'Add to Food' : 'Add to the tab'
+			)
+			fireEvent.change(screen.getByPlaceholderText('Amount'), { target: { value: '10' } })
+			if (component === 'ledger') {
+				fireEvent.change(screen.getByPlaceholderText('What for'), {
+					target: { value: 'First' },
+				})
+			}
+			await waitFor(() => expect(add.closest('button')?.disabled).toBe(false))
+			fireEvent.click(add)
+			fireEvent.change(screen.getByPlaceholderText('Amount'), { target: { value: '20' } })
+			if (component === 'ledger') {
+				fireEvent.change(screen.getByPlaceholderText('What for'), {
+					target: { value: 'Next' },
+				})
+			}
+			await act(async () => ack.resolve())
+			expect(screen.getByPlaceholderText<HTMLInputElement>('Amount').value).toBe('20')
+			if (component === 'ledger') {
+				expect(screen.getByPlaceholderText<HTMLInputElement>('What for').value).toBe(
+					'Next'
+				)
+			}
+		}
+	)
+	it('selects independent budget categories with the same label', async () => {
+		render(<Budget categories={categories} />)
+		fireEvent.change(screen.getByRole('combobox', { name: 'Category' }), {
+			target: { value: 'second' },
+		})
+		fireEvent.change(screen.getByPlaceholderText('Amount'), { target: { value: '10' } })
+		await waitFor(() =>
+			expect(screen.getByText('Add to Food').closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.click(screen.getByText('Add to Food'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiBudget')?.value().spent_second).toBe(10)
+		)
+		expect(stores.get('private:KowalskiBudget')?.value().spent_first).toBeUndefined()
+	})
+	it('blocks spending that would exceed the stored category limit', async () => {
+		stores.set(
+			'private:KowalskiBudget',
+			nativeStore(kowalskiCatalog.budget.storeSchema.parse({ spent_first: 1e12 }))
+		)
+		render(<Budget categories={categories} />)
+		await waitFor(() =>
+			expect(screen.getByText('$1,000,000,000,000.00 of $100.00')).toBeTruthy()
+		)
+		fireEvent.change(screen.getByPlaceholderText('Amount'), { target: { value: '1' } })
+		expect(screen.getByText('Add to Food').closest('button')?.disabled).toBe(true)
+	})
+	it('requires an admissible ledger description and recovers when it is shortened', async () => {
+		render(<Ledger people={people} />)
+		fireEvent.change(screen.getByPlaceholderText('Amount'), { target: { value: '10' } })
+		await waitFor(() =>
+			expect(screen.getByText('Add to the tab').closest('button')?.disabled).toBe(false)
+		)
+		fireEvent.change(screen.getByPlaceholderText('What for'), {
+			target: { value: 'x'.repeat(161) },
+		})
+		expect(screen.getByText('Add to the tab').closest('button')?.disabled).toBe(true)
+		fireEvent.change(screen.getByPlaceholderText('What for'), {
+			target: { value: 'Dinner' },
+		})
+		fireEvent.click(screen.getByText('Add to the tab'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiLedger')?.value().entries).toMatchObject([
+				{ amount: 10, label: 'Dinner' },
+			])
+		)
+	})
+	it('can clear a balanced full ledger and add new costs', async () => {
+		stores.set(
+			'private:KowalskiLedger',
+			nativeStore(
+				kowalskiCatalog.ledger.storeSchema.parse({
+					entries: Array.from({ length: 200 }, (_, index) => ({
+						amount: 10,
+						id: `entry${index}`,
+						label: '',
+						paidBy: index % 2 ? 'sam' : 'riley',
+					})),
+				})
+			)
+		)
+		render(<Ledger people={people} />)
+		await waitFor(() => expect(screen.getByText('Settle up')).toBeTruthy())
+		fireEvent.click(screen.getByText('Settle up'))
+		await waitFor(() =>
+			expect(stores.get('private:KowalskiLedger')?.value().entries).toEqual([])
+		)
+		fireEvent.change(screen.getByPlaceholderText('Amount'), { target: { value: '10' } })
+		expect(screen.getByText('Add to the tab').closest('button')?.disabled).toBe(false)
+	})
+})
+
+function nativeStore(initial: object) {
+	let value: Record<string, unknown> = { ...initial }
+	const listeners = new Set<(raw: { rawValue: unknown; version: number }) => void>()
+	return {
+		store: {
+			set(patch: object) {
+				value = { ...value, ...patch }
+				for (const listener of listeners) {
+					listener({ rawValue: value, version: 0 })
+				}
+			},
+			async setAsync(patch: object) {
+				this.set(patch)
+				return { rawValue: value, version: 0 }
+			},
+			subscribe(listener: (raw: { rawValue: unknown; version: number }) => void) {
+				listeners.add(listener)
+				listener({ rawValue: value, version: 0 })
+				return () => {
+					listeners.delete(listener)
+				}
+			},
+		},
+		value: () => value,
+	}
+}