dineway 0.1.44 → 0.1.46

package/dist/ui/server-runtime.d.mts

@@ -1,11 +1,17 @@
-import "../types-C-CMfzSl.mjs";
-import { A as PageMetadataContribution, q as PublicPageContext } from "../types-BIM7jwxr.mjs";
-import { t as MediaReference } from "../types-t7_nCCA9.mjs";
-import { a as EmbedResult, i as EmbedOptions, m as MediaValue, o as ImageEmbed } from "../types-cn-fvYQ1.mjs";
-import { H as getSiteSettings, R as getComments, St as PublicComment, T as getMenu, _ as getTaxonomyTerms, ft as sanitizeHref, l as Widget, pt as getCollectionInfo, rt as getEditMeta, t as getWidgetArea, tt as getDinewayCollection } from "../index-Ct0pjZwW.mjs";
-import { a as generateSiteSeoContributions, d as resolvePageMetadata, i as generateBaseSeoContributions, o as renderFragments, u as renderPageMetadata } from "../jsonld-CLbYsYYH.mjs";
+import { C as getWidgetArea, Er as getCollectionInfo, Mn as getDinewayCollection, Pn as getEditMeta, Xn as sanitizeHref, Y as getMenu, ct as getComments, ft as getSiteSettings, hi as PublicComment, j as Widget, z as getTaxonomyTerms } from "../runtime-Cd-kjPfN.mjs";
+import "../types-DYKtk8f1.mjs";
+import { A as PageMetadataContribution, q as PublicPageContext } from "../types-UGmU5sWx.mjs";
+import "../types-Dryvv7LH.mjs";
+import { _ as MediaValue, c as EmbedResult, l as ImageEmbed, s as EmbedOptions } from "../placeholder-CXfoCtCd.mjs";
+import "../runner-Cnz4dl0f.mjs";
+import "../index-DJVaYiUV.mjs";
+import { t as MediaReference } from "../types-nP9vGUFq.mjs";
+import "../byline-fields-CaF_xfpj.mjs";
+import "../types-GaCtZ1k9.mjs";
+import "../validate-BJuG-ISL.mjs";
+import { a as generateSiteSeoContributions, d as resolvePageMetadata, i as generateBaseSeoContributions, o as renderFragments, u as renderPageMetadata } from "../jsonld-AcPnCEGD.mjs";
 import { getPageRuntime } from "../page/index.mjs";
-import { t as getMediaProvider } from "../provider-loader-B19YyyBp.mjs";
+import { t as getMediaProvider } from "../provider-loader-B5PMjpN7.mjs";
 
 //#region src/utils/sanitize.d.ts
 /**

package/dist/ui/server-runtime.mjs

@@ -1,22 +1,23 @@
-import "../dialect-helpers-TkdbkFad.mjs";
+import "../dialect-helpers-fk43GbDb.mjs";
 import "../base64-C1Q9yr0B.mjs";
-import "../types-D1DjBFA9.mjs";
-import "../media-Cg4zc9fq.mjs";
-import "../comment-BmJXz3lc.mjs";
+import "../types-Ck7-WoUD.mjs";
+import "../media-DhBwiCYR.mjs";
+import "../comment-ogMaF1gk.mjs";
 import "../options-BF11H_FD.mjs";
-import "../request-cache-BpwuE2ix.mjs";
-import "../fts-manager-DnfOsF4s.mjs";
-import "../registry-i__XP2WV.mjs";
-import "../loader-p2imNN98.mjs";
-import { i as getSiteSettings, s as buildRenderMediaUrl } from "../settings-DORe02PC.mjs";
-import { t as getCollectionInfo } from "../query-BnRpB09I.mjs";
-import { a as getTaxonomyTerms } from "../taxonomies-BVBKoXRf.mjs";
-import { n as sanitizeHref } from "../url-BzhfYtRn.mjs";
-import { r as getEditMeta, t as getDinewayCollection } from "../query-DHvNhBhi.mjs";
-import { i as getComments, t as getMenu } from "../menus-DzG3-9tQ.mjs";
-import { t as getWidgetArea } from "../widgets-Cj6ULpED.mjs";
-import { t as getMediaProvider } from "../provider-loader-BdRV01gr.mjs";
-import { c as escapeHtmlAttr, l as renderPageMetadata, n as generateSiteSeoContributions, o as renderFragments, t as generateBaseSeoContributions, u as resolvePageMetadata } from "../seo-contributions-C0LXoWw3.mjs";
+import "../request-cache-w5cj5itT.mjs";
+import "../fts-manager-EHY2Kes9.mjs";
+import "../registry-Cq3QRBW2.mjs";
+import "../loader-Y0QvC_QO.mjs";
+import { i as getSiteSettings, s as buildRenderMediaUrl } from "../settings-DNRQuX3d.mjs";
+import { t as getCollectionInfo } from "../query-BJuUydtD.mjs";
+import "../resolve-DTuDyYKs.mjs";
+import { a as getTaxonomyTerms } from "../taxonomies-faQVeMgj.mjs";
+import { n as sanitizeHref } from "../url-w7Mp5qAD.mjs";
+import { r as getEditMeta, t as getDinewayCollection } from "../query-CSx0EdSW.mjs";
+import { i as getComments, t as getMenu } from "../menus-fqqzXyHd.mjs";
+import { t as getWidgetArea } from "../widgets-CdDvF4fV.mjs";
+import { t as getMediaProvider } from "../provider-loader-DzUxejk7.mjs";
+import { c as escapeHtmlAttr, l as renderPageMetadata, n as generateSiteSeoContributions, o as renderFragments, t as generateBaseSeoContributions, u as resolvePageMetadata } from "../seo-contributions-CqVvReEj.mjs";
 import { getPageRuntime } from "../page/index.mjs";
 import sanitizeHtml from "sanitize-html";
 

package/dist/{user-2aI21yV1.mjs → user-CqZwN21P.mjs}

@@ -1,4 +1,4 @@
-import { n as decodeCursor, r as encodeCursor } from "./types-D1DjBFA9.mjs";
+import { n as decodeCursor, r as encodeCursor } from "./types-Ck7-WoUD.mjs";
 import { ulid } from "ulidx";
 
 //#region src/database/repositories/user.ts

package/dist/{validate-CvQ6cvHH.d.mts → validate-BJuG-ISL.d.mts}

@@ -1,6 +1,7 @@
-import { t as Database } from "./types-C-CMfzSl.mjs";
-import { i as SiteSettings, m as FieldType } from "./types-t7_nCCA9.mjs";
-import { d as Storage } from "./types-BYjPylrZ.mjs";
+import { d as FieldType } from "./types-DEAQG87T.mjs";
+import { t as Database } from "./types-DYKtk8f1.mjs";
+import { d as Storage } from "./types-DZpT-PnG.mjs";
+import { i as SiteSettings } from "./types-nP9vGUFq.mjs";
 import { Kysely } from "kysely";
 
 //#region src/seed/types.d.ts
@@ -189,6 +190,23 @@ interface SeedByline {
   bio?: string;
   websiteUrl?: string;
   isGuest?: boolean;
+  /**
+   * Avatar for the byline, seeded as an already-stored media item. Nothing is
+   * downloaded: the caller supplies the storage key of an existing file.
+   */
+  avatar?: SeedBylineAvatar;
+}
+interface SeedBylineAvatar {
+  /** Storage key of an avatar file that already exists in configured storage. */
+  storageKey: string;
+  /** Alt text for the avatar image. */
+  alt?: string;
+  /** Filename for the media record. Defaults to the storage key basename. */
+  filename?: string;
+  /** MIME type for the media record. Defaults to image/jpeg. */
+  mimeType?: string;
+  width?: number;
+  height?: number;
 }
 /**
  * Content entry in seed

package/dist/{validate-JE-WfUQ5.mjs → validate-CK4a1sIF.mjs}

@@ -1,5 +1,5 @@
-import { t as __exportAll } from "./chunk-ClPoSABd.mjs";
-import { t as FIELD_TYPES } from "./types-C3Em8xpG.mjs";
+import { a as __exportAll } from "./runner-DTfG5v0G.mjs";
+import { n as FIELD_TYPES } from "./types-DbZhHtqS.mjs";
 
 //#region src/seed/validate.ts
 /**
@@ -226,6 +226,26 @@ function validateSeed(data) {
 				bylineSlugs.add(byline.slug);
 			}
 			if (!byline.displayName) errors.push(`${prefix}: displayName is required`);
+			if (byline.avatar !== void 0) {
+				const avatar = byline.avatar;
+				if (!isRecord(avatar)) errors.push(`${prefix}.avatar: must be an object`);
+				else {
+					if (typeof avatar.storageKey !== "string" || avatar.storageKey.length === 0 || avatar.storageKey !== avatar.storageKey.trim()) errors.push(`${prefix}.avatar.storageKey: must be a non-empty string with no leading or trailing whitespace`);
+					for (const key of [
+						"alt",
+						"filename",
+						"mimeType"
+					]) if (avatar[key] !== void 0 && typeof avatar[key] !== "string") errors.push(`${prefix}.avatar.${key}: must be a string`);
+					for (const key of ["filename", "mimeType"]) {
+						const value = avatar[key];
+						if (typeof value === "string" && (value.length === 0 || value !== value.trim())) errors.push(`${prefix}.avatar.${key}: must not be empty or whitespace-padded`);
+					}
+					for (const key of ["width", "height"]) {
+						const value = avatar[key];
+						if (value !== void 0 && (typeof value !== "number" || !Number.isFinite(value) || value < 0)) errors.push(`${prefix}.avatar.${key}: must be a non-negative number`);
+					}
+				}
+			}
 		}
 	}
 	if (seed.content) if (typeof seed.content !== "object" || Array.isArray(seed.content)) errors.push("content must be an object (collection -> entries)");

package/dist/version-Cg6ur4zS.mjs

@@ -0,0 +1,6 @@
+//#region src/version.ts
+const VERSION = "0.1.46";
+const COMMIT = "74b06bd1";
+
+//#endregion
+export { VERSION as n, COMMIT as t };

package/dist/{widgets-Cj6ULpED.mjs → widgets-CdDvF4fV.mjs}

@@ -1,5 +1,5 @@
-import { r as getDb } from "./loader-p2imNN98.mjs";
-import { t as getWidgetComponents$1 } from "./components-BJfa-F6n.mjs";
+import { r as getDb } from "./loader-Y0QvC_QO.mjs";
+import { t as getWidgetComponents$1 } from "./components--pg6zBvu.mjs";
 
 //#region src/widgets/index.ts
 /**

package/dist/{wordpress-slugs-hqItqJrQ.mjs → wordpress-slugs-B6Gw9q3Q.mjs}

@@ -1,4 +1,4 @@
-import { r as RESERVED_COLLECTION_SLUGS } from "./types-C3Em8xpG.mjs";
+import { a as RESERVED_COLLECTION_SLUGS } from "./types-DbZhHtqS.mjs";
 
 //#region src/import/wordpress-slugs.ts
 const INVALID_SLUG_CHARS = /[^a-z0-9_]/g;

package/dist/{zod-generator-C4BgFBZV.mjs → zod-generator-D1ROBNuC.mjs}

@@ -1,5 +1,5 @@
-import { t as __exportAll } from "./chunk-ClPoSABd.mjs";
-import { n as hashString } from "./hash-DFFrkivP.mjs";
+import { a as __exportAll } from "./runner-DTfG5v0G.mjs";
+import { n as hashString } from "./hash-BPmX6P8I.mjs";
 import { z } from "zod";
 
 //#region src/schema/zod-generator.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dineway",
-  "version": "0.1.44",
+  "version": "0.1.46",
   "description": "Agentic Website builder for restaurants — structured content meets AI via the Model Context Protocol",
   "type": "module",
   "publishConfig": {
@@ -319,11 +319,12 @@
     }
   },
   "dependencies": {
-    "@cloudflare/kumo": "^1.16.0",
+    "@cloudflare/kumo": "^2.3.0",
     "@floating-ui/react": "^0.27.16",
     "@modelcontextprotocol/sdk": "^1.26.0",
     "@portabletext/toolkit": "^5.0.1",
     "@tiptap/core": "^3.20.0",
+    "@tiptap/extension-code-block": "^3.20.0",
     "@tiptap/extension-focus": "^3.20.0",
     "@tiptap/extension-image": "^3.20.0",
     "@tiptap/extension-link": "^3.20.0",
@@ -354,9 +355,9 @@
     "ulidx": "^2.4.1",
     "upng-js": "^2.1.0",
     "zod": "^4.4.1",
-    "@dineway-ai/admin": "^0.1.15",
-    "@dineway-ai/auth": "^0.1.15",
-    "@dineway-ai/gutenberg-to-portable-text": "^0.1.13"
+    "@dineway-ai/admin": "^0.1.16",
+    "@dineway-ai/auth": "^0.1.16",
+    "@dineway-ai/gutenberg-to-portable-text": "^0.1.14"
   },
   "optionalDependencies": {
     "@aws-sdk/client-s3": "^3.1049.0",
@@ -373,8 +374,6 @@
   "devDependencies": {
     "@apidevtools/swagger-parser": "^12.1.0",
     "@arethetypeswrong/cli": "^0.18.2",
-    "@rivet-dev/agent-os-common": "^0.0.260331072558",
-    "@rivet-dev/agent-os-core": "^0.1.1",
     "@types/better-sqlite3": "^7.6.12",
     "@types/pg": "^8.16.0",
     "@types/react": "19.2.14",
@@ -387,7 +386,7 @@
     "vite": "^6.0.0",
     "vitest": "^4.0.18",
     "zod-openapi": "^5.4.6",
-    "@dineway-ai/blocks": "^0.1.13"
+    "@dineway-ai/blocks": "^0.1.14"
   },
   "keywords": [
     "astro",

package/src/components/InlinePortableTextEditor.tsx

@@ -26,6 +26,8 @@ import { computeThumbnailSize } from "dineway/ui/client-runtime";
 import * as React from "react";
 import { createPortal } from "react-dom";
 
+import { InlineCodeBlockExtension } from "./inline-code-block.js";
+
 // ── Portable Text types ────────────────────────────────────────────
 
 interface PTSpan {
@@ -181,6 +183,14 @@ function convertPMNode(node: PMNode): PTBlock | PTBlock[] | null {
 				language: attrStrOpt(node.attrs, "language"),
 			};
 		}
+		case "htmlBlock": {
+			const rawHtml = node.attrs?.html;
+			return {
+				_type: "htmlBlock",
+				_key: k(),
+				html: typeof rawHtml === "string" ? rawHtml : "",
+			};
+		}
 		case "image": {
 			const provider = attrStrOpt(node.attrs, "provider");
 			return {
@@ -386,6 +396,13 @@ function convertPTBlock(block: PTBlock): JSONContent | null {
 	if (block._type === "break") {
 		return { type: "horizontalRule" };
 	}
+	if (block._type === "htmlBlock") {
+		const htmlBlock = block as PTBlock & { html?: string };
+		return {
+			type: "htmlBlock",
+			attrs: { html: htmlBlock.html || "" },
+		};
+	}
 	if (block._type === "image") {
 		const ib = block as PTBlock & {
 			asset?: { _ref?: string; url?: string; provider?: string };
@@ -513,6 +530,37 @@ function convertPTMarks(marks: string[], markDefs: Map<string, PTMarkDef>): Mark
 	return pm;
 }
 
+const htmlBlockExtension = Node.create({
+	name: "htmlBlock",
+	group: "block",
+	atom: true,
+	selectable: true,
+	draggable: true,
+
+	addAttributes() {
+		const noDom = { rendered: false, parseHTML: () => null };
+		return {
+			html: { default: "", ...noDom },
+		};
+	},
+
+	parseHTML() {
+		return [{ tag: 'div[data-dineway-html-block="true"]' }];
+	},
+
+	renderHTML({ HTMLAttributes }) {
+		return [
+			"div",
+			mergeAttributes(HTMLAttributes, {
+				"data-dineway-html-block": "true",
+				class: "dineway-plugin-block-placeholder",
+				contenteditable: "false",
+			}),
+			"HTML block (edit in admin)",
+		];
+	},
+});
+
 const pluginBlockExtension = Node.create({
 	name: "pluginBlock",
 	group: "block",
@@ -766,6 +814,21 @@ const slashCommands: SlashCommandItem[] = [
 			editor.chain().focus().deleteRange(range).toggleCodeBlock().run();
 		},
 	},
+	{
+		id: "htmlBlock",
+		title: "HTML",
+		description: "Insert raw HTML",
+		icon: "< >",
+		aliases: ["html", "raw", "markup"],
+		command: ({ editor, range }) => {
+			editor
+				.chain()
+				.focus()
+				.deleteRange(range)
+				.insertContent({ type: "htmlBlock", attrs: { html: "" } })
+				.run();
+		},
+	},
 	{
 		id: "divider",
 		title: "Divider",
@@ -1746,7 +1809,9 @@ export function InlinePortableTextEditor({
 			StarterKit.configure({
 				heading: { levels: [1, 2, 3] },
 				dropcursor: { color: "#3b82f6", width: 2 },
+				codeBlock: false,
 			}),
+			InlineCodeBlockExtension,
 			Image.extend({
 				addAttributes() {
 					return {
@@ -1778,6 +1843,7 @@ export function InlinePortableTextEditor({
 				mode: "all",
 			}),
 			Typography,
+			htmlBlockExtension,
 			pluginBlockExtension,
 			slashCommandsExtension,
 		],

package/src/components/code-block-languages.ts

@@ -0,0 +1,76 @@
+export interface CodeBlockLanguage {
+	id: string;
+	label: string;
+	aliases?: string[];
+}
+
+export const CODE_BLOCK_LANGUAGES: readonly CodeBlockLanguage[] = [
+	{ id: "plaintext", label: "Plain text", aliases: ["text", "plain", "txt"] },
+	{ id: "astro", label: "Astro" },
+	{ id: "bash", label: "Bash", aliases: ["sh", "shell", "zsh"] },
+	{ id: "c", label: "C" },
+	{ id: "cpp", label: "C++", aliases: ["c++"] },
+	{ id: "csharp", label: "C#", aliases: ["cs", "c#"] },
+	{ id: "css", label: "CSS" },
+	{ id: "diff", label: "Diff", aliases: ["patch"] },
+	{ id: "dockerfile", label: "Dockerfile", aliases: ["docker"] },
+	{ id: "go", label: "Go", aliases: ["golang"] },
+	{ id: "graphql", label: "GraphQL", aliases: ["gql"] },
+	{ id: "html", label: "HTML" },
+	{ id: "java", label: "Java" },
+	{ id: "javascript", label: "JavaScript", aliases: ["js"] },
+	{ id: "json", label: "JSON" },
+	{ id: "jsx", label: "JSX" },
+	{ id: "kotlin", label: "Kotlin", aliases: ["kt"] },
+	{ id: "markdown", label: "Markdown", aliases: ["md"] },
+	{ id: "mdx", label: "MDX" },
+	{ id: "php", label: "PHP" },
+	{ id: "python", label: "Python", aliases: ["py"] },
+	{ id: "ruby", label: "Ruby", aliases: ["rb"] },
+	{ id: "rust", label: "Rust", aliases: ["rs"] },
+	{ id: "scss", label: "SCSS", aliases: ["sass"] },
+	{ id: "sql", label: "SQL" },
+	{ id: "svelte", label: "Svelte" },
+	{ id: "swift", label: "Swift" },
+	{ id: "toml", label: "TOML" },
+	{ id: "tsx", label: "TSX" },
+	{ id: "typescript", label: "TypeScript", aliases: ["ts"] },
+	{ id: "vue", label: "Vue" },
+	{ id: "xml", label: "XML" },
+	{ id: "yaml", label: "YAML", aliases: ["yml"] },
+];
+
+export function findCodeBlockLanguage(value: string | null | undefined): CodeBlockLanguage | null {
+	if (!value) return null;
+	const needle = value.trim().toLowerCase();
+	if (!needle) return null;
+	for (const language of CODE_BLOCK_LANGUAGES) {
+		if (language.id === needle) return language;
+		if (language.aliases?.includes(needle)) return language;
+	}
+	return null;
+}
+
+const DISALLOWED_LANGUAGE_CHARS = /[^a-z0-9_-]+/g;
+const EDGE_HYPHENS = /^-+|-+$/g;
+
+export function normalizeCodeBlockLanguage(value: string | null | undefined): string | undefined {
+	if (!value) return undefined;
+	const trimmed = value.trim();
+	if (!trimmed) return undefined;
+
+	const knownLanguage = findCodeBlockLanguage(trimmed);
+	if (knownLanguage) return knownLanguage.id;
+
+	const sanitized = trimmed
+		.toLowerCase()
+		.replace(DISALLOWED_LANGUAGE_CHARS, "-")
+		.replace(EDGE_HYPHENS, "");
+	return sanitized || undefined;
+}
+
+export function formatCodeBlockLanguageLabel(value: string | null | undefined): string {
+	if (!value) return "Plain text";
+	const knownLanguage = findCodeBlockLanguage(value);
+	return knownLanguage?.label ?? value;
+}

package/src/components/inline-code-block.tsx

@@ -0,0 +1,241 @@
+import CodeBlock from "@tiptap/extension-code-block";
+import type { NodeViewProps } from "@tiptap/react";
+import { NodeViewContent, NodeViewWrapper, ReactNodeViewRenderer } from "@tiptap/react";
+import * as React from "react";
+
+import {
+	CODE_BLOCK_LANGUAGES,
+	formatCodeBlockLanguageLabel,
+	normalizeCodeBlockLanguage,
+} from "./code-block-languages.js";
+
+function LanguageOptions({ id }: { id: string }) {
+	return (
+		<datalist id={id}>
+			{CODE_BLOCK_LANGUAGES.map((language) => (
+				<option key={language.id} value={language.id} label={language.label} />
+			))}
+		</datalist>
+	);
+}
+
+const iconButtonStyle: React.CSSProperties = {
+	alignItems: "center",
+	background: "transparent",
+	border: "none",
+	borderRadius: "0.25rem",
+	color: "inherit",
+	cursor: "pointer",
+	display: "inline-flex",
+	height: "1.75rem",
+	justifyContent: "center",
+	padding: 0,
+	width: "1.75rem",
+};
+
+function CheckIcon() {
+	return (
+		<svg
+			width="14"
+			height="14"
+			viewBox="0 0 24 24"
+			fill="none"
+			stroke="currentColor"
+			strokeWidth="2.5"
+			strokeLinecap="round"
+			strokeLinejoin="round"
+			aria-hidden="true"
+		>
+			<polyline points="20 6 9 17 4 12" />
+		</svg>
+	);
+}
+
+function XIcon() {
+	return (
+		<svg
+			width="14"
+			height="14"
+			viewBox="0 0 24 24"
+			fill="none"
+			stroke="currentColor"
+			strokeWidth="2.5"
+			strokeLinecap="round"
+			strokeLinejoin="round"
+			aria-hidden="true"
+		>
+			<line x1="18" y1="6" x2="6" y2="18" />
+			<line x1="6" y1="6" x2="18" y2="18" />
+		</svg>
+	);
+}
+
+function InlineCodeBlockNodeView({ node, selected, updateAttributes }: NodeViewProps) {
+	const [isEditing, setIsEditing] = React.useState(false);
+	const [isHovered, setIsHovered] = React.useState(false);
+	const storedLanguage = typeof node.attrs.language === "string" ? node.attrs.language : "";
+	const [draft, setDraft] = React.useState(storedLanguage);
+	const inputRef = React.useRef<HTMLInputElement>(null);
+	const popoverRef = React.useRef<HTMLDivElement>(null);
+	const datalistId = React.useId();
+
+	React.useEffect(() => {
+		if (!isEditing) {
+			setDraft(storedLanguage);
+		}
+	}, [isEditing, storedLanguage]);
+
+	const openPicker = React.useCallback(() => {
+		setDraft(storedLanguage);
+		setIsEditing(true);
+		window.setTimeout(() => inputRef.current?.focus(), 0);
+	}, [storedLanguage]);
+
+	const closePicker = React.useCallback(() => {
+		setDraft(storedLanguage);
+		setIsEditing(false);
+	}, [storedLanguage]);
+
+	const commit = React.useCallback(() => {
+		const nextLanguage = normalizeCodeBlockLanguage(draft);
+		updateAttributes({ language: nextLanguage ?? null });
+		setIsEditing(false);
+	}, [draft, updateAttributes]);
+
+	const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
+		if (event.key === "Enter") {
+			event.preventDefault();
+			commit();
+		} else if (event.key === "Escape") {
+			event.preventDefault();
+			closePicker();
+		}
+	};
+
+	React.useEffect(() => {
+		if (!isEditing) return undefined;
+		const onMouseDown = (event: MouseEvent) => {
+			const target = event.target instanceof Node ? event.target : null;
+			if (popoverRef.current && target && !popoverRef.current.contains(target)) {
+				closePicker();
+			}
+		};
+		document.addEventListener("mousedown", onMouseDown);
+		return () => document.removeEventListener("mousedown", onMouseDown);
+	}, [closePicker, isEditing]);
+
+	const chipVisible = isHovered || selected || isEditing || Boolean(storedLanguage);
+	const label = formatCodeBlockLanguageLabel(storedLanguage);
+
+	return (
+		<NodeViewWrapper
+			className="dineway-inline-code-block"
+			data-language={storedLanguage || undefined}
+			style={{ margin: "1rem 0", position: "relative" }}
+			onMouseEnter={() => setIsHovered(true)}
+			onMouseLeave={() => setIsHovered(false)}
+		>
+			<LanguageOptions id={datalistId} />
+			<pre>
+				<NodeViewContent<"code"> as="code" />
+			</pre>
+			<div
+				contentEditable={false}
+				aria-hidden={chipVisible ? undefined : true}
+				style={{
+					insetInlineEnd: "0.5rem",
+					opacity: chipVisible ? 1 : 0,
+					pointerEvents: chipVisible ? "auto" : "none",
+					position: "absolute",
+					top: "0.5rem",
+					transition: "opacity 0.15s",
+					userSelect: "none",
+					zIndex: 1,
+				}}
+			>
+				{isEditing ? (
+					<div
+						ref={popoverRef}
+						style={{
+							alignItems: "center",
+							background: "var(--dineway-inline-bg, #fff)",
+							border: "1px solid rgba(0, 0, 0, 0.12)",
+							borderRadius: "0.375rem",
+							boxShadow: "0 4px 12px rgba(0, 0, 0, 0.12)",
+							display: "flex",
+							gap: "0.25rem",
+							padding: "0.25rem",
+						}}
+					>
+						<input
+							ref={inputRef}
+							type="text"
+							list={datalistId}
+							value={draft}
+							onChange={(event) => setDraft(event.target.value)}
+							onKeyDown={handleKeyDown}
+							placeholder="Language"
+							aria-label="Language"
+							style={{
+								background: "transparent",
+								border: "1px solid rgba(0, 0, 0, 0.16)",
+								borderRadius: "0.25rem",
+								color: "inherit",
+								fontSize: "0.75rem",
+								height: "1.75rem",
+								padding: "0 0.5rem",
+								width: "10rem",
+							}}
+						/>
+						<button
+							type="button"
+							style={iconButtonStyle}
+							onMouseDown={(event) => event.preventDefault()}
+							onClick={commit}
+							title="Apply language"
+							aria-label="Apply language"
+						>
+							<CheckIcon />
+						</button>
+						<button
+							type="button"
+							style={iconButtonStyle}
+							onMouseDown={(event) => event.preventDefault()}
+							onClick={closePicker}
+							title="Cancel"
+							aria-label="Cancel"
+						>
+							<XIcon />
+						</button>
+					</div>
+				) : (
+					<button
+						type="button"
+						tabIndex={chipVisible ? 0 : -1}
+						onMouseDown={(event) => event.preventDefault()}
+						onClick={openPicker}
+						title="Set language"
+						aria-label={`Set language (current: ${label})`}
+						style={{
+							background: "rgba(255, 255, 255, 0.9)",
+							border: "1px solid rgba(0, 0, 0, 0.12)",
+							borderRadius: "0.375rem",
+							color: "rgba(0, 0, 0, 0.65)",
+							cursor: "pointer",
+							fontSize: "0.75rem",
+							padding: "0.125rem 0.5rem",
+						}}
+					>
+						{storedLanguage ? label : "Set language"}
+					</button>
+				)}
+			</div>
+		</NodeViewWrapper>
+	);
+}
+
+export const InlineCodeBlockExtension = CodeBlock.extend({
+	addNodeView() {
+		return ReactNodeViewRenderer(InlineCodeBlockNodeView);
+	},
+});