"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../helpers.js"),s=require("@gem-sdk/system"),a=require("./common/attrs.js"),l=require("./common/classes.js"),r=require("./common/styles.js"),i=require("./common/helpers.js");exports.default=({setting:n={},styles:u={},advanced:o,builderProps:c})=>{let{plusIcon:d,minusIcon:p,updatePrice:g}=n,y=n.defaultQtyValue??1,{inputHeight:$,buttonBackgroundColor:f,iconColor:b,inputBackgroundColor:v,textColor:S,align:m,borderBtn:C,buttonWidth:q,iconSizeCustom:B,corner:A,backgroundColor:I,dividerColor:_,dividerStroke:h}=u,j=n?.hasButton,E=s.createAttr({...a.getContainerAttrs({uid:c?.uid||"",isDisableByLiquid:!0})}),P=s.createClass({...l.getContainerClasses(o?.cssClass)}),R=s.createStyle({...r.getContainerStyles({align:m,inputHeight:$})}),k=s.createClass({...l.getWrapperClasses()}),H=s.createStyle({...r.getWrapperStyles({backgroundColor:I,styles:u})}),L=s.createAttr({...a.getInputAttr({isLiquid:!0,hasButton:j,defaultQty:y})}),M=s.createClass({...l.getInputClasses({styles:u,borderBtn:C,inputBackgroundColor:v,textColor:S})}),W=s.createStyle({...r.getInputStyle({setting:n,styles:{...u,borderBtn:C,inputBackgroundColor:v,textColor:S,dividerColor:_,dividerStroke:h}})}),D=s.createClass({...l.getButtonClass({borderBtn:C,buttonBackgroundColor:f,iconColor:b,buttonSide:"left"})}),x=s.createStyle({...r.getButtonStyle({borderBtn:C,buttonWidth:q,buttonBackgroundColor:f,iconColor:b,corner:A,enableHoverButton:n?.enableHoverButton})}),G=s.createAttr({...a.getButtonAttrs({buttonSide:"left"})}),O=s.createClass({...l.getButtonClass({borderBtn:C,buttonBackgroundColor:f,iconColor:b,buttonSide:"right"})}),V=s.createStyle({...r.getButtonStyle({borderBtn:C,buttonWidth:q,buttonBackgroundColor:f,iconColor:b,corner:A,flipStyle:!0,enableHoverButton:n?.enableHoverButton})}),N=s.createAttr({...a.getButtonAttrs({buttonSide:"right"})}),Q=s.createClass({...l.getIconWrapperClasses()}),T=i.getIconWidth(B);return e.template`
    {%- liquid
      assign current_variant = product.selected_or_first_available_variant
      assign available = current_variant.available | default: false
    -%}
      <gp-product-quantity
        ${{...E}}
        data-price="${g}"
        class="${P}"
        style="${R}"
      >
        <div class="${k}" style="${H}">
          ${e.RenderIf(j,e.template`
              <button
              {% if available == false %} disabled {% endif %}
               ${{...G}}
                class="${D}"
                style="${x}"
              >
                <span class="${Q}" style="${T}"
                >
                  ${i.getMinusIcon(p)}
                </span>
              </button>
            `)}
          <input
            {% if available == false %} disabled {% endif %}
            ${{...L}}
            class="${M}"
            style="${W}"
            inputMode="numeric"
          />

          ${e.RenderIf(j,e.template`
            <button
              {% if available == false %} disabled {% endif %}
              ${{...N}}
              class="${O}"
              style="${V}"
            >
              <span class="${Q}" style="${T}">
                ${i.getPlusIcon(d)}
              </span>
            </button>
          `)}
          </div>
        </gp-product-quantity>
      ${e.RenderIf(e.isLocalEnv,`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-product-quantity-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-product-quantity-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}`};
