import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useLabel } from '@websolutespa/bom-mixer-hooks';
import { Cta, useLlmView } from '@websolutespa/bom-mixer-llm';
import style from './custom-card.module.scss';
export const CustomCard = (props)=>{
    const { item } = props;
    const label = useLabel();
    const { send } = useLlmView((state)=>state.actions);
    const onTellMeMore = async (event)=>{
        const prompt = `${label('llm.tellMeMoreAbout')} ${item.title}`;
        await send(prompt, (response)=>{
        // console.log('Prompt.onChunk', response.chunks);
        }, (response)=>{
        // console.log('Prompt.onEnd', response);
        });
    };
    const ariaLabel = label('llm.tellMeMore');
    return /*#__PURE__*/ _jsxs("div", {
        className: style.customCard,
        children: [
            item.media && /*#__PURE__*/ _jsx(_Fragment, {
                children: item.href ? /*#__PURE__*/ _jsx("a", {
                    className: style.customCardMedia,
                    href: item.href,
                    target: "_blank",
                    rel: "noreferrer",
                    "aria-label": ariaLabel,
                    children: /*#__PURE__*/ _jsx("div", {
                        className: style.customCardAsset,
                        children: /*#__PURE__*/ _jsx("img", {
                            src: item.media.url,
                            alt: ""
                        })
                    })
                }) : /*#__PURE__*/ _jsx("div", {
                    className: style.customCardMedia,
                    children: /*#__PURE__*/ _jsx("div", {
                        className: style.customCardAsset,
                        children: /*#__PURE__*/ _jsx("img", {
                            src: item.media.url,
                            alt: ""
                        })
                    })
                })
            }),
            /*#__PURE__*/ _jsxs("div", {
                className: style.customCardContent,
                children: [
                    item.title && /*#__PURE__*/ _jsx("div", {
                        className: style.customCardTitle,
                        dangerouslySetInnerHTML: {
                            __html: item.title
                        }
                    }),
                    item.abstract && /*#__PURE__*/ _jsx("div", {
                        className: style.customCardAbstract,
                        dangerouslySetInnerHTML: {
                            __html: item.abstract
                        }
                    }),
                    /*#__PURE__*/ _jsx(Cta, {
                        type: "button",
                        label: label('llm.tellMeMore'),
                        onClick: onTellMeMore
                    })
                ]
            })
        ]
    });
};

//# sourceMappingURL=custom-card.js.map