@brizy/ui
Version:
React elements in Brizy style
29 lines (28 loc) • 1.63 kB
JavaScript
import { classNames } from "../classNamesFn";
import React, { useMemo } from "react";
import { BRZ_PREFIX } from "../constants";
export const SoundCloud = (props) => {
const { src, isAutoPlay, showArtwork, showLikeButton, showBuyButton, showDownloadButton, showShareButton, showComments, showPlayCounts, showUsername, isVisual, controlsColor, className, } = props;
// intrinsic-ignore - this class is needed for WP theme twentytwenty(themes/twentytwenty/assets/js/index.js?ver=1.1)
// intrinsicRatioVideos - property contain function - makeFit which changes iframes width
// and breaks our code(video, map inside megamenu isn't showing as example)
const _className = classNames(className, "intrinsic-ignore")("iframe");
const url = useMemo(() => {
return `https://w.soundcloud.com/player/?url=${src}&auto_play=${isAutoPlay}&how_teaser=true&visual=${isVisual}&color=${controlsColor}&buying=${showBuyButton}&sharing=${showShareButton}&download=${showDownloadButton}&show_artwork=${showArtwork}&show_playcount=${showPlayCounts}&show_user=${showUsername}&show_comments=${showComments}&liking=${showLikeButton}&`;
}, [
src,
isAutoPlay,
isVisual,
controlsColor,
showBuyButton,
showShareButton,
showDownloadButton,
showArtwork,
showPlayCounts,
showUsername,
showComments,
showLikeButton,
]);
return (React.createElement("div", { className: `${BRZ_PREFIX}-sound-cloud__content` },
React.createElement("iframe", { className: _className, src: url, title: `${BRZ_PREFIX}-sound-cloud` })));
};