@databricks/appkit-ui 0.16.0 → 0.18.0

package/dist/react/genie/use-genie-chat.js

@@ -55,6 +55,47 @@ function messageResultToItems(msg) {
 	return [makeUserItem(msg, "-user"), makeAssistantItem(msg)];
 }
 /**
+* Streams a conversation page via SSE. Collects message items and query
+* results into a buffer and returns them when the stream completes.
+*/
+function fetchConversationPage(basePath, alias, convId, options) {
+	const params = new URLSearchParams({ requestId: crypto.randomUUID() });
+	if (options.pageToken) params.set("pageToken", options.pageToken);
+	const items = [];
+	return connectSSE({
+		url: `${basePath}/${encodeURIComponent(alias)}/conversations/${encodeURIComponent(convId)}?${params}`,
+		signal: options.signal,
+		onMessage: async (message) => {
+			try {
+				const event = JSON.parse(message.data);
+				switch (event.type) {
+					case "message_result":
+						items.push(...messageResultToItems(event.message));
+						break;
+					case "query_result":
+						for (let i = items.length - 1; i >= 0; i--) {
+							const item = items[i];
+							if (item.attachments.some((a) => a.attachmentId === event.attachmentId)) {
+								item.queryResults.set(event.attachmentId, event.data);
+								break;
+							}
+						}
+						break;
+					case "history_info":
+						options.onPaginationInfo?.(event.nextPageToken);
+						break;
+					case "error":
+						options.onError?.(event.error);
+						break;
+				}
+			} catch {}
+		},
+		onError: (err) => options.onConnectionError?.(err)
+	}).then(() => items);
+}
+/** Minimum time (ms) to hold the loading-older state so scroll inertia settles before prepending messages. */
+const MIN_PREVIOUS_PAGE_LOAD_MS = 800;
+/**
 * Manages the full Genie chat lifecycle:
 * SSE streaming, conversation persistence via URL, and history replay.
 *
@@ -69,12 +110,20 @@ function useGenieChat(options) {
 	const [status, setStatus] = useState("idle");
 	const [conversationId, setConversationId] = useState(null);
 	const [error, setError] = useState(null);
+	const [nextPageToken, setNextPageToken] = useState(null);
+	const hasPreviousPage = nextPageToken !== null;
+	const isFetchingPreviousPage = status === "loading-older";
 	const abortControllerRef = useRef(null);
+	const paginationAbortRef = useRef(null);
 	const conversationIdRef = useRef(null);
+	const nextPageTokenRef = useRef(null);
+	const isLoadingOlderRef = useRef(false);
 	useEffect(() => {
 		conversationIdRef.current = conversationId;
-	}, [conversationId]);
-	const processEvent = useCallback((event, isHistory) => {
+		nextPageTokenRef.current = nextPageToken;
+	}, [conversationId, nextPageToken]);
+	/** Process SSE events during live message streaming (sendMessage). */
+	const processStreamEvent = useCallback((event) => {
 		switch (event.type) {
 			case "message_start":
 				setConversationId(event.conversationId);
@@ -92,11 +141,7 @@ function useGenieChat(options) {
 				break;
 			case "message_result": {
 				const msg = event.message;
-				const hasAttachments = (msg.attachments?.length ?? 0) > 0;
-				if (isHistory) {
-					const items = messageResultToItems(msg);
-					setMessages((prev) => [...prev, ...items]);
-				} else if (hasAttachments) {
+				if ((msg.attachments?.length ?? 0) > 0) {
 					const item = makeAssistantItem(msg);
 					setMessages((prev) => {
 						const last = prev[prev.length - 1];
@@ -108,20 +153,18 @@ function useGenieChat(options) {
 			}
 			case "query_result":
 				setMessages((prev) => {
-					const updated = [...prev];
-					for (let i = updated.length - 1; i >= 0; i--) {
-						const msg = updated[i];
+					for (let i = prev.length - 1; i >= 0; i--) {
+						const msg = prev[i];
 						if (msg.attachments.some((a) => a.attachmentId === event.attachmentId)) {
-							const queryResults = new Map(msg.queryResults);
-							queryResults.set(event.attachmentId, event.data);
+							const updated = prev.slice();
 							updated[i] = {
 								...msg,
-								queryResults
+								queryResults: new Map(msg.queryResults).set(event.attachmentId, event.data)
 							};
-							break;
+							return updated;
 						}
 					}
-					return updated;
+					return prev;
 				});
 				break;
 			case "error":
@@ -134,6 +177,7 @@ function useGenieChat(options) {
 		const trimmed = content.trim();
 		if (!trimmed) return;
 		abortControllerRef.current?.abort();
+		paginationAbortRef.current?.abort();
 		setError(null);
 		setStatus("streaming");
 		const userMessage = {
@@ -169,7 +213,7 @@ function useGenieChat(options) {
 			signal: abortController.signal,
 			onMessage: async (message) => {
 				try {
-					processEvent(JSON.parse(message.data), false);
+					processStreamEvent(JSON.parse(message.data));
 				} catch {}
 			},
 			onError: (err) => {
@@ -187,44 +231,74 @@ function useGenieChat(options) {
 	}, [
 		alias,
 		basePath,
-		processEvent
+		processStreamEvent
 	]);
+	/** Creates an AbortController, stores it in the given ref, and fetches a conversation page. */
+	const fetchPage = useCallback((controllerRef, convId, options) => {
+		controllerRef.current?.abort();
+		const abortController = new AbortController();
+		controllerRef.current = abortController;
+		return {
+			promise: fetchConversationPage(basePath, alias, convId, {
+				pageToken: options?.pageToken,
+				signal: abortController.signal,
+				onPaginationInfo: setNextPageToken,
+				onError: (msg) => {
+					setError(msg);
+					setStatus("error");
+				},
+				onConnectionError: (err) => {
+					if (abortController.signal.aborted) return;
+					setError(err instanceof Error ? err.message : options?.errorMessage ?? "Failed to load messages.");
+					setStatus("error");
+				}
+			}),
+			abortController
+		};
+	}, [alias, basePath]);
 	const loadHistory = useCallback((convId) => {
-		abortControllerRef.current?.abort();
+		paginationAbortRef.current?.abort();
 		setStatus("loading-history");
 		setError(null);
 		setMessages([]);
 		setConversationId(convId);
-		const abortController = new AbortController();
-		abortControllerRef.current = abortController;
-		const requestId = crypto.randomUUID();
-		connectSSE({
-			url: `${basePath}/${encodeURIComponent(alias)}/conversations/${encodeURIComponent(convId)}?requestId=${encodeURIComponent(requestId)}`,
-			signal: abortController.signal,
-			onMessage: async (message) => {
-				try {
-					processEvent(JSON.parse(message.data), true);
-				} catch {}
-			},
-			onError: (err) => {
-				if (abortController.signal.aborted) return;
-				setError(err instanceof Error ? err.message : "Failed to load conversation history.");
-				setStatus("error");
+		const { promise, abortController } = fetchPage(abortControllerRef, convId, { errorMessage: "Failed to load conversation history." });
+		promise.then((items) => {
+			if (!abortController.signal.aborted) {
+				setMessages(items);
+				setStatus((prev) => prev === "error" ? "error" : "idle");
 			}
-		}).then(() => {
-			if (!abortController.signal.aborted) setStatus((prev) => prev === "error" ? "error" : "idle");
 		});
-	}, [
-		alias,
-		basePath,
-		processEvent
-	]);
+	}, [fetchPage]);
+	const fetchPreviousPage = useCallback(() => {
+		if (!nextPageTokenRef.current || !conversationIdRef.current || isLoadingOlderRef.current) return;
+		isLoadingOlderRef.current = true;
+		setStatus("loading-older");
+		setError(null);
+		const startTime = Date.now();
+		const { promise, abortController } = fetchPage(paginationAbortRef, conversationIdRef.current, {
+			pageToken: nextPageTokenRef.current,
+			errorMessage: "Failed to load older messages."
+		});
+		promise.then(async (items) => {
+			if (abortController.signal.aborted) return;
+			const elapsed = Date.now() - startTime;
+			if (elapsed < MIN_PREVIOUS_PAGE_LOAD_MS) await new Promise((r) => setTimeout(r, MIN_PREVIOUS_PAGE_LOAD_MS - elapsed));
+			if (abortController.signal.aborted) return;
+			if (items.length > 0) setMessages((prev) => [...items, ...prev]);
+			setStatus((current) => current === "loading-older" ? "idle" : current);
+		}).finally(() => {
+			isLoadingOlderRef.current = false;
+		});
+	}, [fetchPage]);
 	const reset = useCallback(() => {
 		abortControllerRef.current?.abort();
+		paginationAbortRef.current?.abort();
 		setMessages([]);
 		setConversationId(null);
 		setError(null);
 		setStatus("idle");
+		setNextPageToken(null);
 		if (persistInUrl) removeUrlParam(urlParamName);
 	}, [persistInUrl, urlParamName]);
 	useEffect(() => {
@@ -233,6 +307,7 @@ function useGenieChat(options) {
 		if (existingId) loadHistory(existingId);
 		return () => {
 			abortControllerRef.current?.abort();
+			paginationAbortRef.current?.abort();
 		};
 	}, [
 		persistInUrl,
@@ -245,7 +320,10 @@ function useGenieChat(options) {
 		conversationId,
 		error,
 		sendMessage,
-		reset
+		reset,
+		hasPreviousPage,
+		isFetchingPreviousPage,
+		fetchPreviousPage
 	};
 }
 

package/dist/react/genie/use-genie-chat.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-genie-chat.js","names":[],"sources":["../../../src/react/genie/use-genie-chat.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport { connectSSE } from \"@/js\";\nimport type {\n  GenieChatStatus,\n  GenieMessageItem,\n  GenieMessageResponse,\n  GenieStreamEvent,\n  UseGenieChatOptions,\n  UseGenieChatReturn,\n} from \"./types\";\n\nfunction getUrlParam(name: string): string | null {\n  return new URLSearchParams(window.location.search).get(name);\n}\n\nfunction setUrlParam(name: string, value: string): void {\n  const url = new URL(window.location.href);\n  url.searchParams.set(name, value);\n  window.history.replaceState({}, \"\", url.toString());\n}\n\nfunction removeUrlParam(name: string): void {\n  const url = new URL(window.location.href);\n  url.searchParams.delete(name);\n  window.history.replaceState({}, \"\", url.toString());\n}\n\n/**\n * The Genie API puts the user's question in `message.content` and the\n * actual AI answer in text attachments. Extract the text attachment\n * content so we display the real answer, not the question echo.\n */\nfunction extractAssistantContent(msg: GenieMessageResponse): string {\n  const textParts = (msg.attachments ?? [])\n    .map((att) => att.text?.content)\n    .filter(Boolean) as string[];\n  return textParts.length > 0 ? textParts.join(\"\\n\\n\") : msg.content;\n}\n\nfunction makeUserItem(\n  msg: GenieMessageResponse,\n  idSuffix = \"\",\n): GenieMessageItem {\n  return {\n    id: `${msg.messageId}${idSuffix}`,\n    role: \"user\",\n    content: msg.content,\n    status: msg.status,\n    attachments: [],\n    queryResults: new Map(),\n  };\n}\n\nfunction makeAssistantItem(msg: GenieMessageResponse): GenieMessageItem {\n  return {\n    id: msg.messageId,\n    role: \"assistant\",\n    content: extractAssistantContent(msg),\n    status: msg.status,\n    attachments: msg.attachments ?? [],\n    queryResults: new Map(),\n    error: msg.error,\n  };\n}\n\n/**\n * The API bundles user question (content) and AI answer (attachments) in one message.\n * Split into separate user + assistant items for display.\n */\nfunction messageResultToItems(msg: GenieMessageResponse): GenieMessageItem[] {\n  const hasAttachments = (msg.attachments?.length ?? 0) > 0;\n  if (!hasAttachments) return [makeUserItem(msg)];\n  return [makeUserItem(msg, \"-user\"), makeAssistantItem(msg)];\n}\n\n/**\n * Manages the full Genie chat lifecycle:\n * SSE streaming, conversation persistence via URL, and history replay.\n *\n * @example\n * ```tsx\n * const { messages, status, sendMessage, reset } = useGenieChat({ alias: \"demo\" });\n * ```\n */\nexport function useGenieChat(options: UseGenieChatOptions): UseGenieChatReturn {\n  const {\n    alias,\n    basePath = \"/api/genie\",\n    persistInUrl = true,\n    urlParamName = \"conversationId\",\n  } = options;\n\n  const [messages, setMessages] = useState<GenieMessageItem[]>([]);\n  const [status, setStatus] = useState<GenieChatStatus>(\"idle\");\n  const [conversationId, setConversationId] = useState<string | null>(null);\n  const [error, setError] = useState<string | null>(null);\n\n  const abortControllerRef = useRef<AbortController | null>(null);\n  const conversationIdRef = useRef<string | null>(null);\n\n  useEffect(() => {\n    conversationIdRef.current = conversationId;\n  }, [conversationId]);\n\n  const processEvent = useCallback(\n    (event: GenieStreamEvent, isHistory: boolean) => {\n      switch (event.type) {\n        case \"message_start\": {\n          setConversationId(event.conversationId);\n          if (persistInUrl) {\n            setUrlParam(urlParamName, event.conversationId);\n          }\n          break;\n        }\n\n        case \"status\": {\n          setMessages((prev) => {\n            const last = prev[prev.length - 1];\n            if (last?.role === \"assistant\") {\n              return [...prev.slice(0, -1), { ...last, status: event.status }];\n            }\n            return prev;\n          });\n          break;\n        }\n\n        case \"message_result\": {\n          const msg = event.message;\n          const hasAttachments = (msg.attachments?.length ?? 0) > 0;\n\n          if (isHistory) {\n            const items = messageResultToItems(msg);\n            setMessages((prev) => [...prev, ...items]);\n          } else if (hasAttachments) {\n            // During streaming we already appended the user message locally,\n            // so only handle assistant results. Messages without attachments\n            // are the user-message echo from the API — skip those.\n            const item = makeAssistantItem(msg);\n            setMessages((prev) => {\n              const last = prev[prev.length - 1];\n              if (last?.role === \"assistant\" && last.id === \"\") {\n                return [...prev.slice(0, -1), item];\n              }\n              return [...prev, item];\n            });\n          }\n          break;\n        }\n\n        case \"query_result\": {\n          setMessages((prev) => {\n            const updated = [...prev];\n            for (let i = updated.length - 1; i >= 0; i--) {\n              const msg = updated[i];\n              if (\n                msg.attachments.some(\n                  (a) => a.attachmentId === event.attachmentId,\n                )\n              ) {\n                const queryResults = new Map(msg.queryResults);\n                queryResults.set(event.attachmentId, event.data);\n                updated[i] = { ...msg, queryResults };\n                break;\n              }\n            }\n            return updated;\n          });\n          break;\n        }\n\n        case \"error\": {\n          setError(event.error);\n          setStatus(\"error\");\n          break;\n        }\n      }\n    },\n    [persistInUrl, urlParamName],\n  );\n\n  const sendMessage = useCallback(\n    (content: string) => {\n      const trimmed = content.trim();\n      if (!trimmed) return;\n\n      abortControllerRef.current?.abort();\n      setError(null);\n      setStatus(\"streaming\");\n\n      const userMessage: GenieMessageItem = {\n        id: crypto.randomUUID(),\n        role: \"user\",\n        content: trimmed,\n        status: \"COMPLETED\",\n        attachments: [],\n        queryResults: new Map(),\n      };\n\n      const assistantPlaceholder: GenieMessageItem = {\n        id: \"\",\n        role: \"assistant\",\n        content: \"\",\n        status: \"ASKING_AI\",\n        attachments: [],\n        queryResults: new Map(),\n      };\n\n      setMessages((prev) => [...prev, userMessage, assistantPlaceholder]);\n\n      const abortController = new AbortController();\n      abortControllerRef.current = abortController;\n\n      const requestId = crypto.randomUUID();\n\n      connectSSE({\n        url: `${basePath}/${encodeURIComponent(alias)}/messages?requestId=${encodeURIComponent(requestId)}`,\n        payload: {\n          content: trimmed,\n          conversationId: conversationIdRef.current ?? undefined,\n        },\n        signal: abortController.signal,\n        onMessage: async (message) => {\n          try {\n            processEvent(JSON.parse(message.data) as GenieStreamEvent, false);\n          } catch {\n            // Malformed SSE data\n          }\n        },\n        onError: (err) => {\n          if (abortController.signal.aborted) return;\n          setError(\n            err instanceof Error\n              ? err.message\n              : \"Connection error. Please try again.\",\n          );\n          setStatus(\"error\");\n          setMessages((prev) => {\n            const last = prev[prev.length - 1];\n            return last?.role === \"assistant\" && last.id === \"\"\n              ? prev.slice(0, -1)\n              : prev;\n          });\n        },\n      }).then(() => {\n        if (!abortController.signal.aborted) {\n          setStatus((prev) => (prev === \"error\" ? \"error\" : \"idle\"));\n        }\n      });\n    },\n    [alias, basePath, processEvent],\n  );\n\n  const loadHistory = useCallback(\n    (convId: string) => {\n      abortControllerRef.current?.abort();\n      setStatus(\"loading-history\");\n      setError(null);\n      setMessages([]);\n      setConversationId(convId);\n\n      const abortController = new AbortController();\n      abortControllerRef.current = abortController;\n\n      const requestId = crypto.randomUUID();\n\n      connectSSE({\n        url: `${basePath}/${encodeURIComponent(alias)}/conversations/${encodeURIComponent(convId)}?requestId=${encodeURIComponent(requestId)}`,\n        signal: abortController.signal,\n        onMessage: async (message) => {\n          try {\n            processEvent(JSON.parse(message.data) as GenieStreamEvent, true);\n          } catch {\n            // Malformed SSE data\n          }\n        },\n        onError: (err) => {\n          if (abortController.signal.aborted) return;\n          setError(\n            err instanceof Error\n              ? err.message\n              : \"Failed to load conversation history.\",\n          );\n          setStatus(\"error\");\n        },\n      }).then(() => {\n        if (!abortController.signal.aborted) {\n          setStatus((prev) => (prev === \"error\" ? \"error\" : \"idle\"));\n        }\n      });\n    },\n    [alias, basePath, processEvent],\n  );\n\n  const reset = useCallback(() => {\n    abortControllerRef.current?.abort();\n    setMessages([]);\n    setConversationId(null);\n    setError(null);\n    setStatus(\"idle\");\n    if (persistInUrl) {\n      removeUrlParam(urlParamName);\n    }\n  }, [persistInUrl, urlParamName]);\n\n  useEffect(() => {\n    if (!persistInUrl) return;\n    const existingId = getUrlParam(urlParamName);\n    if (existingId) {\n      loadHistory(existingId);\n    }\n    return () => {\n      abortControllerRef.current?.abort();\n    };\n  }, [persistInUrl, urlParamName, loadHistory]);\n\n  return { messages, status, conversationId, error, sendMessage, reset };\n}\n"],"mappings":"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"}
+{"version":3,"file":"use-genie-chat.js","names":[],"sources":["../../../src/react/genie/use-genie-chat.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport { connectSSE } from \"@/js\";\nimport type {\n  GenieChatStatus,\n  GenieMessageItem,\n  GenieMessageResponse,\n  GenieStreamEvent,\n  UseGenieChatOptions,\n  UseGenieChatReturn,\n} from \"./types\";\n\nfunction getUrlParam(name: string): string | null {\n  return new URLSearchParams(window.location.search).get(name);\n}\n\nfunction setUrlParam(name: string, value: string): void {\n  const url = new URL(window.location.href);\n  url.searchParams.set(name, value);\n  window.history.replaceState({}, \"\", url.toString());\n}\n\nfunction removeUrlParam(name: string): void {\n  const url = new URL(window.location.href);\n  url.searchParams.delete(name);\n  window.history.replaceState({}, \"\", url.toString());\n}\n\n/**\n * The Genie API puts the user's question in `message.content` and the\n * actual AI answer in text attachments. Extract the text attachment\n * content so we display the real answer, not the question echo.\n */\nfunction extractAssistantContent(msg: GenieMessageResponse): string {\n  const textParts = (msg.attachments ?? [])\n    .map((att) => att.text?.content)\n    .filter(Boolean) as string[];\n  return textParts.length > 0 ? textParts.join(\"\\n\\n\") : msg.content;\n}\n\nfunction makeUserItem(\n  msg: GenieMessageResponse,\n  idSuffix = \"\",\n): GenieMessageItem {\n  return {\n    id: `${msg.messageId}${idSuffix}`,\n    role: \"user\",\n    content: msg.content,\n    status: msg.status,\n    attachments: [],\n    queryResults: new Map(),\n  };\n}\n\nfunction makeAssistantItem(msg: GenieMessageResponse): GenieMessageItem {\n  return {\n    id: msg.messageId,\n    role: \"assistant\",\n    content: extractAssistantContent(msg),\n    status: msg.status,\n    attachments: msg.attachments ?? [],\n    queryResults: new Map(),\n    error: msg.error,\n  };\n}\n\n/**\n * The API bundles user question (content) and AI answer (attachments) in one message.\n * Split into separate user + assistant items for display.\n */\nfunction messageResultToItems(msg: GenieMessageResponse): GenieMessageItem[] {\n  const hasAttachments = (msg.attachments?.length ?? 0) > 0;\n  if (!hasAttachments) return [makeUserItem(msg)];\n  return [makeUserItem(msg, \"-user\"), makeAssistantItem(msg)];\n}\n\n/**\n * Streams a conversation page via SSE. Collects message items and query\n * results into a buffer and returns them when the stream completes.\n */\nfunction fetchConversationPage(\n  basePath: string,\n  alias: string,\n  convId: string,\n  options: {\n    pageToken?: string;\n    signal?: AbortSignal;\n    onPaginationInfo?: (nextPageToken: string | null) => void;\n    onError?: (error: string) => void;\n    onConnectionError?: (err: unknown) => void;\n  },\n): Promise<GenieMessageItem[]> {\n  const params = new URLSearchParams({\n    requestId: crypto.randomUUID(),\n  });\n  if (options.pageToken) {\n    params.set(\"pageToken\", options.pageToken);\n  }\n\n  const items: GenieMessageItem[] = [];\n  return connectSSE({\n    url: `${basePath}/${encodeURIComponent(alias)}/conversations/${encodeURIComponent(convId)}?${params}`,\n    signal: options.signal,\n    onMessage: async (message) => {\n      try {\n        const event = JSON.parse(message.data) as GenieStreamEvent;\n        switch (event.type) {\n          case \"message_result\":\n            items.push(...messageResultToItems(event.message));\n            break;\n          case \"query_result\":\n            for (let i = items.length - 1; i >= 0; i--) {\n              const item = items[i];\n              if (\n                item.attachments.some(\n                  (a) => a.attachmentId === event.attachmentId,\n                )\n              ) {\n                item.queryResults.set(event.attachmentId, event.data);\n                break;\n              }\n            }\n            break;\n          case \"history_info\":\n            options.onPaginationInfo?.(event.nextPageToken);\n            break;\n          case \"error\":\n            options.onError?.(event.error);\n            break;\n        }\n      } catch {\n        // Malformed SSE data\n      }\n    },\n    onError: (err) => options.onConnectionError?.(err),\n  }).then(() => items);\n}\n\n/** Minimum time (ms) to hold the loading-older state so scroll inertia settles before prepending messages. */\nconst MIN_PREVIOUS_PAGE_LOAD_MS = 800;\n\n/**\n * Manages the full Genie chat lifecycle:\n * SSE streaming, conversation persistence via URL, and history replay.\n *\n * @example\n * ```tsx\n * const { messages, status, sendMessage, reset } = useGenieChat({ alias: \"demo\" });\n * ```\n */\nexport function useGenieChat(options: UseGenieChatOptions): UseGenieChatReturn {\n  const {\n    alias,\n    basePath = \"/api/genie\",\n    persistInUrl = true,\n    urlParamName = \"conversationId\",\n  } = options;\n\n  const [messages, setMessages] = useState<GenieMessageItem[]>([]);\n  const [status, setStatus] = useState<GenieChatStatus>(\"idle\");\n  const [conversationId, setConversationId] = useState<string | null>(null);\n  const [error, setError] = useState<string | null>(null);\n  const [nextPageToken, setNextPageToken] = useState<string | null>(null);\n\n  const hasPreviousPage = nextPageToken !== null;\n  const isFetchingPreviousPage = status === \"loading-older\";\n\n  const abortControllerRef = useRef<AbortController | null>(null);\n  const paginationAbortRef = useRef<AbortController | null>(null);\n  const conversationIdRef = useRef<string | null>(null);\n  const nextPageTokenRef = useRef<string | null>(null);\n  const isLoadingOlderRef = useRef(false);\n\n  useEffect(() => {\n    conversationIdRef.current = conversationId;\n    nextPageTokenRef.current = nextPageToken;\n  }, [conversationId, nextPageToken]);\n\n  /** Process SSE events during live message streaming (sendMessage). */\n  const processStreamEvent = useCallback(\n    (event: GenieStreamEvent) => {\n      switch (event.type) {\n        case \"message_start\": {\n          setConversationId(event.conversationId);\n          if (persistInUrl) {\n            setUrlParam(urlParamName, event.conversationId);\n          }\n          break;\n        }\n\n        case \"status\": {\n          setMessages((prev) => {\n            const last = prev[prev.length - 1];\n            if (last?.role === \"assistant\") {\n              return [...prev.slice(0, -1), { ...last, status: event.status }];\n            }\n            return prev;\n          });\n          break;\n        }\n\n        case \"message_result\": {\n          const msg = event.message;\n          const hasAttachments = (msg.attachments?.length ?? 0) > 0;\n\n          if (hasAttachments) {\n            // During streaming we already appended the user message locally,\n            // so only handle assistant results. Messages without attachments\n            // are the user-message echo from the API — skip those.\n            const item = makeAssistantItem(msg);\n            setMessages((prev) => {\n              const last = prev[prev.length - 1];\n              if (last?.role === \"assistant\" && last.id === \"\") {\n                return [...prev.slice(0, -1), item];\n              }\n              return [...prev, item];\n            });\n          }\n          break;\n        }\n\n        case \"query_result\": {\n          setMessages((prev) => {\n            // Reverse scan — query results typically match recent messages\n            for (let i = prev.length - 1; i >= 0; i--) {\n              const msg = prev[i];\n              if (\n                msg.attachments.some(\n                  (a) => a.attachmentId === event.attachmentId,\n                )\n              ) {\n                const updated = prev.slice();\n                updated[i] = {\n                  ...msg,\n                  queryResults: new Map(msg.queryResults).set(\n                    event.attachmentId,\n                    event.data,\n                  ),\n                };\n                return updated;\n              }\n            }\n            return prev;\n          });\n          break;\n        }\n\n        case \"error\": {\n          setError(event.error);\n          setStatus(\"error\");\n          break;\n        }\n      }\n    },\n    [persistInUrl, urlParamName],\n  );\n\n  const sendMessage = useCallback(\n    (content: string) => {\n      const trimmed = content.trim();\n      if (!trimmed) return;\n\n      abortControllerRef.current?.abort();\n      paginationAbortRef.current?.abort();\n      setError(null);\n      setStatus(\"streaming\");\n\n      const userMessage: GenieMessageItem = {\n        id: crypto.randomUUID(),\n        role: \"user\",\n        content: trimmed,\n        status: \"COMPLETED\",\n        attachments: [],\n        queryResults: new Map(),\n      };\n\n      const assistantPlaceholder: GenieMessageItem = {\n        id: \"\",\n        role: \"assistant\",\n        content: \"\",\n        status: \"ASKING_AI\",\n        attachments: [],\n        queryResults: new Map(),\n      };\n\n      setMessages((prev) => [...prev, userMessage, assistantPlaceholder]);\n\n      const abortController = new AbortController();\n      abortControllerRef.current = abortController;\n\n      const requestId = crypto.randomUUID();\n\n      connectSSE({\n        url: `${basePath}/${encodeURIComponent(alias)}/messages?requestId=${encodeURIComponent(requestId)}`,\n        payload: {\n          content: trimmed,\n          conversationId: conversationIdRef.current ?? undefined,\n        },\n        signal: abortController.signal,\n        onMessage: async (message) => {\n          try {\n            processStreamEvent(JSON.parse(message.data) as GenieStreamEvent);\n          } catch {\n            // Malformed SSE data\n          }\n        },\n        onError: (err) => {\n          if (abortController.signal.aborted) return;\n          setError(\n            err instanceof Error\n              ? err.message\n              : \"Connection error. Please try again.\",\n          );\n          setStatus(\"error\");\n          setMessages((prev) => {\n            const last = prev[prev.length - 1];\n            return last?.role === \"assistant\" && last.id === \"\"\n              ? prev.slice(0, -1)\n              : prev;\n          });\n        },\n      }).then(() => {\n        if (!abortController.signal.aborted) {\n          setStatus((prev) => (prev === \"error\" ? \"error\" : \"idle\"));\n        }\n      });\n    },\n    [alias, basePath, processStreamEvent],\n  );\n\n  /** Creates an AbortController, stores it in the given ref, and fetches a conversation page. */\n  const fetchPage = useCallback(\n    (\n      controllerRef: { current: AbortController | null },\n      convId: string,\n      options?: { pageToken?: string; errorMessage?: string },\n    ) => {\n      controllerRef.current?.abort();\n      const abortController = new AbortController();\n      controllerRef.current = abortController;\n\n      const promise = fetchConversationPage(basePath, alias, convId, {\n        pageToken: options?.pageToken,\n        signal: abortController.signal,\n        onPaginationInfo: setNextPageToken,\n        onError: (msg) => {\n          setError(msg);\n          setStatus(\"error\");\n        },\n        onConnectionError: (err) => {\n          if (abortController.signal.aborted) return;\n          setError(\n            err instanceof Error\n              ? err.message\n              : (options?.errorMessage ?? \"Failed to load messages.\"),\n          );\n          setStatus(\"error\");\n        },\n      });\n\n      return { promise, abortController };\n    },\n    [alias, basePath],\n  );\n\n  const loadHistory = useCallback(\n    (convId: string) => {\n      paginationAbortRef.current?.abort();\n      setStatus(\"loading-history\");\n      setError(null);\n      setMessages([]);\n      setConversationId(convId);\n\n      const { promise, abortController } = fetchPage(\n        abortControllerRef,\n        convId,\n        { errorMessage: \"Failed to load conversation history.\" },\n      );\n      promise.then((items) => {\n        if (!abortController.signal.aborted) {\n          setMessages(items);\n          setStatus((prev) => (prev === \"error\" ? \"error\" : \"idle\"));\n        }\n      });\n    },\n    [fetchPage],\n  );\n\n  const fetchPreviousPage = useCallback(() => {\n    if (\n      !nextPageTokenRef.current ||\n      !conversationIdRef.current ||\n      isLoadingOlderRef.current\n    )\n      return;\n\n    isLoadingOlderRef.current = true;\n    setStatus(\"loading-older\");\n    setError(null);\n\n    const startTime = Date.now();\n    const { promise, abortController } = fetchPage(\n      paginationAbortRef,\n      conversationIdRef.current,\n      {\n        pageToken: nextPageTokenRef.current,\n        errorMessage: \"Failed to load older messages.\",\n      },\n    );\n    promise\n      .then(async (items) => {\n        if (abortController.signal.aborted) return;\n        const elapsed = Date.now() - startTime;\n        if (elapsed < MIN_PREVIOUS_PAGE_LOAD_MS) {\n          await new Promise((r) =>\n            setTimeout(r, MIN_PREVIOUS_PAGE_LOAD_MS - elapsed),\n          );\n        }\n        if (abortController.signal.aborted) return;\n        if (items.length > 0) {\n          setMessages((prev) => [...items, ...prev]);\n        }\n        setStatus((current) =>\n          current === \"loading-older\" ? \"idle\" : current,\n        );\n      })\n      .finally(() => {\n        isLoadingOlderRef.current = false;\n      });\n  }, [fetchPage]);\n\n  const reset = useCallback(() => {\n    abortControllerRef.current?.abort();\n    paginationAbortRef.current?.abort();\n    setMessages([]);\n    setConversationId(null);\n    setError(null);\n    setStatus(\"idle\");\n    setNextPageToken(null);\n    if (persistInUrl) {\n      removeUrlParam(urlParamName);\n    }\n  }, [persistInUrl, urlParamName]);\n\n  useEffect(() => {\n    if (!persistInUrl) return;\n    const existingId = getUrlParam(urlParamName);\n    if (existingId) {\n      loadHistory(existingId);\n    }\n    return () => {\n      abortControllerRef.current?.abort();\n      paginationAbortRef.current?.abort();\n    };\n  }, [persistInUrl, urlParamName, loadHistory]);\n\n  return {\n    messages,\n    status,\n    conversationId,\n    error,\n    sendMessage,\n    reset,\n    hasPreviousPage,\n    isFetchingPreviousPage,\n    fetchPreviousPage,\n  };\n}\n"],"mappings":"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"}

package/dist/react/index.d.ts

@@ -1,4 +1,4 @@
-import { GenieAttachmentResponse, GenieMessageResponse, GenieStreamEvent } from "../shared/src/genie.js";
+import { GenieAttachmentResponse, GenieMessageResponse, GenieStatementResponse, GenieStreamEvent } from "../shared/src/genie.js";
 import { DATE_FIELD_PATTERNS, METADATA_DATE_PATTERNS, NAME_FIELD_PATTERNS } from "../js/constants.js";
 import { AreaChartProps, AreaChartSpecificProps, BarChartProps, BarChartSpecificProps, ChartBaseProps, ChartColorPalette, ChartData, ChartType, DataFormat, DataProps, DonutChartProps, HeatmapChartProps, HeatmapChartSpecificProps, LineChartProps, LineChartSpecificProps, NormalizedChartData, NormalizedChartDataBase, Orientation, PieChartProps, PieChartSpecificProps, QueryProps, RadarChartProps, RadarChartSpecificProps, ScatterChartProps, ScatterChartSpecificProps, UnifiedChartProps, isArrowTable, isDataProps, isQueryProps } from "./charts/types.js";
 import { AreaChart } from "./charts/area/index.js";
@@ -18,11 +18,14 @@ import { useAllThemeColors, useThemeColors } from "./charts/theme.js";
 import { createTimeSeriesData, formatLabel, sortTimeSeriesAscending, toChartArray, toChartValue, truncateLabel } from "./charts/utils.js";
 import { CartesianContext, HeatmapContext, OptionBuilderContext, buildCartesianOption, buildHeatmapOption, buildHorizontalBarOption, buildPieOption, buildRadarOption } from "./charts/options.js";
 import "./charts/index.js";
+import { ColumnCategory, GenieColumnMeta, TransformedGenieData, transformGenieData } from "./genie/genie-query-transform.js";
+import { ChartInference, inferChartType } from "./genie/genie-chart-inference.js";
 import { GenieChatProps, GenieChatStatus, GenieMessageItem, UseGenieChatOptions, UseGenieChatReturn } from "./genie/types.js";
 import { GenieChat } from "./genie/genie-chat.js";
 import { GenieChatInput } from "./genie/genie-chat-input.js";
 import { GenieChatMessage } from "./genie/genie-chat-message.js";
 import { GenieChatMessageList } from "./genie/genie-chat-message-list.js";
+import { GenieQueryVisualization } from "./genie/genie-query-visualization.js";
 import { useGenieChat } from "./genie/use-genie-chat.js";
 import "./genie/index.js";
 import { AnalyticsFormat, InferResultByFormat, InferRowType, PluginRegistry, QueryRegistry, TypedArrowTable, UseAnalyticsQueryOptions, UseAnalyticsQueryResult } from "./hooks/types.js";
@@ -86,4 +89,4 @@ import { Textarea } from "./ui/textarea.js";
 import { Toggle, toggleVariants } from "./ui/toggle.js";
 import { ToggleGroup, ToggleGroupItem } from "./ui/toggle-group.js";
 import "./ui/index.js";
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AnalyticsFormat, AreaChart, AreaChartProps, AreaChartSpecificProps, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, BarChart, BarChartProps, BarChartSpecificProps, BaseChart, BaseChartProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CHART_COLOR_VARS, CHART_COLOR_VARS_CATEGORICAL, CHART_COLOR_VARS_DIVERGING, CHART_COLOR_VARS_SEQUENTIAL, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, CartesianContext, ChartBaseProps, ChartColorPalette, ChartConfig, ChartContainer, ChartData, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, ChartType, ChartWrapper, ChartWrapperProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DATE_FIELD_PATTERNS, DataFormat, DataProps, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DonutChart, DonutChartProps, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, FALLBACK_COLORS, FALLBACK_COLORS_CATEGORICAL, FALLBACK_COLORS_DIVERGING, FALLBACK_COLORS_SEQUENTIAL, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, GenieAttachmentResponse, GenieChat, GenieChatInput, GenieChatMessage, GenieChatMessageList, GenieChatProps, GenieChatStatus, GenieMessageItem, GenieMessageResponse, GenieStreamEvent, HeatmapChart, HeatmapChartProps, HeatmapChartSpecificProps, HeatmapContext, HoverCard, HoverCardContent, HoverCardTrigger, InferResultByFormat, InferRowType, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, LineChart, LineChartProps, LineChartSpecificProps, METADATA_DATE_PATTERNS, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NAME_FIELD_PATTERNS, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, NormalizedChartData, NormalizedChartDataBase, NormalizedHeatmapData, OptionBuilderContext, Orientation, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PieChart, PieChartProps, PieChartSpecificProps, PluginRegistry, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PortalContainerContext, PortalContainerProvider, Progress, QueryProps, QueryRegistry, RadarChart, RadarChartProps, RadarChartSpecificProps, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScatterChart, ScatterChartProps, ScatterChartSpecificProps, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TypedArrowTable, UnifiedChartProps, UseAnalyticsQueryOptions, UseAnalyticsQueryResult, UseChartDataOptions, UseChartDataResult, UseGenieChatOptions, UseGenieChatReturn, badgeVariants, buildCartesianOption, buildHeatmapOption, buildHorizontalBarOption, buildPieOption, buildRadarOption, buttonGroupVariants, buttonVariants, cn, createChart, createTimeSeriesData, formatLabel, isArrowTable, isDataProps, isQueryProps, navigationMenuTriggerStyle, normalizeChartData, normalizeHeatmapData, sortTimeSeriesAscending, toChartArray, toChartValue, toggleVariants, truncateLabel, useAllThemeColors, useAnalyticsQuery, useChartData, useFormField, useGenieChat, usePortalContainer, useResolvedPortalContainer, useSidebar, useThemeColors };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AnalyticsFormat, AreaChart, AreaChartProps, AreaChartSpecificProps, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, BarChart, BarChartProps, BarChartSpecificProps, BaseChart, BaseChartProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CHART_COLOR_VARS, CHART_COLOR_VARS_CATEGORICAL, CHART_COLOR_VARS_DIVERGING, CHART_COLOR_VARS_SEQUENTIAL, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, CartesianContext, ChartBaseProps, ChartColorPalette, ChartConfig, ChartContainer, ChartData, ChartInference, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, ChartType, ChartWrapper, ChartWrapperProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, ColumnCategory, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DATE_FIELD_PATTERNS, DataFormat, DataProps, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DonutChart, DonutChartProps, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, FALLBACK_COLORS, FALLBACK_COLORS_CATEGORICAL, FALLBACK_COLORS_DIVERGING, FALLBACK_COLORS_SEQUENTIAL, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, GenieAttachmentResponse, GenieChat, GenieChatInput, GenieChatMessage, GenieChatMessageList, GenieChatProps, GenieChatStatus, GenieColumnMeta, GenieMessageItem, GenieMessageResponse, GenieQueryVisualization, GenieStatementResponse, GenieStreamEvent, HeatmapChart, HeatmapChartProps, HeatmapChartSpecificProps, HeatmapContext, HoverCard, HoverCardContent, HoverCardTrigger, InferResultByFormat, InferRowType, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, LineChart, LineChartProps, LineChartSpecificProps, METADATA_DATE_PATTERNS, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NAME_FIELD_PATTERNS, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, NormalizedChartData, NormalizedChartDataBase, NormalizedHeatmapData, OptionBuilderContext, Orientation, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PieChart, PieChartProps, PieChartSpecificProps, PluginRegistry, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PortalContainerContext, PortalContainerProvider, Progress, QueryProps, QueryRegistry, RadarChart, RadarChartProps, RadarChartSpecificProps, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScatterChart, ScatterChartProps, ScatterChartSpecificProps, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TransformedGenieData, TypedArrowTable, UnifiedChartProps, UseAnalyticsQueryOptions, UseAnalyticsQueryResult, UseChartDataOptions, UseChartDataResult, UseGenieChatOptions, UseGenieChatReturn, badgeVariants, buildCartesianOption, buildHeatmapOption, buildHorizontalBarOption, buildPieOption, buildRadarOption, buttonGroupVariants, buttonVariants, cn, createChart, createTimeSeriesData, formatLabel, inferChartType, isArrowTable, isDataProps, isQueryProps, navigationMenuTriggerStyle, normalizeChartData, normalizeHeatmapData, sortTimeSeriesAscending, toChartArray, toChartValue, toggleVariants, transformGenieData, truncateLabel, useAllThemeColors, useAnalyticsQuery, useChartData, useFormField, useGenieChat, usePortalContainer, useResolvedPortalContainer, useSidebar, useThemeColors };

package/dist/react/index.js

@@ -18,6 +18,7 @@ import { DonutChart, PieChart } from "./charts/pie/index.js";
 import { RadarChart } from "./charts/radar/index.js";
 import { ScatterChart } from "./charts/scatter/index.js";
 import "./charts/index.js";
+import { inferChartType } from "./genie/genie-chart-inference.js";
 import { cn } from "./lib/utils.js";
 import { Button, buttonVariants } from "./ui/button.js";
 import { GenieChatInput } from "./genie/genie-chat-input.js";
@@ -26,6 +27,10 @@ import { Skeleton } from "./ui/skeleton.js";
 import { Spinner } from "./ui/spinner.js";
 import { Avatar, AvatarFallback, AvatarImage } from "./ui/avatar.js";
 import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "./ui/card.js";
+import { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from "./ui/table.js";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "./ui/tabs.js";
+import { transformGenieData } from "./genie/genie-query-transform.js";
+import { GenieQueryVisualization } from "./genie/genie-query-visualization.js";
 import { GenieChatMessage } from "./genie/genie-chat-message.js";
 import { GenieChatMessageList } from "./genie/genie-chat-message-list.js";
 import { useGenieChat } from "./genie/use-genie-chat.js";
@@ -36,7 +41,6 @@ import { PortalContainerContext, PortalContainerProvider, usePortalContainer, us
 import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "./ui/dropdown-menu.js";
 import { Input } from "./ui/input.js";
 import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue } from "./ui/select.js";
-import { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from "./ui/table.js";
 import { Checkbox } from "./ui/checkbox.js";
 import { DataTable } from "./table/data-table.js";
 import "./table/index.js";
@@ -79,9 +83,8 @@ import { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupActio
 import { Slider } from "./ui/slider.js";
 import { Toaster } from "./ui/sonner.js";
 import { Switch } from "./ui/switch.js";
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "./ui/tabs.js";
 import { Toggle, toggleVariants } from "./ui/toggle.js";
 import { ToggleGroup, ToggleGroupItem } from "./ui/toggle-group.js";
 import "./ui/index.js";
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AreaChart, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, BarChart, BaseChart, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CHART_COLOR_VARS, CHART_COLOR_VARS_CATEGORICAL, CHART_COLOR_VARS_DIVERGING, CHART_COLOR_VARS_SEQUENTIAL, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, ChartWrapper, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DATE_FIELD_PATTERNS, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DonutChart, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, FALLBACK_COLORS, FALLBACK_COLORS_CATEGORICAL, FALLBACK_COLORS_DIVERGING, FALLBACK_COLORS_SEQUENTIAL, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, GenieChat, GenieChatInput, GenieChatMessage, GenieChatMessageList, HeatmapChart, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, LineChart, METADATA_DATE_PATTERNS, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NAME_FIELD_PATTERNS, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PieChart, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PortalContainerContext, PortalContainerProvider, Progress, RadarChart, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScatterChart, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buildCartesianOption, buildHeatmapOption, buildHorizontalBarOption, buildPieOption, buildRadarOption, buttonGroupVariants, buttonVariants, cn, createChart, createTimeSeriesData, formatLabel, isArrowTable, isDataProps, isQueryProps, navigationMenuTriggerStyle, normalizeChartData, normalizeHeatmapData, sortTimeSeriesAscending, toChartArray, toChartValue, toggleVariants, truncateLabel, useAllThemeColors, useAnalyticsQuery, useChartData, useFormField, useGenieChat, usePortalContainer, useResolvedPortalContainer, useSidebar, useThemeColors };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AreaChart, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, BarChart, BaseChart, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CHART_COLOR_VARS, CHART_COLOR_VARS_CATEGORICAL, CHART_COLOR_VARS_DIVERGING, CHART_COLOR_VARS_SEQUENTIAL, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, ChartWrapper, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DATE_FIELD_PATTERNS, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DonutChart, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, FALLBACK_COLORS, FALLBACK_COLORS_CATEGORICAL, FALLBACK_COLORS_DIVERGING, FALLBACK_COLORS_SEQUENTIAL, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, GenieChat, GenieChatInput, GenieChatMessage, GenieChatMessageList, GenieQueryVisualization, HeatmapChart, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, LineChart, METADATA_DATE_PATTERNS, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NAME_FIELD_PATTERNS, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PieChart, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PortalContainerContext, PortalContainerProvider, Progress, RadarChart, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScatterChart, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buildCartesianOption, buildHeatmapOption, buildHorizontalBarOption, buildPieOption, buildRadarOption, buttonGroupVariants, buttonVariants, cn, createChart, createTimeSeriesData, formatLabel, inferChartType, isArrowTable, isDataProps, isQueryProps, navigationMenuTriggerStyle, normalizeChartData, normalizeHeatmapData, sortTimeSeriesAscending, toChartArray, toChartValue, toggleVariants, transformGenieData, truncateLabel, useAllThemeColors, useAnalyticsQuery, useChartData, useFormField, useGenieChat, usePortalContainer, useResolvedPortalContainer, useSidebar, useThemeColors };

package/dist/react/table/data-table.js

@@ -1,9 +1,9 @@
 import { Button } from "../ui/button.js";
+import { Table as Table$1, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../ui/table.js";
 import { formatFieldLabel } from "../lib/format.js";
 import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuTrigger } from "../ui/dropdown-menu.js";
 import { Input } from "../ui/input.js";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../ui/select.js";
-import { Table as Table$1, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../ui/table.js";
 import { TableWrapper } from "./table-wrapper.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ChevronDown } from "lucide-react";

package/dist/react/ui/index.js

@@ -4,10 +4,11 @@ import { Skeleton } from "./skeleton.js";
 import { Spinner } from "./spinner.js";
 import { Avatar, AvatarFallback, AvatarImage } from "./avatar.js";
 import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "./card.js";
+import { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from "./table.js";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "./tabs.js";
 import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "./dropdown-menu.js";
 import { Input } from "./input.js";
 import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue } from "./select.js";
-import { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from "./table.js";
 import { Checkbox } from "./checkbox.js";
 import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "./accordion.js";
 import { Alert, AlertDescription, AlertTitle } from "./alert.js";
@@ -48,6 +49,5 @@ import { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupActio
 import { Slider } from "./slider.js";
 import { Toaster } from "./sonner.js";
 import { Switch } from "./switch.js";
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "./tabs.js";
 import { Toggle, toggleVariants } from "./toggle.js";
 import { ToggleGroup, ToggleGroupItem } from "./toggle-group.js";

package/dist/shared/src/genie.d.ts

@@ -15,11 +15,31 @@ type GenieStreamEvent = {
   type: "query_result";
   attachmentId: string;
   statementId: string;
-  data: unknown;
+  data: GenieStatementResponse;
 } | {
   type: "error";
   error: string;
+} | {
+  type: "history_info";
+  conversationId: string;
+  spaceId: string; /** Opaque token to fetch the next (older) page. Null means no more pages. */
+  nextPageToken: string | null; /** Total messages returned in this initial load */
+  loadedCount: number;
 };
+/** Shape of the Databricks SQL statement_response returned by Genie queries */
+interface GenieStatementResponse {
+  manifest: {
+    schema: {
+      columns: Array<{
+        name: string;
+        type_name: string;
+      }>;
+    };
+  };
+  result: {
+    data_array: (string | null)[][];
+  };
+}
 /** Cleaned response — subset of SDK GenieMessage */
 interface GenieMessageResponse {
   messageId: string;
@@ -44,5 +64,5 @@ interface GenieAttachmentResponse {
   suggestedQuestions?: string[];
 }
 //#endregion
-export { GenieAttachmentResponse, GenieMessageResponse, GenieStreamEvent };
+export { GenieAttachmentResponse, GenieMessageResponse, GenieStatementResponse, GenieStreamEvent };
 //# sourceMappingURL=genie.d.ts.map

package/dist/shared/src/genie.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"genie.d.ts","names":[],"sources":["../../../../shared/src/genie.ts"],"mappings":";;KACY,gBAAA;EAEN,IAAA;EACA,cAAA;EACA,SAAA;EACA,OAAA;AAAA;EAEA,IAAA;EAAgB,MAAA;AAAA;EAChB,IAAA;EAAwB,OAAA,EAAS,oBAAA;AAAA;EAEjC,IAAA;EACA,YAAA;EACA,WAAA;EACA,IAAA;AAAA;EAEA,IAAA;EAAe,KAAA;AAAA;;UAGJ,oBAAA;EACf,SAAA;EACA,cAAA;EACA,OAAA;EACA,MAAA;EACA,OAAA;EACA,WAAA,GAAc,uBAAA;EACd,KAAA;AAAA;AAAA,UAGe,uBAAA;EACf,YAAA;EACA,KAAA;IACE,KAAA;IACA,WAAA;IACA,KAAA;IACA,WAAA;EAAA;EAEF,IAAA;IAAS,OAAA;EAAA;EACT,kBAAA;AAAA"}
+{"version":3,"file":"genie.d.ts","names":[],"sources":["../../../../shared/src/genie.ts"],"mappings":";;KACY,gBAAA;EAEN,IAAA;EACA,cAAA;EACA,SAAA;EACA,OAAA;AAAA;EAEA,IAAA;EAAgB,MAAA;AAAA;EAChB,IAAA;EAAwB,OAAA,EAAS,oBAAA;AAAA;EAEjC,IAAA;EACA,YAAA;EACA,WAAA;EACA,IAAA,EAAM,sBAAA;AAAA;EAEN,IAAA;EAAe,KAAA;AAAA;EAEf,IAAA;EACA,cAAA;EACA,OAAA,UAEA;EAAA,aAAA,iBAEW;EAAX,WAAA;AAAA;;UAIW,sBAAA;EACf,QAAA;IACE,MAAA;MACE,OAAA,EAAS,KAAA;QAAQ,IAAA;QAAc,SAAA;MAAA;IAAA;EAAA;EAGnC,MAAA;IACE,UAAA;EAAA;AAAA;;UAKa,oBAAA;EACf,SAAA;EACA,cAAA;EACA,OAAA;EACA,MAAA;EACA,OAAA;EACA,WAAA,GAAc,uBAAA;EACd,KAAA;AAAA;AAAA,UAGe,uBAAA;EACf,YAAA;EACA,KAAA;IACE,KAAA;IACA,WAAA;IACA,KAAA;IACA,WAAA;EAAA;EAEF,IAAA;IAAS,OAAA;EAAA;EACT,kBAAA;AAAA"}

package/dist/shared/src/index.d.ts

@@ -1,7 +1,7 @@
 import "./plugin.js";
 import "./cache.js";
 import "./execute.js";
-import { GenieAttachmentResponse, GenieMessageResponse, GenieStreamEvent } from "./genie.js";
+import { GenieAttachmentResponse, GenieMessageResponse, GenieStatementResponse, GenieStreamEvent } from "./genie.js";
 import { SQLBinaryMarker, SQLBooleanMarker, SQLDateMarker, SQLNumberMarker, SQLStringMarker, SQLTimestampMarker, SQLTypeMarker } from "./sql/types.js";
 import { isSQLTypeMarker, sql } from "./sql/helpers.js";
 import "./tunnel.js";

package/docs/api/appkit-ui/genie/GenieChatMessageList.md

@@ -10,11 +10,13 @@ Scrollable message list that renders Genie chat messages with auto-scroll, skele
 
 ### Props[​](#props "Direct link to Props")
 
-| Prop        | Type                 | Required | Default | Description                                                                 |
-| ----------- | -------------------- | -------- | ------- | --------------------------------------------------------------------------- |
-| `messages`  | `GenieMessageItem[]` | ✓        | -       | Array of messages to display                                                |
-| `status`    | `enum`               | ✓        | -       | Current chat status (controls loading indicators and skeleton placeholders) |
-| `className` | `string`             |          | -       | Additional CSS class for the scroll area                                    |
+| Prop                  | Type                 | Required | Default | Description                                                                 |
+| --------------------- | -------------------- | -------- | ------- | --------------------------------------------------------------------------- |
+| `messages`            | `GenieMessageItem[]` | ✓        | -       | Array of messages to display                                                |
+| `status`              | `enum`               | ✓        | -       | Current chat status (controls loading indicators and skeleton placeholders) |
+| `className`           | `string`             |          | -       | Additional CSS class for the scroll area                                    |
+| `hasPreviousPage`     | `boolean`            |          | `false` | Whether a previous page of older messages exists                            |
+| `onFetchPreviousPage` | `(() => void)`       |          | -       | Callback to fetch the previous page of messages                             |
 
 ### Usage[​](#usage "Direct link to Usage")
 

package/docs/api/appkit-ui/genie/GenieQueryVisualization.md

@@ -0,0 +1,29 @@
+# GenieQueryVisualization
+
+Renders a chart + data table for a Genie query result.
+
+## GenieQueryVisualization[​](#geniequeryvisualization-1 "Direct link to GenieQueryVisualization")
+
+Renders a chart + data table for a Genie query result.
+
+* When a chart type can be inferred: shows Tabs with "Chart" (default) and "Table"
+* When no chart fits: shows only the data table
+* When data is empty/malformed: renders nothing
+
+**Source:** [`packages/appkit-ui/src/react/genie/genie-query-visualization.tsx`](https://github.com/databricks/appkit/blob/main/packages/appkit-ui/src/react/genie/genie-query-visualization.tsx)
+
+### Props[​](#props "Direct link to Props")
+
+| Prop        | Type                     | Required | Default | Description                                |
+| ----------- | ------------------------ | -------- | ------- | ------------------------------------------ |
+| `data`      | `GenieStatementResponse` | ✓        | -       | Raw statement\_response from the Genie API |
+| `className` | `string`                 |          | -       | Additional CSS classes                     |
+
+### Usage[​](#usage "Direct link to Usage")
+
+```tsx
+import { GenieQueryVisualization } from '@databricks/appkit-ui';
+
+<GenieQueryVisualization /* props */ />
+
+```

package/llms.txt

@@ -114,6 +114,7 @@ npx @databricks/appkit docs <query>
 - [GenieChatInput](./docs/api/appkit-ui/genie/GenieChatInput.md): Auto-expanding textarea input with a send button for chat messages. Submits on Enter (Shift+Enter for newline).
 - [GenieChatMessage](./docs/api/appkit-ui/genie/GenieChatMessage.md): Renders a single Genie message bubble with optional expandable SQL query attachments.
 - [GenieChatMessageList](./docs/api/appkit-ui/genie/GenieChatMessageList.md): Scrollable message list that renders Genie chat messages with auto-scroll, skeleton loaders, and a streaming indicator.
+- [GenieQueryVisualization](./docs/api/appkit-ui/genie/GenieQueryVisualization.md): Renders a chart + data table for a Genie query result.
 - [Styling](./docs/api/appkit-ui/styling.md): This guide covers how to style AppKit UI components using CSS variables and theming.
 - [Accordion](./docs/api/appkit-ui/ui/Accordion.md): Collapsible content sections organized in a vertical stack
 - [Alert](./docs/api/appkit-ui/ui/Alert.md): Displays important information with optional icon and multiple variants

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@databricks/appkit-ui",
   "type": "module",
-  "version": "0.16.0",
+  "version": "0.18.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",