{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/6YG9xkpOc9WpH269TQeK/8QMqJvasXMadBWsOhEaX/ThemeImage.js"],
  "sourcesContent": ["import{jsx as _jsx}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{useState,useEffect}from\"react\";/**\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */export default function ThemeImage(props){const[isDarkTheme,setIsDarkTheme]=useState(null);useEffect(()=>{const updateTheme=()=>{// For compatibility with the theme toggle component.\n// If your site does not have a theme toggle, the device theme will be used.\nconst currentToggleState=localStorage.getItem(\"currentToggleState\");// If the toggle theme was found in local storage, use it.\nif(currentToggleState!==null){setIsDarkTheme(currentToggleState===\"dark\");}else{// If the theme toggle was not found in local storage, use the device theme.\nconst mediaQuery=window.matchMedia(\"(prefers-color-scheme: dark)\");setIsDarkTheme(mediaQuery.matches);}};// Event listener for changes in the device theme\nconst osThemeChange=e=>{setIsDarkTheme(e.matches);};// Update the theme when the page loads\nupdateTheme();// Listen for theme changes made by the theme toggle component\nwindow.addEventListener(\"themeChange\",updateTheme);// Listen for changes in the device theme\nconst mediaQuery=window.matchMedia(\"(prefers-color-scheme: dark)\");mediaQuery.addListener(osThemeChange);// Clean up the event listeners when the theme toggle component unmounts\nreturn()=>{window.removeEventListener(\"themeChange\",updateTheme);mediaQuery.removeListener(osThemeChange);};},[]);// Before the theme has been determined, render nothing.\n// This prevents flashing while the page loads.\nif(isDarkTheme===null){return null;}// Once the theme is determined, render the image corresponding to the theme.\nconst imageSrc=isDarkTheme?props.dark:props.light;return /*#__PURE__*/_jsx(\"img\",{src:imageSrc?imageSrc.src:\"\",alt:imageSrc?imageSrc.alt:\"\",style:{width:\"100%\",height:\"100%\",objectFit:props.sizing,borderRadius:props.radiusIsMixed?`${props.topLeft}px ${props.topRight}px ${props.bottomRight}px ${props.bottomLeft}px`:`${props.radius}px`}});}ThemeImage.displayName=\"Theme Image\";addPropertyControls(ThemeImage,{light:{type:ControlType.ResponsiveImage},dark:{type:ControlType.ResponsiveImage},sizing:{type:ControlType.Enum,defaultValue:\"cover\",options:[\"cover\",\"contain\",\"fill\"],optionTitles:[\"Fill\",\"Fit\",\"Stretch\"]},radius:{type:ControlType.FusedNumber,defaultValue:0,toggleKey:\"radiusIsMixed\",toggleTitles:[\"All\",\"Individual\"],valueKeys:[\"topLeft\",\"topRight\",\"bottomRight\",\"bottomLeft\"],valueLabels:[\"TL\",\"TR\",\"BR\",\"BL\"],min:0,description:\"*Note:* Theming may not work properly on the canvas or preview.\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ThemeImage\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutWidth\":\"fixed\",\"framerSupportedLayoutHeight\":\"fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ThemeImage.map"],
  "mappings": "4JAAAA,IAGkB,SAARC,EAA4BC,EAAM,CAAC,GAAK,CAACC,EAAYC,CAAc,EAAEC,EAAS,IAAI,EAW5F,GAX8FC,EAAU,IAAI,CAAC,IAAMC,EAAY,IAAI,CAEnI,IAAMC,EAAmB,aAAa,QAAQ,oBAAoB,EAClE,GAAGA,IAAqB,KAAMJ,EAAeI,IAAqB,MAAM,MAAO,CAC/E,IAAMC,EAAW,OAAO,WAAW,8BAA8B,EAAEL,EAAeK,EAAW,OAAO,EAAG,EACjGC,EAAcC,GAAG,CAACP,EAAeO,EAAE,OAAO,CAAE,EAClDJ,EAAY,EACZ,OAAO,iBAAiB,cAAcA,CAAW,EACjD,IAAME,EAAW,OAAO,WAAW,8BAA8B,EAAE,OAAAA,EAAW,YAAYC,CAAa,EACjG,IAAI,CAAC,OAAO,oBAAoB,cAAcH,CAAW,EAAEE,EAAW,eAAeC,CAAa,CAAE,CAAE,EAAE,CAAC,CAAC,EAE7GP,IAAc,KAAM,OAAO,KAC9B,IAAMS,EAAST,EAAYD,EAAM,KAAKA,EAAM,MAAM,OAAoBW,EAAK,MAAM,CAAC,IAAID,EAASA,EAAS,IAAI,GAAG,IAAIA,EAASA,EAAS,IAAI,GAAG,MAAM,CAAC,MAAM,OAAO,OAAO,OAAO,UAAUV,EAAM,OAAO,aAAaA,EAAM,cAAc,GAAGA,EAAM,aAAaA,EAAM,cAAcA,EAAM,iBAAiBA,EAAM,eAAe,GAAGA,EAAM,UAAU,CAAC,CAAC,CAAE,CAACD,EAAW,YAAY,cAAca,EAAoBb,EAAW,CAAC,MAAM,CAAC,KAAKc,EAAY,eAAe,EAAE,KAAK,CAAC,KAAKA,EAAY,eAAe,EAAE,OAAO,CAAC,KAAKA,EAAY,KAAK,aAAa,QAAQ,QAAQ,CAAC,QAAQ,UAAU,MAAM,EAAE,aAAa,CAAC,OAAO,MAAM,SAAS,CAAC,EAAE,OAAO,CAAC,KAAKA,EAAY,YAAY,aAAa,EAAE,UAAU,gBAAgB,aAAa,CAAC,MAAM,YAAY,EAAE,UAAU,CAAC,UAAU,WAAW,cAAc,YAAY,EAAE,YAAY,CAAC,KAAK,KAAK,KAAK,IAAI,EAAE,IAAI,EAAE,YAAY,iEAAiE,CAAC,CAAC",
  "names": ["init_ssg_sandbox_shims", "ThemeImage", "props", "isDarkTheme", "setIsDarkTheme", "ye", "ue", "updateTheme", "currentToggleState", "mediaQuery", "osThemeChange", "e", "imageSrc", "p", "addPropertyControls", "ControlType"]
}
