{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/jJi6uNs7WZkDOr2yZPCV/9Dhe8xOCTDPaDWrSzent/Responsive_Image.js"],
  "sourcesContent": ["// Welcome to Code in Framer\n// Get Started: https://www.framer.com/developers\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{motion}from\"framer-motion\";/**\n * These annotations control how your component sizes\n * Learn more: https://www.framer.com/developers/#code-components-auto-sizing\n *\n * @framerSupportedLayoutWidth auto\n * @framerSupportedLayoutHeight auto\n *\n */export default function ResponsiveImage(props){const{style,radius,image,isMixed,topLeft,topRight,bottomRight,bottomLeft,children,type}=props;const borderRadius=isMixed?`${topLeft}px ${topRight}px ${bottomRight}px ${bottomLeft}px`:`${radius}px`;return /*#__PURE__*/_jsxs(\"div\",{style:{...containerStyle,borderRadius},children:[type===\"component\"&&children,type===\"image\"&&/*#__PURE__*/_jsx(motion.img,{style:{...squareStyle},src:(image===null||image===void 0?void 0:image.src)||\"https://images.unsplash.com/photo-1682687218147-9806132dc697?q=80&w=800&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDF8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\",srcSet:image===null||image===void 0?void 0:image.srcSet,alt:image===null||image===void 0?void 0:image.alt})]});}addPropertyControls(ResponsiveImage,{radius:{type:ControlType.FusedNumber,title:\"Radius\",defaultValue:0,toggleKey:\"isMixed\",toggleTitles:[\"All\",\"Individual\"],valueKeys:[\"topLeft\",\"topRight\",\"bottomRight\",\"bottomLeft\"],valueLabels:[\"TL\",\"TR\",\"BR\",\"BL\"],min:0},type:{type:ControlType.Enum,options:[\"image\",\"component\"],optionTitles:[\"Image\",\"Component\"],defaultValue:\"image\",displaySegmentedControl:true,segmentedControlDirection:\"vertical\"},children:{type:ControlType.ComponentInstance,hidden(props){return props.type===\"image\";}},image:{type:ControlType.ResponsiveImage,hidden(props){return props.type===\"component\";}}});const containerStyle={display:\"flex\",justifyContent:\"center\",alignItems:\"center\",overflow:\"hidden\"};const squareStyle={display:\"flex\",width:\"100%\",height:\"auto\"};\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ResponsiveImage\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutWidth\":\"auto\",\"framerSupportedLayoutHeight\":\"auto\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Responsive_Image.map"],
  "mappings": "qEASkB,SAARA,EAAiCC,EAAM,CAAC,GAAK,CAAC,MAAAC,EAAM,OAAAC,EAAO,MAAAC,EAAM,QAAAC,EAAQ,QAAAC,EAAQ,SAAAC,EAAS,YAAAC,EAAY,WAAAC,EAAW,SAAAC,EAAS,KAAAC,CAAI,EAAEV,EAAYW,EAAaP,EAAQ,GAAGC,CAAO,MAAMC,CAAQ,MAAMC,CAAW,MAAMC,CAAU,KAAK,GAAGN,CAAM,KAAK,OAAoBU,EAAM,MAAM,CAAC,MAAM,CAAC,GAAGC,EAAe,aAAAF,CAAY,EAAE,SAAS,CAACD,IAAO,aAAaD,EAASC,IAAO,SAAsBI,EAAKC,EAAO,IAAI,CAAC,MAAM,CAAC,GAAGC,CAAW,EAAE,IAAyCb,GAAM,KAAM,wKAAwK,OAA2CA,GAAM,OAAO,IAAwCA,GAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAE,CAACc,EAAoBlB,EAAgB,CAAC,OAAO,CAAC,KAAKmB,EAAY,YAAY,MAAM,SAAS,aAAa,EAAE,UAAU,UAAU,aAAa,CAAC,MAAM,YAAY,EAAE,UAAU,CAAC,UAAU,WAAW,cAAc,YAAY,EAAE,YAAY,CAAC,KAAK,KAAK,KAAK,IAAI,EAAE,IAAI,CAAC,EAAE,KAAK,CAAC,KAAKA,EAAY,KAAK,QAAQ,CAAC,QAAQ,WAAW,EAAE,aAAa,CAAC,QAAQ,WAAW,EAAE,aAAa,QAAQ,wBAAwB,GAAK,0BAA0B,UAAU,EAAE,SAAS,CAAC,KAAKA,EAAY,kBAAkB,OAAOlB,EAAM,CAAC,OAAOA,EAAM,OAAO,OAAQ,CAAC,EAAE,MAAM,CAAC,KAAKkB,EAAY,gBAAgB,OAAOlB,EAAM,CAAC,OAAOA,EAAM,OAAO,WAAY,CAAC,CAAC,CAAC,EAAE,IAAMa,EAAe,CAAC,QAAQ,OAAO,eAAe,SAAS,WAAW,SAAS,SAAS,QAAQ,EAAQG,EAAY,CAAC,QAAQ,OAAO,MAAM,OAAO,OAAO,MAAM",
  "names": ["ResponsiveImage", "props", "style", "radius", "image", "isMixed", "topLeft", "topRight", "bottomRight", "bottomLeft", "children", "type", "borderRadius", "u", "containerStyle", "p", "motion", "squareStyle", "addPropertyControls", "ControlType"]
}