@vibesdotdev/chat 0.0.0-stage → 1.0.0-rc.1

package/dist/svelte/components/runtime/RuntimeChatDialogHost.svelte

@@ -0,0 +1,288 @@
+<script lang="ts">
+ import { useChatSurface } from "../../surface-context.js";
+ const { chatRoomStore } = useChatSurface();
+	import { onMount } from 'svelte';
+	import type { Component } from 'svelte';
+	import * as z from 'zod/v4';
+	import { valueFreeFailure, type VibesRuntime } from '@vibesdotdev/kernel';
+	import { getRuntimeSvelteContext } from '@vibesdotdev/surface-sveltekit/svelte';
+	import { createEmptyStagedContext } from '@vibesdotdev/ai/context/schemas/staged-context-helpers';
+	import type { TextGenerationStagedContext } from '@vibesdotdev/ai-schemas/generation/contracts';
+	import {
+		CHAT_DIALOG_WIDGET_KIND,
+		CHAT_DIALOG_WIDGETS_CHANGED_EVENT,
+		resolveRuntimeChatDialogWidgets,
+		type ChatDialogWidgetDescriptor,
+		type RuntimeChatDialogWidgetProps,
+		type RuntimeChatDialogWidgetPropMap
+	} from '../../dialog-widgets.js';
+	import { stageChatAttachment, type ChatAttachmentStageInput } from '../../attachments.js';
+
+	const uploadedItemSchema = z.looseObject({
+		id: z.string().optional(),
+		name: z.string().optional(),
+		fileName: z.string().optional(),
+		size: z.number().optional(),
+		status: z.enum(['queued', 'uploading', 'failed', 'ready']).optional(),
+		source: z.enum(['chat-upload', 'platform-storage', 'inline']).optional(),
+		type: z.string().optional(),
+		contentType: z.string().optional(),
+		url: z.string().optional(),
+		error: z.string().optional()
+	});
+
+	type UploadedItemCandidate = z.infer<typeof uploadedItemSchema>;
+	type UploadedItemsPayload = UploadedItemCandidate | readonly UploadedItemCandidate[];
+
+	type DialogWidgetProps = {
+		open?: boolean;
+		stagedContext?: TextGenerationStagedContext;
+		descriptor?: ChatDialogWidgetDescriptor;
+		eventDetail?: RuntimeChatDialogWidgetPropMap;
+		roomId?: string | null;
+		onInsert?: (content: string) => void;
+		onPromptInsert?: (content: string) => void;
+		onUploaded?: (items: UploadedItemsPayload) => void;
+		onAttachUploaded?: (items: UploadedItemsPayload) => void;
+		onNotice?: (message: string) => void;
+		onError?: (message: string) => void;
+	};
+
+	type DialogWidgetComponent = Component<DialogWidgetProps>;
+
+	interface DialogWidgetRecord {
+		descriptor: ChatDialogWidgetDescriptor;
+		component: DialogWidgetComponent;
+		open: boolean;
+		eventDetail: RuntimeChatDialogWidgetPropMap;
+	}
+
+	const dialogWidgetComponentSchema = z.custom<DialogWidgetComponent>((v) => v instanceof Function);
+	const normalizedComponentCandidateSchema = z.looseObject({
+		default: dialogWidgetComponentSchema.optional(),
+		component: dialogWidgetComponentSchema.optional()
+	});
+
+	const propMapCandidateSchema = z.record(
+		z.string(),
+		z.union([z.string(), z.number(), z.boolean(), z.null(), z.undefined(), z.array(z.string())])
+	);
+
+	const runtimeStore = getRuntimeSvelteContext();
+
+	let {
+		roomId = null,
+		stagedContext = $bindable<TextGenerationStagedContext>(createEmptyStagedContext()),
+		widgetProps = {},
+		disabledDialogs = [],
+		onPromptInsert,
+		onNotice = (_message: string) => {},
+		onError = (_message: string) => {}
+	}: {
+		roomId?: string | null;
+		stagedContext?: TextGenerationStagedContext;
+		widgetProps?: RuntimeChatDialogWidgetProps;
+		disabledDialogs?: readonly string[];
+		onPromptInsert?: (content: string) => void;
+		onNotice?: (message: string) => void;
+		onError?: (message: string) => void;
+	} = $props();
+
+	let records = $state<DialogWidgetRecord[]>([]);
+	let listeners: [string, EventListener][] = [];
+
+	const disabledDialogSet = $derived(new Set(disabledDialogs));
+
+	function eventNameForWidget(widget: ChatDialogWidgetDescriptor): string {
+		return widget.event ?? `chat:open-${widget.dialog}`;
+	}
+
+	function isDialogWidgetComponent(value: WeakKey | null | undefined): value is DialogWidgetComponent {
+		return value instanceof Function;
+	}
+
+	function normalizeComponent(value: WeakKey | null | undefined): DialogWidgetComponent | null {
+		if (isDialogWidgetComponent(value)) return value;
+		const parsed = normalizedComponentCandidateSchema.safeParse(value);
+		if (!parsed.success) return null;
+		return parsed.data.default ?? parsed.data.component ?? null;
+	}
+
+	function explicitWidgetIds(runtime: VibesRuntime): Set<string> {
+		if (!runtime.hasKind(CHAT_DIALOG_WIDGET_KIND)) return new Set();
+		return new Set(runtime.assets(CHAT_DIALOG_WIDGET_KIND).available());
+	}
+
+	function removeListeners() {
+		const win = globalThis.window;
+		if (!win) return;
+		for (const [eventName, listener] of listeners) {
+			win.removeEventListener(eventName, listener);
+		}
+		listeners = [];
+	}
+
+	function registerListeners() {
+		const win = globalThis.window;
+		if (!win) return;
+		removeListeners();
+		const registeredEvents = new Set<string>();
+		for (const record of records) {
+			const eventName = eventNameForWidget(record.descriptor);
+			if (registeredEvents.has(eventName)) continue;
+			const listener: EventListener = (event) => openWidget(record.descriptor.id, event);
+			win.addEventListener(eventName, listener);
+			listeners.push([eventName, listener]);
+			registeredEvents.add(eventName);
+		}
+	}
+
+	function openWidget(widgetId: string, event: Event) {
+		records = records.map((record) => {
+			if (record.descriptor.id !== widgetId) return record;
+			if (record.descriptor.requiresRoom && !roomId) {
+				onNotice(`${record.descriptor.name ?? 'This option'} is available after the conversation starts.`);
+				return record;
+			}
+			let eventDetail: RuntimeChatDialogWidgetPropMap = {};
+			if ('detail' in event && event.detail instanceof Object) {
+				const parsed = propMapCandidateSchema.safeParse(event.detail);
+				if (parsed.success) {
+					eventDetail = parsed.data;
+				}
+			}
+			return {
+				...record,
+				open: true,
+				eventDetail
+			};
+		});
+	}
+
+	async function refreshWidgets() {
+		const runtime = await runtimeStore.load();
+		const availableIds = explicitWidgetIds(runtime);
+		const existingById = new Map(records.map((record) => [record.descriptor.id, record]));
+		const widgets = resolveRuntimeChatDialogWidgets(runtime).filter(
+			(widget) => !disabledDialogSet.has(widget.dialog)
+		);
+		const settled = await Promise.allSettled(
+			widgets.map(async (widget) => {
+				const implementationId = widget.implementationId ?? widget.id;
+				if (!availableIds.has(implementationId)) return null;
+				const resolved = await runtime
+					.query<ChatDialogWidgetDescriptor, WeakKey | null | undefined>(CHAT_DIALOG_WIDGET_KIND)
+					.withId(implementationId)
+					.resolve();
+				const component = normalizeComponent(resolved);
+				return component ? { widget, component } : null;
+			})
+		);
+		const next: DialogWidgetRecord[] = [];
+		for (const result of settled) {
+			if (result.status === 'fulfilled') {
+				if (!result.value) continue;
+				const { widget, component } = result.value;
+				const existing = existingById.get(widget.id);
+				next.push({
+					descriptor: widget,
+					component,
+					open: existing?.open ?? false,
+					eventDetail: existing?.eventDetail ?? {}
+				});
+			} else {
+				const failure = valueFreeFailure(result.reason);
+				onError(failure.reason ?? failure.name ?? 'Could not load dialog widget.');
+			}
+		}
+		records = next;
+		registerListeners();
+	}
+
+	function propsForWidget(widget: ChatDialogWidgetDescriptor): RuntimeChatDialogWidgetPropMap {
+		return widgetProps[widget.id] ?? widgetProps[widget.dialog] ?? {};
+	}
+
+	function stageUploadedItems(items: UploadedItemsPayload) {
+		const list = Array.isArray(items) ? items : [items];
+		let staged = 0;
+		let invalid = 0;
+		for (const item of list) {
+			const input = toChatAttachmentInput(item);
+			if (!input) {
+				invalid += 1;
+				continue;
+			}
+			stageChatAttachment(input, chatRoomStore);
+			staged += 1;
+		}
+		if (staged === 0 && list.length > 0) {
+			onError('The uploaded files could not be added to your message. Try attaching them again.');
+		} else if (invalid > 0) {
+			onNotice?.(`Added ${staged} attachment${staged === 1 ? '' : 's'}; ${invalid} invalid upload${invalid === 1 ? '' : 's'} skipped.`);
+		}
+	}
+
+	function toChatAttachmentInput(item: UploadedItemCandidate): ChatAttachmentStageInput | null {
+		const parsed = uploadedItemSchema.safeParse(item);
+		if (!parsed.success) return null;
+		const data = parsed.data;
+		const name = data.name ?? data.fileName;
+		if (!name) return null;
+		const status =
+			data.status === 'queued' || data.status === 'uploading'
+				? 'uploading'
+				: data.status === 'failed'
+					? 'failed'
+					: 'ready';
+		const source = data.source ?? 'platform-storage';
+		return {
+			id: data.id ?? createAttachmentId(),
+			name,
+			size: data.size && Number.isFinite(data.size) ? data.size : 0,
+			type: data.type ?? data.contentType,
+			url: data.url,
+			status,
+			source,
+			error: data.error
+		};
+	}
+
+	function createAttachmentId(): string {
+		const c = globalThis.crypto;
+		if (c && 'randomUUID' in c) return c.randomUUID();
+		return `attachment-${Date.now()}-${Math.random().toString(36).slice(2)}`;
+	}
+
+	onMount(() => {
+		void refreshWidgets();
+		const win = globalThis.window;
+		if (!win) return;
+		const refreshListener = () => {
+			void refreshWidgets();
+		};
+		win.addEventListener(CHAT_DIALOG_WIDGETS_CHANGED_EVENT, refreshListener);
+		return () => {
+			win.removeEventListener(CHAT_DIALOG_WIDGETS_CHANGED_EVENT, refreshListener);
+			removeListeners();
+		};
+	});
+</script>
+
+{#each records as record (record.descriptor.id)}
+	{@const Component = record.component}
+	<Component
+		{...propsForWidget(record.descriptor)}
+		bind:open={record.open}
+		bind:stagedContext
+		descriptor={record.descriptor}
+		eventDetail={record.eventDetail}
+		{roomId}
+		onInsert={onPromptInsert}
+		onPromptInsert={onPromptInsert}
+		onUploaded={stageUploadedItems}
+		onAttachUploaded={stageUploadedItems}
+		{onNotice}
+		{onError}
+	/>
+{/each}

package/dist/svelte/components/runtime/RuntimeChatDialogHost.svelte.d.ts

@@ -0,0 +1,16 @@
+import type { Component } from 'svelte';
+import type { TextGenerationStagedContext } from '@vibesdotdev/ai-schemas/generation/contracts';
+import { type RuntimeChatDialogWidgetProps } from '../../dialog-widgets.ts';
+type $$ComponentProps = {
+    roomId?: string | null;
+    stagedContext?: TextGenerationStagedContext;
+    widgetProps?: RuntimeChatDialogWidgetProps;
+    disabledDialogs?: readonly string[];
+    onPromptInsert?: (content: string) => void;
+    onNotice?: (message: string) => void;
+    onError?: (message: string) => void;
+};
+declare const RuntimeChatDialogHost: Component<$$ComponentProps, {}, "stagedContext">;
+type RuntimeChatDialogHost = ReturnType<typeof RuntimeChatDialogHost>;
+export default RuntimeChatDialogHost;
+//# sourceMappingURL=RuntimeChatDialogHost.svelte.d.ts.map

package/dist/svelte/components/runtime/RuntimeChatDialogHost.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuntimeChatDialogHost.svelte.d.ts","sourceRoot":"","sources":["../../../../src/svelte/components/runtime/RuntimeChatDialogHost.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAKxC,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,8CAA8C,CAAC;AAChG,OAAO,EAKL,KAAK,4BAA4B,EAEjC,MAAM,yBAAyB,CAAC;AAGjC,KAAK,gBAAgB,GAAI;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,aAAa,CAAC,EAAE,2BAA2B,CAAC;IAC5C,WAAW,CAAC,EAAE,4BAA4B,CAAC;IAC3C,eAAe,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACpC,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC;AAwQH,QAAA,MAAM,qBAAqB,kDAAwC,CAAC;AACpE,KAAK,qBAAqB,GAAG,UAAU,CAAC,OAAO,qBAAqB,CAAC,CAAC;AACtE,eAAe,qBAAqB,CAAC"}