{"version":3,"file":"ThemeImage.CRxxNVfI.mjs","names":["mediaQuery","Image"],"sources":["https:/framerusercontent.com/modules/n9cR4gFLy0DjoxfkLrIe/eDj1MxSfupkYrrIeXQ6b/Shared.js","https:/framerusercontent.com/modules/oz8LbimHQqM5Ulxjy5PL/JMGT4igGLZGlSHtoVUMb/ThemeImage.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{ControlType}from\"framer\";import{motion}from\"framer-motion\";export const borderPropertyControl=(hidden=null)=>({type:ControlType.Object,optional:true,hidden,controls:{color:{type:ControlType.Color,defaultValue:\"#222\"},width:{type:ControlType.FusedNumber,defaultValue:1,toggleKey:\"widthIsMixed\",toggleTitles:[\"All\",\"Individual\"],valueKeys:[\"widthTop\",\"widthRight\",\"widthBottom\",\"widthLeft\"],valueLabels:[\"T\",\"R\",\"B\",\"L\"],min:0},style:{type:ControlType.Enum,defaultValue:\"solid\",options:[\"solid\",\"dashed\",\"dotted\",\"double\"],optionTitles:[\"Solid\",\"Dashed\",\"Dotted\",\"Double\"]}}});export function Border({width,widthIsMixed,widthTop,widthRight,widthBottom,widthLeft,style,color,transition}){return /*#__PURE__*/_jsx(motion.div,{animate:{borderColor:color},style:{position:\"absolute\",inset:0,borderWidth:widthIsMixed?`${widthTop}px ${widthRight}px ${widthBottom}px ${widthLeft}px`:`${width}px`,borderStyle:style,borderRadius:\"inherit\",pointerEvents:\"none\"},initial:false,transition:transition});}export function EmptyState({title,subtitle,maxWidth=0}){return /*#__PURE__*/_jsxs(\"div\",{style:{display:\"flex\",width:\"100%\",height:\"100%\",placeContent:\"center\",placeItems:\"center\",flexDirection:\"column\",gap:16,backgroundColor:\"rgba(136, 85, 255, 0.1)\",borderRadius:6,border:\"1px dashed rgb(136, 85, 255)\",color:\"rgb(136, 85, 255)\",fontSize:16,padding:20,minHeight:200,maxWidth:maxWidth||undefined},children:[/*#__PURE__*/_jsx(\"p\",{style:{margin:0,fontWeight:600,textAlign:\"center\"},children:title}),/*#__PURE__*/_jsx(\"p\",{style:{margin:0,opacity:.7,// maxWidth: 500,\nlineHeight:1.5,textAlign:\"center\"},children:subtitle})]});}EmptyState.displayName=\"Empty State\";\nexport const __FramerMetadata__ = {\"exports\":{\"borderPropertyControl\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"Border\":{\"type\":\"reactComponent\",\"name\":\"Border\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"EmptyState\":{\"type\":\"reactComponent\",\"name\":\"EmptyState\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Shared.map","import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType,Image}from\"framer\";import{useState,useEffect}from\"react\";import{EmptyState}from\"https://framerusercontent.com/modules/n9cR4gFLy0DjoxfkLrIe/eDj1MxSfupkYrrIeXQ6b/Shared.js\";import{borderPropertyControl,Border}from\"https://framerusercontent.com/modules/n9cR4gFLy0DjoxfkLrIe/eDj1MxSfupkYrrIeXQ6b/Shared.js\";const THEME_ATTRIBUTE=\"framestack-theme\";const SIGNAL_NAME=\"framestack-theme-changed\";/**\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */export default function ThemeImage(props){var _props_dark,_props_light;const[isDarkTheme,setIsDarkTheme]=useState(null);useEffect(()=>{const updateTheme=()=>{// For compatibility with the theme toggle component.\n// https://framestack.co/components/theme-toggle\n// If the site does not have a theme toggle, the device theme will be used.\nconst currentToggleState=document.body.getAttribute(THEME_ATTRIBUTE);// Check if page has the theme toggle attribute.\nif(!currentToggleState||currentToggleState==\"deviceTheme\"){if(document.body.hasAttribute(\"data-framer-theme\")){setIsDarkTheme(document.body.getAttribute(\"data-framer-theme\")==\"dark\");}else{const mediaQuery=window.matchMedia(\"(prefers-color-scheme: dark)\");setIsDarkTheme(mediaQuery.matches);}}else{// Use device theme\nsetIsDarkTheme(currentToggleState==\"dark\")// light or dark\n;}};// 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(SIGNAL_NAME,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(SIGNAL_NAME,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;}// Empty state\nif(!((_props_dark=props.dark)===null||_props_dark===void 0?void 0:_props_dark.src)||!((_props_light=props.light)===null||_props_light===void 0?void 0:_props_light.src)){return /*#__PURE__*/_jsx(EmptyState,{title:\"Add dark and light images.\",subtitle:\"Use the properties panel on the right side to upload images for dark and light theme.\"});}return /*#__PURE__*/_jsxs(\"div\",{style:{position:\"relative\",borderRadius:props.radiusIsMixed?`${props.topLeft}px ${props.topRight}px ${props.bottomRight}px ${props.bottomLeft}px`:`${props.radius}px`,boxShadow:props.shadows,...props.style},children:[/*#__PURE__*/_jsx(Image,{background:{fit:props.sizing,...isDarkTheme?props.dark:props.light},style:{borderRadius:\"inherit\",...props.style}}),/*#__PURE__*/_jsx(Border,{...props.border})]});}ThemeImage.displayName=\"Theme Image\";addPropertyControls(ThemeImage,{light:{type:ControlType.ResponsiveImage},dark:{type:ControlType.ResponsiveImage},sizing:{type:ControlType.Enum,defaultValue:\"cover\",options:[\"fill\",\"fit\",\"stretch\"],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},border:borderPropertyControl(),shadows:{type:ControlType.BoxShadow,description:\"*Note:* Theming may not work properly in the editor or preview.\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ThemeImage\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"fixed\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}"],"mappings":"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"}