{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/NEd4VmDdsxM3StIUbddO/vYIHSp44qmOgHgaaijWz/YouTube.js"],
  "sourcesContent": ["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useReducer,useState}from\"react\";import{ControlType,addPropertyControls}from\"framer\";import{useIsOnCanvas,emptyStateStyle,containerStyles,defaultEvents}from\"https://framer.com/m/framer/default-utils.js\";var PlayOptions;(function(PlayOptions){PlayOptions[\"Normal\"]=\"Off\";PlayOptions[\"Auto\"]=\"On\";PlayOptions[\"Loop\"]=\"Loop\";})(PlayOptions||(PlayOptions={}));var ThumbnailOptions;(function(ThumbnailOptions){ThumbnailOptions[\"High\"]=\"High Quality\";ThumbnailOptions[\"Medium\"]=\"Medium Quality\";ThumbnailOptions[\"Low\"]=\"Low Quality\";ThumbnailOptions[\"Off\"]=\"Off\";})(ThumbnailOptions||(ThumbnailOptions={}));/**\n * @framerIntrinsicWidth 560\n * @framerIntrinsicHeight 315\n *\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */ export function Youtube({url,play,shouldMute,thumbnail,isRed,onClick,onMouseEnter,onMouseLeave,onMouseDown,onMouseUp,...props}){const onCanvas=useIsOnCanvas();const isAutoplay=play!==PlayOptions.Normal;const showThumbnail=onCanvas||thumbnail!==ThumbnailOptions.Off&&!isAutoplay;const[isPreloading,preloadVideo]=useReducer(()=>true,false);const[showVideo,startVideo]=useReducer(()=>true,!showThumbnail);const[isHovered,setHovered]=useState(false);if(url===\"\"){return(/*#__PURE__*/ _jsx(Instructions,{}));}const parsedURL=parseVideoURL(url);if(parsedURL===undefined){return(/*#__PURE__*/ _jsx(ErrorMessage,{message:\"Invalid Youtube URL.\"}));}const[videoId,embedURL]=parsedURL;// https://stackoverflow.com/questions/2068344/how-do-i-get-a-youtube-video-thumbnail-from-the-youtube-api\nconst thumbnailURL=getThumbnailURL(videoId,thumbnail);// https://developers.google.com/youtube/player_parameters\nconst searchParams=embedURL.searchParams;searchParams.set(\"iv_load_policy\",\"3\");searchParams.set(\"rel\",\"0\");searchParams.set(\"modestbranding\",\"1\");searchParams.set(\"playsinline\",\"1\");if(isAutoplay||showThumbnail){searchParams.set(\"autoplay\",\"1\");}if(isAutoplay&&shouldMute){searchParams.set(\"mute\",\"1\");}if(play===PlayOptions.Loop){searchParams.set(\"loop\",\"1\");searchParams.set(\"playlist\",videoId);}if(!isRed){searchParams.set(\"color\",\"white\");}return(/*#__PURE__*/ _jsxs(\"article\",{onPointerEnter:()=>setHovered(true),onPointerLeave:()=>setHovered(false),onPointerOver:preloadVideo,onClick:startVideo,style:{...centerStyle,background:showThumbnail?`center / cover url(${thumbnailURL}) no-repeat`:undefined,cursor:\"pointer\",overflow:\"hidden\"},children:[isPreloading&&/*#__PURE__*/ _jsx(\"link\",{rel:\"preconnect\",href:\"https://www.youtube.com\"}),isPreloading&&/*#__PURE__*/ _jsx(\"link\",{rel:\"preconnect\",href:\"https://www.google.com\"}),showVideo?/*#__PURE__*/ _jsx(\"iframe\",{src:embedURL.href,width:\"100%\",height:\"100%\",frameBorder:\"0\",allow:\"presentation; fullscreen; accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\",onClick:onClick,onMouseEnter:onMouseEnter,onMouseLeave:onMouseLeave,onMouseDown:onMouseDown,onMouseUp:onMouseUp}):/*#__PURE__*/ _jsx(PlayButton,{onClick:startVideo,isHovered:isHovered,isRed:isRed})]}));}Youtube.displayName=\"YouTube\";addPropertyControls(Youtube,{url:{type:ControlType.String,title:\"Video\"},play:{type:ControlType.Enum,title:\"Autoplay\",options:Object.values(PlayOptions)},shouldMute:{title:\"Mute\",type:ControlType.Boolean,enabledTitle:\"Yes\",disabledTitle:\"No\",hidden(props){return props.play===PlayOptions.Normal;}},thumbnail:{title:\"Thumbnail\",description:\"Showing a thumbnail improves performance.\",type:ControlType.Enum,options:Object.values(ThumbnailOptions),hidden(props){return props.play!==PlayOptions.Normal;}},isRed:{title:\"Color\",type:ControlType.Boolean,enabledTitle:\"Red\",disabledTitle:\"White\"},...defaultEvents});const defaultProps={url:\"https://youtu.be/smPos0mJvh8\",play:PlayOptions.Normal,shouldMute:true,thumbnail:ThumbnailOptions.Medium,isRed:true};Youtube.defaultProps=defaultProps;function parseVideoURL(urlString){let url;try{url=new URL(urlString);}catch{const embedURL=getEmbedURL(urlString);return[urlString,embedURL];}if(url.hostname===\"youtube.com\"||url.hostname===\"www.youtube.com\"||url.hostname===\"youtube-nocookie.com\"||url.hostname===\"www.youtube-nocookie.com\"){const pathSegments=url.pathname.slice(1).split(\"/\");// https://www.youtube.com/watch?v=Fop2oskTug8\nif(pathSegments[0]===\"watch\"){const videoId=url.searchParams.get(\"v\");const embedURL=getEmbedURL(videoId);return[videoId,embedURL];}// https://www.youtube.com/embed/Fop2oskTug8\nif(pathSegments[0]===\"embed\"){const videoId=pathSegments[1];return[videoId,url];}}// https://youtu.be/Fop2oskTug8\nif(url.hostname===\"youtu.be\"){const videoId=url.pathname.slice(1);const embedURL=getEmbedURL(videoId);return[videoId,embedURL];}}function getEmbedURL(videoId){return new URL(`https://www.youtube.com/embed/${videoId}`);}function getThumbnailURL(videoId,res){switch(res){case ThumbnailOptions.Low:return`https://i.ytimg.com/vi/${videoId}/hqdefault.jpg`;case ThumbnailOptions.Medium:return`https://i.ytimg.com/vi/${videoId}/sddefault.jpg`;case ThumbnailOptions.High:return`https://i.ytimg.com/vi/${videoId}/maxresdefault.jpg`;default:return`https://i.ytimg.com/vi/${videoId}/0.jpg`;}}// Helper components\nfunction Instructions(){return(/*#__PURE__*/ _jsx(\"div\",{style:{...emptyStateStyle,overflow:\"hidden\"},children:/*#__PURE__*/ _jsx(\"div\",{style:centerTextStyle,children:\"To embed a Youtube video, add the URL to the properties\\xa0panel.\"})}));}function ErrorMessage({message}){return(/*#__PURE__*/ _jsx(\"div\",{className:\"framerInternalUI-errorPlaceholder\",style:{...containerStyles,overflow:\"hidden\"},children:/*#__PURE__*/ _jsxs(\"div\",{style:centerTextStyle,children:[\"Error: \",message]})}));}function PlayButton({onClick,isHovered,isRed}){return(/*#__PURE__*/ _jsx(\"button\",{onClick:onClick,\"aria-label\":\"Play\",style:buttonStyle,children:/*#__PURE__*/ _jsxs(\"svg\",{height:\"100%\",version:\"1.1\",viewBox:\"0 0 68 48\",width:\"100%\",children:[/*#__PURE__*/ _jsx(\"path\",{d:\"M66.52,7.74c-0.78-2.93-2.49-5.41-5.42-6.19C55.79,.13,34,0,34,0S12.21,.13,6.9,1.55 C3.97,2.33,2.27,4.81,1.48,7.74C0.06,13.05,0,24,0,24s0.06,10.95,1.48,16.26c0.78,2.93,2.49,5.41,5.42,6.19 C12.21,47.87,34,48,34,48s21.79-0.13,27.1-1.55c2.93-0.78,4.64-3.26,5.42-6.19C67.94,34.95,68,24,68,24S67.94,13.05,66.52,7.74z\",fill:isHovered?isRed?\"#f00\":\"#000\":\"#212121\",fillOpacity:isHovered?isRed?1:0.8:0.8,style:{transition:\"fill .1s cubic-bezier(0.4, 0, 1, 1), fill-opacity .1s cubic-bezier(0.4, 0, 1, 1)\"}}),/*#__PURE__*/ _jsx(\"path\",{d:\"M 45,24 27,14 27,34\",fill:\"#fff\"})]})}));}const buttonStyle={width:68,height:48,padding:0,border:\"none\",background:\"transparent\",cursor:\"pointer\"};const centerStyle={display:\"flex\",justifyContent:\"center\",alignItems:\"center\",width:\"100%\",height:\"100%\"};const centerTextStyle={textAlign:\"center\",minWidth:140};\nexport const __FramerMetadata__ = {\"exports\":{\"Youtube\":{\"type\":\"reactComponent\",\"name\":\"Youtube\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"fixed\",\"framerSupportedLayoutHeight\":\"fixed\",\"framerIntrinsicHeight\":\"315\",\"framerContractVersion\":\"1\",\"framerIntrinsicWidth\":\"560\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./YouTube.map"],
  "mappings": "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",
  "names": ["PlayOptions", "ThumbnailOptions", "Youtube", "url", "play", "shouldMute", "thumbnail", "isRed", "onClick", "onMouseEnter", "onMouseLeave", "onMouseDown", "onMouseUp", "props", "onCanvas", "useIsOnCanvas", "isAutoplay", "showThumbnail", "isPreloading", "preloadVideo", "le", "showVideo", "startVideo", "isHovered", "setHovered", "ye", "p", "Instructions", "parsedURL", "parseVideoURL", "ErrorMessage", "videoId", "embedURL", "thumbnailURL", "getThumbnailURL", "searchParams", "u", "centerStyle", "PlayButton", "addPropertyControls", "ControlType", "defaultEvents", "defaultProps", "urlString", "getEmbedURL", "pathSegments", "res", "emptyStateStyle", "centerTextStyle", "message", "containerStyles", "buttonStyle"]
}
