{"version":3,"file":"BlogCard.BkHMt9i0.mjs","names":["useState"],"sources":["https:/framerusercontent.com/modules/ZJALG6HWNYxTIv6J56wh/dIPDcCEmES57h8d7hAzC/BlogCard.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{useState}from\"react\";function resolveImageUrl(image){if(!image)return\"\";if(typeof image===\"string\")return image;return image.src||\"\";}// Responsive CSS lives here (real @media queries) because inline React styles\n// can't respond to viewport width on their own. These classes control layout\n// only — colors, fonts etc. stay as inline styles below.\nconst RESPONSIVE_CSS=`\n.bc-featured { display:flex; flex-direction:row; align-items:stretch; gap:56px; padding:16px 28px; margin:0 -28px; box-sizing:border-box; max-width:100%; }\n.bc-featured-img { flex:1 1 380px; min-width:300px; aspect-ratio:16/11; max-width:100%; }\n.bc-featured-text { flex:1 1 380px; min-width:300px; display:flex; flex-direction:column; gap:16px; justify-content:center; min-width:0; }\n.bc-list { display:flex; flex-wrap:wrap; align-items:center; gap:20px 40px; padding:16px 20px; margin:0 -20px; box-sizing:border-box; max-width:100%; }\n.bc-list-index { flex:0 0 auto; width:48px; }\n.bc-list-thumb { width:140px; height:100px; flex-shrink:0; max-width:100%; }\n.bc-list-textcol { flex:1 1 340px; min-width:260px; display:flex; flex-direction:column; gap:10px; }\n.bc-list-meta { flex:1 1 220px; min-width:200px; display:flex; justify-content:space-between; align-items:center; gap:20px; }\n\n/* Every image/thumb inside the card is capped to its own column's width no\n   matter what — this is the safety net so a card can never push the page\n   wider than the screen, regardless of what padding the parent happens to\n   have. */\n.bc-featured-img, .bc-list-thumb { box-sizing:border-box; }\n\n@media (max-width: 900px) {\n  .bc-featured { flex-direction:column; gap:24px; padding:16px 20px; margin:0 -20px; }\n  .bc-featured-img { min-width:0; aspect-ratio:16/10; width:100%; }\n  .bc-featured-text { min-width:0; }\n}\n\n/* Below 600px: every article (featured or list) becomes a full-width stacked\n   card — large image on top, same aspect ratio for all, text below. Nothing\n   shrinks down to a tiny thumbnail anymore, and nothing bleeds past the\n   viewport: the risky negative-margin \"bleed to the edge\" trick (which\n   assumed a specific parent padding and broke as soon as a page used a\n   different one) is dropped in favor of simply staying inside the card's\n   own container. */\n@media (max-width: 600px) {\n  .bc-featured { flex-direction:column; padding:14px 16px; margin:0; gap:18px; width:100%; }\n  .bc-featured-img { aspect-ratio:16/10; width:100%; }\n  .bc-featured-text { min-width:0; width:100%; }\n\n  .bc-list {\n    flex-direction:column; align-items:stretch; gap:18px;\n    padding:14px 16px; margin:0; width:100%;\n  }\n  .bc-list-index { display:none; }\n  .bc-list-thumb {\n    width:100%; height:auto; aspect-ratio:16/10;\n  }\n  .bc-list-textcol { flex:1 1 auto; min-width:0; width:100%; }\n  .bc-list-meta { flex:1 1 auto; min-width:0; width:100%; justify-content:space-between; }\n}\n`;let styleInjected=false;function injectResponsiveStyles(){if(styleInjected||typeof document===\"undefined\")return;const existing=document.getElementById(\"blogcard-responsive-styles\");if(existing){styleInjected=true;return;}const styleEl=document.createElement(\"style\");styleEl.id=\"blogcard-responsive-styles\";styleEl.textContent=RESPONSIVE_CSS;document.head.appendChild(styleEl);styleInjected=true;}export default function BlogCard({thumbnail,category,readTime,date,title,summary,featuredLinkLabel,listLinkLabel,slug,index,hideIfCurrentPage=true,variant=\"featured\",style}){// Note: this component renders a <div>, not an <a>. It is designed to sit\n// INSIDE a Framer layer that already has its own Link set (e.g. a Collection\n// List item bound to the CMS entry). Do not also add a link on this\n// component's own wrapper, or on any parent Frame around it, to avoid\n// nested <a> tags.\ninjectResponsiveStyles();const[hovered,setHovered]=useState(false);// Self-hiding: when this card is used in a \"related/continue reading\" list\n// on a blog article page, and its own slug matches the article currently\n// being viewed, render nothing. This lets the exact same Collection List\n// be reused on every article page without manually excluding \"yourself\".\n//\n// This is computed directly during render (not in a useEffect+state pair)\n// on purpose: Framer's client-side page transitions can reuse the same\n// component instance across articles without remounting it, and an effect\n// keyed on [slug, hideIfCurrentPage] would then never re-run (those props\n// don't change), leaving it stuck showing/hiding based on the previous\n// page. Reading window.location.pathname inline means it's re-checked on\n// every render, so it can never go stale after a soft navigation.\nconst isCurrentPage=hideIfCurrentPage&&!!slug&&typeof window!==\"undefined\"&&window.location.pathname.replace(/\\/+$/,\"\")===`/insights/blogs/${slug}`;if(isCurrentPage)return null;const imageUrl=resolveImageUrl(thumbnail);const TEXT=\"rgb(31,31,31)\";const MUTED=\"rgba(31,31,31,0.55)\";const BORDER=\"rgba(26,46,44,0.12)\";const ACCENT=\"rgb(44,109,112)\";const HOVER_BG=\"rgba(44,109,112,0.1)\";const HEADING_FONT='\"Cormorant Garamond\", serif';const BODY_FONT='\"Instrument Sans\", sans-serif';const MONO_FONT='\"IBM Plex Mono\", monospace';const hoverHandlers={onMouseEnter:()=>setHovered(true),onMouseLeave:()=>setHovered(false)};if(variant===\"featured\"){// No bottom border here on purpose: every \"list\" card below draws its\n// own top border, so a bottom border on the featured card would double\n// up with the first list card's top line.\nreturn /*#__PURE__*/_jsxs(\"div\",{className:\"bc-featured\",...hoverHandlers,style:{textDecoration:\"none\",color:\"inherit\",width:\"100%\",cursor:\"pointer\",backgroundColor:hovered?HOVER_BG:\"transparent\",transition:\"background-color 150ms ease\",...style},children:[/*#__PURE__*/_jsx(\"div\",{className:\"bc-featured-img\",style:{backgroundImage:imageUrl?`url(${imageUrl})`:\"none\",backgroundSize:\"cover\",backgroundPosition:\"center\",backgroundColor:imageUrl?\"transparent\":\"rgba(44,109,112,0.11)\"}}),/*#__PURE__*/_jsxs(\"div\",{className:\"bc-featured-text\",children:[/*#__PURE__*/_jsxs(\"div\",{style:{display:\"flex\",alignItems:\"center\",gap:\"8px\",flexWrap:\"wrap\"},children:[/*#__PURE__*/_jsxs(\"span\",{style:{fontFamily:MONO_FONT,fontSize:\"12px\",fontWeight:500,letterSpacing:\"0.04em\",textTransform:\"uppercase\",color:ACCENT},children:[\"Featured\",category?` — ${category}`:\"\"]}),/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:MONO_FONT,fontSize:\"12px\",color:MUTED,marginLeft:\"auto\"},children:readTime||\"5 min read\"})]}),/*#__PURE__*/_jsx(\"div\",{style:{fontFamily:HEADING_FONT,fontWeight:500,fontSize:\"clamp(24px, 3.4vw, 34px)\",letterSpacing:\"-0.01em\",lineHeight:\"1.15em\",color:TEXT},children:title||\"Article title\"}),summary&&/*#__PURE__*/_jsx(\"div\",{style:{fontFamily:BODY_FONT,fontSize:\"16px\",lineHeight:\"1.6em\",color:MUTED,maxWidth:\"480px\"},children:summary}),/*#__PURE__*/_jsxs(\"div\",{style:{display:\"flex\",alignItems:\"center\",justifyContent:\"space-between\",borderTop:`1px solid ${BORDER}`,paddingTop:\"16px\",marginTop:\"8px\",flexWrap:\"wrap\",gap:\"8px\"},children:[/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:MONO_FONT,fontSize:\"12px\",letterSpacing:\"0.04em\",textTransform:\"uppercase\",color:MUTED},children:date||\"\"}),/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:MONO_FONT,fontSize:\"12px\",letterSpacing:\"0.04em\",textTransform:\"uppercase\",color:TEXT},children:featuredLinkLabel||\"Read the article →\"})]})]})]});}return /*#__PURE__*/_jsxs(\"div\",{className:\"bc-list\",...hoverHandlers,style:{borderTop:`1px solid ${BORDER}`,backgroundColor:hovered?HOVER_BG:\"transparent\",transition:\"background-color 150ms ease\",cursor:\"pointer\",textDecoration:\"none\",color:\"inherit\",width:\"100%\",...style},children:[index!==undefined&&/*#__PURE__*/_jsx(\"span\",{className:\"bc-list-index\",style:{fontFamily:MONO_FONT,fontSize:\"11px\",letterSpacing:\"0.04em\",color:ACCENT},children:typeof index===\"number\"?String(index).padStart(2,\"0\"):index}),/*#__PURE__*/_jsx(\"div\",{className:\"bc-list-thumb\",style:{backgroundImage:imageUrl?`url(${imageUrl})`:\"none\",backgroundSize:\"cover\",backgroundPosition:\"center\",backgroundColor:imageUrl?\"transparent\":\"rgba(44,109,112,0.11)\"}}),/*#__PURE__*/_jsxs(\"div\",{className:\"bc-list-textcol\",children:[/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:HEADING_FONT,fontWeight:400,fontSize:\"clamp(22px, 2.6vw, 34px)\",letterSpacing:\"-0.02em\",lineHeight:\"1.15em\",color:TEXT},children:title||\"Article title\"}),summary&&/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:BODY_FONT,fontSize:\"15px\",lineHeight:\"1.7em\",color:MUTED,maxWidth:\"58ch\"},children:summary})]}),/*#__PURE__*/_jsxs(\"div\",{className:\"bc-list-meta\",children:[/*#__PURE__*/_jsxs(\"div\",{style:{display:\"flex\",flexDirection:\"column\",gap:\"5px\"},children:[/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:MONO_FONT,fontSize:\"11px\",letterSpacing:\"0.04em\",textTransform:\"uppercase\",color:ACCENT},children:category||\"\"}),/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:MONO_FONT,fontSize:\"11px\",letterSpacing:\"0.04em\",textTransform:\"uppercase\",color:MUTED},children:[date,readTime].filter(Boolean).join(\" \\xb7 \")})]}),/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:MONO_FONT,fontSize:\"11px\",letterSpacing:\"0.04em\",textTransform:\"uppercase\",color:TEXT,whiteSpace:\"nowrap\"},children:listLinkLabel||\"Read →\"})]})]});}addPropertyControls(BlogCard,{variant:{type:ControlType.Enum,title:\"Variant\",options:[\"featured\",\"list\"],optionTitles:[\"Featured\",\"List\"],defaultValue:\"featured\"},thumbnail:{type:ControlType.ResponsiveImage,title:\"Thumbnail\"},category:{type:ControlType.String,title:\"Category\",defaultValue:\"Strategy\"},readTime:{type:ControlType.String,title:\"Read time\",defaultValue:\"5 min read\"},date:{type:ControlType.String,title:\"Date\",defaultValue:\"\"},title:{type:ControlType.String,title:\"Title\",defaultValue:\"\"},summary:{type:ControlType.String,title:\"Summary\",defaultValue:\"\"},featuredLinkLabel:{type:ControlType.String,title:\"Featured link\",defaultValue:\"Read the article →\"},listLinkLabel:{type:ControlType.String,title:\"List link\",defaultValue:\"Read →\"},slug:{type:ControlType.String,title:\"Slug\",defaultValue:\"article-slug\"},index:{type:ControlType.String,title:\"Index\",defaultValue:\"\"},hideIfCurrentPage:{type:ControlType.Boolean,title:\"Hide if current page\",defaultValue:true}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"BlogCard\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./BlogCard.map"],"mappings":"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"}