import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from 'react';
import { Link, useUniqId } from '@gravity-ui/uikit';
import { Image } from "../../components/index.js";
import { getMediaImage } from "../../components/Media/Image/utils.js";
import { useTheme } from "../../gravity-blocks/context/theme/index.js";
import { ImageCardDirection } from "../../models/index.js";
import { block, getThemedValue } from "../../utils/index.js";
import Content from "../Content/Content.js";
import './ImageCard.css';
const b = block('image-card');
const CONTENT_COL_SIZES = { all: 12, md: 12 };
const ImageCard = (props) => {
    const { border = 'shadow', title, text, image, enableImageBorderRadius = false, direction = ImageCardDirection.Direct, margins, backgroundColor, url, target, urlTitle, additionalInfo, links, buttons, list, theme: cardTheme = 'default', size = 's', controlPosition = 'content', } = props;
    const globalTheme = useTheme();
    const areControlsInFooter = controlPosition === 'footer';
    const hasContent = Boolean(text || title || buttons || links || list);
    const themedImage = getThemedValue(image, globalTheme);
    const imageProps = getMediaImage(themedImage);
    const titleId = useUniqId();
    const cardContent = (_jsxs(React.Fragment, { children: [image && (_jsx("div", { className: b('image', { margins }), children: _jsx(Image, { className: b('image_inner', { radius: enableImageBorderRadius }), ...imageProps }) })), hasContent && (_jsx("div", { className: b('content'), children: _jsx(Content, { titleId: titleId, title: title, text: text, links: links, buttons: buttons, list: list, theme: cardTheme, additionalInfo: additionalInfo, size: size, colSizes: CONTENT_COL_SIZES, controlPosition: areControlsInFooter ? 'bottom' : 'default' }) }))] }));
    return url ? (_jsx(Link, { href: url, target: target, rel: target === '_blank' ? 'noopener noreferrer' : undefined, className: b({ border, 'with-content': hasContent, direction }), title: urlTitle, style: { backgroundColor }, extraProps: {
            draggable: false,
            onDragStart: (e) => e.preventDefault(),
        }, children: cardContent })) : (_jsx("div", { className: b({ border, 'with-content': hasContent, direction }), style: { backgroundColor }, children: cardContent }));
};
export default ImageCard;
//# sourceMappingURL=ImageCard.js.map
