import{makeStyle as e,template as t}from"@gem-sdk/core";import{getDynamicSourceLocales as s,createSettingId as a}from"../../../../helpers.js";import{customClass as i}from"./classes.js";import r from"html-react-parser";import{createClass as o,createStyle as l}from"@gem-sdk/system";import{getCustomStyle as p,getPaginatorStyle as n}from"./styles.js";import{CollectionPaginator as m}from"../../../settings/collection-paginator/configs/translate.js";let u=({setting:e,builderProps:t,pageContext:s},a)=>"liquid"===a?c({setting:e,builderProps:t,pageContext:s}):d({setting:e,builderProps:t,pageContext:s}),c=({setting:e,builderProps:t,pageContext:s})=>{let a=x({setting:e,builderProps:t,pageContext:s},"liquid"),i=y({setting:e,builderProps:t,pageContext:s},"liquid"),r=e?.numberOfProducts||s?.numberOfProductOfProductList||0,o=e=>e?.replace(/"/g,'\\"')??"",l=`"${o(a??"")}"`,p=`"${o(i??"")}"`;return`
    {% paginate collection.products by ${r>0?r:4} %}
      {% assign previousText = ${s?.isPreviewing?l:a||'""'} %}
      {% assign nextText = ${s?.isPreviewing?p:i||'""'} %}

      {{ paginate | default_pagination: previous: previousText, next: nextText }}
    {% endpaginate %}
  `},d=({setting:t,builderProps:s,pageContext:a})=>{let{pageQuantity:m,typo:u,normalColor:c,activeColor:d}=t??{},f=[],h=parseInt(m??"0"),k=6;6>h&&(k=h-1);let v=k>1?k-1:0,$=x({setting:t,builderProps:s,pageContext:a},"react"),N=y({setting:t,builderProps:s,pageContext:a},"react"),q=o({...i("prev",c,t)}),L=o({...i("page",c,t)}),w=o({...i("deco",c,t)}),z=e=>o({...i("page",e===v?d:c,t)}),C=o({...i("deco",c,t)}),P=o({...i("page",c,t)}),T=o({...i("next",c,t)}),j=e=>l({...n(e===v,p(t),d)}),I=l({...p(t),...e({w:"auto"})}),b=l({...p(t)}),O=l({...p(t),...e({w:"auto"})});v>0&&f.push(g({key:"prev",text:u?.attrs?.transform==="capitalize"?$?.toLocaleLowerCase():$,className:q,style:I})),v>2&&f.push(g({key:1,text:1,className:L,style:b})),v>3&&f.push(g({key:"deco",text:"...",className:w,style:b}));for(let e=Math.max(0,v-2);e<=Math.min(v+2,h-1);e++)f.push(g({key:e+1,text:e+1,className:z(e),style:j(e)}));return v<h-4&&f.push(g({key:"deco-2",text:"...",className:C,style:b})),v<h-3&&f.push(g({key:h,text:h,className:P,style:b})),v!==h-1&&0!==h&&f.push(g({key:"next",text:u?.attrs?.transform==="capitalize"?N?.toLocaleLowerCase():N,className:T,style:O})),f.map(e=>r(e))},g=({key:e,text:s,className:a,style:i})=>t`<span key="${e}" className="${a}" style="${i}"> ${s} </span>`,x=({setting:e,builderProps:t,pageContext:i},r)=>{let{previousText:o,typo:l}=e??{};return"liquid"===r?s({val:o,uid:t?.uid,settingId:a({id:m?.previousText?.id}),pageContext:i??{},isLiquid:!0,isCapitalize:l?.attrs?.transform==="capitalize"}).toString():o},y=({setting:e,builderProps:t,pageContext:i},r)=>{let{nextText:o,typo:l}=e??{};return"liquid"===r?s({val:o,uid:t?.uid,settingId:a({id:m?.nextText?.id}),pageContext:i??{},isLiquid:!0,isCapitalize:l?.attrs?.transform==="capitalize"}).toString():o};export{u as renderPaginatorItem};
