"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),helpers$1=require("../../../helpers.js"),system=require("@gem-sdk/system"),classes=require("./common/classes.js"),styles=require("./common/styles.js"),helpers=require("./common/helpers.js");const CollectionToolbar=({setting:e,builderProps:s,pageContext:t})=>{let{displayQuantity:l}=e??{},o=system.createClass({...classes.getClassContainer()}),a=system.createClass({...classes.getClassToolbarWrapper()}),r=system.createClass({...classes.getClassToolbarSortWrapper()}),i=system.createClass({...classes.getClassSelect(e)}),c=system.createClass({...classes.getClassToolbarWrapperQuantity(e)}),n=system.createClass({"gp-flex-1":!0}),p=system.createStyle({...styles.getStyleCollectionToolbar(e)}),y=system.createStyle({...styles.getStyleToolbarWrapper(e)}),d=system.createStyle({...styles.getStyleSelect(e)}),u=system.createStyle({...styles.getStyleToolbarWrapperQuantity(e)}),g=helpers.getSortingTextDisplayVal({setting:e,builderProps:s,pageContext:t},"liquid"),m=helpers.getQuantityTextDisplayVal({setting:e,builderProps:s,pageContext:t},"liquid"),$=system.createStateOrContext({uid:s?.uid});return core.template`
    <gp-collection-toolbar
      class="${o}"
      style="${p}"
      id="${s?.uid}"
      gp-data='${JSON.stringify($)}'
    >
      <div class="${a}" style="${y}" >
        <div class="${r}">
          <select id="sorting" class="${i}" style="${d}" >

            {% if collection.sort_by == "" %}
              {% assign sort_by = collection.default_sort_by %}
            {% else %}
              {% assign sort_by = collection.sort_by %}
            {% endif %}

            <option key=${g} value="">
              ${g}
            </option>
            {% for option in collection.sort_options %}
              {% if sort_by == option.value %}
                <option value="{{ option.value }}" selected>{{ option.name }}</option>
              {% else %}
                <option value="{{ option.value }}">{{ option.name }}</option>
              {% endif %}
            {% endfor %}
          </select>
        </div>
        <div
          class="${c}"
          style="${u}"
        >
          {% assign quantityTemplate = ${m} %}
          {% assign productsCount = collection.products_count %}
          ${system.LiquidIf(l?.toString()??"",core.template`<span class="gf_product-quantity">{{ quantityTemplate | replace: '%number%', productsCount }}</span>`,"")}
        </div>
        <div class="${n}">&nbsp;</div>
      </div>
    </gp-collection-toolbar>
    ${core.RenderIf(core.isLocalEnv,`<script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-collection-toolbar-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="${core.baseAssetURL}/assets-v2/gp-collection-toolbar-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
  `};exports.default=CollectionToolbar;
