goji-search 1.0.0

package/dist/goji-search/components/goji-search-component.js

@@ -0,0 +1,505 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import "./goji-search.css";
+import { ArrowLeft, X, Maximize2, Minimize2 } from "lucide-react";
+import { useState, useEffect, useRef, useId } from "react";
+import { SuggestedQuestions } from "./elements/suggested-questions";
+import { MessageList } from "./elements/message-list";
+import { SearchInput } from "./elements/search-input";
+import { ActionButtons } from "./elements/action-buttons";
+import CalendarIntegration from "./elements/calendar-integration";
+import { gojiClient } from "../lib/goji-client";
+import { companyConfig } from "../config/company";
+export function GojiSearchComponent() {
+    const [searchQuery, setSearchQuery] = useState("");
+    const [size, setSize] = useState("xs");
+    const [isHovered, setIsHovered] = useState(false);
+    const [messages, setMessages] = useState([]);
+    const [isStreaming, setIsStreaming] = useState(false);
+    const [showSuggestions, setShowSuggestions] = useState(false);
+    const [showCalendar, setShowCalendar] = useState(false);
+    const [sessionId, setSessionId] = useState();
+    const [hasInteracted, setHasInteracted] = useState(false);
+    const inputRef = useRef(null);
+    const sparkleRef = useRef(null);
+    const streamingCancelRef = useRef(null);
+    const [isInputHovered, setIsInputHovered] = useState(false);
+    const [hoverTopExpand, setHoverTopExpand] = useState(false);
+    const [hoverTopClose, setHoverTopClose] = useState(false);
+    const currentLanguage = companyConfig.defaultLanguage;
+    const languageConfig = companyConfig.languages[currentLanguage];
+    const suggestedQuestions = languageConfig.suggestedPrompts;
+    const inspirationQuestions = languageConfig.suggestedPrompts;
+    const idBase = useId();
+    const xTooltipId = `${idBase}-x-tip`;
+    const expandTooltipId = `${idBase}-expand-tip`;
+    useEffect(() => {
+        const timer = setTimeout(() => {
+            setSize("s");
+        }, 4000);
+        return () => clearTimeout(timer);
+    }, []);
+    useEffect(() => {
+        const timer = setTimeout(() => {
+            if (!hasInteracted && size !== "xs") {
+                setSize("xs");
+            }
+        }, 12000);
+        return () => clearTimeout(timer);
+    }, [hasInteracted, size]);
+    useEffect(() => {
+        return () => {
+            if (streamingCancelRef.current) {
+                streamingCancelRef.current();
+            }
+            gojiClient.closeWebSocket();
+        };
+    }, []);
+    const handleSearch = async (e) => {
+        e.preventDefault();
+        if (!searchQuery.trim() || isStreaming)
+            return;
+        const userMessage = {
+            role: "user",
+            content: searchQuery.trim(),
+            timestamp: Date.now(),
+        };
+        setMessages((prev) => [...prev, userMessage]);
+        setSearchQuery("");
+        // don't force-shrink xl -> l; only set to l if not currently xl
+        setSize((prev) => (prev === "xl" ? "xl" : "l"));
+        setIsStreaming(true);
+        // Create placeholder for assistant message
+        const assistantMessageIndex = messages.length + 1;
+        setMessages((prev) => [...prev, { role: "assistant", content: "", timestamp: Date.now() }]);
+        let accumulatedContent = "";
+        try {
+            const cancelFn = await gojiClient.streamChat({
+                message: userMessage.content,
+                sessionId,
+                limit: 5,
+                language: "en",
+                onDelta: (delta) => {
+                    accumulatedContent += delta;
+                    setMessages((prev) => {
+                        const updated = [...prev];
+                        updated[assistantMessageIndex] = {
+                            ...updated[assistantMessageIndex],
+                            content: accumulatedContent,
+                        };
+                        return updated;
+                    });
+                },
+                onDone: (response) => {
+                    setSessionId(response.session_id);
+                    setMessages((prev) => {
+                        const updated = [...prev];
+                        updated[assistantMessageIndex] = {
+                            ...updated[assistantMessageIndex],
+                            sources: response.sources,
+                        };
+                        return updated;
+                    });
+                    setIsStreaming(false);
+                    streamingCancelRef.current = null;
+                },
+                onError: (error) => {
+                    console.error(" Streaming error:", error);
+                    setMessages((prev) => {
+                        const updated = [...prev];
+                        updated[assistantMessageIndex] = {
+                            ...updated[assistantMessageIndex],
+                            content: "I'm sorry, I encountered an error. Please try again.",
+                        };
+                        return updated;
+                    });
+                    setIsStreaming(false);
+                    streamingCancelRef.current = null;
+                },
+            });
+            streamingCancelRef.current = cancelFn;
+        }
+        catch (error) {
+            console.error(" Failed to start streaming:", error);
+            setIsStreaming(false);
+        }
+    };
+    const handleSuggestionClick = async (question) => {
+        setShowSuggestions(false);
+        const userMessage = {
+            role: "user",
+            content: question,
+            timestamp: Date.now(),
+        };
+        setMessages((prev) => [...prev, userMessage]);
+        // preserve xl if already expanded
+        setSize((prev) => (prev === "xl" ? "xl" : "l"));
+        setIsStreaming(true);
+        const assistantMessageIndex = messages.length + 1;
+        setMessages((prev) => [...prev, { role: "assistant", content: "", timestamp: Date.now() }]);
+        let accumulatedContent = "";
+        try {
+            const cancelFn = await gojiClient.streamChat({
+                message: question,
+                sessionId,
+                limit: 5,
+                language: "en",
+                onDelta: (delta) => {
+                    accumulatedContent += delta;
+                    setMessages((prev) => {
+                        const updated = [...prev];
+                        updated[assistantMessageIndex] = {
+                            ...updated[assistantMessageIndex],
+                            content: accumulatedContent,
+                        };
+                        return updated;
+                    });
+                },
+                onDone: (response) => {
+                    setSessionId(response.session_id);
+                    setMessages((prev) => {
+                        const updated = [...prev];
+                        updated[assistantMessageIndex] = {
+                            ...updated[assistantMessageIndex],
+                            sources: response.sources,
+                        };
+                        return updated;
+                    });
+                    setIsStreaming(false);
+                    streamingCancelRef.current = null;
+                },
+                onError: (error) => {
+                    console.error(" Streaming error:", error);
+                    setMessages((prev) => {
+                        const updated = [...prev];
+                        updated[assistantMessageIndex] = {
+                            ...updated[assistantMessageIndex],
+                            content: "I'm sorry, I encountered an error. Please try again.",
+                        };
+                        return updated;
+                    });
+                    setIsStreaming(false);
+                    streamingCancelRef.current = null;
+                },
+            });
+            streamingCancelRef.current = cancelFn;
+        }
+        catch (error) {
+            console.error(" Failed to start streaming:", error);
+            setIsStreaming(false);
+        }
+    };
+    const handleClose = () => {
+        setSearchQuery("");
+        setSize("xs");
+        setShowCalendar(false);
+    };
+    const handleVoiceSearch = () => {
+        console.log("Voice search activated");
+    };
+    const handleToggle = () => {
+        setHasInteracted(true);
+        if (size === "xs") {
+            setSize(messages.length > 0 ? "l" : "s");
+        }
+        else {
+            setSize("xs");
+        }
+    };
+    const handleExpandToggle = () => {
+        // toggle between large and extra-large
+        if (size === "xl") {
+            setSize("l");
+        }
+        else {
+            setSize("xl");
+        }
+    };
+    const handleInputFocus = () => {
+        setHasInteracted(true);
+        if (messages.length > 0) {
+            // if currently xl, keep xl; otherwise go to l
+            setSize((prev) => (prev === "xl" ? "xl" : "l"));
+        }
+        else {
+            setSize("m");
+            setShowSuggestions(true);
+        }
+    };
+    const handleInputAreaMouseEnter = () => {
+        setHasInteracted(true);
+        setIsInputHovered(true);
+        if (messages.length === 0 && !searchQuery) {
+            setShowSuggestions(true);
+        }
+    };
+    const handleInputAreaMouseLeave = () => {
+        setIsInputHovered(false);
+        setShowSuggestions(false);
+    };
+    const handleInputChange = (e) => {
+        setSearchQuery(e.target.value);
+        if (e.target.value && size === "s") {
+            setSize("m");
+        }
+        if (e.target.value.length > 0 && messages.length === 0) {
+            setShowSuggestions(true);
+        }
+        else {
+            setShowSuggestions(false);
+        }
+    };
+    const handleMouseEnter = () => {
+        setHasInteracted(true);
+        setIsHovered(true);
+        if (size === "s") {
+            setSize("m");
+        }
+    };
+    const handleMouseLeave = () => {
+        setIsHovered(false);
+        if (size === "m" && !searchQuery && messages.length === 0) {
+            setSize("s");
+        }
+    };
+    const handleInputBlur = () => {
+        if (!searchQuery && messages.length === 0) {
+            setSize("s");
+        }
+    };
+    const handleCalendarClick = () => {
+        setShowCalendar(true);
+        setSize("l");
+    };
+    const handleBackToChat = () => {
+        setShowCalendar(false);
+    };
+    const sizeConfig = {
+        xs: { maxWidth: "5.5rem", bottom: "0.5rem", padding: "0" },
+        s: { maxWidth: "25.5rem", bottom: "0.5rem", padding: "0" },
+        m: { maxWidth: "30rem", bottom: "0.75rem", padding: "0.25rem" },
+        l: { maxWidth: "45vw", bottom: "1.25rem", padding: "1rem" },
+        xl: { maxWidth: "70vw", bottom: "1.5rem", padding: "1.25rem" },
+    };
+    const currentConfig = sizeConfig[size];
+    return (_jsx("div", { style: {
+            position: "fixed",
+            bottom: currentConfig.bottom,
+            left: 0,
+            right: 0,
+            zIndex: 50,
+            padding: "0.7rem",
+            transition: "bottom 0.4s cubic-bezier(0.4, 0, 0.2, 1)",
+        }, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: _jsx("div", { style: {
+                maxWidth: currentConfig.maxWidth,
+                margin: "0 auto",
+                transition: "max-width 0.4s cubic-bezier(0.4, 0, 0.2, 1)",
+            }, children: _jsxs("div", { style: {
+                    borderRadius: size === "xs" ? "0.75rem" : "1rem",
+                    border: size === "xs" || size === "s" ? "none" : "1px solid rgba(85, 85, 85, 0.18)",
+                    backgroundColor: size === "xs" || size === "s" ? "transparent" : "rgba(233, 210, 251, 0.15)",
+                    padding: size === "s" ? "0" : currentConfig.padding,
+                    height: size === "l" ? "55vh" : size === "xl" ? "70vh" : "auto",
+                    display: "flex",
+                    flexDirection: "column",
+                    position: "relative",
+                    boxShadow: size === "xs" || size === "s"
+                        ? "none"
+                        : size === "l"
+                            ? "0 8px 32px 0 rgba(0, 0, 0, 0.12), inset 0 1px 0 0 rgba(255, 255, 255, 0.4)"
+                            : "0 4px 24px 0 rgba(0, 0, 0, 0.08), inset 0 1px 0 0 rgba(255, 255, 255, 0.3)",
+                    backdropFilter: size === "xs" || size === "s" ? "none" : "blur(40px) saturate(180%) brightness(110%)",
+                    WebkitBackdropFilter: size === "xs" || size === "s" ? "none" : "blur(40px) saturate(180%) brightness(110%)",
+                    transition: "all 0.4s cubic-bezier(0.4, 0, 0.2, 1)",
+                }, children: [(size === "m" || size === "l" || size === "xl") && (_jsx("div", { style: {
+                            position: "absolute",
+                            top: size === "m" ? "0.5rem" : "0.75rem",
+                            right: size === "m" ? "0.5rem" : "0.75rem",
+                            zIndex: 50,
+                        }, children: _jsx("div", { style: {
+                                position: "relative",
+                                // show the top-right controls when we have no messages OR when in compact (m) mode OR when calendar is open
+                                // but hide them when only suggested questions are shown (messages.length === 0 && showSuggestions)
+                                display: (size === 'm' || messages.length === 0 || showCalendar) && !(messages.length === 0 && showSuggestions) ? 'inline-flex' : 'none',
+                                gap: '0.5rem',
+                                alignItems: 'center',
+                            }, children: _jsxs("div", { style: { display: 'inline-flex', gap: '0.375rem', alignItems: 'center' }, children: [_jsxs("div", { style: { position: 'relative' }, children: [_jsx("button", { type: "button", onClick: handleExpandToggle, onMouseEnter: () => setHoverTopExpand(true), onMouseLeave: () => setHoverTopExpand(false), "aria-label": size === 'xl' ? 'Restore' : 'Expand', "aria-describedby": hoverTopExpand ? expandTooltipId : undefined, style: {
+                                                    borderRadius: '1.3rem',
+                                                    border: '1px solid rgba(255, 255, 255, 0.3)',
+                                                    backgroundColor: 'rgba(255, 255, 255, 0.2)',
+                                                    padding: '0.375rem',
+                                                    display: 'flex',
+                                                    alignItems: 'center',
+                                                    justifyContent: 'center',
+                                                    color: 'rgba(0, 0, 0, 0.75)',
+                                                    transition: 'all 0.2s',
+                                                    cursor: 'pointer',
+                                                    outline: 'none',
+                                                    boxShadow: 'inset 0 1px 0 rgba(255, 255, 255, 0.3)',
+                                                }, children: size === 'xl' ? _jsx(Minimize2, { style: { width: '0.9rem', height: '0.9rem' } }) : _jsx(Maximize2, { style: { width: '0.9rem', height: '0.9rem' } }) }), _jsx("span", { id: expandTooltipId, role: "tooltip", style: {
+                                                    position: 'absolute',
+                                                    top: 'calc(100% + 0.4rem)',
+                                                    left: '50%',
+                                                    transform: 'translateX(-50%)',
+                                                    whiteSpace: 'nowrap',
+                                                    background: 'rgba(0,0,0,0.9)',
+                                                    color: '#fff',
+                                                    padding: '4px 6px',
+                                                    borderRadius: '1.3rem',
+                                                    fontSize: '0.55rem',
+                                                    boxShadow: '0 6px 18px rgba(0,0,0,0.35)',
+                                                    opacity: hoverTopExpand ? 1 : 0,
+                                                    pointerEvents: 'none',
+                                                    transition: 'opacity 120ms ease-in-out',
+                                                    zIndex: 30,
+                                                }, children: size === 'xl' ? 'Restore' : 'Expand' })] }), _jsxs("div", { style: { position: 'relative' }, children: [_jsx("button", { type: "button", onClick: handleClose, onMouseEnter: () => setHoverTopClose(true), onMouseLeave: () => setHoverTopClose(false), "aria-label": "Close", "aria-describedby": hoverTopClose ? xTooltipId : undefined, style: {
+                                                    borderRadius: "1.3rem",
+                                                    border: "1px solid rgba(255, 255, 255, 0.3)",
+                                                    backgroundColor: "rgba(255, 255, 255, 0.2)",
+                                                    padding: "0.4rem",
+                                                    display: "flex",
+                                                    alignItems: "center",
+                                                    justifyContent: "center",
+                                                    color: "rgba(0, 0, 0, 0.75)",
+                                                    backdropFilter: "blur(20px)",
+                                                    WebkitBackdropFilter: "blur(20px)",
+                                                    transition: "all 0.2s",
+                                                    cursor: "pointer",
+                                                    outline: "none",
+                                                    boxShadow: "inset 0 1px 0 rgba(255, 255, 255, 0.3)",
+                                                }, children: _jsx(X, { style: { width: "0.875rem", height: "0.875rem" } }) }), _jsx("span", { id: xTooltipId, role: "tooltip", style: {
+                                                    position: 'absolute',
+                                                    top: 'calc(100% + 0.4rem)',
+                                                    left: '50%',
+                                                    transform: 'translateX(-50%)',
+                                                    whiteSpace: 'nowrap',
+                                                    background: 'rgba(0,0,0,0.9)',
+                                                    color: '#fff',
+                                                    padding: '4px 6px',
+                                                    borderRadius: '1.3rem',
+                                                    fontSize: '0.55rem',
+                                                    boxShadow: '0 6px 18px rgba(0,0,0,0.35)',
+                                                    opacity: hoverTopClose ? 1 : 0,
+                                                    pointerEvents: 'none',
+                                                    transition: 'opacity 120ms ease-in-out',
+                                                    zIndex: 30,
+                                                }, children: "Close" })] })] }) }) })), size === "xs" ? (_jsx("button", { type: "button", onClick: handleToggle, style: {
+                            background: "transparent",
+                            border: "none",
+                            padding: 0,
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            cursor: "pointer",
+                            outline: "none",
+                            width: "100%",
+                        }, children: _jsxs("div", { className: "ai", children: [_jsxs("div", { className: "container-ai", children: [_jsx("div", { className: "c c4" }), _jsx("div", { className: "c c1" }), _jsx("div", { className: "c c2" }), _jsx("div", { className: "c c3" }), _jsx("div", { className: "rings-ai", children: _jsx("div", { className: "rings-ai" }) })] }), _jsx("div", { className: "glass-ai" })] }) })) : (_jsx("div", { style: {
+                            display: "flex",
+                            flexDirection: "column",
+                            gap: "0.75rem",
+                            height: "100%"
+                        }, children: showCalendar ? (_jsxs("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: "0.75rem", minHeight: 0 }, children: [_jsx("button", { type: "button", onClick: handleBackToChat, style: {
+                                        display: "flex",
+                                        alignItems: "center",
+                                        justifyContent: "center",
+                                        padding: "0.5rem",
+                                        borderRadius: "0.5rem",
+                                        border: "1px solid rgba(255, 255, 255, 0.3)",
+                                        backgroundColor: "rgba(255, 255, 255, 0.2)",
+                                        color: "rgba(0, 0, 0, 0.75)",
+                                        cursor: "pointer",
+                                        transition: "all 0.2s",
+                                        alignSelf: "flex-start",
+                                        width: "2.5rem",
+                                        height: "2.5rem",
+                                    }, onMouseEnter: (e) => {
+                                        e.currentTarget.style.backgroundColor = "rgba(255, 255, 255, 0.3)";
+                                    }, onMouseLeave: (e) => {
+                                        e.currentTarget.style.backgroundColor = "rgba(255, 255, 255, 0.2)";
+                                    }, children: _jsx(ArrowLeft, { style: { width: "1.125rem", height: "1.125rem" } }) }), _jsx("div", { style: {
+                                        flex: 1,
+                                        borderRadius: "0.75rem",
+                                        overflow: "hidden",
+                                        backgroundColor: "rgba(255, 255, 255, 0.5)",
+                                        minHeight: 0,
+                                        display: "flex",
+                                        flexDirection: "column",
+                                    }, children: _jsx(CalendarIntegration, { onBooked: handleBackToChat }) })] })) : (_jsxs(_Fragment, { children: [(size === "l" || size === "xl") && messages.length > 0 && (_jsx(MessageList, { messages: messages, isStreaming: isStreaming, aiAvatarSrc: undefined, onClose: handleClose, onExpand: handleExpandToggle, size: size })), size === "s" ? (_jsxs("div", { style: {
+                                        display: "flex",
+                                        alignItems: "center",
+                                        gap: "0.35rem",
+                                        transition: "max-width 0.4s cubic-bezier(0.4, 0, 0.2, 1)",
+                                    }, children: [_jsx("button", { type: "button", onClick: handleToggle, style: {
+                                                background: "transparent",
+                                                border: "none",
+                                                padding: 0,
+                                                display: "flex",
+                                                alignItems: "center",
+                                                justifyContent: "center",
+                                                cursor: "pointer",
+                                                outline: "none",
+                                                flexShrink: 0,
+                                            }, children: _jsxs("div", { className: "ai", children: [_jsxs("div", { className: "container-ai", children: [_jsx("div", { className: "c c4" }), _jsx("div", { className: "c c1" }), _jsx("div", { className: "c c2" }), _jsx("div", { className: "c c3" }), _jsx("div", { className: "rings-ai", children: _jsx("div", { className: "rings-ai" }) })] }), _jsx("div", { className: "glass-ai" })] }) }), _jsx("div", { onMouseEnter: handleInputAreaMouseEnter, onMouseLeave: handleInputAreaMouseLeave, style: {
+                                                display: "flex",
+                                                flexDirection: "column",
+                                                gap: "0.35rem",
+                                                flex: 1,
+                                                backgroundColor: "rgba(233, 210, 251, 0.15)",
+                                                borderRadius: "1.5rem",
+                                                border: "1px solid rgba(85, 85, 85, 0.18)",
+                                                boxShadow: "0 4px 24px 0 rgba(0, 0, 0, 0.08), inset 0 1px 0 0 rgba(255, 255, 255, 0.3)",
+                                                backdropFilter: "blur(40px) saturate(180%) brightness(110%)",
+                                                WebkitBackdropFilter: "blur(40px) saturate(180%) brightness(110%)",
+                                                transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
+                                            }, children: _jsxs("form", { onSubmit: handleSearch, style: {
+                                                    display: "flex",
+                                                    alignItems: "center",
+                                                    gap: "0.375rem",
+                                                    transition: "gap 0.3s ease",
+                                                    flexShrink: 0,
+                                                }, children: [_jsx("div", { style: { flex: 1 }, children: _jsx(SearchInput, { value: searchQuery, onChange: handleInputChange, onFocus: handleInputFocus, onBlur: handleInputBlur, placeholder: "Search...", size: size, inputRef: inputRef, inspirationQuestions: inspirationQuestions, onInspirationClick: handleSuggestionClick, sparkleRef: sparkleRef }) }), _jsx(ActionButtons, { size: size, isHovered: isHovered, isStreaming: isStreaming, searchQuery: searchQuery, onSubmit: () => { }, onVoiceSearch: handleVoiceSearch, onClose: handleClose, onCalendarClick: handleCalendarClick })] }) })] })) : (_jsxs("div", { onMouseEnter: handleInputAreaMouseEnter, onMouseLeave: handleInputAreaMouseLeave, style: {
+                                        display: "flex",
+                                        flexDirection: "column",
+                                        gap: "0.5rem",
+                                        paddingTop: size === "m" ? "0.5rem" : "0.75rem",
+                                    }, children: [_jsx("button", { type: "button", onClick: handleClose, style: {
+                                                borderRadius: "1.3rem",
+                                                border: "1px solid rgba(255, 255, 255, 0.3)",
+                                                backgroundColor: "rgba(255, 255, 255, 0.2)",
+                                                padding: "0.4rem",
+                                                // rendered only when size !== 'xs' so show the button
+                                                display: size === 'm' ? "flex" : "none",
+                                                alignItems: "center",
+                                                justifyContent: "center",
+                                                alignSelf: "flex-end",
+                                                width: "fit-content",
+                                                color: "rgba(0, 0, 0, 0.75)",
+                                                backdropFilter: "blur(20px)",
+                                                WebkitBackdropFilter: "blur(20px)",
+                                                transition: "all 0.2s",
+                                                cursor: "pointer",
+                                                outline: "none",
+                                                boxShadow: "inset 0 1px 0 rgba(255, 255, 255, 0.3)",
+                                            }, children: _jsx(X, { style: { width: "0.875rem", height: "0.875rem" } }) }), _jsx("span", { role: "tooltip", style: {
+                                                position: "absolute",
+                                                top: "calc(100% + 0.4rem)",
+                                                left: "50%",
+                                                transform: "translateX(-50%)",
+                                                whiteSpace: "nowrap",
+                                                background: "rgba(0,0,0,0.9)",
+                                                color: "#fff",
+                                                padding: "4px 6px",
+                                                borderRadius: "1.3rem",
+                                                fontSize: "0.55rem",
+                                                boxShadow: "0 6px 18px rgba(0,0,0,0.35)",
+                                                opacity: 0,
+                                                pointerEvents: "none",
+                                                transition: "opacity 120ms ease-in-out",
+                                                zIndex: 30,
+                                            }, children: "Close" }), showSuggestions && messages.length === 0 && !searchQuery && (_jsx(SuggestedQuestions, { questions: suggestedQuestions, onQuestionClick: handleSuggestionClick })), _jsxs("form", { onSubmit: handleSearch, style: {
+                                                display: "flex",
+                                                alignItems: "center",
+                                                gap: "0.375rem",
+                                                transition: "gap 0.3s ease",
+                                                flexShrink: 0,
+                                            }, children: [_jsx("div", { style: { flex: 1 }, children: _jsx(SearchInput, { value: searchQuery, onChange: handleInputChange, onFocus: handleInputFocus, onBlur: handleInputBlur, placeholder: "Ask me anything...", size: size, inputRef: inputRef, inspirationQuestions: inspirationQuestions, onInspirationClick: handleSuggestionClick, sparkleRef: sparkleRef }) }), _jsx(ActionButtons, { size: size, isHovered: isHovered, isStreaming: isStreaming, searchQuery: searchQuery, onSubmit: () => { }, onVoiceSearch: handleVoiceSearch, onClose: handleClose, onCalendarClick: handleCalendarClick })] })] }))] })) }))] }) }) }));
+}

package/dist/goji-search/config/company.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Company-specific configuration for GojiSearch chat interface.
+ * Update these values to customize the chat for different clients.
+ */
+interface LanguageConfig {
+    label: string;
+    welcome: {
+        title: string;
+        description: string;
+    };
+    suggestedPrompts: string[];
+    headerSubtitleExpanded: string;
+    headerSubtitleCollapsed: string;
+    sourcesLabel: string;
+    languageSelectorLabel: string;
+    generatingMessage: string;
+    inputPlaceholder: string;
+    bookDemoButton: string;
+    bookDemoDialogTitle: string;
+    bookDemoDialogDescription: string;
+    errorMessage: string;
+}
+export declare const companyConfig: {
+    brandName: string;
+    defaultLanguage: string;
+    languages: Record<string, LanguageConfig>;
+};
+export type SupportedLanguage = keyof typeof companyConfig.languages;
+export {};

package/dist/goji-search/config/company.js

@@ -0,0 +1,68 @@
+/**
+ * Company-specific configuration for GojiSearch chat interface.
+ * Update these values to customize the chat for different clients.
+ */
+export const companyConfig = {
+    brandName: "GojiSearch",
+    defaultLanguage: "en",
+    languages: {
+        en: {
+            label: "English",
+            welcome: {
+                title: "Welcome to GojiSearch",
+                description: "Ask me anything! I'll search through your knowledge base and provide accurate answers with sources.",
+            },
+            suggestedPrompts: ["Tell me how you engage with prospects", "How do you qualify my leads?", "How long does it take to have Goji on my website?"],
+            headerSubtitleExpanded: "Conversation powered by your docs",
+            headerSubtitleCollapsed: "Start typing to expand",
+            sourcesLabel: "Sources",
+            languageSelectorLabel: "Language",
+            generatingMessage: "{brand} is generating...",
+            inputPlaceholder: "Ask anything and press Enter",
+            bookDemoButton: "Book a Demo",
+            bookDemoDialogTitle: "Book a Demo with Chaimaa",
+            bookDemoDialogDescription: "Schedule a 30-minute call to discuss your needs and see how we can help.",
+            errorMessage: "I'm sorry, I encountered an error. Please try again.",
+        },
+        it: {
+            label: "Italiano",
+            welcome: {
+                title: "Benvenuto in GojiSearch",
+                description: "Chiedimi qualsiasi cosa! Cercherò nella tua knowledge base e fornirò risposte accurate con citazioni.",
+            },
+            suggestedPrompts: ["Parlami di come interagisci con i tuoi clienti", "Parlami di come qualifichi i tuoi leads", "Quanto tempo ci vuole per avere Goji sul mio sito?"],
+            headerSubtitleExpanded: "Conversazione alimentata dai tuoi documenti",
+            headerSubtitleCollapsed: "Inizia a digitare per espandere",
+            sourcesLabel: "Fonti",
+            languageSelectorLabel: "Lingua",
+            generatingMessage: "{brand} sta generando...",
+            inputPlaceholder: "Chiedi qualsiasi cosa e premi Invio",
+            bookDemoButton: "Prenota una demo",
+            bookDemoDialogTitle: "Prenota una demo con Chaimaa",
+            bookDemoDialogDescription: "Pianifica una chiamata di 30 minuti per discutere le tue esigenze e vedere come possiamo aiutarti.",
+            errorMessage: "Si è verificato un errore. Riprova più tardi.",
+        },
+        fr: {
+            label: "Français",
+            welcome: {
+                title: "Bienvenue sur GojiSearch",
+                description: "Posez-moi vos questions ! Je parcourrai votre base de connaissances et fournirai des réponses précises avec des sources.",
+            },
+            suggestedPrompts: [
+                "Qu'est-ce que Deel ?",
+                "Comment fonctionne la tarification ?",
+                "Parle-moi des fonctionnalités",
+            ],
+            headerSubtitleExpanded: "Conversation alimentée par vos contenus",
+            headerSubtitleCollapsed: "Commencez à écrire pour développer",
+            sourcesLabel: "Sources",
+            languageSelectorLabel: "Langue",
+            generatingMessage: "{brand} génère une réponse...",
+            inputPlaceholder: "Posez votre question et appuyez sur Entrée",
+            bookDemoButton: "Réserver une démo",
+            bookDemoDialogTitle: "Réserver une démo avec Chaimaa",
+            bookDemoDialogDescription: "Planifiez un appel de 30 minutes pour discuter de vos besoins et découvrir nos solutions.",
+            errorMessage: "Une erreur s'est produite. Merci de réessayer.",
+        },
+    },
+};

package/dist/goji-search/lib/calendar-config.d.ts

@@ -0,0 +1,9 @@
+export interface CalendarConfig {
+    provider: "calcom" | "calendly";
+    link: string;
+    namespace?: string;
+    theme?: "light" | "dark";
+    layout?: "month_view" | "week_view" | "agenda";
+}
+export declare const calendarConfig: CalendarConfig;
+export declare function getCalendarConfig(): CalendarConfig;

package/dist/goji-search/lib/calendar-config.js

@@ -0,0 +1,10 @@
+export const calendarConfig = {
+    provider: "calcom",
+    link: "chaimaahrk/30min",
+    namespace: "30min",
+    theme: "light",
+    layout: "month_view",
+};
+export function getCalendarConfig() {
+    return calendarConfig;
+}