chore: bump version to 0.16.1

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

CLAUDE.md

@@ -98,6 +98,10 @@ tests/
   unit/                # Vitest unit tests
   e2e/                 # Playwright e2e tests (Gherkin-style)
     helpers/fixtures.ts  # Shared authenticatedPage fixture
+website/               # Static landing page (crumbs.bretzel.app)
+  index.html           # Landing page with feature cards, screenshots, deploy section
+  styles.css           # Landing page styles (retro parchment theme)
+  assets/              # Favicon, screenshots
 ```
 
 ## Commands

docker-compose.yml

@@ -1,6 +1,6 @@
 services:
   crumbs:
-    image: ghcr.io/bretzel-app/crumbs:0.13.1
+    image: ghcr.io/bretzel-app/crumbs:0.15.0
     container_name: crumbs
     ports:
       - "3000:3000"

package.json

@@ -1,7 +1,7 @@
 {
   "name": "crumbs",
   "private": true,
-  "version": "0.14.0",
+  "version": "0.16.1",
   "type": "module",
   "license": "MIT",
   "author": "Bretzel (https://bretzel.app)",

src/app.css

@@ -102,3 +102,77 @@ body::before {
 .tiptap .selectedCell {
 	background-color: color-mix(in srgb, var(--primary) 12%, transparent);
 }
+
+/* Task list styles — shared between TipTap editor and markdown-it preview */
+
+/* TipTap: ul[data-type="taskList"]  |  markdown-it: ul.task-list */
+.tiptap ul[data-type="taskList"],
+.prose ul.task-list {
+	list-style: none;
+	padding-left: 0;
+	margin: 0.25rem 0;
+}
+
+.tiptap ul[data-type="taskList"] li,
+.prose ul.task-list li {
+	display: flex;
+	align-items: center;
+	gap: 0.375rem;
+	margin: 0;
+	padding: 0;
+}
+
+.tiptap ul[data-type="taskList"] li::marker,
+.prose ul.task-list li::marker {
+	content: none;
+}
+
+/* TipTap: checkbox is inside a label */
+.tiptap ul[data-type="taskList"] li label {
+	display: flex;
+	align-items: center;
+	flex-shrink: 0;
+}
+
+/* Shared checkbox styles */
+.tiptap ul[data-type="taskList"] li label input[type="checkbox"],
+.prose ul.task-list .task-checkbox {
+	cursor: pointer;
+	margin: 0;
+	flex-shrink: 0;
+}
+
+/* TipTap: text content is in a div>p */
+.tiptap ul[data-type="taskList"] li > div {
+	flex: 1;
+	min-width: 0;
+}
+
+.tiptap ul[data-type="taskList"] li > div p {
+	margin: 0;
+}
+
+/* Checked item styling */
+.tiptap ul[data-type="taskList"] li[data-checked="true"] > div {
+	text-decoration: line-through;
+	color: var(--text-muted);
+}
+
+/* Override prose spacing for task lists */
+.prose ul[data-type="taskList"],
+.prose ul.task-list {
+	padding-left: 0;
+	margin-top: 0.25rem;
+	margin-bottom: 0.25rem;
+}
+
+.prose ul[data-type="taskList"] li,
+.prose ul.task-list li {
+	padding-left: 0;
+	margin-top: 0;
+	margin-bottom: 0;
+}
+
+.prose ul.task-list li p {
+	margin: 0;
+}

src/hooks.server.ts

@@ -22,36 +22,31 @@ export const handle: Handle = async ({ event, resolve }) => {
 		return resolve(event);
 	}
 
-	// MCP endpoint: authenticate via Bearer token (API key)
-	if (pathname.startsWith('/api/mcp')) {
+	// API routes: authenticate via Bearer token if present
+	if (pathname.startsWith('/api/')) {
 		const authHeader = event.request.headers.get('authorization');
 		const token = authHeader?.startsWith('Bearer ') ? authHeader.slice(7) : null;
 
-		if (!token) {
-			return new Response(JSON.stringify({ error: 'Unauthorized' }), {
-				status: 401,
-				headers: { 'Content-Type': 'application/json' }
-			});
-		}
+		if (token) {
+			const { valid, userId } = validateApiKey(token);
+			if (!valid || !userId) {
+				return new Response(JSON.stringify({ error: 'Unauthorized' }), {
+					status: 401,
+					headers: { 'Content-Type': 'application/json' }
+				});
+			}
 
-		const { valid, userId } = validateApiKey(token);
-		if (!valid || !userId) {
-			return new Response(JSON.stringify({ error: 'Unauthorized' }), {
-				status: 401,
-				headers: { 'Content-Type': 'application/json' }
-			});
-		}
+			const user = getUserForApiKey(userId);
+			if (!user) {
+				return new Response(JSON.stringify({ error: 'Unauthorized' }), {
+					status: 401,
+					headers: { 'Content-Type': 'application/json' }
+				});
+			}
 
-		const user = getUserForApiKey(userId);
-		if (!user) {
-			return new Response(JSON.stringify({ error: 'Unauthorized' }), {
-				status: 401,
-				headers: { 'Content-Type': 'application/json' }
-			});
+			event.locals.user = user;
+			return resolve(event);
 		}
-
-		event.locals.user = user;
-		return resolve(event);
 	}
 
 	// Check if setup is complete

src/lib/components/FormattingToolbar.svelte

@@ -6,6 +6,7 @@
 		Heading,
 		List,
 		ListOrdered,
+		ListChecks,
 		TextQuote,
 		CodeXml,
 		Bold,
@@ -222,7 +223,7 @@
 	<div class="relative" data-dropdown="list">
 		<button
 			onclick={() => toggleDropdown('list')}
-			class={dropdownBtnClass(isActive('bulletList') || isActive('orderedList'))}
+			class={dropdownBtnClass(isActive('bulletList') || isActive('orderedList') || isActive('taskList'))}
 			title="Lists"
 			data-testid="format-list"
 		>
@@ -247,6 +248,14 @@
 					<ListOrdered size={iconSize} />
 					<span>Ordered list</span>
 				</button>
+				<button
+					onclick={() => { editor?.chain().focus().toggleTaskList().run(); closeDropdowns(); }}
+					class={dropdownItemClass(isActive('taskList'))}
+					data-testid="format-task-list"
+				>
+					<ListChecks size={iconSize} />
+					<span>Task list</span>
+				</button>
 			</div>
 		{/if}
 	</div>

src/lib/components/NoteCard.svelte

@@ -237,24 +237,3 @@
 	{/if}
 </article>
 
-<style>
-	article :global(.prose li:has(.task-checkbox)) {
-		list-style: none;
-		display: flex;
-		align-items: flex-start;
-		gap: 0.25rem;
-	}
-
-	article :global(.prose li:has(.task-checkbox))::before {
-		display: none;
-	}
-
-	article :global(.prose li:has(.task-checkbox))::marker {
-		content: none;
-	}
-
-	article :global(.task-checkbox) {
-		margin-top: 0.15rem;
-		flex-shrink: 0;
-	}
-</style>

src/lib/components/TiptapEditor.svelte

@@ -10,6 +10,8 @@
 	import { TableRow } from '@tiptap/extension-table-row';
 	import { TableHeader } from '@tiptap/extension-table-header';
 	import { TableCell } from '@tiptap/extension-table-cell';
+	import TaskList from '@tiptap/extension-task-list';
+	import TaskItem from '@tiptap/extension-task-item';
 	import { Markdown } from 'tiptap-markdown';
 
 	interface Props {
@@ -38,6 +40,8 @@
 				TableRow,
 				TableHeader,
 				TableCell,
+					TaskList,
+				TaskItem.configure({ nested: true }),
 				Markdown
 			],
 			content,

src/lib/utils/markdown.ts

@@ -24,6 +24,17 @@ md.core.ruler.after('inline', 'task-lists', (state) => {
 			const token = new state.Token('html_inline', '', 0);
 			token.content = checkbox;
 			tokens[i].children!.unshift(token);
+
+			// Add task-list class to parent <ul> (once)
+			for (let j = i - 1; j >= 0; j--) {
+				if (tokens[j].type === 'bullet_list_open') {
+					const cls = tokens[j].attrGet('class') ?? '';
+					if (!cls.includes('task-list')) {
+						tokens[j].attrJoin('class', 'task-list');
+					}
+					break;
+				}
+			}
 		}
 	}
 });

src/routes/(app)/settings/+layout.svelte

@@ -32,7 +32,7 @@
 						class="flex items-center gap-2 rounded-sm px-3 py-2 text-sm whitespace-nowrap transition-colors {pathname === '/settings/mcp' ? 'bg-[var(--primary)]/15 text-[var(--primary)] font-medium' : 'text-[var(--text)] hover:bg-[var(--bg-base)]'}"
 					>
 						<Cpu size={16} />
-						MCP Server
+						API
 					</a>
 				</li>
 				{#if data.user?.role === 'admin'}

src/routes/(app)/settings/mcp/+page.svelte

@@ -122,7 +122,7 @@ ${mcpJsonConfig}`);
 		<h2 class="text-lg font-semibold text-[var(--text)]">API Keys</h2>
 	</div>
 	<p class="mb-4 text-xs text-[var(--text-muted)]">
-		API keys allow external tools (like Claude Code) to access your notes via the MCP protocol.
+		API keys allow external tools to access your notes via the MCP protocol and the REST API.
 	</p>
 
 	<!-- Create Key Form -->
@@ -229,9 +229,19 @@ ${mcpJsonConfig}`);
 	{/if}
 </section>
 
+<!-- REST API Example -->
+<section class="mb-6 rounded-sm border border-[var(--border-subtle)] bg-[var(--bg-surface)] p-6 shadow-[var(--card-shadow)]">
+	<h2 class="mb-4 text-lg font-semibold text-[var(--text)]">REST API</h2>
+	<p class="mb-3 text-xs text-[var(--text-muted)]">
+		Use your API key to authenticate requests to any <code class="rounded-sm bg-[var(--bg-base)] px-1 py-0.5">/api/*</code> endpoint:
+	</p>
+	<pre class="overflow-x-auto rounded-sm bg-[var(--bg-base)] p-3 text-xs text-[var(--text)]">curl -H "Authorization: Bearer {activeApiKey}" \
+  {baseUrl}/api/notes</pre>
+</section>
+
 <!-- MCP Config Help -->
 <section class="rounded-sm border border-[var(--border-subtle)] bg-[var(--bg-surface)] p-6 shadow-[var(--card-shadow)]">
-	<h2 class="mb-4 text-lg font-semibold text-[var(--text)]">Client Configuration</h2>
+	<h2 class="mb-4 text-lg font-semibold text-[var(--text)]">MCP Client Configuration</h2>
 	<p class="mb-3 text-xs text-[var(--text-muted)]">
 		Add this to your <code class="rounded-sm bg-[var(--bg-base)] px-1 py-0.5">.claude/settings.json</code> (Claude Code):
 	</p>

tests/e2e/settings.spec.ts

@@ -57,10 +57,10 @@ test.describe('Settings — API Key Management', () => {
 		// Given the user is on the settings page
 		await page.goto('/settings');
 
-		// When the user clicks the MCP Server nav link
-		await page.getByRole('link', { name: 'MCP Server' }).click();
+		// When the user clicks the API nav link
+		await page.getByRole('link', { name: 'API' }).click();
 
-		// Then the MCP settings page is shown
+		// Then the API settings page is shown
 		await expect(page).toHaveURL('/settings/mcp');
 		await expect(page.getByRole('heading', { name: 'API Keys' })).toBeVisible();
 

website/index.html

@@ -145,8 +145,8 @@
 					<div class="feature-icon">
 						<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="4" y="4" width="16" height="16" rx="2"/><path d="M9 9h6v6H9z"/><path d="M15 2v2"/><path d="M15 20v2"/><path d="M2 15h2"/><path d="M2 9h2"/><path d="M20 15h2"/><path d="M20 9h2"/><path d="M9 2v2"/><path d="M9 20v2"/></svg>
 					</div>
-					<h3>MCP Server</h3>
-					<p>Built-in AI integration. Connect Claude, Cursor, or any MCP client to read and write your notes.</p>
+					<h3>API & MCP</h3>
+					<p>Full REST API with token auth. Integrate with n8n, Zapier, or scripts. Built-in MCP server for AI tools like Claude and Cursor.</p>
 				</div>
 
 				<!-- Multi-User -->
@@ -253,7 +253,7 @@
 				<li><a href="https://github.com/bretzel-app/crumbs/blob/main/docs/DEPLOYMENT.md" target="_blank" rel="noopener">Docs</a></li>
 				<li><a href="https://github.com/bretzel-app/crumbs/blob/main/LICENSE" target="_blank" rel="noopener">License</a></li>
 			</ul>
-			<span class="footer-version">v0.14.0</span>
+			<span class="footer-version">v0.16.1</span>
 		</div>
 	</footer>