{ "$schema": "https://ui.shadcn.com/schema/registry-item.json", "name": "highlight-to-askai", "type": "registry:block", "title": "Highlight to Ask AI [Experimental]", "description": "🚧 [Experimental] Highlight any text and ask Algolia Ask AI with an inline tooltip", "dependencies": [ "@floating-ui/react", "@ai-sdk/react@^2.0.4", "ai@^5.0.30", "lucide-react", "marked" ], "registryDependencies": [ "button", "input" ], "files": [ { "path": "src/registry/experiences/highlight-to-askai/components/highlight-to-askai.tsx", "content": "/** biome-ignore-all lint/security/noDangerouslySetInnerHtml: markdown rendering sanitized via parseMarkdownToSafeHtml */\n/** biome-ignore-all lint/suspicious/noArrayIndexKey: parts are stable during render */\n\"use client\";\n\nimport type { Placement, ReferenceType } from \"@floating-ui/react\";\nimport {\n FloatingPortal,\n flip,\n offset,\n shift,\n useFloating,\n} from \"@floating-ui/react\";\nimport {\n BrainIcon,\n CornerDownLeftIcon,\n SearchIcon,\n ThumbsDown,\n ThumbsUp,\n} from \"lucide-react\";\nimport { marked, type Tokens } from \"marked\";\nimport React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport {\n postAgentStudioFeedback,\n postFeedback,\n useAskai,\n} from \"@/registry/experiences/highlight-to-askai/hooks/use-askai\";\n\nfunction escapeHtml(html: string): string {\n return html\n .replace(/&/g, \"&\")\n .replace(//g, \">\")\n .replace(/\"/g, \""\")\n .replace(/'/g, \"'\");\n}\n\nfunction decodeUrlForSchemeCheck(value: string): string {\n let current = value;\n for (let i = 0; i < 3; i += 1) {\n try {\n const decoded = decodeURIComponent(current);\n if (decoded === current) {\n break;\n }\n current = decoded;\n } catch {\n break;\n }\n }\n return current;\n}\n\nfunction stripControlsAndWhitespace(value: string): string {\n let result = \"\";\n for (let i = 0; i < value.length; i += 1) {\n const code = value.charCodeAt(i);\n if (code > 0x20 && code !== 0x7f) {\n result += value.charAt(i);\n }\n }\n return result;\n}\n\nfunction sanitizeUrl(url: string | null | undefined): string {\n if (!url) {\n return \"\";\n }\n\n const trimmed = url.trim();\n if (!trimmed) {\n return \"\";\n }\n\n // Decode / strip controls for scheme checks only β€” return the original trimmed\n // URL when safe so percent-encoding in the path/query is preserved.\n const normalized = stripControlsAndWhitespace(\n decodeUrlForSchemeCheck(trimmed),\n ).replace(/\\\\/g, \"/\");\n if (!normalized) {\n return \"\";\n }\n\n // Protocol-relative and backslash-obfuscated hosts (e.g. /\\evil.com β†’ //evil.com).\n if (normalized.startsWith(\"//\")) {\n return \"\";\n }\n\n if (!/^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(normalized)) {\n return trimmed;\n }\n\n try {\n const parsed = new URL(normalized);\n if (\n parsed.protocol === \"http:\" ||\n parsed.protocol === \"https:\" ||\n parsed.protocol === \"mailto:\"\n ) {\n return trimmed;\n }\n } catch {\n return \"\";\n }\n\n return \"\";\n}\n\n/* eslint-disable xss/no-mixed-html -- marked renderer: interpolations escaped/sanitized */\nconst markdownRenderer = new marked.Renderer();\n\nmarkdownRenderer.code = ({ text, lang = \"\", escaped }: Tokens.Code): string => {\n const safeLang = /^[a-zA-Z0-9_-]+$/.test(lang) ? lang : \"\";\n const languageClass = safeLang ? \"language-\" + safeLang : \"\";\n const safeCode = escaped ? text : escapeHtml(text);\n return (\n '
' + safeCode + \"
\"\n );\n};\n\nmarkdownRenderer.link = ({ href, title, text }: Tokens.Link): string => {\n const safeHref = escapeHtml(sanitizeUrl(href));\n const textEscaped = escapeHtml(text);\n if (!safeHref) {\n return textEscaped;\n }\n const titleAttr = title ? ' title=\"' + escapeHtml(title) + '\"' : \"\";\n // href/text/title are sanitized + escaped above.\n return (\n '' +\n textEscaped +\n \"\"\n ); // nosemgrep\n};\n\nmarkdownRenderer.image = ({ href, title, text }: Tokens.Image): string => {\n const safeHref = escapeHtml(sanitizeUrl(href));\n if (!safeHref) {\n return escapeHtml(text);\n }\n const titleAttr = title ? ' title=\"' + escapeHtml(title) + '\"' : \"\";\n // src/alt/title are sanitized + escaped above.\n return (\n '\"'\"\n ); // nosemgrep\n};\n\nmarkdownRenderer.html = ({ text }: Tokens.HTML | Tokens.Tag): string =>\n escapeHtml(text);\n/* eslint-enable xss/no-mixed-html */\n\nfunction parseMarkdownToSafeHtml(content: string): string {\n return marked.parse(content, {\n gfm: true,\n breaks: true,\n renderer: markdownRenderer,\n }) as string;\n}\n\ntype OnAskPayload = {\n text: string;\n html: string;\n rect: DOMRect;\n range: Range;\n contextNode: HTMLElement;\n};\n\nexport type HighlightAskAIProps = {\n agentStudio?: boolean;\n applicationId: string;\n apiKey: string;\n indexName: string;\n assistantId: string;\n excludeElements?: string[];\n side?: Placement;\n sideOffset?: number;\n delay?: number;\n askButtonLabel?: string;\n className?: string;\n askAiBaseUrl?: string;\n onAsk?: (payload: OnAskPayload) => void | Promise;\n children: React.ReactNode;\n};\n\ntype VirtualElement = {\n getBoundingClientRect: () => DOMRect;\n contextElement?: Element | null;\n};\n\nfunction isWhitespaceOnly(text: string) {\n return text.trim().length === 0;\n}\n\nfunction selectionIntersectsContainer(\n range: Range,\n container: HTMLElement,\n): boolean {\n const startContainer = range.startContainer as Node | null;\n const endContainer = range.endContainer as Node | null;\n if (!startContainer || !endContainer) return false;\n return container.contains(startContainer) || container.contains(endContainer);\n}\n\nfunction nodeIsExcluded(node: Node, selectors: string[]): boolean {\n let el: Element | null = null;\n if (node instanceof Element) {\n el = node;\n } else if ((node as ChildNode).parentElement) {\n el = (node as ChildNode).parentElement;\n }\n if (!el) return false;\n for (const sel of selectors) {\n if (el.closest(sel)) return true;\n }\n return false;\n}\n\nconst AlgoliaLogo = ({ size = 52 }: { size?: number | string }) => (\n \n \n {/* eslint-disable-nextLine @docusaurus/no-untranslated-text */}\n \n \n \n \n \n \n \n \n \n \n \n \n);\n\nexport function HighlightAskAI({\n agentStudio = false,\n applicationId,\n apiKey,\n indexName,\n assistantId,\n excludeElements = [\"pre\", \"code\"],\n side = \"top\",\n sideOffset = 8,\n delay = 120,\n askButtonLabel = \"Ask AI?\",\n className,\n onAsk,\n children,\n}: HighlightAskAIProps) {\n const containerRef = React.useRef(null);\n const [open, setOpen] = React.useState(false);\n const [expanded, setExpanded] = React.useState(false);\n const [range, setRange] = React.useState(null);\n const [virtualEl, setVirtualEl] = React.useState(null);\n const [followUpInput, setFollowUpInput] = React.useState(\"\");\n const [feedbackGiven, setFeedbackGiven] = React.useState(false);\n const [submittingFeedback, setSubmittingFeedback] = React.useState(false);\n\n const { messages, error, isGenerating, sendMessage, setMessages, stop } =\n useAskai({\n applicationId,\n apiKey,\n indexName,\n assistantId,\n agentStudio,\n });\n\n const handleFeedback = async (vote: 0 | 1) => {\n const messageToFeedback = (messages || []).find(\n (m: unknown) =>\n (m as { role?: string }).role === (agentStudio ? \"assistant\" : \"user\"),\n ) as { id?: string } | undefined;\n\n if (!messageToFeedback?.id) return;\n\n setSubmittingFeedback(true);\n try {\n if (agentStudio) {\n await postAgentStudioFeedback({\n agentId: assistantId,\n vote,\n messageId: messageToFeedback.id,\n appId: applicationId,\n apiKey,\n });\n } else {\n await postFeedback({\n assistantId,\n appId: applicationId,\n messageId: messageToFeedback.id,\n thumbs: vote,\n });\n }\n setFeedbackGiven(true);\n } catch {\n // ignore errors\n } finally {\n setSubmittingFeedback(false);\n }\n };\n const resetConversation = React.useCallback(() => {\n try {\n stop?.();\n } catch {}\n setMessages?.([]);\n setFollowUpInput(\"\");\n setFeedbackGiven(false);\n setSubmittingFeedback(false);\n }, [setMessages, stop]);\n\n const { refs, floatingStyles, update } = useFloating<\n HTMLElement | ReferenceType\n >({\n placement: side,\n middleware: [offset(sideOffset), flip(), shift()],\n // Don't use autoUpdate - we want the tooltip to stay in place on scroll\n });\n\n // Keep placement in sync with prop changes\n React.useEffect(() => {\n update?.();\n }, [update]);\n\n React.useEffect(() => {\n if (virtualEl) refs.setReference(virtualEl as unknown as ReferenceType);\n }, [virtualEl, refs.setReference]);\n\n // Debounced selection handler\n const debounceRef = React.useRef(null);\n const handleSelectionChange = React.useCallback(() => {\n if (debounceRef.current) window.clearTimeout(debounceRef.current);\n debounceRef.current = window.setTimeout(() => {\n const sel = window.getSelection();\n const containerEl = containerRef.current;\n const floatingEl = refs.floating.current;\n const activeEl =\n typeof document !== \"undefined\"\n ? (document.activeElement as Node | null)\n : null;\n\n // Ignore selection changes while focus is inside the floating tooltip\n if (floatingEl && activeEl && floatingEl.contains(activeEl)) {\n return;\n }\n\n if (!sel || !containerEl) return;\n if (sel.rangeCount === 0 || sel.isCollapsed) {\n // Don't close if already expanded; allow typing in the tooltip\n if (!expanded) {\n setOpen(false);\n setExpanded(false);\n setRange(null);\n setVirtualEl(null);\n }\n return;\n }\n\n const nextRange = sel.getRangeAt(0);\n const text = sel.toString();\n if (isWhitespaceOnly(text)) {\n if (!expanded) {\n setOpen(false);\n setExpanded(false);\n setRange(null);\n setVirtualEl(null);\n }\n return;\n }\n\n if (!selectionIntersectsContainer(nextRange, containerEl)) {\n if (!expanded) {\n setOpen(false);\n setExpanded(false);\n setRange(null);\n setVirtualEl(null);\n }\n return;\n }\n\n const anchorNode = sel.anchorNode;\n const focusNode = sel.focusNode;\n if (\n (anchorNode && nodeIsExcluded(anchorNode, excludeElements)) ||\n (focusNode && nodeIsExcluded(focusNode, excludeElements))\n ) {\n if (!expanded) {\n setOpen(false);\n setExpanded(false);\n setRange(null);\n setVirtualEl(null);\n }\n return;\n }\n\n const rect = nextRange.getBoundingClientRect();\n if (rect.width === 0 && rect.height === 0) {\n if (!expanded) {\n setOpen(false);\n setExpanded(false);\n setRange(null);\n setVirtualEl(null);\n }\n return;\n }\n\n const v: VirtualElement = {\n getBoundingClientRect: () => rect,\n };\n setRange(nextRange);\n setVirtualEl(v);\n setOpen(true);\n setExpanded(false);\n // Trigger update after setting v\n requestAnimationFrame(() => {\n update?.();\n });\n }, delay);\n }, [delay, excludeElements, expanded, refs.floating, update]);\n\n React.useEffect(() => {\n document.addEventListener(\"selectionchange\", handleSelectionChange);\n return () =>\n document.removeEventListener(\"selectionchange\", handleSelectionChange);\n }, [handleSelectionChange]);\n\n // Close on Escape and click outside\n React.useEffect(() => {\n function onKeyDown(e: KeyboardEvent) {\n if (e.key === \"Escape\") {\n setOpen(false);\n setExpanded(false);\n resetConversation();\n }\n }\n function onMouseDown(e: MouseEvent) {\n if (!open) return;\n\n const floatingEl = refs.floating.current;\n const containerEl = containerRef.current;\n const target = e.target as Node | null;\n\n if (!target) return;\n\n // Don't close if clicking inside the floating tooltip\n if (floatingEl?.contains(target)) {\n return;\n }\n\n // Don't close if clicking inside the container (but outside selection)\n if (containerEl?.contains(target)) {\n return;\n }\n\n // Click is outside both - close the tooltip\n setOpen(false);\n setExpanded(false);\n resetConversation();\n }\n document.addEventListener(\"keydown\", onKeyDown);\n document.addEventListener(\"mousedown\", onMouseDown);\n return () => {\n document.removeEventListener(\"keydown\", onKeyDown);\n document.removeEventListener(\"mousedown\", onMouseDown);\n };\n }, [open, refs.floating, resetConversation]);\n\n // Build HTML content string for onAsk consumers\n const getSelectionHtml = React.useCallback((rangeArg: Range | null) => {\n if (!rangeArg) return \"\";\n const fragment = rangeArg.cloneContents();\n const div = document.createElement(\"div\");\n div.appendChild(fragment);\n return div.innerHTML;\n }, []);\n\n const handleAskClick = React.useCallback(async () => {\n if (!range) return;\n const text = range.toString();\n const html = getSelectionHtml(range);\n const rect = range.getBoundingClientRect();\n const node = range.commonAncestorContainer as Node;\n const contextElement =\n node instanceof HTMLElement ? node : node.parentElement;\n const contextNode = (contextElement as HTMLElement) ?? document.body;\n\n setExpanded(true);\n // starting a fresh question: clear past conversation first\n resetConversation();\n if (onAsk) {\n try {\n await onAsk({ text, html, rect, range, contextNode });\n } catch (err) {\n // eslint-disable-next-line no-console\n console.error(\"onAsk error\", err);\n }\n }\n\n const prompt = `Can you tell me what exactly is '${text}' ? be concise`;\n try {\n await sendMessage({ text: prompt });\n } catch (err) {\n // eslint-disable-next-line no-console\n console.error(\"sendMessage error\", err);\n }\n }, [getSelectionHtml, onAsk, range, resetConversation, sendMessage]);\n\n return (\n
\n {children}\n {open && virtualEl && (\n \n \n {!expanded ? (\n
\n \n {askButtonLabel}\n \n
\n ) : (\n
\n \n \n Powered by\n \n \n \n {\n setOpen(false);\n setExpanded(false);\n resetConversation();\n }}\n type=\"button\"\n size=\"sm\"\n variant=\"outline\"\n className=\"p-1.5 text-xs text-muted-foreground\"\n >\n esc\n \n
\n )}\n {expanded && (\n
\n
\n {(() => {\n const assistant = (messages || [])\n .slice()\n .reverse()\n .find(\n (m: unknown) =>\n (m as { role?: string }).role === \"assistant\",\n );\n if (!assistant)\n return (\n \n {isGenerating ? \"Thinking...\" : \"\"}\n \n );\n const parts =\n (\n assistant as {\n parts?: Array<\n | string\n | {\n type: string;\n text?: string;\n state?: string;\n input?: { query?: string };\n output?: { query?: string; hits?: unknown[] };\n errorText?: string;\n }\n >;\n }\n ).parts ?? [];\n\n return (\n <>\n {parts.map((part, index) => {\n if (typeof part === \"string\") {\n return

{part}

;\n }\n if (part.type === \"text\") {\n // eslint-disable-next-line xss/no-mixed-html -- sanitized via parseMarkdownToSafeHtml\n const html = parseMarkdownToSafeHtml(\n part.text || \"\",\n );\n return (\n \n );\n } else if (\n part.type === \"reasoning\" &&\n part.state === \"streaming\"\n ) {\n return (\n \n Reasoning...\n

\n );\n } else if (part.type === \"tool-searchIndex\") {\n if (part.state === \"input-streaming\") {\n return (\n \n Searching...\n

\n );\n } else if (part.state === \"input-available\") {\n return (\n \n Looking for{\" \"}\n \n "{part.input?.query || \"\"}"\n \n

\n );\n } else if (part.state === \"output-available\") {\n return (\n \n {\" \"}\n \n Searched for{\" \"}\n \n "{part.output?.query}"\n {\" \"}\n found {part.output?.hits?.length || \"no\"}{\" \"}\n results\n \n

\n );\n } else if (part.state === \"output-error\") {\n return (\n \n {part.errorText}\n

\n );\n }\n }\n return null;\n })}\n \n );\n })()}\n
\n {error ? (\n
\n {String(\n (error as unknown as { message?: string }).message ||\n error,\n )}\n
\n ) : null}\n {(() => {\n const hasAssistantResponse = (messages || []).some(\n (m: unknown) =>\n (m as { role?: string }).role === \"assistant\",\n );\n if (!hasAssistantResponse || isGenerating) return null;\n\n return (\n <>\n
\n
\n {feedbackGiven ? (\n \n Thanks for your feedback!\n \n ) : submittingFeedback ? (\n \n Submitting...\n \n ) : (\n
\n handleFeedback(1)}\n >\n \n \n handleFeedback(0)}\n >\n \n \n
\n )}\n
\n {\n e.preventDefault();\n if (followUpInput.trim()) {\n sendMessage({ text: followUpInput.trim() });\n setFollowUpInput(\"\");\n }\n }}\n className=\"flex items-center gap-2 p-3\"\n >\n setFollowUpInput(e.target.value)}\n placeholder=\"Ask a follow-up...\"\n className=\"flex-1 text-sm\"\n />\n \n \n \n \n
\n \n );\n })()}\n
\n )}\n
\n \n )}\n \n );\n}\n\nexport default HighlightAskAI;\n", "type": "registry:component" }, { "path": "src/registry/experiences/highlight-to-askai/hooks/use-askai.ts", "content": "import { useChat } from \"@ai-sdk/react\";\nimport {\n DefaultChatTransport,\n lastAssistantMessageIsCompleteWithToolCalls,\n} from \"ai\";\nimport { useMemo } from \"react\";\n\nexport interface AskAIConfig {\n agentStudio?: boolean;\n applicationId: string;\n apiKey: string;\n indexName: string;\n assistantId: string;\n}\n\n/**\n * Checks if an error is a thread depth error (AI-217)\n * Thread depth errors occur when a conversation has reached its maximum depth limit\n */\nexport function isThreadDepthError(error?: Error | null): boolean {\n if (!error) return false;\n\n // Check if error has a code property\n const errorWithCode = error as Error & { code?: string };\n if (errorWithCode.code === \"AI-217\") return true;\n\n // Check message content for AI-217 or thread depth references\n const message = error.message?.toLowerCase() || \"\";\n return message.includes(\"ai-217\") || message.includes(\"conversation depth\");\n}\n\nconst agentStudioBaseUrl = (appId: string): string =>\n `https://${appId}.algolia.net/agent-studio/1`;\n\nfunction getChatApiUrl(config: AskAIConfig): string {\n if (config.agentStudio) {\n return `${agentStudioBaseUrl(config.applicationId)}/agents/${config.assistantId}/completions?stream=true&compatibilityMode=ai-sdk-5`;\n }\n return `${BASE_ASKAI_URL}/chat`;\n}\n\nexport function useAskai(config: AskAIConfig) {\n if (!config) {\n throw new Error(\"config is required for useAskai\");\n }\n\n const transport = useMemo(() => {\n return new DefaultChatTransport({\n api: getChatApiUrl(config),\n headers: async () => {\n if (config.agentStudio) {\n return {\n \"x-algolia-api-key\": config.apiKey,\n \"x-algolia-application-id\": config.applicationId,\n } as Record;\n }\n const token = await getValidToken({ assistantId: config.assistantId });\n return {\n \"x-algolia-api-key\": config.apiKey,\n \"x-algolia-application-id\": config.applicationId,\n \"x-algolia-index-name\": config.indexName,\n \"x-algolia-assistant-id\": config.assistantId,\n \"x-ai-sdk-version\": \"v5\",\n authorization: `TOKEN ${token}`,\n } as Record;\n },\n });\n }, [\n config.apiKey,\n config.applicationId,\n config.indexName,\n config.assistantId,\n config.agentStudio,\n config,\n ]);\n\n const chat = useChat({\n transport,\n sendAutomaticallyWhen: lastAssistantMessageIsCompleteWithToolCalls,\n });\n\n const isGenerating =\n chat.status === \"submitted\" || chat.status === \"streaming\";\n\n // Check if there's a thread depth error (AI-217)\n const hasThreadDepthError = useMemo(() => {\n return (\n chat.status === \"error\" && isThreadDepthError(chat.error as Error | null)\n );\n }, [chat.status, chat.error]);\n\n return {\n ...chat,\n isGenerating,\n hasThreadDepthError,\n };\n}\n\nconst BASE_ASKAI_URL = \"https://askai.algolia.com\";\nconst TOKEN_KEY = \"askai_token\";\n\ntype TokenPayload = { exp: number };\n\nconst decode = (token: string): TokenPayload => {\n const [b64] = token.split(\".\");\n return JSON.parse(atob(b64));\n};\n\nconst isExpired = (token?: string | null): boolean => {\n if (!token) return true;\n try {\n const { exp } = decode(token);\n // refresh 30 s before the backend rejects it\n return Date.now() / 1000 > exp - 30;\n } catch {\n return true;\n }\n};\n\nlet inflight: Promise | null = null;\n\n// call /token once, cache the promise while it’s running\n// eslint-disable-next-line require-await\nexport const getValidToken = async ({\n assistantId,\n}: {\n assistantId: string;\n}): Promise => {\n const cached = sessionStorage.getItem(TOKEN_KEY);\n if (!isExpired(cached)) return cached as string;\n\n if (!inflight) {\n inflight = fetch(`${BASE_ASKAI_URL}/chat/token`, {\n method: \"POST\",\n headers: {\n \"x-algolia-assistant-id\": assistantId,\n \"content-type\": \"application/json\",\n },\n })\n .then((r) => r.json())\n .then(({ token }) => {\n sessionStorage.setItem(TOKEN_KEY, token);\n return token;\n })\n .finally(() => {\n inflight = null;\n });\n }\n\n return inflight;\n};\n\nexport const postFeedback = async ({\n assistantId,\n thumbs,\n messageId,\n appId,\n}: {\n assistantId: string;\n thumbs: 0 | 1;\n messageId: string;\n appId: string;\n}): Promise => {\n const headers = new Headers();\n headers.set(\"x-algolia-assistant-id\", assistantId);\n headers.set(\"content-type\", \"application/json\");\n\n const token = await getValidToken({ assistantId });\n headers.set(\"authorization\", `TOKEN ${token}`);\n\n return fetch(`${BASE_ASKAI_URL}/chat/feedback`, {\n method: \"POST\",\n body: JSON.stringify({\n appId,\n messageId,\n thumbs,\n }),\n headers,\n });\n};\n\nexport const postAgentStudioFeedback = ({\n agentId,\n vote,\n messageId,\n appId,\n apiKey,\n}: {\n agentId: string;\n vote: 0 | 1;\n messageId: string;\n appId: string;\n apiKey: string;\n}): Promise => {\n const headers = new Headers();\n headers.set(\"x-algolia-application-id\", appId);\n headers.set(\"x-algolia-api-key\", apiKey);\n headers.set(\"content-type\", \"application/json\");\n\n const baseUrl = `${agentStudioBaseUrl(appId)}/feedback`;\n\n return fetch(baseUrl, {\n method: \"POST\",\n body: JSON.stringify({\n messageId,\n agentId,\n vote,\n }),\n headers,\n });\n};\n", "type": "registry:hook" }, { "path": "src/registry/experiences/highlight-to-askai/page.tsx", "content": "\"use client\";\n\nimport { HighlightAskAI } from \"@/registry/experiences/highlight-to-askai/components/highlight-to-askai\";\n\nexport default function Page() {\n return (\n
\n
\n \n
\n

Try it

\n

\n Select any text in this block to see a small tooltip. Click\n Ask AI? to expand the panel and stream an answer.\n

\n

\n The tooltip respects excluded elements like pre and\n code, and it uses smart placement to avoid viewport\n edges.\n

\n
\n \n

\n Tip: Try selecting a sentence across multiple lines.\n

\n
\n
\n );\n}\n", "type": "registry:page", "target": "app/highlight-to-askai/page.tsx" } ], "categories": [ "ai" ] }