@automattic/social-previews
Version:
A suite of components to generate previews for a post for both social and search engines.
14 lines • 1.28 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import clsx from 'clsx';
import MastodonPostActions from './post/actions';
import MastonPostBody from './post/body';
import MastodonPostCard from './post/card';
import MastodonPostHeader from './post/header';
import './styles.scss';
export const MastodonPostPreview = (props) => {
const { user, media } = props;
return (_jsxs("div", { className: "mastodon-preview__post", children: [_jsx(MastodonPostHeader, { user: user }), _jsx(MastonPostBody, { ...props, children: media?.length ? (_jsx("div", { className: clsx('mastodon-preview__media', { 'as-grid': media.length > 1 }), children: media.map((mediaItem, index) => (_jsx("div", { className: "mastodon-preview__media-item", children: mediaItem.type.startsWith('video/') ? (
// eslint-disable-next-line jsx-a11y/media-has-caption
_jsx("video", { controls: true, children: _jsx("source", { src: mediaItem.url, type: mediaItem.type }) })) : (_jsx("img", { alt: mediaItem.alt || '', src: mediaItem.url })) }, `mastodon-preview__media-item-${index}`))) })) : null }), !media?.length ? _jsx(MastodonPostCard, { ...props }) : null, _jsx(MastodonPostActions, {})] }));
};
//# sourceMappingURL=post-preview.js.map