'use client';
import{jsx as e,Fragment as s,jsxs as r}from"react/jsx-runtime";import{FALLBACK_IMAGE as t,getAdaptiveImageData as m,IMAGE_PLACEHOLDER as a}from"../common/helpers.js";import{createAttr as o,createStyleReact as l,createStyle as c,createClass as i}from"@gem-sdk/system";import{getAdaptiveImageClasses as d}from"../common/classes.js";import{getAdaptivePictureStyles as p,getAdaptiveImageStyles as n}from"../common/styles.js";let f=f=>{let{alt:h,style:u,srcSet:g,layout:y,priority:x,className:j,aspectRatio:k,borderRadius:w,pictureClass:v,enableLazyLoadImage:z,...L}=f,{getDeviceSource:N}=m(f),{srcTablet:S,srcMobile:b}=N(),A=o({loading:x?"eager":"lazy",src:g?.desktop?.src||t}),I=l({...p()}),P=c({...n({layout:y,aspectRatio:k,borderRadius:w}),...u}),q=i({...d({className:j,hasLazyLoad:!x&&z})});return e(s,{children:r("picture",{style:I,className:v,children:[r(s,{children:[b&&e("source",{media:"(max-width: 767px)",srcSet:z?a:b}),S&&e("source",{media:"(max-width: 1024px)",srcSet:z?a:S})]}),e("img",{...L,...A,alt:h,width:"100%",style:P,className:q,draggable:"false"})]})})};f.defaultProps={layout:{desktop:"cover"}};export{f as default};
