'use client';
import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
import React from 'react';
import { useConfig } from '../../providers/Config/index.js';
import { useTranslation } from '../../providers/Translation/index.js';
import { formatDocTitle } from '../../utilities/formatDocTitle/index.js';
import './index.scss';
const baseClass = 'thumbnail-card';
export const ThumbnailCard = (props)=>{
    const { alignLabel, className, collection, doc, label: labelFromProps, onClick, thumbnail } = props;
    const { config } = useConfig();
    const { i18n } = useTranslation();
    const classes = [
        baseClass,
        className,
        typeof onClick === 'function' && `${baseClass}--has-on-click`,
        alignLabel && `${baseClass}--align-label-${alignLabel}`
    ].filter(Boolean).join(' ');
    let title = labelFromProps;
    if (!title) {
        title = formatDocTitle({
            collectionConfig: collection,
            data: doc,
            dateFormat: config.admin.dateFormat,
            fallback: doc?.filename,
            i18n
        });
    }
    return /*#__PURE__*/ _jsxDEV("button", {
        className: classes,
        onClick: onClick,
        title: title,
        type: "button",
        children: [
            /*#__PURE__*/ _jsxDEV("div", {
                className: `${baseClass}__thumbnail`,
                children: thumbnail
            }, void 0, false, {
                fileName: "src/elements/ThumbnailCard/index.tsx",
                lineNumber: 62,
                columnNumber: 7
            }, this),
            /*#__PURE__*/ _jsxDEV("div", {
                className: `${baseClass}__label`,
                children: title
            }, void 0, false, {
                fileName: "src/elements/ThumbnailCard/index.tsx",
                lineNumber: 63,
                columnNumber: 7
            }, this)
        ]
    }, void 0, true, {
        fileName: "src/elements/ThumbnailCard/index.tsx",
        lineNumber: 61,
        columnNumber: 5
    }, this);
};

//# sourceMappingURL=index.js.map