@anvia/react-ui 1.3.0 → 1.3.2

package/dist/chat-Dgz8hsVT.js

@@ -0,0 +1,1210 @@
+import { I as useChatContext, R as InternalAttachmentProvider, T as useComposer, c as useThread, f as InternalMessageProvider, s as InternalThreadProvider, w as InternalComposerProvider } from "./contexts-B4ijG24z.js";
+import { t as composeRefs } from "./refs-Djj9rSvB.js";
+import { t as AttachmentPrimitive } from "./attachment-By2pged3.js";
+import { n as shiftComposerEntityRanges, r as isComposerEntityData, t as MessagePrimitive } from "./message-CElFEKgL.js";
+import { t as renderPrimitive } from "./primitives-xfE7zfwJ.js";
+import { Fragment, forwardRef, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { mergeAttributes } from "@tiptap/core";
+import Document from "@tiptap/extension-document";
+import HardBreak from "@tiptap/extension-hard-break";
+import Mention from "@tiptap/extension-mention";
+import Paragraph from "@tiptap/extension-paragraph";
+import Placeholder from "@tiptap/extension-placeholder";
+import Text from "@tiptap/extension-text";
+import { PluginKey } from "@tiptap/pm/state";
+import { EditorContent, NodeViewWrapper, ReactNodeViewRenderer, useEditor } from "@tiptap/react";
+// src/chat/composer.tsx
+const ComposerRoot = forwardRef(function ComposerRoot({ attachments: attachmentsProp, defaultAttachments, defaultEntities, defaultInput = "", defaultQuote, entities: entitiesProp, input: inputProp, onAttachmentsChange, onEntitiesChange, onInputChange, onQuoteChange, quote: quoteProp, submitMessage, triggers: triggersProp, onSubmit, ...props }, ref) {
+	const chat = useChatContext();
+	const [uncontrolledInput, setUncontrolledInput] = useState(defaultInput);
+	const [uncontrolledAttachments, setUncontrolledAttachments] = useState(() => [...defaultAttachments ?? []]);
+	const [uncontrolledEntities, setUncontrolledEntities] = useState(() => [...defaultEntities ?? []]);
+	const [uncontrolledQuote, setUncontrolledQuote] = useState(defaultQuote);
+	const [activeTrigger, setActiveTriggerState] = useState();
+	const input = inputProp ?? uncontrolledInput;
+	const attachments = attachmentsProp ?? uncontrolledAttachments;
+	const entities = entitiesProp ?? uncontrolledEntities;
+	const triggers = triggersProp ?? EMPTY_COMPOSER_TRIGGERS;
+	const rawQuote = quoteProp ?? uncontrolledQuote;
+	const rawQuoteMessageId = rawQuote?.messageId;
+	const rawQuoteText = rawQuote?.text;
+	const quote = useMemo(() => rawQuoteMessageId === void 0 || rawQuoteText === void 0 ? void 0 : {
+		messageId: rawQuoteMessageId,
+		text: rawQuoteText
+	}, [rawQuoteMessageId, rawQuoteText]);
+	const attachmentsRef = useRef(attachments);
+	attachmentsRef.current = attachments;
+	const entitiesRef = useRef(entities);
+	entitiesRef.current = entities;
+	const defaultSubmissionInFlightRef = useRef(false);
+	const inputControlled = inputProp !== void 0;
+	const attachmentsControlled = attachmentsProp !== void 0;
+	const entitiesControlled = entitiesProp !== void 0;
+	const quoteControlled = quoteProp !== void 0;
+	const hasMessageContent = input.trim().length > 0 || attachments.length > 0 || entities.length > 0 || quote !== void 0;
+	const active = chat.status === "submitted" || chat.status === "streaming";
+	const canSubmit = hasMessageContent && !active;
+	const canStop = active;
+	const setInput = useCallback((nextInput) => {
+		if (!inputControlled) setUncontrolledInput(nextInput);
+		onInputChange?.(nextInput);
+	}, [inputControlled, onInputChange]);
+	const setAttachments = useCallback((update) => {
+		const nextAttachments = typeof update === "function" ? update(attachmentsRef.current) : update;
+		attachmentsRef.current = nextAttachments;
+		if (!attachmentsControlled) setUncontrolledAttachments(nextAttachments);
+		onAttachmentsChange?.(nextAttachments);
+	}, [attachmentsControlled, onAttachmentsChange]);
+	const setEntities = useCallback((update) => {
+		const nextEntities = typeof update === "function" ? update(entitiesRef.current) : update;
+		entitiesRef.current = nextEntities;
+		if (!entitiesControlled) setUncontrolledEntities(nextEntities);
+		onEntitiesChange?.(nextEntities);
+	}, [entitiesControlled, onEntitiesChange]);
+	const setQuote = useCallback((nextQuote) => {
+		const normalizedQuote = normalizeQuote(nextQuote);
+		if (!quoteControlled) setUncontrolledQuote(normalizedQuote);
+		onQuoteChange?.(normalizedQuote);
+	}, [onQuoteChange, quoteControlled]);
+	const addAttachment = useCallback(async (attachment) => {
+		const normalized = isFileAttachmentInput(attachment) ? await attachmentFromFile(attachment) : createAttachment(attachment);
+		setAttachments((current) => [...current, normalized]);
+	}, [setAttachments]);
+	const removeAttachment = useCallback((id) => {
+		setAttachments((current) => current.filter((attachment) => attachment.id !== id));
+	}, [setAttachments]);
+	const clearAttachments = useCallback(() => {
+		setAttachments([]);
+	}, [setAttachments]);
+	const clearQuote = useCallback(() => {
+		setQuote(void 0);
+	}, [setQuote]);
+	const clear = useCallback(() => {
+		setInput("");
+		setAttachments([]);
+		setEntities([]);
+		setActiveTriggerState(void 0);
+		clearQuote();
+	}, [
+		clearQuote,
+		setAttachments,
+		setEntities,
+		setInput
+	]);
+	const submit = useCallback(async () => {
+		const prompt = input;
+		if (prompt.trim().length === 0 && attachments.length === 0 && entities.length === 0 && quote === void 0 || chat.status === "submitted" || chat.status === "streaming") return;
+		assertComposerEntitiesData(entities);
+		if (submitMessage !== void 0) {
+			await submitMessage({
+				input: prompt,
+				attachments,
+				entities,
+				chat,
+				quote,
+				clear
+			});
+			return;
+		}
+		if (defaultSubmissionInFlightRef.current) return;
+		const submittedAttachments = [...attachments];
+		const submittedQuote = quote === void 0 ? void 0 : { ...quote };
+		const formattedPrompt = submittedQuote === void 0 ? {
+			text: prompt,
+			prefixLength: 0
+		} : promptWithQuote(prompt, submittedQuote);
+		const submittedEntities = shiftComposerEntityRanges([...entities], formattedPrompt.prefixLength);
+		const submittedText = formattedPrompt.text;
+		const metadata = composerSubmitMetadata(submittedQuote, submittedEntities);
+		let payload;
+		if (submittedAttachments.length === 0) payload = metadata === void 0 ? { text: submittedText } : {
+			text: submittedText,
+			metadata
+		};
+		else {
+			const attachmentPayload = {
+				text: submittedText,
+				attachments: submittedAttachments
+			};
+			if (metadata !== void 0) attachmentPayload.metadata = metadata;
+			payload = attachmentPayload;
+		}
+		defaultSubmissionInFlightRef.current = true;
+		try {
+			const submission = chat.sendMessage(payload);
+			clear();
+			await submission;
+		} finally {
+			defaultSubmissionInFlightRef.current = false;
+		}
+	}, [
+		attachments,
+		chat,
+		clear,
+		entities,
+		input,
+		quote,
+		submitMessage
+	]);
+	const setActiveTrigger = useCallback((update) => {
+		setActiveTriggerState(update);
+	}, []);
+	const value = useMemo(() => ({
+		input,
+		setInput,
+		attachments,
+		setAttachments,
+		addAttachment,
+		removeAttachment,
+		clearAttachments,
+		entities,
+		setEntities,
+		quote,
+		setQuote,
+		clearQuote,
+		triggers,
+		activeTrigger,
+		setActiveTrigger,
+		submit,
+		stop: chat.stop,
+		status: chat.status,
+		canSubmit,
+		canStop
+	}), [
+		addAttachment,
+		attachments,
+		activeTrigger,
+		canStop,
+		canSubmit,
+		chat.status,
+		chat.stop,
+		clearAttachments,
+		clearQuote,
+		entities,
+		input,
+		quote,
+		removeAttachment,
+		setAttachments,
+		setActiveTrigger,
+		setEntities,
+		setInput,
+		setQuote,
+		submit,
+		triggers
+	]);
+	const handleSubmit = useCallback((event) => {
+		onSubmit?.(event);
+		if (event.defaultPrevented) return;
+		event.preventDefault();
+		submit();
+	}, [onSubmit, submit]);
+	return /* @__PURE__ */ jsx(InternalComposerProvider, {
+		value,
+		children: renderPrimitive("form", {
+			...props,
+			onSubmit: handleSubmit,
+			"data-state": chat.status
+		}, ref)
+	});
+});
+const ComposerQuotePreview = forwardRef(function ComposerQuotePreview({ children, ...props }, ref) {
+	const quote = useComposer().quote;
+	if (quote === void 0) return null;
+	const renderedChildren = typeof children === "function" ? children(quote) : children ?? quote.text;
+	return renderPrimitive("blockquote", {
+		...props,
+		children: renderedChildren
+	}, ref);
+});
+const ComposerClearQuote = forwardRef(function ComposerClearQuote({ onClick, ...props }, ref) {
+	const composer = useComposer();
+	const disabled = props.disabled ?? composer.quote === void 0;
+	const handleClick = useCallback((event) => {
+		onClick?.(event);
+		if (event.defaultPrevented || disabled) return;
+		composer.clearQuote();
+	}, [
+		composer,
+		disabled,
+		onClick
+	]);
+	return renderPrimitive("button", {
+		...props,
+		children: props.children ?? "Clear quote",
+		disabled,
+		onClick: handleClick,
+		type: props.type ?? "button",
+		"data-state": disabled ? "disabled" : "enabled"
+	}, ref);
+});
+const ComposerInput = forwardRef(function ComposerInput({ autoResize = true, disabled, maxRows: maxRowsProp, minRows: minRowsProp, onKeyDown, placeholder, renderEntity, style, ...props }, ref) {
+	const composer = useComposer();
+	const composerRef = useRef(composer);
+	composerRef.current = composer;
+	const renderEntityRef = useRef(renderEntity);
+	renderEntityRef.current = renderEntity;
+	const customEntityView = renderEntity !== void 0;
+	const editorReadyRef = useRef(false);
+	const syncingFromEditorRef = useRef(false);
+	const triggers = composer.triggers;
+	const minRows = normalizeRows(minRowsProp ?? 1, 1);
+	const maxRows = normalizeRows(maxRowsProp ?? 6, minRows);
+	const extensions = useMemo(() => composerInputExtensions({
+		composerRef,
+		placeholder,
+		renderEntityRef: customEntityView ? renderEntityRef : void 0,
+		triggers
+	}), [
+		customEntityView,
+		placeholder,
+		triggers
+	]);
+	const editor = useEditor({
+		extensions,
+		content: plainTextToComposerContent(composer.input),
+		editable: composer.status !== "submitted" && composer.status !== "streaming",
+		editorProps: {
+			attributes: {
+				"aria-label": props["aria-label"] ?? "Message",
+				"aria-multiline": "true",
+				role: "textbox"
+			},
+			handleKeyDown: (_view, event) => submitComposerFromEditorKeyDown(event, composerRef)
+		},
+		onUpdate: ({ editor: updatedEditor }) => {
+			if (!editorReadyRef.current) return;
+			const snapshot = composerSnapshotFromEditor(updatedEditor, composerRef.current.entities, composerRef.current.triggers);
+			syncingFromEditorRef.current = true;
+			composerRef.current.setInput(snapshot.input);
+			composerRef.current.setEntities(snapshot.entities);
+		}
+	}, [extensions]);
+	const ariaDisabled = props["aria-disabled"] === true || props["aria-disabled"] === "true";
+	const composerDisabled = disabled === true || ariaDisabled || composer.status === "submitted" || composer.status === "streaming";
+	const inputStyle = useMemo(() => {
+		if (!autoResize) return style;
+		const rowsStyle = {
+			["--anvia-composer-min-rows"]: minRows,
+			["--anvia-composer-max-rows"]: maxRows
+		};
+		return style === void 0 ? rowsStyle : {
+			...rowsStyle,
+			...style
+		};
+	}, [
+		autoResize,
+		maxRows,
+		minRows,
+		style
+	]);
+	const handleKeyDown = useCallback((event) => {
+		onKeyDown?.(event);
+		if (event.defaultPrevented || event.key !== "Enter" || event.shiftKey || event.nativeEvent.isComposing) return;
+		event.preventDefault();
+		composerRef.current.submit();
+	}, [onKeyDown]);
+	useEffect(() => {
+		if (editor === null) return;
+		editor.setEditable(!composerDisabled, false);
+	}, [composerDisabled, editor]);
+	useEffect(() => {
+		if (editor === null) return;
+		editor.commands.setContent(plainTextToComposerContent(composerRef.current.input), { emitUpdate: false });
+		editorReadyRef.current = true;
+		return () => {
+			editorReadyRef.current = false;
+		};
+	}, [editor]);
+	useEffect(() => {
+		if (editor === null || !editorReadyRef.current) return;
+		if (syncingFromEditorRef.current) {
+			syncingFromEditorRef.current = false;
+			return;
+		}
+		if (composerSnapshotFromEditor(editor, composer.entities, composer.triggers).input === composer.input) return;
+		editor.commands.setContent(plainTextToComposerContent(composer.input), { emitUpdate: false });
+	}, [composer, editor]);
+	return renderPrimitive("div", {
+		...props,
+		children: /* @__PURE__ */ jsx(EditorContent, { editor }),
+		"aria-disabled": composerDisabled ? true : props["aria-disabled"],
+		"data-role": "editor",
+		"data-state": composerDisabled ? "disabled" : "enabled",
+		onKeyDown: handleKeyDown,
+		style: inputStyle
+	}, ref);
+});
+const ComposerTextareaInput = forwardRef(function ComposerTextareaInput({ autoResize = true, maxRows: maxRowsProp, minRows: minRowsProp, onChange, onKeyDown, rows, ...props }, ref) {
+	const composer = useComposer();
+	const inputRef = useRef(null);
+	const wasAutoResizeRef = useRef(autoResize);
+	const composedInputRef = useMemo(() => composeRefs(inputRef, ref), [ref]);
+	const minRows = normalizeRows(minRowsProp ?? rows ?? 1, 1);
+	const maxRows = normalizeRows(maxRowsProp ?? 6, minRows);
+	useEffect(() => {
+		const wasAutoResize = wasAutoResizeRef.current;
+		wasAutoResizeRef.current = autoResize;
+		if (!autoResize) {
+			if (wasAutoResize) resetComposerInputSize(inputRef.current);
+			return;
+		}
+		resizeComposerInput(inputRef.current, {
+			maxRows,
+			minRows
+		});
+	});
+	const handleChange = useCallback((event) => {
+		onChange?.(event);
+		if (!event.defaultPrevented) {
+			composer.setInput(event.currentTarget.value);
+			composer.setEntities([]);
+			if (autoResize) resizeComposerInput(event.currentTarget, {
+				maxRows,
+				minRows
+			});
+		}
+	}, [
+		autoResize,
+		composer,
+		maxRows,
+		minRows,
+		onChange
+	]);
+	const handleKeyDown = useCallback((event) => {
+		onKeyDown?.(event);
+		if (event.defaultPrevented || event.key !== "Enter" || event.shiftKey || event.nativeEvent.isComposing) return;
+		event.preventDefault();
+		composer.submit();
+	}, [composer, onKeyDown]);
+	return renderPrimitive("textarea", {
+		...props,
+		"aria-label": props["aria-label"] ?? "Message",
+		disabled: props.disabled ?? (composer.status === "submitted" || composer.status === "streaming"),
+		onChange: handleChange,
+		onKeyDown: handleKeyDown,
+		rows: autoResize ? minRows : rows,
+		value: composer.input
+	}, composedInputRef);
+});
+const COMPOSER_ENTITY_NODE = "composerEntity";
+const EMPTY_COMPOSER_TRIGGERS = [];
+const ComposerEntityExtension = Mention.extend({
+	name: COMPOSER_ENTITY_NODE,
+	addAttributes() {
+		return {
+			id: {
+				default: null,
+				parseHTML: (element) => element.getAttribute("data-id"),
+				renderHTML: (attributes) => attributes.id === void 0 || attributes.id === null ? {} : { "data-id": String(attributes.id) }
+			},
+			label: {
+				default: null,
+				parseHTML: (element) => element.getAttribute("data-label"),
+				renderHTML: (attributes) => attributes.label === void 0 || attributes.label === null ? {} : { "data-label": String(attributes.label) }
+			},
+			mentionSuggestionChar: {
+				default: "@",
+				parseHTML: (element) => element.getAttribute("data-mention-suggestion-char"),
+				renderHTML: (attributes) => ({ "data-mention-suggestion-char": attributes.mentionSuggestionChar })
+			},
+			triggerId: {
+				default: null,
+				parseHTML: (element) => element.getAttribute("data-trigger-id"),
+				renderHTML: (attributes) => attributes.triggerId === void 0 || attributes.triggerId === null ? {} : { "data-trigger-id": String(attributes.triggerId) }
+			},
+			text: {
+				default: null,
+				parseHTML: (element) => element.getAttribute("data-text"),
+				renderHTML: (attributes) => attributes.text === void 0 || attributes.text === null ? {} : { "data-text": String(attributes.text) }
+			},
+			data: {
+				default: void 0,
+				parseHTML: (element) => dataFromAttribute(element.getAttribute("data-entity-data")),
+				renderHTML: (attributes) => {
+					if (attributes.data === void 0) return {};
+					if (!isComposerEntityData(attributes.data)) throw new TypeError("Composer entity data must be a JSON value.");
+					return { "data-entity-data": JSON.stringify(attributes.data) };
+				}
+			}
+		};
+	}
+});
+function composerEntityView(renderEntityRef, composerRef) {
+	return function ComposerEntityView({ node }) {
+		const attrs = node.attrs;
+		const { range: _range, ...entity } = composerEntityFromAttrs(attrs, 0, composerRef.current.entities, composerRef.current.triggers);
+		return /* @__PURE__ */ jsx(NodeViewWrapper, {
+			as: "span",
+			children: renderEntityRef.current?.(entity) ?? entity.text
+		});
+	};
+}
+function composerInputExtensions({ composerRef, placeholder, renderEntityRef, triggers }) {
+	const EntityExtension = renderEntityRef === void 0 ? ComposerEntityExtension : ComposerEntityExtension.extend({ addNodeView() {
+		return ReactNodeViewRenderer(composerEntityView(renderEntityRef, composerRef), { as: "span" });
+	} });
+	return [
+		Document,
+		Paragraph,
+		Text,
+		HardBreak,
+		Placeholder.configure(placeholder === void 0 ? {} : { placeholder }),
+		EntityExtension.configure({
+			HTMLAttributes: {},
+			deleteTriggerWithBackspace: true,
+			renderText: ({ node }) => composerEntityText(node.attrs),
+			renderHTML: ({ node, options }) => [
+				"span",
+				mergeAttributes(options.HTMLAttributes, {}),
+				composerEntityText(node.attrs)
+			],
+			suggestions: triggers.map((trigger) => composerSuggestion(trigger, composerRef))
+		})
+	];
+}
+function submitComposerFromEditorKeyDown(event, composerRef) {
+	if (event.defaultPrevented || event.key !== "Enter" || event.shiftKey || event.isComposing || composerRef.current.activeTrigger !== void 0) return false;
+	event.preventDefault();
+	composerRef.current.submit();
+	return true;
+}
+function composerSuggestion(trigger, composerRef) {
+	const suggestion = {
+		pluginKey: new PluginKey(`anvia-composer-trigger-${trigger.id}`),
+		char: trigger.char,
+		items: ({ query, signal }) => resolveTriggerItems(trigger, query, composerRef.current, signal),
+		command: ({ editor, range, props }) => {
+			const overrideSpace = editor.state.selection.$to.nodeAfter?.text?.startsWith(" ");
+			const insertRange = {
+				from: range.from,
+				to: overrideSpace ? range.to + 1 : range.to
+			};
+			editor.chain().focus().insertContentAt(insertRange, [{
+				type: COMPOSER_ENTITY_NODE,
+				attrs: props
+			}, {
+				type: "text",
+				text: " "
+			}]).run();
+			composerEditorOwnerDocument(editor)?.defaultView?.getSelection()?.collapseToEnd();
+			composerRef.current.setActiveTrigger(void 0);
+		},
+		render: () => ({
+			onStart: (props) => {
+				updateComposerTriggerState(trigger, props, composerRef);
+			},
+			onUpdate: (props) => {
+				updateComposerTriggerState(trigger, props, composerRef);
+			},
+			onExit: () => {
+				composerRef.current.setActiveTrigger((current) => current?.trigger.id === trigger.id ? void 0 : current);
+			},
+			onKeyDown: (props) => handleComposerTriggerKeyDown(trigger, props, composerRef)
+		})
+	};
+	if (trigger.allowSpaces !== void 0) suggestion.allowSpaces = trigger.allowSpaces;
+	if (trigger.allowedPrefixes !== void 0) suggestion.allowedPrefixes = trigger.allowedPrefixes;
+	if (trigger.startOfLine !== void 0) suggestion.startOfLine = trigger.startOfLine;
+	if (trigger.minQueryLength !== void 0) suggestion.minQueryLength = trigger.minQueryLength;
+	return suggestion;
+}
+function resolveTriggerItems(trigger, query, composer, signal) {
+	if (Array.isArray(trigger.items)) {
+		const normalizedQuery = query.toLowerCase();
+		return trigger.items.filter((item) => item.label.toLowerCase().includes(normalizedQuery));
+	}
+	return trigger.items({
+		trigger,
+		query,
+		input: composer.input,
+		entities: composer.entities,
+		signal
+	});
+}
+function composerEditorOwnerDocument(editor) {
+	const element = editor.options.element;
+	if (element === null || typeof element === "function") return;
+	return "mount" in element ? element.mount.ownerDocument : element.ownerDocument;
+}
+function updateComposerTriggerState(trigger, props, composerRef) {
+	const current = composerRef.current.activeTrigger;
+	const selectedIndex = current?.trigger.id === trigger.id ? clampIndex(current.selectedIndex, props.items.length) : 0;
+	const rect = rectFromSuggestion(props);
+	const state = {
+		trigger,
+		query: props.query,
+		items: props.items,
+		loading: props.loading,
+		selectedIndex,
+		selectItem: (item) => {
+			if (item.disabled) return;
+			props.command(triggerItemToEntityAttrs(trigger, item));
+		},
+		setSelectedIndex: (index) => {
+			composerRef.current.setActiveTrigger((active) => active?.trigger.id === trigger.id ? {
+				...active,
+				selectedIndex: clampIndex(index, active.items.length)
+			} : active);
+		}
+	};
+	if (rect !== void 0) state.rect = rect;
+	composerRef.current.setActiveTrigger(state);
+}
+function handleComposerTriggerKeyDown(trigger, { event }, composerRef) {
+	const activeTrigger = composerRef.current.activeTrigger;
+	if (activeTrigger?.trigger.id !== trigger.id) return false;
+	if (event.key === "ArrowDown") {
+		event.preventDefault();
+		activeTrigger.setSelectedIndex(activeTrigger.selectedIndex + 1);
+		return true;
+	}
+	if (event.key === "ArrowUp") {
+		event.preventDefault();
+		activeTrigger.setSelectedIndex(activeTrigger.selectedIndex - 1);
+		return true;
+	}
+	if (event.key === "Enter" || event.key === "Tab") {
+		event.preventDefault();
+		const item = activeTrigger.items[activeTrigger.selectedIndex];
+		if (item !== void 0) activeTrigger.selectItem(item);
+		return true;
+	}
+	if (event.key === "Escape") {
+		composerRef.current.setActiveTrigger(void 0);
+		return false;
+	}
+	return false;
+}
+function triggerItemToEntityAttrs(trigger, item) {
+	if (item.data !== void 0 && !isComposerEntityData(item.data)) throw new TypeError("Composer trigger item data must be a JSON value.");
+	return {
+		id: item.id,
+		label: item.label,
+		mentionSuggestionChar: trigger.char,
+		triggerId: trigger.id,
+		text: triggerItemText(trigger, item),
+		data: item.data
+	};
+}
+function triggerItemText(trigger, item) {
+	return item.text ?? `${trigger.char}${item.label}`;
+}
+function rectFromSuggestion(props) {
+	const rect = props.clientRect?.();
+	if (rect === void 0 || rect === null) return;
+	return {
+		top: rect.top,
+		right: rect.right,
+		bottom: rect.bottom,
+		left: rect.left,
+		width: rect.width,
+		height: rect.height
+	};
+}
+function clampIndex(index, length) {
+	if (length <= 0) return 0;
+	return (index + length) % length;
+}
+function plainTextToComposerContent(input) {
+	return {
+		type: "doc",
+		content: (input.length === 0 ? [""] : input.split(/\r?\n/)).map((line) => {
+			const paragraph = { type: "paragraph" };
+			if (line.length > 0) paragraph.content = [{
+				type: "text",
+				text: line
+			}];
+			return paragraph;
+		})
+	};
+}
+function composerSnapshotFromEditor(editor, previousEntities, triggers) {
+	return composerSnapshotFromContent(editor.getJSON(), previousEntities, triggers);
+}
+function composerSnapshotFromContent(content, previousEntities, triggers) {
+	const entities = [];
+	let input = "";
+	let blockIndex = 0;
+	const appendNode = (node) => {
+		if (node.type === "doc") {
+			for (const child of node.content ?? []) appendNode(child);
+			return;
+		}
+		if (node.type === "paragraph") {
+			if (blockIndex > 0) input += "\n";
+			blockIndex += 1;
+			for (const child of node.content ?? []) appendNode(child);
+			return;
+		}
+		if (node.type === "text") {
+			input += node.text ?? "";
+			return;
+		}
+		if (node.type === "hardBreak") {
+			input += "\n";
+			return;
+		}
+		if (node.type === COMPOSER_ENTITY_NODE) {
+			const attrs = node.attrs;
+			const entity = composerEntityFromAttrs(attrs, input.length, previousEntities, triggers);
+			input += entity.text;
+			entities.push(entity);
+			return;
+		}
+		for (const child of node.content ?? []) appendNode(child);
+	};
+	appendNode(content);
+	return {
+		input,
+		entities
+	};
+}
+function composerEntityFromAttrs(attrs, from, previousEntities, triggers) {
+	const id = stringAttr(attrs?.id) ?? "";
+	const trigger = stringAttr(attrs?.mentionSuggestionChar) ?? "@";
+	const triggerId = stringAttr(attrs?.triggerId) ?? triggers.find((candidate) => candidate.char === trigger)?.id ?? trigger;
+	const label = stringAttr(attrs?.label) ?? id;
+	const text = composerEntityText(attrs);
+	const previous = previousEntities.find((entity) => entity.id === id && entity.triggerId === triggerId && entity.trigger === trigger);
+	const data = attrs?.data === void 0 ? previous?.data : attrs.data;
+	const entity = {
+		id,
+		triggerId,
+		trigger,
+		label,
+		text,
+		range: {
+			from,
+			to: from + text.length
+		}
+	};
+	if (data !== void 0) entity.data = data;
+	return entity;
+}
+function composerEntityText(attrs) {
+	const text = stringAttr(attrs?.text);
+	if (text !== void 0) return text;
+	return `${stringAttr(attrs?.mentionSuggestionChar) ?? "@"}${stringAttr(attrs?.label) ?? stringAttr(attrs?.id) ?? ""}`;
+}
+function stringAttr(value) {
+	return typeof value === "string" ? value : void 0;
+}
+function dataFromAttribute(value) {
+	if (value === null) return;
+	try {
+		const parsed = JSON.parse(value);
+		return isComposerEntityData(parsed) ? parsed : void 0;
+	} catch {
+		return;
+	}
+}
+function resizeComposerInput(input, { maxRows, minRows }) {
+	if (input === null) return;
+	const style = getComputedStyle(input);
+	const lineHeight = lineHeightFromStyle(style);
+	const paddingHeight = pixelValue(style.paddingTop) + pixelValue(style.paddingBottom);
+	const borderHeight = pixelValue(style.borderTopWidth) + pixelValue(style.borderBottomWidth);
+	const minContentHeight = lineHeight * minRows;
+	const maxContentHeight = Math.max(minContentHeight, lineHeight * maxRows);
+	input.style.height = "auto";
+	const scrollContentHeight = Math.max(input.scrollHeight - paddingHeight, 0);
+	const contentHeight = clamp(scrollContentHeight, minContentHeight, maxContentHeight);
+	const nextHeight = style.boxSizing === "border-box" ? contentHeight + paddingHeight + borderHeight : contentHeight;
+	input.style.height = `${Math.ceil(nextHeight)}px`;
+	input.style.overflowY = scrollContentHeight > maxContentHeight ? "auto" : "hidden";
+}
+function resetComposerInputSize(input) {
+	if (input === null) return;
+	input.style.height = "";
+	input.style.overflowY = "";
+}
+function normalizeRows(value, min) {
+	if (!Number.isFinite(value)) return min;
+	return Math.max(min, Math.floor(value));
+}
+function lineHeightFromStyle(style) {
+	return pixelValue(style.lineHeight) || (pixelValue(style.fontSize) || 16) * 1.2;
+}
+function pixelValue(value) {
+	const parsed = Number.parseFloat(value);
+	return Number.isFinite(parsed) ? parsed : 0;
+}
+function clamp(value, min, max) {
+	return Math.min(Math.max(value, min), max);
+}
+function promptWithQuote(prompt, quote) {
+	const quotedText = quote.text.split(/\r?\n/).map((line) => `> ${line}`).join("\n");
+	if (prompt.trim().length === 0) return {
+		text: quotedText,
+		prefixLength: 0
+	};
+	const prefix = `${quotedText}\n\n`;
+	return {
+		text: `${prefix}${prompt}`,
+		prefixLength: prefix.length
+	};
+}
+function normalizeQuote(quote) {
+	if (quote === void 0) return;
+	return {
+		text: quote.text,
+		messageId: quote.messageId
+	};
+}
+function composerSubmitMetadata(quote, entities) {
+	if (quote === void 0 && entities.length === 0) return;
+	const metadata = {};
+	if (quote !== void 0) metadata.quote = quote;
+	if (entities.length > 0) metadata.composer = { entities: entities.map(composerEntityMetadata) };
+	return metadata;
+}
+function assertComposerEntitiesData(entities) {
+	for (const entity of entities) if (entity.data !== void 0 && !isComposerEntityData(entity.data)) throw new TypeError("Composer entity data must be a JSON value.");
+}
+function composerEntityMetadata(entity) {
+	const metadata = {
+		id: entity.id,
+		triggerId: entity.triggerId,
+		trigger: entity.trigger,
+		label: entity.label,
+		text: entity.text,
+		range: {
+			from: entity.range.from,
+			to: entity.range.to
+		}
+	};
+	if (entity.data !== void 0) metadata.data = entity.data;
+	return metadata;
+}
+const ComposerSubmit = forwardRef(function ComposerSubmit(props, ref) {
+	const composer = useComposer();
+	const disabled = props.disabled ?? !composer.canSubmit;
+	return renderPrimitive("button", {
+		...props,
+		children: props.children ?? "Send",
+		disabled,
+		type: props.type ?? "submit",
+		"data-state": disabled ? "disabled" : "enabled"
+	}, ref);
+});
+const ComposerStop = forwardRef(function ComposerStop({ onClick, ...props }, ref) {
+	const composer = useComposer();
+	const disabled = props.disabled ?? !composer.canStop;
+	const handleClick = useCallback((event) => {
+		onClick?.(event);
+		if (event.defaultPrevented || disabled) return;
+		composer.stop();
+	}, [
+		composer,
+		disabled,
+		onClick
+	]);
+	return renderPrimitive("button", {
+		...props,
+		children: props.children ?? "Stop",
+		disabled,
+		onClick: handleClick,
+		type: props.type ?? "button",
+		"data-state": disabled ? "disabled" : "enabled"
+	}, ref);
+});
+const ComposerTriggerMenu = forwardRef(function ComposerTriggerMenu({ children, keepMounted = false, style, ...props }, ref) {
+	const activeTrigger = useComposer().activeTrigger;
+	const empty = activeTrigger === void 0;
+	if (empty && !keepMounted) return null;
+	const menuStyle = activeTrigger?.rect === void 0 ? style : {
+		position: "fixed",
+		top: activeTrigger.rect.bottom,
+		left: activeTrigger.rect.left,
+		...style
+	};
+	const renderedChildren = activeTrigger === void 0 ? typeof children === "function" ? null : children : typeof children === "function" ? children(activeTrigger) : children ?? activeTrigger.items.map((item, index) => /* @__PURE__ */ jsx(ComposerTriggerItem, { index }, `${item.id}:${index.toString()}`));
+	return renderPrimitive("div", {
+		...props,
+		children: renderedChildren,
+		role: props.role ?? "listbox",
+		style: menuStyle,
+		"data-state": activeTrigger === void 0 ? "closed" : activeTrigger.loading ? "loading" : empty ? "empty" : "open"
+	}, ref);
+});
+const ComposerTriggerItem = forwardRef(function ComposerTriggerItem({ children, index, item: itemProp, onClick, onMouseEnter, ...props }, ref) {
+	const activeTrigger = useComposer().activeTrigger;
+	const itemIndex = index ?? 0;
+	const item = itemProp ?? activeTrigger?.items[itemIndex];
+	if (activeTrigger === void 0 || item === void 0) return null;
+	const selected = activeTrigger.selectedIndex === itemIndex;
+	const disabled = props.disabled ?? item.disabled ?? false;
+	const renderedChildren = typeof children === "function" ? children(item, activeTrigger) : children ?? item.label;
+	const handleMouseEnter = (event) => {
+		onMouseEnter?.(event);
+		if (!event.defaultPrevented && !disabled) activeTrigger.setSelectedIndex(itemIndex);
+	};
+	const handleClick = (event) => {
+		onClick?.(event);
+		if (!event.defaultPrevented && !disabled) activeTrigger.selectItem(item);
+	};
+	return renderPrimitive("button", {
+		...props,
+		children: renderedChildren,
+		disabled,
+		onClick: handleClick,
+		onMouseEnter: handleMouseEnter,
+		role: props.role ?? "option",
+		type: props.type ?? "button",
+		"aria-selected": selected,
+		"data-state": disabled ? "disabled" : selected ? "selected" : "idle"
+	}, ref);
+});
+const ComposerAttachments = forwardRef(function ComposerAttachments({ children, keepMounted = false, ...props }, ref) {
+	const composer = useComposer();
+	const empty = composer.attachments.length === 0;
+	if (empty && !keepMounted) return null;
+	return renderPrimitive("div", {
+		...props,
+		children: composer.attachments.map((attachment) => /* @__PURE__ */ jsx(InternalAttachmentProvider, {
+			value: {
+				attachment,
+				remove: () => {
+					composer.removeAttachment(attachment.id);
+				}
+			},
+			children: typeof children === "function" ? children(attachment) : children ?? /* @__PURE__ */ jsx(AttachmentPrimitive.Root, {})
+		}, attachment.id)),
+		"data-role": "attachments",
+		"data-state": empty ? "empty" : "populated"
+	}, ref);
+});
+const ComposerAttachmentInput = forwardRef(function ComposerAttachmentInput({ onChange, ...props }, ref) {
+	const composer = useComposer();
+	const disabled = props.disabled ?? (composer.status === "submitted" || composer.status === "streaming");
+	const handleChange = useCallback(async (event) => {
+		onChange?.(event);
+		if (event.defaultPrevented) return;
+		const files = Array.from(event.currentTarget.files ?? []);
+		event.currentTarget.value = "";
+		for (const file of files) await composer.addAttachment(file);
+	}, [composer, onChange]);
+	return renderPrimitive("input", {
+		...props,
+		disabled,
+		onChange: (event) => {
+			handleChange(event);
+		},
+		type: "file",
+		"data-state": disabled ? "disabled" : "enabled"
+	}, ref);
+});
+const ComposerAddAttachment = forwardRef(function ComposerAddAttachment({ accept, multiple = false, onClick, ...props }, ref) {
+	const composer = useComposer();
+	const inputRef = useRef(null);
+	const disabled = props.disabled ?? (composer.status === "submitted" || composer.status === "streaming");
+	const handleClick = useCallback((event) => {
+		onClick?.(event);
+		if (event.defaultPrevented || disabled) return;
+		inputRef.current?.click();
+	}, [disabled, onClick]);
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [renderPrimitive("button", {
+		...props,
+		children: props.children ?? "Attach",
+		disabled,
+		onClick: handleClick,
+		type: props.type ?? "button",
+		"data-state": disabled ? "disabled" : "enabled"
+	}, ref), /* @__PURE__ */ jsx(ComposerAttachmentInput, {
+		accept,
+		"aria-hidden": "true",
+		hidden: true,
+		multiple,
+		ref: inputRef,
+		tabIndex: -1
+	})] });
+});
+const ComposerAttachmentDropzone = forwardRef(function ComposerAttachmentDropzone({ disabled: disabledProp = false, onDragLeave, onDragOver, onDrop, ...props }, ref) {
+	const composer = useComposer();
+	const [dragging, setDragging] = useState(false);
+	const disabled = disabledProp || composer.status === "submitted" || composer.status === "streaming";
+	const handleDragOver = useCallback((event) => {
+		onDragOver?.(event);
+		if (event.defaultPrevented || disabled) return;
+		event.preventDefault();
+		setDragging(true);
+	}, [disabled, onDragOver]);
+	const handleDragLeave = useCallback((event) => {
+		onDragLeave?.(event);
+		if (!event.defaultPrevented) setDragging(false);
+	}, [onDragLeave]);
+	const handleDrop = useCallback((event) => {
+		onDrop?.(event);
+		if (event.defaultPrevented || disabled) return;
+		event.preventDefault();
+		setDragging(false);
+		const files = Array.from(event.dataTransfer.files);
+		Promise.all(files.map((file) => composer.addAttachment(file)));
+	}, [
+		composer,
+		disabled,
+		onDrop
+	]);
+	return renderPrimitive("div", {
+		...props,
+		onDragLeave: handleDragLeave,
+		onDragOver: handleDragOver,
+		onDrop: handleDrop,
+		"data-state": disabled ? "disabled" : dragging ? "dragging" : "enabled"
+	}, ref);
+});
+function createAttachment(attachment) {
+	return {
+		...attachment,
+		id: attachment.id ?? createAttachmentId()
+	};
+}
+function isFileAttachmentInput(attachment) {
+	return typeof File !== "undefined" && attachment instanceof File;
+}
+async function attachmentFromFile(file) {
+	return {
+		id: createAttachmentId(),
+		type: file.type.startsWith("image/") ? "image" : "document",
+		name: file.name,
+		mediaType: file.type.length > 0 ? file.type : "application/octet-stream",
+		data: await readFileData(file)
+	};
+}
+async function readFileData(file) {
+	const dataUrl = await new Promise((resolve, reject) => {
+		const reader = new FileReader();
+		reader.addEventListener("load", () => {
+			resolve(String(reader.result ?? ""));
+		});
+		reader.addEventListener("error", () => {
+			reject(reader.error ?? /* @__PURE__ */ new Error("Failed to read attachment."));
+		});
+		reader.readAsDataURL(file);
+	});
+	return dataUrl.includes(",") ? dataUrl.slice(dataUrl.indexOf(",") + 1) : dataUrl;
+}
+let nextAttachmentId = 0;
+function createAttachmentId() {
+	const random = globalThis.crypto?.randomUUID?.();
+	if (random !== void 0) return `attachment_${random}`;
+	nextAttachmentId += 1;
+	return `attachment_${nextAttachmentId.toString(36)}`;
+}
+const ComposerPrimitive = {
+	Root: ComposerRoot,
+	Quote: ComposerQuotePreview,
+	ClearQuote: ComposerClearQuote,
+	Input: ComposerInput,
+	TextareaInput: ComposerTextareaInput,
+	TriggerMenu: ComposerTriggerMenu,
+	TriggerItem: ComposerTriggerItem,
+	Attachments: ComposerAttachments,
+	AddAttachment: ComposerAddAttachment,
+	AttachmentInput: ComposerAttachmentInput,
+	AttachmentDropzone: ComposerAttachmentDropzone,
+	Submit: ComposerSubmit,
+	Stop: ComposerStop
+};
+// src/chat/thread.tsx
+const ThreadRoot = forwardRef(function ThreadRoot(props, ref) {
+	const chat = useChatContext();
+	const viewportRef = useRef(null);
+	const messagesRef = useRef(null);
+	const [atBottom, setAtBottom] = useState(true);
+	const scrollToBottom = useCallback((behavior = "smooth") => {
+		const viewport = viewportRef.current;
+		if (viewport === null) return;
+		viewport.scrollTo({
+			top: viewport.scrollHeight,
+			behavior
+		});
+	}, []);
+	const thread = useMemo(() => ({
+		viewportRef,
+		messagesRef,
+		atBottom,
+		setAtBottom,
+		scrollToBottom
+	}), [atBottom, scrollToBottom]);
+	return /* @__PURE__ */ jsx(InternalThreadProvider, {
+		value: thread,
+		children: renderPrimitive("div", {
+			...props,
+			"data-state": chat.status
+		}, ref)
+	});
+});
+const ThreadViewport = forwardRef(function ThreadViewport({ autoScroll = true, onScroll, ...props }, ref) {
+	const chat = useChatContext();
+	const thread = useThread();
+	const messages = chat.messages;
+	const composedRef = useMemo(() => composeRefs(ref, (node) => {
+		thread.viewportRef.current = node;
+	}), [ref, thread.viewportRef]);
+	useEffect(() => {
+		const hasMessages = messages.length > 0;
+		if (autoScroll && (thread.atBottom || !hasMessages)) thread.scrollToBottom("auto");
+	}, [
+		autoScroll,
+		messages,
+		thread
+	]);
+	useEffect(() => {
+		const viewport = thread.viewportRef.current;
+		if (viewport === null || !autoScroll || typeof ResizeObserver !== "function") return;
+		const content = thread.messagesRef.current;
+		if (content === null) return;
+		const observer = new ResizeObserver(() => {
+			if (thread.atBottom) thread.scrollToBottom("auto");
+		});
+		observer.observe(viewport);
+		observer.observe(content);
+		return () => observer.disconnect();
+	}, [autoScroll, thread]);
+	const handleScroll = useCallback((event) => {
+		onScroll?.(event);
+		const node = event.currentTarget;
+		const distanceFromBottom = node.scrollHeight - node.scrollTop - node.clientHeight;
+		thread.setAtBottom(distanceFromBottom < 80);
+	}, [onScroll, thread]);
+	return renderPrimitive("div", {
+		...props,
+		onScroll: handleScroll,
+		"data-state": thread.atBottom ? "bottom" : "away"
+	}, composedRef);
+});
+const ThreadViewportFooter = forwardRef(function ThreadViewportFooter(props, ref) {
+	return renderPrimitive("div", { ...props }, ref);
+});
+const ThreadEmpty = forwardRef(function ThreadEmpty(props, ref) {
+	if (useChatContext().messages.length > 0) return null;
+	return renderPrimitive("div", { ...props }, ref);
+});
+const ThreadStatus = forwardRef(function ThreadStatus({ children, ...props }, ref) {
+	const chat = useChatContext();
+	const renderedChildren = typeof children === "function" ? children(chat.status) : children;
+	return renderPrimitive("div", {
+		...props,
+		children: renderedChildren ?? chat.status,
+		"data-state": chat.status
+	}, ref);
+});
+const ThreadLoading = forwardRef(function ThreadLoading(props, ref) {
+	const chat = useChatContext();
+	if (chat.status !== "submitted" && chat.status !== "streaming") return null;
+	return renderPrimitive("div", {
+		...props,
+		children: props.children ?? "Loading"
+	}, ref);
+});
+const ThreadError = forwardRef(function ThreadError({ children, ...props }, ref) {
+	const chat = useChatContext();
+	if (chat.status !== "error" && chat.error === void 0) return null;
+	const renderedChildren = typeof children === "function" ? children(chat.error) : children;
+	return renderPrimitive("div", {
+		...props,
+		children: renderedChildren ?? errorMessage(chat.error),
+		role: props.role ?? "alert"
+	}, ref);
+});
+const ThreadMessages = forwardRef(function ThreadMessages({ children, keepMounted = true, ...props }, ref) {
+	const chat = useChatContext();
+	const thread = useThread();
+	const composedRef = useMemo(() => composeRefs(ref, (node) => {
+		thread.messagesRef.current = node;
+	}), [ref, thread.messagesRef]);
+	const empty = chat.messages.length === 0;
+	if (empty && !keepMounted) return null;
+	return renderPrimitive("div", {
+		...props,
+		children: chat.messages.map((message) => /* @__PURE__ */ jsx(InternalMessageProvider, {
+			message,
+			children: typeof children === "function" ? children(message) : children ?? defaultMessage()
+		}, message.id)),
+		"data-state": empty ? "empty" : "populated"
+	}, composedRef);
+});
+const ThreadSuggestions = forwardRef(function ThreadSuggestions({ children, keepMounted = false, ...props }, ref) {
+	const suggestions = useChatContext().suggestions ?? [];
+	const empty = suggestions.length === 0;
+	if (empty && !keepMounted) return null;
+	return renderPrimitive("div", {
+		...props,
+		children: suggestions.map((suggestion) => typeof children === "function" ? /* @__PURE__ */ jsx(Fragment, { children: children(suggestion) }, suggestion.id) : /* @__PURE__ */ jsx(ThreadSuggestion, {
+			suggestion,
+			children
+		}, suggestion.id)),
+		"data-role": "suggestions",
+		"data-state": empty ? "empty" : "populated"
+	}, ref);
+});
+const ThreadSuggestion = forwardRef(function ThreadSuggestion({ onClick, prompt, suggestion, ...props }, ref) {
+	const chat = useChatContext();
+	const suggestionPrompt = prompt ?? suggestion?.prompt ?? "";
+	const disabled = props.disabled ?? (suggestionPrompt.length === 0 || chat.status === "submitted" || chat.status === "streaming");
+	const handleClick = useCallback((event) => {
+		onClick?.(event);
+		if (event.defaultPrevented || disabled) return;
+		chat.sendMessage({ text: suggestionPrompt });
+	}, [
+		chat,
+		disabled,
+		onClick,
+		suggestionPrompt
+	]);
+	return renderPrimitive("button", {
+		...props,
+		children: props.children ?? suggestion?.label ?? suggestionPrompt,
+		disabled,
+		onClick: handleClick,
+		type: props.type ?? "button",
+		"data-state": disabled ? "disabled" : "enabled"
+	}, ref);
+});
+const ThreadScrollToBottom = forwardRef(function ThreadScrollToBottom({ onClick, ...props }, ref) {
+	const thread = useThread();
+	const disabled = props.disabled ?? thread.atBottom;
+	const handleClick = useCallback((event) => {
+		onClick?.(event);
+		if (event.defaultPrevented || disabled) return;
+		thread.scrollToBottom();
+	}, [
+		disabled,
+		onClick,
+		thread
+	]);
+	return renderPrimitive("button", {
+		...props,
+		children: props.children ?? "Scroll to bottom",
+		disabled,
+		onClick: handleClick,
+		type: props.type ?? "button",
+		"data-state": thread.atBottom ? "bottom" : "away"
+	}, ref);
+});
+function defaultMessage() {
+	return /* @__PURE__ */ jsxs(MessagePrimitive.Root, { children: [/* @__PURE__ */ jsx(MessagePrimitive.Content, { children: /* @__PURE__ */ jsx(MessagePrimitive.Parts, {}) }), /* @__PURE__ */ jsx(MessagePrimitive.Actions, {})] });
+}
+function errorMessage(error) {
+	if (error instanceof Error) return error.message;
+	if (typeof error === "string") return error;
+	return "Something went wrong.";
+}
+const ThreadPrimitive = {
+	Root: ThreadRoot,
+	Viewport: ThreadViewport,
+	ViewportFooter: ThreadViewportFooter,
+	Messages: ThreadMessages,
+	Empty: ThreadEmpty,
+	Status: ThreadStatus,
+	Loading: ThreadLoading,
+	Error: ThreadError,
+	Suggestions: ThreadSuggestions,
+	Suggestion: ThreadSuggestion,
+	ScrollToBottom: ThreadScrollToBottom
+};
+export { ComposerPrimitive as n, ThreadPrimitive as t };
+
+//# sourceMappingURL=chat-Dgz8hsVT.js.map