{"version":3,"file":"SectionHeader.DwAEMcdg.mjs","names":[],"sources":["https:/framerusercontent.com/modules/YkK2gLsk1ZsdNJis8D7N/TpLencHd8tXRSPSF8biL/SectionHeader.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";// Canonical brand colours.\nconst ELECTRIC=\"#50fb60\";const JUNGLE=\"#0E2B2E\";const TEAL_11_LIGHT=\"rgb(0, 133, 115)\";const WHITE=\"#ffffff\";// Treat empty / black / \"none\" as \"no override\" — fall back to the on-dark\n// or on-light derived colour. This is robust to legacy instances configured\n// via MCP that serialised an empty default as `rgb(0, 0, 0)` and would have\n// otherwise painted the eyebrow + bullet dots black on dark backgrounds.\nfunction isAccentUnset(c){if(!c)return true;const s=c.trim().toLowerCase().replace(/\\s+/g,\"\");if(s===\"\")return true;if(s===\"black\")return true;if(s===\"#000\"||s===\"#000000\")return true;if(s===\"rgb(0,0,0)\")return true;if(s===\"rgba(0,0,0,1)\"||s===\"rgba(0,0,0,0)\")return true;return false;}const HEADLINE_SIZES={h1:{fontSize:\"48px\",lineHeight:\"1.0em\"},h2:{fontSize:\"40px\",lineHeight:\"1.0em\"},h3:{fontSize:\"24px\",lineHeight:\"1.1em\"}};/**\n * SectionHeader — shared layout for an \"eyebrow → headline → body → bullets\" block.\n *\n * Single source of truth for section-heading spacing site-wide. To change\n * the gap between eyebrow→headline or headline→body across the entire\n * site, edit the two `gap` literals in the render below — every instance\n * updates on next deploy.\n *\n * V8: `bulletColumns` prop added (1 | 2) for the \"list\" bullet style.\n *      Set to 2 to render bullets in a two-column grid — useful when a\n *      section has 4-6 bullets and you want the block to take up less\n *      vertical real estate so the next section fits on screen.\n *      Default 1 (single column) preserves prior behaviour.\n *\n * V7: eyebrow bumped 18px → 20px and eyebrow→headline gap tightened\n *      16px → 10px per design feedback (tighter, more confident lockup).\n *\n * V6: bullet dots now mirror the eyebrow accent fallback — Electric green on\n * dark backgrounds, Teal 11 on light backgrounds. Previously bullets always\n * defaulted to Electric green which looked too pale on light surfaces.\n *\n * V5: eyebrow + bullet accent now resolves via `isAccentUnset()` so legacy\n * instances that pass `accentColor=\"rgb(0, 0, 0)\"` correctly fall back to\n * the on-dark Electric / on-light Teal derived colour instead of painting\n * the eyebrow + bullet dots black.\n *\n * V4: added `bullets` (pipe-separated string) + `bulletStyle` (\"list\" or\n * \"tags\") props. When set, renders a styled list or pill row below the\n * body — useful for replacing dense intro paragraphs with skimmable\n * key points (V14 feedback #7/#8 for the Sync page).\n *\n * Bullets are pipe-delimited rather than ControlType.Array because Framer's\n * MCP can't round-trip Array prop values reliably (per CLAUDE.md guardrail).\n * Example: bullets=\"Point one|Point two|Point three\"\n *\n * V3: tightened headline letter-spacing 0.02em → 0.01em.\n * V2: added `showEyebrow` toggle.\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight fit-content\n * @framerIntrinsicWidth 720\n * @framerIntrinsicHeight 200\n */export default function SectionHeader(props){const{showEyebrow,eyebrow,headline,body,bullets,bulletStyle,bulletColumns,align,onDark,headlineLevel,maxWidth,accentColor,style}=props;const accentUnset=isAccentUnset(accentColor);const eyebrowColor=accentUnset?onDark?ELECTRIC:TEAL_11_LIGHT:accentColor;// V6: bullet dots now follow the same on-dark / on-light fallback as the\n// eyebrow. Previously bullets always defaulted to Electric which is too\n// pale on white. On light backgrounds bullets now use the darker Teal 11.\nconst accentForBullet=accentUnset?onDark?ELECTRIC:TEAL_11_LIGHT:accentColor;const headlineColor=onDark?WHITE:JUNGLE;const bodyColor=onDark?\"rgba(255,255,255,0.80)\":\"rgba(10,20,22,0.65)\";const itemsAlign=align===\"center\"?\"center\":\"flex-start\";const textAlign=align===\"center\"?\"center\":\"left\";const maxW=maxWidth?`${maxWidth}px`:undefined;const eyebrowVisible=showEyebrow&&Boolean(eyebrow);const bulletList=(bullets||\"\").split(\"|\").map(b=>b.trim()).filter(Boolean);const eyebrowStyle={fontFamily:\"'Barlow Condensed','Barlow',sans-serif\",fontWeight:700,fontSize:\"20px\",lineHeight:\"1.4em\",letterSpacing:\"0.08em\",textTransform:\"uppercase\",color:eyebrowColor,margin:0,textAlign,maxWidth:maxW};const headlineSize=HEADLINE_SIZES[headlineLevel||\"h2\"]||HEADLINE_SIZES.h2;const headlineStyle={fontFamily:\"'Barlow Condensed','Barlow',sans-serif\",fontWeight:800,fontSize:headlineSize.fontSize,lineHeight:headlineSize.lineHeight,letterSpacing:\"0.01em\",color:headlineColor,margin:0,textAlign,maxWidth:maxW,...{textWrap:\"balance\"}};const bodyStyle={fontFamily:\"'Source Sans 3',sans-serif\",fontSize:\"18px\",lineHeight:1.55,color:bodyColor,margin:0,textAlign,maxWidth:maxW};const renderHeadline=()=>{if(!headline)return null;if(headlineLevel===\"h1\")return /*#__PURE__*/_jsx(\"h1\",{style:headlineStyle,children:headline});if(headlineLevel===\"h3\")return /*#__PURE__*/_jsx(\"h3\",{style:headlineStyle,children:headline});return /*#__PURE__*/_jsx(\"h2\",{style:headlineStyle,children:headline});};const hasHeaderRow=eyebrowVisible||Boolean(headline);const hasBullets=bulletList.length>0;// — Bullets rendering ————————————————————————————————————————\nconst bulletTextColor=onDark?WHITE:JUNGLE;const renderBullets=()=>{if(!hasBullets)return null;if(bulletStyle===\"tags\"){const tagStyle={display:\"inline-flex\",alignItems:\"center\",padding:\"8px 14px\",borderRadius:\"9999px\",background:onDark?\"rgba(255, 255, 255, 0.06)\":\"rgba(14, 43, 46, 0.05)\",border:`1px solid ${onDark?\"rgba(255, 255, 255, 0.16)\":\"rgba(14, 43, 46, 0.12)\"}`,color:bulletTextColor,fontFamily:\"'Source Sans 3', sans-serif\",fontWeight:500,fontSize:\"15px\",lineHeight:1.2,whiteSpace:\"nowrap\"};return /*#__PURE__*/_jsx(\"div\",{style:{display:\"flex\",flexWrap:\"wrap\",gap:\"10px\",maxWidth:maxW,justifyContent:align===\"center\"?\"center\":\"flex-start\"},children:bulletList.map((b,i)=>/*#__PURE__*/_jsx(\"span\",{style:tagStyle,children:b},i))});}// Default: list style with accent bullet glyph.\nconst itemStyle={display:\"flex\",alignItems:\"flex-start\",gap:\"14px\",fontFamily:\"'Source Sans 3', sans-serif\",fontSize:\"17px\",lineHeight:1.55,color:bulletTextColor,textAlign};const dotStyle={display:\"inline-block\",width:\"8px\",height:\"8px\",borderRadius:\"9999px\",background:accentForBullet,marginTop:\"8px\",flexShrink:0};// V8: when bulletColumns === 2, render as a 2-column CSS grid so a\n// 4-6 item list takes up roughly half the vertical space. Falls back\n// to a single-column flex stack (the original behaviour) for 1.\nconst useTwoCols=bulletColumns===2;const listBaseStyle={listStyle:\"none\",padding:0,margin:0,width:\"100%\",maxWidth:maxW,alignItems:useTwoCols?undefined:itemsAlign};const listStyle=useTwoCols?{...listBaseStyle,display:\"grid\",gridTemplateColumns:\"repeat(2, minmax(0, 1fr))\",columnGap:\"32px\",rowGap:\"10px\"}:{...listBaseStyle,display:\"flex\",flexDirection:\"column\",gap:\"10px\"};// In single-column mode each item carried its own maxWidth so very\n// long bullets wouldn't overrun. In two-column mode the grid track\n// already constrains width, so we drop the per-item maxWidth.\nconst itemStyleResolved=useTwoCols?{...itemStyle}:{...itemStyle,maxWidth:maxW};return /*#__PURE__*/_jsx(\"ul\",{style:listStyle,children:bulletList.map((b,i)=>/*#__PURE__*/_jsxs(\"li\",{style:itemStyleResolved,children:[/*#__PURE__*/_jsx(\"span\",{style:dotStyle,\"aria-hidden\":\"true\"}),/*#__PURE__*/_jsx(\"span\",{children:b})]},i))});};return /*#__PURE__*/_jsxs(\"div\",{style:{display:\"flex\",flexDirection:\"column\",gap:\"20px\",alignItems:itemsAlign,width:\"100%\",...style},children:[hasHeaderRow&&/*#__PURE__*/_jsxs(\"div\",{style:{display:\"flex\",flexDirection:\"column\",gap:\"10px\",alignItems:itemsAlign,width:\"100%\"},children:[eyebrowVisible&&/*#__PURE__*/_jsx(\"div\",{style:eyebrowStyle,children:eyebrow}),renderHeadline()]}),body&&/*#__PURE__*/_jsx(\"p\",{style:bodyStyle,children:body}),hasBullets&&renderBullets()]});}addPropertyControls(SectionHeader,{showEyebrow:{type:ControlType.Boolean,title:\"Show eyebrow\",defaultValue:true,description:\"Toggle the eyebrow line on/off. When off the eyebrow row is skipped even if the string has content.\"},eyebrow:{type:ControlType.String,title:\"Eyebrow\",defaultValue:\"\"},headline:{type:ControlType.String,title:\"Headline\",defaultValue:\"Section headline\",displayTextArea:true},body:{type:ControlType.String,title:\"Body\",defaultValue:\"\",displayTextArea:true},bullets:{type:ControlType.String,title:\"Bullets\",defaultValue:\"\",displayTextArea:true,description:\"Pipe-separated list, e.g. 'Point one | Point two | Point three'. Rendered below the body. Leave blank to hide.\"},bulletStyle:{type:ControlType.Enum,title:\"Bullet style\",options:[\"list\",\"tags\"],optionTitles:[\"List (accent dot + text)\",\"Tags (rounded pills)\"],defaultValue:\"list\",displaySegmentedControl:true},bulletColumns:{type:ControlType.Enum,title:\"Bullet columns\",options:[1,2],optionTitles:[\"One\",\"Two\"],defaultValue:1,displaySegmentedControl:true,description:\"Two-column grid for list-style bullets. Useful when there are 4–6 bullets and you want the block to take less vertical space so the next section fits on screen.\"},align:{type:ControlType.Enum,title:\"Align\",options:[\"left\",\"center\"],optionTitles:[\"Left\",\"Center\"],defaultValue:\"left\",displaySegmentedControl:true},onDark:{type:ControlType.Boolean,title:\"On Dark\",defaultValue:false},headlineLevel:{type:ControlType.Enum,title:\"Headline level\",options:[\"h1\",\"h2\",\"h3\"],optionTitles:[\"H1 (48px)\",\"H2 (40px)\",\"H3 (24px)\"],defaultValue:\"h2\"},maxWidth:{type:ControlType.Number,title:\"Max width\",defaultValue:900,min:320,max:1400,step:10,unit:\"px\"},accentColor:{type:ControlType.Color,title:\"Eyebrow / bullet accent (custom)\",defaultValue:\"\",description:\"Optional override. Leave blank (or black) to auto-derive from On Dark — Electric green on dark, Teal 11 on light.\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"SectionHeader\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"fit-content\",\"framerContractVersion\":\"1\",\"framerIntrinsicWidth\":\"720\",\"framerIntrinsicHeight\":\"200\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./SectionHeader.map"],"mappings":"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"}