'use client';
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),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??{},r=core.useCollection(),a=r?.products?.totalCount??12,c=system.createClass({...classes.getClassContainer()}),o=system.createClass({...classes.getClassToolbarWrapper()}),i=system.createClass({...classes.getClassToolbarSortWrapper()}),n=system.createClass({...classes.getClassSelect(e)}),m=system.createClass({...classes.getClassToolbarWrapperQuantity(e)}),y=system.createClass({"gp-flex-1":!0}),u=system.createStyle({...styles.getStyleCollectionToolbar(e)}),p=system.createStyle({...styles.getStyleToolbarWrapper(e)}),x=system.createStyle({...styles.getStyleSelect(e)}),d=system.createStyle({...styles.getStyleToolbarWrapperQuantity(e)}),j=helpers.getSortingTextDisplayVal({setting:e,builderProps:s,pageContext:t},"react"),g=helpers.getQuantityTextDisplayVal({setting:e,builderProps:s,pageContext:t},"react");return jsxRuntime.jsx("div",{className:c,style:u,id:s?.uid,children:jsxRuntime.jsxs("div",{className:o,style:p,children:[jsxRuntime.jsx("div",{className:i,children:jsxRuntime.jsxs("select",{id:"sorting",className:n,style:x,defaultValue:helpers.sortBy,children:[jsxRuntime.jsx("option",{value:"",children:j},j?.toString()),helpers.SORT_OPTIONS.map(e=>jsxRuntime.jsx("option",{value:e.value,children:e.name},e.value))]})}),jsxRuntime.jsx("div",{className:m,style:d,children:system.If(l,(g?.toString()??"").replace("%number%",`${a}`),"")}),jsxRuntime.jsx("div",{className:y,children:"\xa0"})]})})};exports.default=CollectionToolbar;
