@udus/notion-renderer
Version:
12 lines (11 loc) • 1.77 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { RichText } from "../RichText/RichText.js";
export const Bookmark = ({ block }) => {
return (_jsxs("div", { id: block.id, className: "notion-block notion-bookmark", children: [_jsx("a", { href: block.bookmark.url, target: "_blank", children: _jsxs("div", { className: "notion-bookmark-container", children: [_jsxs("div", { className: "notion-bookmark-content", children: [_jsx("div", { className: "notion-bookmark-title", children: block.bookmark?.site_meta?.title
? block.bookmark.site_meta.title
: block.bookmark.url }), _jsx("div", { className: "notion-bookmark-description", children: block.bookmark?.site_meta?.description
? block.bookmark.site_meta.description
: block.bookmark.url }), _jsxs("div", { className: "notion-bookmark-url", children: [_jsx("span", { className: "notion-bookmark-favicon", children: _jsx("img", { src: block.bookmark?.site_meta?.favicon
? block.bookmark.site_meta?.favicon
: `https://www.google.com/s2/favicons?domain=${block.bookmark.url}`, alt: "bookmark favicon" }) }), _jsx("span", { className: "notion-bookmark-link-url", children: block.bookmark.url })] })] }), block.bookmark?.site_meta?.image && (_jsx("div", { className: "notion-bookmark-cover", children: _jsx("img", { src: block.bookmark.site_meta.image, alt: "bookmark og image" }) }))] }) }), _jsx("div", { className: "notion-caption notion-bookmark-caption", children: _jsx(RichText, { richText: block.bookmark.caption }) })] }));
};