"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),Text_liquid=require("../../text/components/Text.liquid.js"),helpers=require("../../helpers.js"),system=require("@gem-sdk/system"),attrs=require("../common/attrs.js"),styles=require("../common/styles.js"),classes=require("../common/classes.js");const Countdown=e=>{let{setting:s,styles:t,builderProps:a,advanced:r,pageContext:l}=e,{labelTypo:c,numTypo:i,numTypography:y,labelTypography:o,enableLabelTextStyle:d}=t??{},{weekLabel:n,dayLabel:u,hourLabel:m,minuteLabel:p,secondLabel:g,enableWeek:$,enableDay:f,enableHour:x,enableMinute:C,enableSecond:S,redirectUrl:h,translate:k,autoHideWhenTimeout:q}=s??{},I=!!h?.link,{urlData:b}=helpers.getInsertLinkData("",h),v=system.createStateOrContext({...s,...a}),w=system.createStyle({...styles.getDateStyle(t)}),L=e=>system.createClass({...classes.getDateClasses(e)}),A=system.createClass({...classes.getTextFrontClasses(t)}),T=system.createStyle({...styles.getTextFrontStyle(t)}),j=system.createStyle({...styles.getTextBackStyle(t)}),_=e=>system.createClass({...classes.getTextBackClasses(t,e)}),P=system.createAttr({...attrs.getAttr({uid:a?.uid||""})}),D=system.createAttr({...attrs.getAttrHref({uid:b.href||""})}),E=system.createStyle({...styles.getWrapperStyle(t)}),F=system.createClass({...classes.getWrapperClasses(r?.cssClass)}),N=system.createClass({...classes.getContentClasses({isLiquid:!0,autoHideWhenTimeout:q})}),O=system.createStyle({...styles.getContainStyle(t)}),R=(e,t,r)=>core.template`
    <div style="${w}" class="${L(t)}">
    ${Text_liquid.default({styles:{typography:y,typo:i},setting:{...s,text:"00",excludeFlex:!0,translate:""},style:T,className:A,builderAttrs:{id:e},builderProps:{...a,uid:a?.uid,uidInteraction:`${a?.uid}-text`}})}
    ${system.If(!!d,core.template`
         ${Text_liquid.default({styles:{typography:o,typo:c},setting:{...s,text:t,excludeFlex:!0,translate:r},style:j,className:_(t),builderProps:{...a,uid:a?.uid,uidInteraction:`${a?.uid}-text`},pageContext:l})}
    `)}
    </div>
    `,B=system.createClass({...classes.getLinkClasses()}),G=()=>core.RenderIf(core.isLocalEnv,`<script ${helpers.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-countdown-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${helpers.getSettingPreloadData('class="gps-link" delay',"src")}="${core.baseAssetURL}/assets-v2/gp-countdown-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`);return core.template`
    <gp-countdown-timer
        ${{...P}}
        ${{...D}}
        class="${F}"
        style="${E}"
        gp-data='${JSON.stringify(v).replaceAll("'","&#039;")}'>
        <div id="section-countdown" class="${N}" style="${O}">
          ${system.If(I,`<a
              href="${b.href}"
              target="${b?.target}"
              aria-label="Countdown link"
              class="${B}"
            > </a>`)}
          ${system.If($,R("week",n,k?"weekLabel":""))}
          ${system.If(f,R("day",u,k?"dayLabel":""))}
          ${system.If(x,R("hour",m,k?"hourLabel":""))}
          ${system.If(C,R("minute",p,k?"minuteLabel":""))}
          ${system.If(S,R("second",g,k?"secondLabel":""))}
        </div>
     </gp-countdown-timer>
    ${G()}
  `};exports.default=Countdown;
