import{template as o,RenderIf as r,isLocalEnv as e,baseAssetURL as s,WrapRenderChildren as t,RenderChildren as i}from"@gem-sdk/core";import a from"../arrow/Arrow.liquid.js";import l from"../dot/Dots.liquid.js";import{mappingNavigationCarousel as d}from"../arrow/common/helpers.js";import{getData as n}from"./common/helpers.js";import{getClass as p}from"./common/classes.js";import{getStyle as m}from"./common/styles.js";import{getAttr as c}from"./common/attrs.js";import{getSettingPreloadData as u,getStaticLocale as $}from"../../../helpers.js";let Carousel=f=>{let{children:v,builderAttrs:g,builderProps:w,styles:S,isHiddenArrowWhenDisabled:h=!0,hiddenDotWhenOnlyOne:C,rootId:y,rawChildren:j,conditionAppendJs:k}=f,z=d(f.setting),E={...f,setting:z},{arrowButtonSize:I,arrowBackgroundColor:A,arrowGapToEachSide:G="16",roundedArrow:P,arrowIconSize:T,arrowCustomColor:b,arrowBorder:q,arrowShadow:x,showWhenHover:B}=z??{},{uniqueComponentId:D,loopConfig:O,arrowShowConfig:W,stateData:_}=n(E),{rootClassRender:H,wrapperClassRender:M,wrapperInnerClass:N,sliderClass:R}=p(E),{rootStyleRender:U,wrapperStyleRender:V,wrapperInnerStyle:F,sliderStyle:J}=m(E),{rootAttrRender:K,sliderAttr:L}=c(E),Q=()=>r(e,`<script ${u('class="gps-link" delay',"src")}="{{ 'gp-carousel-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${u('class="gps-link" delay',"src")}="${s}/assets-v2/gp-carousel-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`),X=o=>{let r="next"===o;return a({uid:w?.uid,componentId:D,custom:z?.arrowCustom??"",showArrow:W,arrowButtonSize:I||{},arrowIconSize:T||{},arrowBackgroundColor:A??"",arrowCustomColor:b,gapToEachSize:G,showWhenHover:B,arrowBorder:q||{},arrowCorner:P||{},arrowShadow:x||{},left:!r,onClick:o=>{o.stopPropagation()},vertical:z?.vertical,isHiddenWhenDisabled:h,rootId:y})},Y=()=>o`
    ${j?.length?t({uid:w?.uid??"",customProps:j[0]?.customProps},j.map((r,e)=>{if(r)return o`${i({...r,index:e,parentSettings:z,parentStyle:S,background:z?.background,parentUid:w?.uid})}`})):v??`<div>${$("Carousel","no_slider")}</div>`}`;return o`
    <gp-carousel gp-data='${_}' ${K} style="${U}" class="${H}">
      <div
        ${g}
        class="${M}"
        style="${V}"
      >
        <div class="${N}" style="${F}">
          ${X("prev")}
          <div ${L} class="${R}" style="${J}">
            ${Y()}
          </div>
          ${X("next")}
        </div>
        ${l({loop:O,showDots:z?.dot,dotStyle:z?.dotStyle,dotGapToCarousel:z?.dotGapToCarousel,dotSize:z?.dotSize,vertical:z?.vertical,uniqueComponentId:D,hiddenWhenOnlyOne:C})}
      </div>
    </gp-carousel>
    ${k?`{% if ${k} %} ${Q()} {% endif %}`:Q()}

  `};export{Carousel as default};
