diff --git a/.gitignore b/.gitignore index 53400d7..bdf02ce 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ node_modules/ dist/ *.tsbuildinfo -.idea/ \ No newline at end of file +.idea/ +example/.next \ No newline at end of file diff --git a/src/client/AIAssistantProvider.tsx b/src/client/AIAssistantProvider.tsx index d545b44..17b9e56 100644 --- a/src/client/AIAssistantProvider.tsx +++ b/src/client/AIAssistantProvider.tsx @@ -7,7 +7,7 @@ import React, { useEffect, useState, } from "react"; -import type { ExplainContext } from "../types"; +import type { ExplainContext, ExplainEvent } from "../types"; import AIChatBot from "./AIChatBot"; import AIFloatingButton from "./AIFloatingButton"; import * as S from "./styles"; @@ -42,6 +42,8 @@ type AIAssistantProviderProps = { children: React.ReactNode; title?: string; subtitle?: string; + onExplain?: (event: ExplainEvent) => void; + showChat?: boolean; }; /** @@ -121,6 +123,8 @@ export default function AIAssistantProvider({ children, title, subtitle, + onExplain, + showChat = true, }: AIAssistantProviderProps) { const [isChatOpen, setIsChatOpen] = useState(false); const [initialQuery, setInitialQuery] = useState(""); @@ -198,7 +202,14 @@ export default function AIAssistantProvider({ const elementDocs = findExplainDocs(explainable); const query = buildQuery(label, explainCtx, elementDocs); - openChat(query); + + if (onExplain) { + onExplain({ label, query, context: explainCtx, docs: elementDocs, element: explainable }); + setExplainMode(false); + setHoveredEl(null); + } else { + openChat(query); + } }; const handleKeyDown = (e: KeyboardEvent) => { @@ -218,7 +229,7 @@ export default function AIAssistantProvider({ document.removeEventListener("click", handleClick, true); document.removeEventListener("keydown", handleKeyDown); }; - }, [explainMode, explainCtx, openChat, exitExplainMode]); + }, [explainMode, explainCtx, openChat, exitExplainMode, onExplain]); // Apply/remove highlight on hovered explainable element via CSS class useEffect(() => { @@ -269,26 +280,30 @@ export default function AIAssistantProvider({ )} - { - if (isChatOpen) { - closeChat(); - } else { - openChat(); - } - }} - /> + {showChat && ( + <> + { + if (isChatOpen) { + closeChat(); + } else { + openChat(); + } + }} + /> - + + + )} ); } diff --git a/src/client/index.ts b/src/client/index.ts index 7191c6e..7f5624d 100644 --- a/src/client/index.ts +++ b/src/client/index.ts @@ -1,4 +1,4 @@ export { default as AIAssistantProvider, useAIAssistant } from "./AIAssistantProvider"; export { default as AIChatBot } from "./AIChatBot"; export { default as AIFloatingButton } from "./AIFloatingButton"; -export type { Message, ExplainContext } from "../types"; \ No newline at end of file +export type { Message, ExplainContext, ExplainEvent } from "../types"; \ No newline at end of file diff --git a/src/types.ts b/src/types.ts index 2ffcbc9..5106304 100644 --- a/src/types.ts +++ b/src/types.ts @@ -8,4 +8,12 @@ export type ExplainContext = { modalName?: string; pageName?: string; docsUrls?: string[]; +}; + +export type ExplainEvent = { + label: string; + query: string; + context: ExplainContext | null; + docs: string[]; + element: HTMLElement; }; \ No newline at end of file