import{makeStyleResponsive as s,template as e,RenderIf as t,isLocalEnv as i,baseAssetURL as r}from"@gem-sdk/core";import{getSettingPreloadData as a}from"../../helpers.js";import{createStyle as d,createClass as l,createStateOrContext as o}from"@gem-sdk/system";import{getContainerStyles as m,getContentStyles as p}from"../common/styles.js";import{getContainerClasses as c}from"../common/classes.js";let Sticky=({children:g,builderAttrs:$,setting:n,style:k,builderProps:f,advanced:y})=>{let{width:u,position:b,display:S,preloadBgImage:v,background:h,isScrollToTop:j}=n??{},E=y?.d,w=d({...s("w",u),...m({position:b,style:k,display:S})}),A=d(p({width:u,style:k,background:h})),C=l(c({uid:f?.uid,isScrollToTop:j,cssClass:y?.cssClass,isLiquid:!0})),G=o({uid:f?.uid,setting:{display:{desktop:S?.desktop,tablet:S?.tablet??S?.desktop,mobile:S?.mobile??S?.tablet??S?.desktop}},advanced:{d:E}}),N=`.drawer-page-content {
       transform: none !important;
      -webkit-transform: none !important;
  }`;return e`
    ${t(!!v,`${t(!!h?.desktop?.image?.src,`<link rel="preload" href="${h?.desktop?.image?.src}" as="image" />`)}${t(!!h?.tablet?.image?.src,`<link rel="preload" href="${h?.tablet?.image?.src}" as="image" />`)}${t(!!h?.mobile?.image?.src,`<link rel="preload" href="${h?.mobile?.image?.src}" as="image" />`)}`)}
    <gp-sticky
    data-id="${f?.uid}"
      gp-data='${JSON.stringify(G)}'
      id="${f?.uid}"
      data-id="${f?.uid}"
      class="${C} ${a("gps-lazy")}"
      style="${w}"
    >
      <style>${N}</style>
      <div ${{...$}} style="${{...A}}">
        ${g}
      </div>
    </gp-sticky>
    ${t(i,`<script ${a('class="gps-link" delay',"src")}="{{ 'gp-sticky-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${a('class="gps-link" delay',"src")}="${r}/assets-v2/gp-sticky-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
  `};export{Sticky as default};
