notion-block-renderer
Version:
Notion Block to React Components.
31 lines (30 loc) • 1.14 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const VideoRenderer = ({ block }) => {
if (block.external) {
return ((0, jsx_runtime_1.jsx)("iframe", { width: "560", height: "315", src: getEmbedUrl(block.external.url), allow: "autoplay; fullscreen; picture-in-picture", allowFullScreen: true }));
}
else if (block.file) {
return ((0, jsx_runtime_1.jsx)("video", { controls: true, children: (0, jsx_runtime_1.jsx)("source", { src: block.file.url }) }));
}
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
};
exports.default = VideoRenderer;
const getEmbedUrl = (url) => {
if (url.includes("youtube")) {
return getYoutubeEmbedUrl(url);
}
return url;
};
const getYoutubeEmbedUrl = (url) => {
const regex = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
const result = url.match(regex);
if (result && result[2] && result[2].length == 11) {
const id = result[2];
return "//www.youtube.com/embed/" + id;
}
else {
return url;
}
};