{"version":3,"file":"VimeoThumbnail.DoF7bkez.mjs","names":[],"sources":["https:/framerusercontent.com/modules/aYNRLDzMtSZhj4mpG05l/kWu5FW4g0Sl4g62VAzhx/VimeoThumbnail.js"],"sourcesContent":["// VimeoThumbnail component that extracts the video ID from any input (link or ID), fetches the thumbnail at a configurable size, and locks aspect ratio to 16:9. Sizing is controlled by Framer's native controls.\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useState,useMemo}from\"react\";import{addPropertyControls,ControlType}from\"framer\";/**\n * VimeoThumbnail\n *\n * Shows a Vimeo video thumbnail at a configurable resolution. Accepts any Vimeo link or ID. Aspect ratio is locked to 16:9. Sizing is controlled by Framer's native controls.\n *\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n */export default function VimeoThumbnail(props){const{vimeoInput,radius}=props;// Extract Vimeo ID from any input\nconst vimeoId=useMemo(()=>{if(!vimeoInput)return\"\";// Try to match ID from various Vimeo URL formats\nconst match=vimeoInput.match(/(?:vimeo\\.com\\/(?:.*\\/)?|video\\/)?(\\d{6,})/);if(match&&match[1])return match[1];// If just numbers, use as ID\nif(/^\\d{6,}$/.test(vimeoInput))return vimeoInput;return\"\";},[vimeoInput]);// Build thumbnail URL\nconst[thumbUrl,setThumbUrl]=useState(\"\");useEffect(()=>{if(!vimeoId){setThumbUrl(\"\");return;}// Vimeo's oEmbed API returns a thumbnail URL\nfetch(`https://vimeo.com/api/oembed.json?url=https://vimeo.com/${vimeoId}`).then(r=>r.json()).then(data=>{// Use the highest resolution thumbnail available\nlet url=data.thumbnail_url;// Prefer 3840x2160 if possible\nurl=url.replace(/_[0-9]+x[0-9]+\\./,\"_3840x2160.\");setThumbUrl(url);}).catch(()=>setThumbUrl(\"\"));},[vimeoId]);// Lock aspect ratio to 16:9\nreturn /*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\",overflow:\"hidden\",position:\"relative\",aspectRatio:\"16/9\"},children:thumbUrl?/*#__PURE__*/_jsx(\"img\",{src:thumbUrl,alt:\"Vimeo Thumbnail\",style:{width:\"100%\",height:\"100%\",objectFit:\"cover\",borderRadius:radius,maxWidth:\"100%\",maxHeight:\"100%\",aspectRatio:\"16/9\"}}):null});}addPropertyControls(VimeoThumbnail,{vimeoInput:{type:ControlType.String,title:\"Vimeo Link/ID\",defaultValue:\"76979871\",placeholder:\"Paste Vimeo link or ID\"},radius:{type:ControlType.Number,title:\"Radius\",defaultValue:8,min:0,max:64,step:1,unit:\"px\",displayStepper:true}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"VimeoThumbnail\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"any\",\"framerSupportedLayoutWidth\":\"any\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./VimeoThumbnail.map"],"mappings":"kRAQG,SAAwB,EAAe,EAAM,CAIhD,GAJsD,CAAC,aAAW,SAAO,CAAC,EACpE,EAAQ,EAAQ,IAAI,CAAC,IAAI,EAAW,MAAM,GAChD,IAAM,EAAM,EAAW,MAAM,6CAA6C,CACzB,OAD6B,GAAO,EAAM,GAAU,EAAM,GACxG,WAAW,KAAK,EAAW,CAAQ,EAAiB,EAAI,EAAC,CAAC,CAAW,EAAC,CACpE,CAAC,EAAS,EAAY,CAAC,EAAS,GAAG,CAIxC,MAJyC,GAAU,IAAI,CAAC,IAAI,EAAQ,CAAC,EAAY,GAAG,CAAC,MAAQ,CAC7F,OAAO,0DAA0D,EAAQ,EAAE,CAAC,KAAK,GAAG,EAAE,MAAM,CAAC,CAAC,KAAK,GAAM,CACzG,IAAI,EAAI,EAAK,cACqC,AAAlD,EAAI,EAAI,QAAQ,mBAAmB,cAAc,CAAC,EAAY,EAAI,AAAE,EAAC,CAAC,MAAM,IAAI,EAAY,GAAG,CAAC,AAAE,EAAC,CAAC,CAAQ,EAAC,CACzF,EAAK,MAAM,CAAC,MAAM,CAAC,MAAM,OAAO,OAAO,OAAO,QAAQ,OAAO,WAAW,SAAS,eAAe,SAAS,SAAS,SAAS,SAAS,WAAW,YAAY,MAAO,EAAC,SAAS,EAAsB,EAAK,MAAM,CAAC,IAAI,EAAS,IAAI,kBAAkB,MAAM,CAAC,MAAM,OAAO,OAAO,OAAO,UAAU,QAAQ,aAAa,EAAO,SAAS,OAAO,UAAU,OAAO,YAAY,MAAO,CAAC,EAAC,CAAC,IAAK,EAAC,AAAE,cAAA,AAf5Y,GAA2C,IAA8C,IAAoD,CAe+P,EAAoB,EAAe,CAAC,WAAW,CAAC,KAAK,EAAY,OAAO,MAAM,gBAAgB,aAAa,WAAW,YAAY,wBAAyB,EAAC,OAAO,CAAC,KAAK,EAAY,OAAO,MAAM,SAAS,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,KAAK,EAAE,KAAK,KAAK,gBAAe,CAAK,CAAC,EAAC"}