import{template as s,RenderIf as l,isLocalEnv as e,baseAssetURL as t}from"@gem-sdk/core";import{createStateOrContext as a,createAttr as i,createStyle as o,createClass as d,If as r}from"@gem-sdk/system";import{getAttr as p,getAttrContainer as $,getAttrOverlay as c,getAttrClose as g}from"../common/attrs.js";import{getWrapperStyle as n,getContainStyle as m,getBackdropStyle as v,getOverlayStyle as y,getDialogContentStyle as f,getButtonContentStyle as u,getSvgContentStyle as b,getBodyContentStyle as L}from"../common/styles.js";import{getContainClasses as S,getBackdropClasses as j,getOverlayClasses as h,getDialogContentClasses as E,getHeadContentClasses as x,getButtonContentClasses as C,getSvgContentClasses as k,getBodyContentClasses as D}from"../common/classes.js";import{getSettingPreloadData as I}from"../../helpers.js";let z=z=>{let{setting:A,children:B,builderProps:G,style:M,advanced:N,builderAttrs:O,pageContext:P}=z,_=N?.d,{frequency:q=3,triggerPercentage:w=0,trigger:J,triggerTime:R,frequencyMode:T="once",mobileTrigger:V,mobileTriggerTime:F,closeOnClickOutside:H}=A??{},{name:K,fullScreen:Q,width:U,height:W,position:X,overlayColor:Y,overlayOpacity:Z,iconSize:ss,closeButtonPosition:sl,iconSvg:se}=A??{},st=A?.dialogId??G?.uid,sa=a({dialogId:st,trigger:J,triggerTime:R,frequency:q,triggerPercentage:w,mobileTrigger:V,mobileTriggerTime:F,closeOnClickOutside:H,frequencyMode:T,display:_}),si=i({...p({uid:G?.uid||""})}),so=o({...n(_)}),sd=d({...S(N?.cssClass,Z,Y)}),sr=i({...$({uid:st||""})}),sp=o({...m()}),s$=d({...j(X)}),sc=o({...v(M)}),sg=i({...c()}),sn=d({...h()}),sm=o({...y(Z,Y,M)}),sv=o({...f({style:M,width:U,height:W,fullScreen:Q})}),sy=d({...E({setting:A,enableEffect:!0,isILP:!1})}),sf=i({...g()}),su=d({...x()}),sb=o({...u(A)}),sL=d({...C(sl)}),sS=o({...b(ss)}),sj=d({...k()}),sh=o({...L({setting:A,style:M,uid:G?.uid,pageContext:P??{},type:"Liquid"})}),sE=d({...D()});return s`
    <gp-dialog
      ${{...si}}
      class="${I("gps-lazy")}"
      style="${so}"
      data-gp-setting='${JSON.stringify(sa)}'>
      <dialog
        aria-label="${K}"
        ${{...sr}}
        class="${sd}"
        style="${sp}"
      >
        <div aria-label="Backdrop" class="${s$}" style="${sc}">
        ${r(!!Y,s`
            <div
              ${{...sg}}
              class="${sn}"
              style="${sm}"
              aria-hidden=true
            ></div>
        `)}
          <span class="${su}"></span>
          <div
            role="dialog"
            aria-label="Dialog content"
            ${{...O}}
            class="${sy}"
            style="${sv}"
          >
            <button
              ${{...sf}}
              type="button"
              tabindex="-1"
              class="${sL}"
              style="${sb}"
            >
              <span style="${sS}" class="${sj}">
              ${se??`<svg viewBox="0 0 12 12" fill="currentColor" style={svgContentStyle}>
                <path d="M7.1,6l4.5,4.5l-1.1,1.1L6,7.1l-4.5,4.5l-1.1-1.1L4.9,6L0.5,1.5l1.1-1.1L6,4.9l4.5-4.5l1.1,1.1L7.1,6z"></path>
              </svg>`}
              </span>
            </button>
            <div
              aria-label="Dialog body"
              style="${sh}"
              class="${sE}">
                <div>
                  ${B??""}
                </div>
            </div>
          </div>
        </div>
      </dialog>
    </gp-dialog>
    ${l(e,'<script src="{{ \'gp-dialog-v7-5.js\' | asset_url }}" defer="defer"></script>',`<script src="${t}/assets-v2/gp-dialog-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
  `};export{z as default};
