import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from 'react';
import { Author, Button, Image, YFMWrapper } from "../../components/index.js";
import { getMediaImage } from "../../components/Media/Image/utils.js";
import { useTheme } from "../../gravity-blocks/context/theme/index.js";
import { useAnalytics } from "../../gravity-blocks/hooks/index.js";
import { AuthorType, DefaultEventNames, QuoteType } from "../../models/index.js";
import { block, getThemedValue } from "../../utils/index.js";
import './Quote.css';
const b = block('quote');
const Quote = (props) => {
    const { theme: textTheme = 'light', color, image, border = 'shadow', text, yfmText, logo, author, url, urlTitle, buttonText, quoteType = QuoteType.Chevron, button, } = props;
    const theme = useTheme();
    const imageThemed = getThemedValue(image, theme);
    const imageData = getMediaImage(imageThemed);
    const handleAnalytics = useAnalytics(DefaultEventNames.QuoteButton, url);
    const handleButtonClick = React.useCallback(() => handleAnalytics(), [handleAnalytics]);
    const themedAuthor = author
        ? {
            ...author,
            avatar: getThemedValue(author.avatar, theme),
        }
        : author;
    const renderFooter = Boolean(author || url) && (_jsxs("div", { className: b('author-wrapper'), children: [themedAuthor && (_jsx(Author, { className: b('author', { theme: textTheme }), author: themedAuthor, type: AuthorType.Line, theme: textTheme })), url && buttonText && !button && (_jsx(Button, { theme: "outlined", size: "xl", url: url, className: b('link-button', { theme: textTheme }), onClick: handleButtonClick, urlTitle: urlTitle, text: buttonText })), button && _jsx(Button, { size: "xl", ...button })] }));
    const themedLogoProps = getThemedValue(logo, theme);
    const logoProps = getMediaImage(themedLogoProps);
    const textLocal = yfmText || text;
    return (_jsxs("div", { className: b({ theme: textTheme, border }), style: color ? { backgroundColor: color } : {}, children: [_jsxs("div", { className: b('content-wrapper'), children: [_jsxs("div", { children: [_jsx(Image, { className: b('logo'), ...logoProps }), _jsx("div", { className: b('content', { 'quote-type': quoteType }), children: textLocal && (_jsx(YFMWrapper, { tagName: "span", contentClassName: b('text'), content: textLocal, modifiers: { constructor: true } })) })] }), renderFooter] }, text), _jsx("div", { className: b('image-wrapper'), children: _jsx(Image, { ...imageData, className: b('image') }) })] }));
};
export default Quote;
//# sourceMappingURL=Quote.js.map
