import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { getClassNames } from '@websolutespa/bom-core';
import { useClickOut, useLabel } from '@websolutespa/bom-mixer-hooks';
import { useActions, useLlm, useLlmView } from '@websolutespa/bom-mixer-llm';
import { AnimatePresence, motion } from 'framer-motion';
import { useRef } from 'react';
import style from './page-prompt.module.scss';
export const PagePrompt = ()=>{
    const label = useLabel();
    const { PageActions, PageContext, PageDictate, PageMenu, PageStop, PageStreamingIndicator, PageSubmit, PageSynthesis, PageTextarea, PageTrigger, PageUpload } = useLlm((state)=>state.components);
    const ref = useRef(null);
    const streaming = useLlm((state)=>state.streaming);
    const opened = useLlmView((state)=>state.opened);
    const { open } = useLlmView((state)=>state.actions);
    const idle = useLlmView((state)=>{
        const { idle, opened } = state;
        // const shouldShowTrigger = (!opened && !idle && !embed && !imperative) || Boolean(app?.contents.customIntro && !introed);
        return idle && !opened;
    });
    const { wrapper } = useActions();
    useClickOut(ref, (event)=>{
        const className = event.target?.getAttribute('class') || '';
        // console.log('useClickOut', className);
        if (className.indexOf('llm') === -1 && opened) {
            open();
        }
    });
    // console.log('idle', idle);
    return /*#__PURE__*/ _jsx(AnimatePresence, {
        children: !idle && /*#__PURE__*/ _jsxs(motion.section, {
            ref: ref,
            className: getClassNames(style.prompt, {
                [style.open]: opened
            }),
            initial: {
                y: '200%',
                opacity: 0
            },
            animate: {
                y: 0,
                opacity: 1
            },
            exit: {
                y: '200%',
                opacity: 0
            },
            transition: {
                duration: .4
            },
            "aria-label": "Prompt",
            children: [
                /*#__PURE__*/ _jsx(PageTrigger, {}),
                wrapper ? /*#__PURE__*/ _jsx(PageActions, {
                    wrapper: wrapper
                }) : /*#__PURE__*/ _jsxs("form", {
                    className: getClassNames(style.form, '-form'),
                    onSubmit: (event)=>event.preventDefault(),
                    children: [
                        /*#__PURE__*/ _jsx(PageMenu, {}),
                        /*#__PURE__*/ _jsxs("div", {
                            className: getClassNames(style.control, {
                                [style.streaming]: streaming
                            }),
                            children: [
                                /*#__PURE__*/ _jsx(PageStreamingIndicator, {}),
                                /*#__PURE__*/ _jsx(PageTextarea, {}),
                                /*#__PURE__*/ _jsx(PageUpload, {}),
                                /*#__PURE__*/ _jsx(PageContext, {}),
                                /*#__PURE__*/ _jsx(PageDictate, {}),
                                /*#__PURE__*/ _jsx(PageSynthesis, {})
                            ]
                        }),
                        streaming ? /*#__PURE__*/ _jsx(PageStop, {}) : /*#__PURE__*/ _jsx(PageSubmit, {})
                    ]
                })
            ]
        })
    });
};

//# sourceMappingURL=page-prompt.js.map