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