import{template as e,RenderIf as t,isLocalEnv as s,baseAssetURL as i}from"@gem-sdk/core";import r from"../../text/components/Text.liquid.js";import{getInsertLinkData as o,getSettingPreloadData as l}from"../../helpers.js";import{createStateOrContext as d,createStyle as a,createClass as n,createAttr as c,If as u}from"@gem-sdk/system";import{getAttr as m,getAttrHref as p}from"../common/attrs.js";import{getDateStyle as $,getTextFrontStyle as y,getTextBackStyle as f,getWrapperStyle as g,getContainStyle as x}from"../common/styles.js";import{getTextFrontClasses as w,getWrapperClasses as b,getContentClasses as h,getLinkClasses as v,getDateClasses as j,getTextBackClasses as k}from"../common/classes.js";import{Countdown as S}from"../settings/configs/translate.js";let L=L=>{let{setting:A,styles:C,builderProps:E,advanced:N,pageContext:F}=L,{labelTypo:I,numTypo:P,numTypography:q,labelTypography:G,enableLabelTextStyle:O}=C??{},{weekLabel:T,dayLabel:V,hourLabel:_,minuteLabel:J,secondLabel:M,enableWeek:R,enableDay:z,enableHour:B,enableMinute:D,enableSecond:H,redirectUrl:K,autoHideWhenTimeout:Q}=A??{},U=!!K?.link,{urlData:W}=o("",K),X=d({...A,...E}),Y=a({...$(C)}),Z=e=>n({...j(e)}),ee=n({...w(C)}),et=a({...y(C)}),es=a({...f(C)}),ei=e=>n({...k(C,e)}),er=c({...m({uid:E?.uid||""})}),eo=c({...p({uid:W.href||""})}),el=a({...g(C)}),ed=n({...b(N?.cssClass)}),ea=n({...h({isLiquid:!0,autoHideWhenTimeout:Q})}),en=a({...x(C)}),ec=(t,s,i)=>{let o=i&&i in S?S[i]?.id:void 0;return e`
    <div style="${Y}" class="${Z(s)}">
    ${r({styles:{typography:q,typo:P},setting:{...A,text:"00",excludeFlex:!0,isForceValue:!0},style:et,className:ee,builderAttrs:{id:t},builderProps:{...E,uid:E?.uid,uidInteraction:`${E?.uid}-text`}})}
    ${u(!!O,e`
         ${r({styles:{typography:G,typo:I},setting:{...A,text:s,excludeFlex:!0},translateSetting:o,style:es,className:ei(s),builderProps:{...E,uid:E?.uid,uidInteraction:`${E?.uid}-text`},pageContext:F})}
    `)}
    </div>
    `},eu=n({...v()});return e`
    <gp-countdown-timer
        ${{...er}}
        ${{...eo}}
        class="${ed}"
        style="${el}"
        gp-data='${JSON.stringify(X).replaceAll("'","&#039;")}'>
        <div id="section-countdown" class="${ea}" style="${en}">
        ${u(U,`<a
            href="${W.href}"
            target="${W?.target}"
            aria-label="Countdown link"
            class="${eu}"
          > </a>`)}
          ${u(R,ec("week",T,"weekLabel"))}
          ${u(z,ec("day",V,"dayLabel"))}
          ${u(B,ec("hour",_,"hourLabel"))}
          ${u(D,ec("minute",J,"minuteLabel"))}
          ${u(H,ec("second",M,"secondLabel"))}
      </div>
     </gp-countdown-timer>
    ${t(s,`<script ${l('class="gps-link" delay',"src")}="{{ 'gp-countdown-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${l('class="gps-link" delay',"src")}="${i}/assets-v2/gp-countdown-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
  `};export{L as default};
