@automattic/social-previews
Version:
A suite of components to generate previews for a post for both social and search engines.
11 lines • 1.58 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { __ } from '@wordpress/i18n';
import clsx from 'clsx';
import { baseDomain, getTitleFromDescription, stripHtmlTags } from '../../../helpers';
import { mastodonTitle } from '../../helpers';
import './styles.scss';
const MastodonPostCard = ({ siteName, title, description, url, image, customImage, }) => {
return (_jsxs("div", { className: clsx('mastodon-preview__card', { 'has-image': image }), children: [_jsx("div", { className: "mastodon-preview__card-img", children: image || customImage ? (_jsx("img", { src: image || customImage, alt: __('Mastodon preview thumbnail', 'social-previews') })) : (_jsx("div", { className: "mastodon-preview__card-img--fallback", children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24", viewBox: "0 -960 960 960", width: "24", "aria-hidden": "true", children: _jsx("path", { d: "M320-240h320v-80H320v80Zm0-160h320v-80H320v80ZM240-80q-33 0-56.5-23.5T160-160v-640q0-33 23.5-56.5T240-880h320l240 240v480q0 33-23.5 56.5T720-80H240Zm280-520h200L520-800v200Z" }) }) })) }), _jsxs("div", { className: "mastodon-preview__card-text", children: [_jsx("span", { className: "mastodon-preview__card-site", children: siteName || baseDomain(url) }), _jsx("span", { className: "mastodon-preview__card-title", children: mastodonTitle(title) || getTitleFromDescription(description) }), _jsx("span", { className: "mastodon-preview__card-description", children: stripHtmlTags(description) })] })] }));
};
export default MastodonPostCard;
//# sourceMappingURL=index.js.map