{"version":3,"file":"TextWithColor.Cy_1GOAn.mjs","names":["useRef","__legacyOverrideHOC_DataObserverContext","_jsx","__esmMin","init_npm_react_18_3_1","oe","de","init_jsx_runtime","c","ce","init_framer_BWFVvmND","DataObserverContext","useItalicAsColor","ref","el","paint","color","mo","useItalicAsDimOpacity","italicSelector","nodes","desiredOpacity","opacity","italicAncestor","n","ItalicAsDim","ItalicAsTeal","withItalicAsDimLight","withuseItalicAsColor","C","props","withItalicAsDim","withItalicAsTeal","withwithItalicAsDimLight","init_TextWithColor"],"sources":["https:/framerusercontent.com/modules/A0WdNaKaswaOLEpXytlI/BYu8iY7Dw7ClDblas5H7/TextWithColor.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useRef}from\"react\";/**\n * Apply this override to a *Text* (rich text) layer in Framer.\n * Any text that is formatted as *italic* will render with a custom color\n * **and** be forced to normal (non-italic) style.\n *\n * Two presets are exported:\n *  - ItalicAsDim → rgba(255, 255, 255, 0.45)\n *  - ItalicAsTeal → #79ABAB\n *\n * Usage: Select your text layer → Add Override → choose one of the exports below.\n */function useItalicAsColor(color){const ref=useRef(null);useEffect(()=>{if(!ref.current)return;const el=ref.current;const paint=()=>{const nodes=el.querySelectorAll(// Italic usually becomes <em> or <i> from Framer rich text\n'em, i, [style*=\"italic\"]');nodes.forEach(n=>{// Force non-italic and set the requested color\nn.style.fontStyle=\"normal\";n.style.color=color;// Avoid inherited opacity dimming the color unintentionally\nn.style.opacity=\"\"// reset if any inline opacity came through\n;});};// Initial run\npaint();// Re-run whenever content changes (e.g., edits, animations)\nconst mo=new MutationObserver(()=>paint());mo.observe(el,{subtree:true,childList:true,characterData:true,attributes:true,attributeFilter:[\"style\",\"class\"]});return()=>mo.disconnect();},[color]);// Attach a ref so we can reach the rendered DOM of the text layer\nreturn{ref};}function useItalicAsDimOpacity(opacity){const ref=useRef(null);useEffect(()=>{if(!ref.current)return;const el=ref.current;const paint=()=>{const italicSelector=// Italic usually becomes <em> or <i> from Framer rich text\n'em, i, [style*=\"italic\"]';const nodes=el.querySelectorAll(italicSelector);const desiredOpacity=`${opacity}`;nodes.forEach(n=>{// Avoid compounding opacity on nested italic elements:\n// only process the outermost matched italic node.\nconst italicAncestor=n.parentElement?.closest(italicSelector);if(italicAncestor&&el.contains(italicAncestor))return;// Match existing behavior: remove italic style\nif(n.style.fontStyle!==\"normal\"){n.style.fontStyle=\"normal\";}// Preserve inherited text color for light backgrounds\nif(n.style.color!==\"\"){n.style.color=\"\";}// Dim only italic-marked text\nif(n.style.opacity!==desiredOpacity){n.style.opacity=desiredOpacity;}});};// Initial run\npaint();// Re-run whenever content changes (e.g., edits, animations)\nconst mo=new MutationObserver(()=>paint());mo.observe(el,{subtree:true,childList:true,characterData:true,attributes:true,attributeFilter:[\"style\",\"class\"]});return()=>mo.disconnect();},[opacity]);// Attach a ref so we can reach the rendered DOM of the text layer\nreturn{ref};}/** Dim preset: render italics as #fff @ 40% */export function ItalicAsDim(){return useItalicAsColor(\"rgba(255, 255, 255, 0.4)\");}/** Teal preset: render italics as #79ABAB */export function ItalicAsTeal(){return useItalicAsColor(\"#8AD1D1\");}/** Light-background preset: preserve color and dim italics to 45% opacity */export function withItalicAsDimLight(){return useItalicAsDimOpacity(.45);}import{useContext as __legacyOverrideHOC_useContext}from\"react\";import{DataObserverContext as __legacyOverrideHOC_DataObserverContext}from\"framer\";export function withuseItalicAsColor(C){return props=>{__legacyOverrideHOC_useContext(__legacyOverrideHOC_DataObserverContext);return _jsx(C,{...props,...useItalicAsColor(props)});};}withuseItalicAsColor.displayName=\"useItalicAsColor\";export function withuseItalicAsDimOpacity(C){return props=>{__legacyOverrideHOC_useContext(__legacyOverrideHOC_DataObserverContext);return _jsx(C,{...props,...useItalicAsDimOpacity(props)});};}withuseItalicAsDimOpacity.displayName=\"useItalicAsDimOpacity\";export function withItalicAsDim(C){return props=>{__legacyOverrideHOC_useContext(__legacyOverrideHOC_DataObserverContext);return _jsx(C,{...props,...ItalicAsDim(props)});};}withItalicAsDim.displayName=\"ItalicAsDim\";export function withItalicAsTeal(C){return props=>{__legacyOverrideHOC_useContext(__legacyOverrideHOC_DataObserverContext);return _jsx(C,{...props,...ItalicAsTeal(props)});};}withItalicAsTeal.displayName=\"ItalicAsTeal\";export function withwithItalicAsDimLight(C){return props=>{__legacyOverrideHOC_useContext(__legacyOverrideHOC_DataObserverContext);return _jsx(C,{...props,...withItalicAsDimLight(props)});};}withwithItalicAsDimLight.displayName=\"withItalicAsDimLight\";\nexport const __FramerMetadata__ = {\"exports\":{\"withItalicAsDim\":{\"type\":\"reactHoc\",\"name\":\"withItalicAsDim\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"withItalicAsTeal\":{\"type\":\"reactHoc\",\"name\":\"withItalicAsTeal\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"ItalicAsTeal\":{\"type\":\"override\",\"name\":\"ItalicAsTeal\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"withItalicAsDimLight\":{\"type\":\"override\",\"name\":\"withItalicAsDimLight\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"withwithItalicAsDimLight\":{\"type\":\"reactHoc\",\"name\":\"withwithItalicAsDimLight\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"withuseItalicAsDimOpacity\":{\"type\":\"reactHoc\",\"name\":\"withuseItalicAsDimOpacity\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"ItalicAsDim\":{\"type\":\"override\",\"name\":\"ItalicAsDim\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"withuseItalicAsColor\":{\"type\":\"reactHoc\",\"name\":\"withuseItalicAsColor\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./TextWithColor.map"],"mappings":"A,kLAUG,SAASY,EAAiB,EAAM,CAAC,IAAMC,EAAIb,EAAO,IAAI,EAOzD,OAP2DS,MAAc,CAAC,GAAG,CAACI,EAAI,QAAQ,OAAO,IAAMC,EAAGD,EAAI,QAAcE,MAAU,CAC1GD,EAD0H,iBACtJ,0BAAgC,CAAC,CAAC,QAAQ,GAAG,CAC7C,EAAE,MAAM,UAAU,SAAS,EAAE,MAAM,MAAME,EACzC,EAAE,MAAM,QAAQ,EACf,CAAC,CAAE,EACJD,EAAM,EACN,IAAME,EAAG,IAAI,qBAAqBF,EAAM,CAAC,EAAoH,OAAlHE,EAAG,QAAQH,EAAG,CAAC,QAAQ,GAAK,UAAU,GAAK,cAAc,GAAK,WAAW,GAAK,gBAAgB,CAAC,QAAQ,OAAO,CAAC,CAAC,MAAYG,EAAG,WAAW,CAAE,EAAE,CAACD,CAAK,CAAC,EAC1L,CAAC,KAAG,CAAE,CAAC,SAASE,EAAsB,EAAQ,CAAC,IAAML,EAAIb,EAAO,IAAI,EAS1E,OAT4ES,MAAc,CAAC,GAAG,CAACI,EAAI,QAAQ,OAAO,IAAMC,EAAGD,EAAI,QAAcE,MAAU,CAAC,IAAMI,EAC9J,2BAAiCC,EAAMN,EAAG,iBAAiBK,CAAc,EAAQE,EAAe,GAAGC,IAAUF,EAAM,QAAQ,GAAG,CAE9H,IAAMG,EAAeC,EAAE,eAAe,QAAQL,CAAc,EAAKI,GAAgBT,EAAG,SAASS,CAAc,IACxGC,EAAE,MAAM,YAAY,WAAU,EAAE,MAAM,UAAU,UAChDA,EAAE,MAAM,QAAQ,KAAI,EAAE,MAAM,MAAM,IAClCA,EAAE,MAAM,UAAUH,IAAgB,EAAE,MAAM,QAAQA,GAAgB,CAAC,CAAE,EACxEN,EAAM,EACN,IAAME,EAAG,IAAI,qBAAqBF,EAAM,CAAC,EAAoH,OAAlHE,EAAG,QAAQH,EAAG,CAAC,QAAQ,GAAK,UAAU,GAAK,cAAc,GAAK,WAAW,GAAK,gBAAgB,CAAC,QAAQ,OAAO,CAAC,CAAC,MAAYG,EAAG,WAAW,CAAE,EAAE,CAACK,CAAO,CAAC,EAC5L,CAAC,KAAG,CAAE,CAAgD,SAAgBG,GAAa,CAAC,OAAOb,EAAiB,0BAA0B,CAAE,CAA8C,SAAgBc,GAAc,CAAC,OAAOd,EAAiB,SAAS,CAAE,CAA8E,SAAgBe,GAAsB,CAAC,OAAOT,EAAsB,GAAG,CAAE,CAAoJ,SAAgBU,EAAqB,EAAE,CAAC,MAAO,KAAQvB,EAA+BJ,CAAuC,EAASC,EAAK2B,EAAE,CAAC,GAAGC,EAAM,GAAGlB,EAAiBkB,CAAK,CAAC,CAAC,EAAI,CAAoT,SAAgBC,EAAgB,EAAE,CAAC,MAAO,KAAQ1B,EAA+BJ,CAAuC,EAASC,EAAK2B,EAAE,CAAC,GAAGC,EAAM,GAAGL,EAAYK,CAAK,CAAC,CAAC,EAAI,CAA2C,SAAgBE,EAAiB,EAAE,CAAC,MAAO,KAAQ3B,EAA+BJ,CAAuC,EAASC,EAAK2B,EAAE,CAAC,GAAGC,EAAM,GAAGJ,EAAaI,CAAK,CAAC,CAAC,EAAI,CAA6C,SAAgBG,EAAyB,EAAE,CAAC,MAAO,KAAQ5B,EAA+BJ,CAAuC,EAASC,EAAK2B,EAAE,CAAC,GAAGC,EAAM,GAAGH,EAAqBG,CAAK,CAAC,CAAC,EAAI,C,0CAAn6B,EAAqB,YAAY,mBAA+b,EAAgB,YAAY,cAA6L,EAAiB,YAAY,eAA8M,EAAyB,YAAY,sB"}