{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/KHhKHHrKFDZMbKcGhQ69/am3Dz6iumEU2n90AjXoQ/textWithHighlight_1.js"],
  "sourcesContent": ["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useRef,useEffect,useState}from\"react\";import{addPropertyControls,ControlType}from\"framer\";export function TextWithHighlight(props){const{text,titleColor,font,Align,highlightColor,highlightTextColor,highlightAnimation,animationDelay,highlightStyle,tag}=props;const{fontSize,lineHeight,fontWeight,fontFamily,fontStyle,letterSpacing}=font||{fontSize:14,lineHeight:\"1.5em\",fontWeight:\"bold\",fontFamily:\"Circular\",fontStyle:\"normal\",letterSpacing:\"0em\"};const sharedTextStyle={color:titleColor,fontWeight,fontSize,fontFamily,fontStyle,letterSpacing,lineHeight,display:\"inline\"};const Tag=tag||\"div\";const ref=useRef(null);const[inView,setInView]=useState(false);useEffect(()=>{const observer=new IntersectionObserver(([entry])=>{if(entry.isIntersecting)setInView(true);},{threshold:.5});if(ref.current)observer.observe(ref.current);return()=>{if(ref.current)observer.unobserve(ref.current);};},[]);const getHighlightStyle=()=>{switch(highlightStyle){case\"underline\":return{textDecoration:`underline`,textDecorationColor:highlightColor,textDecorationThickness:\"4px\",textUnderlineOffset:\"0.2em\"};case\"half\":return{background:`linear-gradient(transparent 60%, ${highlightColor} 60%)`,borderRadius:2};case\"outline\":return{boxShadow:`inset 0 0 0 2px ${highlightColor}`,borderRadius:4,padding:\"0 4px\"};default:return{};}};const getAnimation=()=>{if(!inView||highlightAnimation===\"none\")return{};const delay=`${animationDelay}s`;switch(highlightAnimation){case\"fade\":return{opacity:0,animation:`fadeIn 0.6s ${delay} forwards`};case\"slide\":return{transform:\"translateY(10px)\",opacity:0,animation:`slideUp 0.5s ${delay} forwards`};case\"scale\":return{transform:\"scale(0.8)\",opacity:0,animation:`scaleIn 0.4s ${delay} forwards`};default:return{};}};const renderTextWithHighlight=segment=>{const regex=/~(.*?)~/g;const elements=[];let lastIndex=0;let match;let index=0;while((match=regex.exec(segment))!==null){const start=match.index;const end=regex.lastIndex;if(start>lastIndex){elements.push(/*#__PURE__*/_jsx(\"span\",{style:sharedTextStyle,children:segment.slice(lastIndex,start)},`plain-${index++}`));}const baseStyles={...sharedTextStyle,...getHighlightStyle(),color:highlightTextColor||titleColor};const highlightAnimatedStyle=highlightStyle===\"solid\"&&inView?{backgroundImage:`linear-gradient(to right, ${highlightColor} 100%)`,backgroundSize:\"0% 100%\",backgroundRepeat:\"no-repeat\",animation:\"highlightWipe 1s forwards\",padding:\"0.05em 0.2em\",borderRadius:4,color:highlightTextColor||titleColor}:{};elements.push(/*#__PURE__*/_jsx(\"span\",{style:{...baseStyles,...highlightStyle===\"solid\"?highlightAnimatedStyle:getAnimation()},children:match[1]},`highlight-${index++}`));lastIndex=end;}if(lastIndex<segment.length){elements.push(/*#__PURE__*/_jsx(\"span\",{style:sharedTextStyle,children:segment.slice(lastIndex)},`last-${index++}`));}return elements;};return /*#__PURE__*/_jsx(\"div\",{ref:ref,style:{width:\"100%\",textAlign:Align},children:/*#__PURE__*/_jsxs(Tag,{style:sharedTextStyle,children:[/*#__PURE__*/_jsx(\"style\",{children:`\n                    @keyframes fadeIn {\n                        from { opacity: 0; }\n                        to { opacity: 1; }\n                    }\n                    @keyframes slideUp {\n                        from { transform: translateY(10px); opacity: 0; }\n                        to { transform: translateY(0); opacity: 1; }\n                    }\n                    @keyframes scaleIn {\n                        from { transform: scale(0.8); opacity: 0; }\n                        to { transform: scale(1); opacity: 1; }\n                    }\n                    @keyframes highlightWipe {\n                        from { background-size: 0% 100%; }\n                        to { background-size: 100% 100%; }\n                    }\n                `}),renderTextWithHighlight(text||\"\")]})});}addPropertyControls(TextWithHighlight,{text:{type:ControlType.String,title:\"Text\",defaultValue:\"This is ~highlighted~ text and ~more~\"},font:{//@ts-ignore\ntype:ControlType.Font,controls:\"extended\",displayFontSize:true,displayTextAlignment:false,defaultFontType:\"monospace\",defaultValue:{fontSize:50,lineHeight:\"1.2em\"}},titleColor:{type:ControlType.Color,title:\"Text Color\",defaultValue:\"#2B2B2B\"},highlightColor:{type:ControlType.Color,title:\"Highlight Background Color\",defaultValue:\"#FFD740\"},highlightTextColor:{type:ControlType.Color,title:\"Highlight Text Color\",defaultValue:\"#000000\"},highlightAnimation:{type:ControlType.Enum,title:\"Animation\",options:[\"none\",\"fade\",\"slide\",\"scale\"],optionTitles:[\"None\",\"Fade In\",\"Slide Up\",\"Scale\"],defaultValue:\"none\"},animationDelay:{type:ControlType.Number,title:\"Delay (s)\",min:0,max:5,defaultValue:0,step:.1,unit:\"s\"},Align:{type:ControlType.Enum,title:\"Align\",options:[\"left\",\"center\",\"right\"],optionTitles:[\"Left\",\"Center\",\"Right\"],defaultValue:\"left\"},highlightStyle:{type:ControlType.Enum,title:\"Style\",options:[\"solid\",\"underline\",\"half\",\"outline\"],optionTitles:[\"Solid\",\"Underline\",\"Half BG\",\"Outline\"],defaultValue:\"solid\"},tag:{type:ControlType.Enum,title:\"SEO Tag\",options:[\"h1\",\"h2\",\"h3\",\"p\",\"div\",\"span\"],optionTitles:[\"H1\",\"H2\",\"H3\",\"Paragraph\",\"Div\",\"Span\"],defaultValue:\"h1\"}});export default TextWithHighlight;\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"TextWithHighlight\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"TextWithHighlight\":{\"type\":\"reactComponent\",\"name\":\"TextWithHighlight\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./textWithHighlight_1.map"],
  "mappings": "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",
  "names": ["TextWithHighlight", "props", "text", "titleColor", "font", "Align", "highlightColor", "highlightTextColor", "highlightAnimation", "animationDelay", "highlightStyle", "tag", "fontSize", "lineHeight", "fontWeight", "fontFamily", "fontStyle", "letterSpacing", "sharedTextStyle", "Tag", "ref", "pe", "inView", "setInView", "ye", "ue", "observer", "entry", "getHighlightStyle", "getAnimation", "delay", "p", "u", "segment", "regex", "elements", "lastIndex", "match", "index", "start", "end", "baseStyles", "highlightAnimatedStyle", "addPropertyControls", "ControlType", "textWithHighlight_1_default"]
}
