@billgangcom/theme-lib 1.23.2 → 1.24.0

package/dist/ui.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./index-DIlddM8Y.cjs"),h=require("react"),at="_accordion_9e4oa_1",lt="_header_9e4oa_9",ut="_icon_9e4oa_18",xt="_open_9e4oa_21",dt="_content_9e4oa_25",z={accordion:at,header:lt,icon:ut,open:xt,content:dt},mt=({title:l,content:n})=>{const[e,c]=h.useState(!1),[i,r]=h.useState(0),s=h.useRef(null),o=()=>{c(!e)};return h.useEffect(()=>{s.current&&r(e?s.current.scrollHeight:0)},[e]),t.jsxRuntimeExports.jsxs("div",{className:z.accordion,children:[t.jsxRuntimeExports.jsxs("div",{className:z.header,onClick:o,children:[t.jsxRuntimeExports.jsx("h3",{children:l}),t.jsxRuntimeExports.jsx("div",{className:t.clx(z.icon,{[z.open]:e}),children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretDown"})})]}),t.jsxRuntimeExports.jsx("div",{ref:s,className:z.content,style:{height:`${i}px`},children:t.jsxRuntimeExports.jsx("p",{children:n})})]})},pt="_wrapper_9rr5j_2",_t="_alignmentBlock_9rr5j_8",jt="_title_9rr5j_15",ht="_subtitle_9rr5j_22",gt="_alignmentContent_9rr5j_29",ft="_alignments_9rr5j_37",bt="_alignment_9rr5j_8",Et="_circle_9rr5j_58",Rt="_paddings_9rr5j_65",vt="_padding_9rr5j_65",kt="_input_9rr5j_84",q={wrapper:pt,alignmentBlock:_t,title:jt,subtitle:ht,alignmentContent:gt,alignments:ft,alignment:bt,circle:Et,paddings:Rt,padding:vt,input:kt},It=["topLeft","top","topRight","left","center","right","bottomLeft","bottom","bottomRight"],yt=["left","top","right","bottom"],Nt=l=>{const{alignment:n,padding:e,setPadding:c,setAlignment:i}=l;function r(){switch(n){case"left":case"topLeft":case"bottomLeft":return"TextAlignLeft";case"right":case"topRight":case"bottomRight":return"TextAlignRight";case"center":case"top":case"bottom":return"TextAlignCenter";default:return"TextAlignCenter"}}function s(o){switch(o){case"left":return"AlignLeft";case"right":return"AlignRight";case"top":return"AlignTop";case"bottom":return"AlignBottom"}}return t.jsxRuntimeExports.jsxs("div",{className:q.layout,children:[t.jsxRuntimeExports.jsx("h3",{className:q.title,children:"Layout"}),t.jsxRuntimeExports.jsxs("div",{className:q.alignmentBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:q.subtitle,children:"Alignment"}),t.jsxRuntimeExports.jsxs("div",{className:q.alignmentContent,children:[t.jsxRuntimeExports.jsx("div",{className:q.alignments,children:It.map(o=>t.jsxRuntimeExports.jsxs("div",{onClick:()=>{i(o)},className:q.alignment,children:[o!==n&&t.jsxRuntimeExports.jsx("div",{className:q.circle}),o===n&&t.jsxRuntimeExports.jsx(t.Icon,{name:r(),fill:"#FF3F19",width:22,height:22})]},o))}),t.jsxRuntimeExports.jsx("div",{className:q.paddings,children:yt.map(o=>t.jsxRuntimeExports.jsxs("label",{className:q.padding,children:[t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:s(o),width:20,height:20})}),t.jsxRuntimeExports.jsx(t.Input,{type:"text",value:String(e[o]),onChange:d=>c({...e,[o]:Number(d)}),paddingless:!0,borderless:!0})]},o))})]})]})]})},$t="_subtitle_1qrz9_1",Ct="_header_1qrz9_8",Bt="_text_1qrz9_9",Pt="_top_1qrz9_17",St="_itemsBlock_1qrz9_26",G={subtitle:$t,header:Ct,text:Bt,top:Pt,itemsBlock:St},wt="_typeTexts_rcw8p_1",Tt="_block_rcw8p_8",qt="_active_rcw8p_21",W={typeTexts:wt,block:Tt,active:qt},At=["bold","italic","underline","strike-through","code"],K=l=>{const{typesText:n,setTypesText:e}=l;function c(i){switch(i){case"bold":return"TextB";case"italic":return"TextItalic";case"code":return"CodeSimple";case"strike-through":return"TextStrikethrough";case"underline":return"TextUnderline"}}return t.jsxRuntimeExports.jsx("div",{className:W.typeTexts,children:At.map(i=>t.jsxRuntimeExports.jsx("div",{className:t.clx(W.block,{[W.active]:n.includes(i)}),onClick:()=>{const r=[...n];if(r.includes(i)){const s=r.filter(o=>o!==i);e(s)}else r.push(i),e(r)},children:t.jsxRuntimeExports.jsx(t.Icon,{name:c(i),fill:n.includes(i)?"#252525":"#757575",width:20,height:20})},String(i)))})},Z=l=>{const{typesText:n,isActiveText:e,setIsActiveText:c,text:i,setText:r,setTypesText:s,title:o,subtitle:d="Items"}=l;return t.jsxRuntimeExports.jsxs("div",{className:G.text,children:[(o||e!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:G.top,children:[o&&t.jsxRuntimeExports.jsx("h3",{className:G.title,children:o}),e!==void 0&&c&&t.jsxRuntimeExports.jsx(t.Switch,{current:e,onChange:v=>c(v)})]}),t.jsxRuntimeExports.jsxs("div",{className:G.itemsBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:G.subtitle,children:d}),t.jsxRuntimeExports.jsx(t.Textarea,{onChange:v=>r(v),value:i,maxLength:150}),t.jsxRuntimeExports.jsx(K,{typesText:n,setTypesText:s})]})]})},Ot="_subtitle_cuny2_1",Dt="_header_cuny2_8",Mt="_text_cuny2_9",Lt="_productsBlock_cuny2_10",Ht="_top_cuny2_22",Vt="_itemsBlock_cuny2_31",Ft="_typeTexts_cuny2_37",Ut="_block_cuny2_44",zt="_active_cuny2_57",Gt="_products_cuny2_10",Yt="_product_cuny2_10",Xt="_button_cuny2_76",Qt="_disabled_cuny2_87",Wt="_image_cuny2_91",Jt="_info_cuny2_98",Kt="_name_cuny2_110",Zt="_buttons_cuny2_114",te="_modal_cuny2_121",ee="_link_cuny2_141",se="_modalOptions_cuny2_147",N={subtitle:Ot,header:Dt,text:Mt,productsBlock:Lt,top:Ht,itemsBlock:Vt,typeTexts:Ft,block:Ut,active:zt,products:Gt,product:Yt,button:Xt,disabled:Qt,image:Wt,info:Jt,name:Kt,buttons:Zt,modal:te,link:ee,modalOptions:se},ne=l=>{const{activeItem:n,setActiveItem:e,popupPosition:c,modalOptions:i,setIsOpenModal:r}=l;return t.jsxRuntimeExports.jsxs("div",{className:N.modal,onClick:s=>{s.stopPropagation()},style:{top:`${c.top}px`,left:`${c.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:N.top,children:[t.jsxRuntimeExports.jsx("h3",{children:n.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>{e(null),r(!1)}})]}),t.jsxRuntimeExports.jsx("div",{className:N.modalOptions,children:i.map(s=>{if(s.type==="image")return t.jsxRuntimeExports.jsx(t.ChooseImage,{label:"Put up an attractive image",onChange:o=>{const d={...n,[s.field]:o};e(d)}},String(s.field));if(s.type==="text")return t.jsxRuntimeExports.jsx(Z,{typesText:n[s.field.type],setTypesText:o=>{const d={...n,[s.field.type]:o};e(d)},text:n[s.field.text]||"",setText:o=>{const d={...n,[s.field.text]:o};e(d)},subtitle:s.label});if(s.type==="input")return t.jsxRuntimeExports.jsx(t.Input,{onChange:o=>{const d={...n,[s.field]:o};e(d)},value:n[s.field]||"",label:s.label,placeholder:s.placeholder});if(s.type==="inputSwitch")return t.jsxRuntimeExports.jsxs("div",{className:N.link,children:[t.jsxRuntimeExports.jsx(t.Input,{onChange:o=>{const d={...n,[s.field.text]:o};e(d)},value:n[s.field.text]||"",label:s.inputLabel,placeholder:s.placeholder}),t.jsxRuntimeExports.jsx(t.Switch,{current:!!n[s.field.switch]||!1,label:s.switchLabel,onChange:o=>{const d={...n,[s.field.switch]:o};e(d)}})]});if(s.type==="list")return t.jsxRuntimeExports.jsx(et,{items:n[s.field]||[],setItems:o=>{const d={...n,[s.field]:o};e(d)},itemsType:"select",draggable:s.draggable||!1,itemsOptions:s.itemsOptions,deletable:s.deletable||!1,editable:!1,subtitle:s.label});if(s.type==="select")return t.jsxRuntimeExports.jsx(t.Select,{options:s.itemsOptions,onChange:o=>{const d={...n,[s.field]:o};e(d)},label:s.label,value:n[s.field]||"String",leftAddon:s.leftAddon&&s.leftAddon==="icon"&&t.jsxRuntimeExports.jsx(t.Icon,{name:n[s.field]})})})})]})},oe="_other_g74jx_1",ie="_subtitle_g74jx_7",ce="_items_g74jx_14",J={other:oe,subtitle:ie,items:ce},tt=l=>{const{items:n,title:e="Other"}=l;return t.jsxRuntimeExports.jsxs("div",{className:J.other,children:[t.jsxRuntimeExports.jsx("h5",{className:J.subtitle,children:e}),t.jsxRuntimeExports.jsx("div",{className:J.items,children:n.map((c,i)=>t.jsxRuntimeExports.jsx(t.Switch,{current:c.isItem,onChange:r=>c.setIsItem(r),label:c.label,hasBackground:!0,paddingless:!1},i))})]})},re=l=>{const{index:n,moveProduct:e,children:c}=l,[,i]=t.useDrop({accept:"product",hover(o){o.index!==n&&(e(o.index,n),o.index=n)}}),[{isDragging:r},s]=t.useDrag({type:"product",item:{index:n},collect:o=>({isDragging:o.isDragging()})});return t.jsxRuntimeExports.jsx("div",{ref:o=>s(i(o)),className:`${N.product} ${r?N.dragging:""}`,children:c})},et=l=>{const{isActiveItems:n,setIsActiveItems:e,items:c,setItems:i,other:r,title:s,subtitle:o,editable:d=!0,draggable:v=!1,withImage:_=!1,deletable:E=!0,addable:f=!0,itemsType:u,itemsPlaceholder:m="",itemsOptions:a,hasRangeSelector:$=!1,rangeSelectorOptions:P,modalOptions:F,addableOptions:L={},limit:R}=l,[O,D]=h.useState(null),[Q,X]=h.useState({top:0,left:0}),[p,b]=h.useState(!1),S=(x,C)=>{const w=[...c],[k]=w.splice(x,1);w.splice(C,0,k),i(w)};h.useEffect(()=>{const x=()=>{D(null),b(!1)};return document.body.addEventListener("click",x),D(null),b(!1),()=>{D(null),b(!1),document.body.removeEventListener("click",x)}},[]),h.useEffect(()=>{if(O){const x=[...c].map(C=>C.id===O.id?O:C);i(x)}},[O]);const I=(x,C)=>{x.stopPropagation(),b(!0);const w=x.target.getBoundingClientRect(),k=500,U=window.innerHeight;let A=w.top+window.scrollY;A+k>U&&(A=U-k-20),X({top:A-80,left:w.left-30}),D(C)};function H(x){if(_)return x?t.jsxRuntimeExports.jsx("img",{src:`https://imagedelivery.net/${x[0]}/w=1000`,alt:"image",width:16,height:16}):t.jsxRuntimeExports.jsx(t.Icon,{name:"Image",width:16,height:16,fill:"#757575"})}const T=(x,C)=>{const w=t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[v&&t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:"DotsSixVertical",hoverable:!0,width:20,height:20})}),u==="select"&&t.jsxRuntimeExports.jsx(t.Select,{onChange:k=>{const A=[...c].map(M=>M.id===x.id?{...x,name:k}:M);D({...x,name:k}),i([...A])},value:x.name,options:a,leftAddon:H(x.images)}),u==="input"&&t.jsxRuntimeExports.jsx(t.Input,{onChange:k=>{const A=[...c].map(M=>M.id===x.id?{...x,name:k}:M);i([...A])},value:x.name,placeholder:m}),u==="image"&&t.jsxRuntimeExports.jsx(t.ChooseImage,{onChange:k=>{const A=[...c].map(M=>M.id===x.id?{...x,images:k}:M);i([...A])}}),t.jsxRuntimeExports.jsxs("div",{className:N.buttons,children:[d&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:k=>I(k,x)}),E&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,width:20,height:20,fill:"#C12A2A",onClick:()=>i(c.filter(k=>k.id!==x.id))})]})]});return v?t.jsxRuntimeExports.jsx(re,{product:x,index:C,moveProduct:S,children:w},x.id):t.jsxRuntimeExports.jsx("div",{className:N.product,children:w},x.id)};return t.jsxRuntimeExports.jsxs("div",{className:N.productsBlock,children:[(s||n!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:N.top,children:[s&&t.jsxRuntimeExports.jsx("h3",{className:N.title,children:s}),n!==void 0&&t.jsxRuntimeExports.jsx(t.Switch,{current:n,onChange:x=>e==null?void 0:e(x)})]}),O&&d&&F&&p&&t.jsxRuntimeExports.jsx(ne,{activeItem:O,setActiveItem:D,popupPosition:Q,modalOptions:F,setIsOpenModal:b}),$&&P&&t.jsxRuntimeExports.jsx(nt,{...P}),t.jsxRuntimeExports.jsxs("div",{className:N.products,children:[o&&t.jsxRuntimeExports.jsx("h5",{className:N.subtitle,children:o}),v?t.jsxRuntimeExports.jsx(t.DndProvider,{backend:t.HTML5Backend,children:c.map((x,C)=>T(x,C))}):c.map((x,C)=>T(x,C)),f&&t.jsxRuntimeExports.jsxs(t.Button,{className:t.clx(N.button,{[N.disabled]:!!(R&&R<=c.length)}),size:"s",disabled:!!(R&&R<=c.length),onClick:()=>{const x=[...c];u==="select"?x.push({name:a[0]||`Product ${c.length+1}`,id:t.v4(),...L}):u==="input"?x.push({name:"",id:t.v4(),...L}):x.push({name:`Image ${c.length+1}`,id:t.v4(),...L}),i(x)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]}),r!==void 0&&t.jsxRuntimeExports.jsx(tt,{items:r})]})},ae="_subtitle_1fb9q_1",le="_header_1fb9q_8",ue="_text_1fb9q_9",xe="_productsBlock_1fb9q_10",de="_buttonsBlock_1fb9q_11",me="_top_1fb9q_22",pe="_itemsBlock_1fb9q_31",_e="_typeTexts_1fb9q_37",je="_block_1fb9q_44",he="_active_1fb9q_56",ge="_products_1fb9q_10",fe="_product_1fb9q_10",be="_button_1fb9q_11",Ee="_image_1fb9q_86",Re="_info_1fb9q_93",ve="_name_1fb9q_105",ke="_buttons_1fb9q_11",Ie="_modal_1fb9q_116",ye="_other_1fb9q_135",Ne="_options_1fb9q_141",V={subtitle:ae,header:le,text:ue,productsBlock:xe,buttonsBlock:de,top:me,itemsBlock:pe,typeTexts:_e,block:je,active:he,products:ge,product:fe,button:be,image:Ee,info:Re,name:ve,buttons:ke,modal:Ie,other:ye,options:Ne},$e=l=>{const{activeButton:n,setActiveButton:e,popupPosition:c}=l,[i,r]=h.useState(n.typesText),[s,o]=h.useState(n.destination),[d,v]=h.useState(n.link||""),[_,E]=h.useState(n.text||"");return h.useEffect(()=>{e({...n,...{text:_,link:d,destination:s,typesText:i}})},[i,s,d,_]),t.jsxRuntimeExports.jsxs("div",{className:V.modal,onClick:f=>{f.stopPropagation()},style:{top:`${c.top}px`,left:`${c.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:V.top,children:[t.jsxRuntimeExports.jsx("h3",{children:n.type}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>e(null)})]}),t.jsxRuntimeExports.jsxs("div",{className:V.options,children:[t.jsxRuntimeExports.jsx(t.Select,{label:"Destination",onChange:f=>o(f),options:["Go to Page","Open Link"],value:s}),s==="Go to Page"?t.jsxRuntimeExports.jsx(t.Select,{label:"Go to",onChange:()=>{},options:[],value:"Homepage"}):t.jsxRuntimeExports.jsx(t.Input,{onChange:f=>v(f),value:d,placeholder:"https://",label:"Link"}),t.jsxRuntimeExports.jsx(t.Switch,{current:!1,label:"Open in new tab"}),t.jsxRuntimeExports.jsx(t.Textarea,{onChange:f=>E(f),value:_,label:"Text",maxLength:150}),t.jsxRuntimeExports.jsx(K,{typesText:i,setTypesText:r})]})]})},Ce="_subtitle_m8qel_1",Be="_header_m8qel_8",Pe="_text_m8qel_9",Se="_productsBlock_m8qel_10",we="_buttonsBlock_m8qel_11",Te="_top_m8qel_23",qe="_itemsBlock_m8qel_32",Ae="_typeTexts_m8qel_38",Oe="_block_m8qel_45",De="_active_m8qel_58",Me="_products_m8qel_10",Le="_product_m8qel_10",He="_button_m8qel_11",Ve="_image_m8qel_88",Fe="_info_m8qel_95",Ue="_name_m8qel_107",ze="_buttons_m8qel_11",Ge="_modal_m8qel_118",Ye="_other_m8qel_137",Xe="_options_m8qel_143",Y={subtitle:Ce,header:Be,text:Pe,productsBlock:Se,buttonsBlock:we,top:Te,itemsBlock:qe,typeTexts:Ae,block:Oe,active:De,products:Me,product:Le,button:He,image:Ve,info:Fe,name:Ue,buttons:ze,modal:Ge,other:Ye,options:Xe},st=l=>{const{buttons:n,setButtons:e,deletable:c=!0,addable:i=!0}=l,[r,s]=h.useState(null),[o,d]=h.useState({top:0,left:0});h.useEffect(()=>{const _=()=>{s(null)};return document.body.addEventListener("click",_),s(null),()=>{s(null),document.body.removeEventListener("click",_)}},[]),h.useEffect(()=>{if(r){const _=[...n].map(E=>E.id===r.id?r:E);e(_)}},[r]);const v=(_,E)=>{_.stopPropagation();const f=_.target.getBoundingClientRect(),u=490,m=window.innerHeight;let a=f.top+window.scrollY;a+u>m&&(a=m-u-20),d({top:a,left:f.left-30}),s(E)};return t.jsxRuntimeExports.jsxs("div",{className:Y.products,children:[t.jsxRuntimeExports.jsx("h5",{className:Y.subtitle,children:"Button Type"}),n.map(_=>t.jsxRuntimeExports.jsxs("div",{className:Y.product,children:[t.jsxRuntimeExports.jsx(t.Select,{onChange:E=>{const u=[...n].map(m=>m.id===_.id?{..._,type:E}:m);e(u)},value:_.type,options:["Primary","Secondary","Tertiary"]}),t.jsxRuntimeExports.jsxs("div",{className:Y.buttons,children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:E=>{v(E,_)}}),c&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,onClick:()=>{const E=n.filter(f=>f.id!==_.id);e(E)},width:20,height:20,fill:"#C12A2A"})]})]},_.id)),r&&t.jsxRuntimeExports.jsx($e,{activeButton:r,setActiveButton:s,popupPosition:o}),i&&t.jsxRuntimeExports.jsxs(t.Button,{className:Y.button,size:"s",onClick:()=>{const _=[...n];_.push({type:"Primary",id:t.v4(),typesText:[],destination:"Go to Page",text:""}),e(_)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]})},Qe=l=>{const{isActiveButtons:n,setIsActiveButtons:e,buttons:c,setButtons:i}=l;return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs("div",{className:V.buttonsBlock,children:[t.jsxRuntimeExports.jsxs("div",{className:V.top,children:[t.jsxRuntimeExports.jsx("h3",{className:V.title,children:"Buttons"}),t.jsxRuntimeExports.jsx(t.Switch,{current:n,onChange:r=>e(r)})]}),t.jsxRuntimeExports.jsx(st,{buttons:c,setButtons:i})]})})},We="_wrapper_m18qi_1",Je="_subtitle_m18qi_7",Ke="_content_m18qi_14",Ze="_range_m18qi_22",ts="_track_m18qi_27",es="_progress_m18qi_36",ss="_dots_m18qi_46",ns="_dot_m18qi_46",os="_active_m18qi_65",is="_input_m18qi_77",cs="_countBlock_m18qi_91",rs="_count_m18qi_91",as="_controls_m18qi_107",ls="_button_m18qi_113",y={wrapper:We,subtitle:Je,content:Ke,range:Ze,track:ts,progress:es,dots:ss,dot:ns,active:os,input:is,countBlock:cs,count:rs,controls:as,button:ls},nt=l=>{const{label:n,min:e=1,max:c=4,step:i=1,count:r,setCount:s}=l,[o,d]=h.useState(!1),v=Array.from({length:(c-e)/i+1}),_=(r-e)/(c-e)*100,E=()=>{r<c&&s(r+i)},f=()=>{r>e&&s(r-i)},u=m=>{const a=e+m*i;s(a)};return t.jsxRuntimeExports.jsxs("div",{className:y.wrapper,children:[n&&t.jsxRuntimeExports.jsx("h5",{className:y.subtitle,children:n}),t.jsxRuntimeExports.jsxs("div",{className:y.content,children:[t.jsxRuntimeExports.jsxs("div",{className:y.range,children:[t.jsxRuntimeExports.jsx("div",{className:y.track}),t.jsxRuntimeExports.jsx("div",{className:y.progress,style:{width:`${_}%`}}),t.jsxRuntimeExports.jsx("div",{className:y.dots,children:v.map((m,a)=>{const $=a<=(r-e)/i;return t.jsxRuntimeExports.jsx("button",{onClick:()=>u(a),className:t.clx(y.dot,{[y.active]:$,[y.inactive]:!$,[y.dragging]:o}),"aria-label":`Set value to ${e+a*i}`},a)})}),t.jsxRuntimeExports.jsx("input",{type:"range",min:e,max:c,step:i,value:r,onChange:m=>s(Number(m.target.value)),onMouseDown:()=>d(!0),onMouseUp:()=>d(!1),onTouchStart:()=>d(!0),onTouchEnd:()=>d(!1),className:y.input})]}),t.jsxRuntimeExports.jsxs("div",{className:y.countBlock,children:[t.jsxRuntimeExports.jsx(t.Input,{type:"number",min:e,max:c,paddingless:!0,onChange:m=>{const a=Number(m);a>c?s(c):a<e?s(e):s(a)},value:String(r)}),t.jsxRuntimeExports.jsxs("div",{className:y.controls,children:[t.jsxRuntimeExports.jsx("button",{onClick:E,disabled:r>=c,className:y.button,"aria-label":"Increment count",children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretUp",width:15,height:15})}),t.jsxRuntimeExports.jsx("button",{onClick:f,disabled:r<=e,className:y.button,"aria-label":"Decrement count",children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretDown",width:15,height:15})})]})]})]})]})},us="_subtitle_16rdk_1",xs="_header_16rdk_8",ds="_text_16rdk_9",ms="_productsBlock_16rdk_10",ps="_top_16rdk_22",_s="_itemsBlock_16rdk_31",js="_typeTexts_16rdk_37",hs="_block_16rdk_44",gs="_active_16rdk_57",fs="_products_16rdk_10",bs="_product_16rdk_10",Es="_button_16rdk_76",Rs="_image_16rdk_87",vs="_info_16rdk_94",ks="_name_16rdk_106",Is="_buttons_16rdk_110",ys="_modal_16rdk_117",Ns="_link_16rdk_137",$s="_modalOptions_16rdk_143",B={subtitle:us,header:xs,text:ds,productsBlock:ms,top:ps,itemsBlock:_s,typeTexts:js,block:hs,active:gs,products:fs,product:bs,button:Es,image:Rs,info:vs,name:ks,buttons:Is,modal:ys,link:Ns,modalOptions:$s},Cs=l=>{const{activeItem:n,setActiveItem:e,popupPosition:c,setIsOpenModal:i}=l;return t.jsxRuntimeExports.jsxs("div",{className:B.modal,onClick:r=>{r.stopPropagation()},style:{top:`${c.top}px`,left:`${c.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:B.top,children:[t.jsxRuntimeExports.jsx("h3",{children:n.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>{i(!1),e(null)}})]}),t.jsxRuntimeExports.jsx("div",{className:B.modalOptions,children:t.jsxRuntimeExports.jsx(t.ChooseImage,{label:"Put up an attractive image",onChange:r=>{const s={...n,images:r,imagePath:r[0]};e(s)}})})]})},Bs=l=>{const{index:n,moveProduct:e,children:c}=l,[,i]=t.useDrop({accept:"product",hover(o){o.index!==n&&(e(o.index,n),o.index=n)}}),[{isDragging:r},s]=t.useDrag({type:"product",item:{index:n},collect:o=>({isDragging:o.isDragging()})});return t.jsxRuntimeExports.jsx("div",{ref:o=>s(i(o)),className:`${B.product} ${r?B.dragging:""}`,children:c})},Ps=l=>{const{isActiveItems:n,setIsActiveItems:e,items:c,setItems:i,other:r,title:s,subtitle:o,editable:d=!0,draggable:v=!1,withImage:_=!1,deletable:E=!0,addable:f=!0,itemsType:u,itemsOptions:m}=l,[a,$]=h.useState(null),[P,F]=h.useState({top:0,left:0}),[L,R]=h.useState(!1),O=(p,b)=>{const S=[...c],[I]=S.splice(p,1);S.splice(b,0,I),i(S)};h.useEffect(()=>{const p=()=>{$(null),R(!1)};return document.body.addEventListener("click",p),$(null),R(!1),()=>{$(null),R(!1),document.body.removeEventListener("click",p)}},[]),h.useEffect(()=>{if(a){const p=[...c].map(b=>b.id===a.id?a:b);i(p)}},[a]);const D=(p,b)=>{p.stopPropagation();const S=p.target.getBoundingClientRect(),I=100,H=window.innerHeight;let T=S.top+window.scrollY;T+I>H&&(T=H-I-20),R(!0),F({top:T-80,left:S.left-30}),$(b)};function Q(p){if(_)return p?t.jsxRuntimeExports.jsx("img",{src:`https://imagedelivery.net/${p}/w=1000`,alt:"image",width:16,height:16}):t.jsxRuntimeExports.jsx(t.Icon,{name:"Image",width:16,height:16,fill:"#757575"})}const X=(p,b)=>{const S=t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[v&&t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:"DotsSixVertical",hoverable:!0,width:20,height:20})},b),u==="select"&&t.jsxRuntimeExports.jsx(t.Select,{onChange:I=>{const H=[...c],T=Number(I.split(" ")[1]),x=m.find(k=>k.id===T);if(!x)return;const C={...x.productData.stats,newPrice:x.productData.minPrice.amount,oldPrice:x.productData.compareAtPrice.amount},w=H.map(k=>k.id===p.id?{...p,name:I,listingId:T,stats:C}:k);$({...p,name:I,listingId:T}),i([...w])},value:p.name,options:[...m.map(I=>`Product ${I.id}`)],leftAddon:Q(p.images[0])},b),t.jsxRuntimeExports.jsxs("div",{className:B.buttons,children:[d&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:I=>D(I,p)}),E&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,width:20,height:20,fill:"#C12A2A",onClick:()=>i(c.filter(I=>I.id!==p.id))})]})]});return v?t.jsxRuntimeExports.jsx(Bs,{product:p,index:b,moveProduct:O,children:S},p.id):t.jsxRuntimeExports.jsx("div",{className:B.product,children:S},p.id)};return t.jsxRuntimeExports.jsxs("div",{className:B.productsBlock,children:[(s||n!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:B.top,children:[s&&t.jsxRuntimeExports.jsx("h3",{className:B.title,children:s}),n!==void 0&&t.jsxRuntimeExports.jsx(t.Switch,{current:n,onChange:p=>e==null?void 0:e(p)})]}),L&&a&&t.jsxRuntimeExports.jsx(Cs,{activeItem:a,setActiveItem:$,setIsOpenModal:R,popupPosition:P}),t.jsxRuntimeExports.jsxs("div",{className:B.products,children:[o&&t.jsxRuntimeExports.jsx("h5",{className:B.subtitle,children:o}),v?t.jsxRuntimeExports.jsx(t.DndProvider,{backend:t.HTML5Backend,children:c.map((p,b)=>X(p,b))}):c.map((p,b)=>X(p,b)),f&&t.jsxRuntimeExports.jsxs(t.Button,{className:B.button,size:"s",onClick:()=>{const p=[...c],b=m[0].id;p.push({name:`Product ${b}`,id:t.v4(),listingId:b,imagePath:"",images:[],stats:{...m[0].productData.stats,newPrice:m[0].productData.minPrice.amount,oldPrice:m[0].productData.compareAtPrice.amount}}),i(p)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]}),r!==void 0&&t.jsxRuntimeExports.jsx(tt,{items:r})]})},Ss="_options_10tml_1",ws="_price_10tml_12",Ts="_oldPrice_10tml_19",qs="_newPrice_10tml_27",As="_meta_10tml_34",Os="_info_10tml_40",Ds="_infoRight_10tml_48",Ms="_buttons_10tml_55",Ls="_variants_10tml_62",Hs="_variant_10tml_62",Vs="_stock_10tml_79",Fs="_variantInfo_10tml_86",Us="_quantity_10tml_92",zs="_count_10tml_99",Gs="_button_10tml_55",Ys="_activeVariant_10tml_120",Xs="_chargeTypes_10tml_124",Qs="_charge_10tml_124",Ws="_chargeActive_10tml_144",Js="_title_10tml_149",g={options:Ss,price:ws,oldPrice:Ts,newPrice:qs,meta:As,info:Os,infoRight:Ds,buttons:Ms,variants:Ls,variant:Hs,stock:Vs,variantInfo:Fs,quantity:Us,count:zs,button:Gs,activeVariant:Ys,chargeTypes:Xs,charge:Qs,chargeActive:Ws,title:Js};var ot=(l=>(l.ONE_TIME="One-Time",l.RECURRING="Subscribe & Save",l))(ot||{});const Ks=l=>{const{variants:n}=l,[e,c]=h.useState(n[0]),[i,r]=h.useState(e.chargeTypes[0]),s=t.useNavigate(),[o,d]=h.useState(1),{reset:v,addProductToCart:_,getProducts:E}=t.useCart();async function f(){await E(),await _({productId:l.id,productVariantId:e.id,quantity:o})}function u(){v(),f(),s("/checkout")}function m(a){if(a>=864e5){const R=Math.floor(a/864e5);return`${R} ${R===1?"day":"days"}`}else if(a>=36e5){const R=Math.floor(a/36e5);return`${R} ${R===1?"hour":"hours"}`}else if(a>=6e4){const R=Math.floor(a/6e4);return`${R} ${R===1?"minute":"minutes"}`}else{const R=Math.floor(a/1e3);return`${R} ${R===1?"second":"seconds"}`}}return t.jsxRuntimeExports.jsxs("div",{className:g.options,children:[t.jsxRuntimeExports.jsx("div",{className:g.chargeTypes,children:e.chargeTypes.map(a=>t.jsxRuntimeExports.jsx("div",{className:t.clx(g.charge,{[g.chargeActive]:i===a}),onClick:()=>r(a),children:ot[a]},a))}),t.jsxRuntimeExports.jsx("div",{className:g.variants,children:n.map(a=>t.jsxRuntimeExports.jsxs("div",{className:t.clx(g.variant,{[g.activeVariant]:e.id===a.id}),onClick:()=>c(a),children:[t.jsxRuntimeExports.jsxs("div",{className:g.variantInfo,children:[t.jsxRuntimeExports.jsx("span",{className:g.title,children:a.name}),t.jsxRuntimeExports.jsxs("span",{children:["$",i==="ONE_TIME"?a.price.amount:a.subscriptionSettings.price.amount]})]}),t.jsxRuntimeExports.jsx("div",{children:i==="ONE_TIME"&&t.jsxRuntimeExports.jsxs("span",{className:g.stock,children:[a.quantity.restrictions.max||0," in stock"]})})]},a.id))}),t.jsxRuntimeExports.jsxs("div",{className:g.quantity,children:[t.jsxRuntimeExports.jsx("div",{onClick:()=>{i==="ONE_TIME"&&(o>1?d(a=>a-1):d(1))},className:g.button,children:t.jsxRuntimeExports.jsx(t.Icon,{name:"Minus"})}),t.jsxRuntimeExports.jsx("div",{className:g.count,children:o}),t.jsxRuntimeExports.jsx("div",{onClick:()=>{i==="ONE_TIME"&&d(a=>a+1)},className:g.button,children:t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus"})})]}),t.jsxRuntimeExports.jsxs("div",{className:g.meta,children:[t.jsxRuntimeExports.jsxs("div",{className:g.info,children:[t.jsxRuntimeExports.jsx("span",{children:"Delivery"}),t.jsxRuntimeExports.jsxs("div",{className:g.infoRight,children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"Lightning",fill:"#FF3F19",width:20,height:20}),t.jsxRuntimeExports.jsx("span",{children:e.deliveryTime===0?"Instant":m(e.deliveryTime)})]})]}),t.jsxRuntimeExports.jsxs("div",{className:g.info,children:[t.jsxRuntimeExports.jsx("span",{children:"Price"}),t.jsxRuntimeExports.jsx("div",{className:g.infoRight,children:i==="ONE_TIME"?e.compareAtPrice&&(e.compareAtPrice.amount||0)-(e.price.amount||0)>0?t.jsxRuntimeExports.jsxs("div",{className:g.price,children:[t.jsxRuntimeExports.jsxs("span",{className:g.newPrice,children:["$ ",(e.price.amount||0)*o]}),t.jsxRuntimeExports.jsxs("span",{className:g.oldPrice,children:["$ ",(e.compareAtPrice.amount||0)*o]})]}):t.jsxRuntimeExports.jsxs("span",{className:g.newPrice,children:["$ ",(e.price.amount||0)*o]}):e.subscriptionSettings.compareAtPrice&&(e.subscriptionSettings.compareAtPrice.amount||0)-(e.subscriptionSettings.price.amount||0)>0?t.jsxRuntimeExports.jsxs("div",{className:g.price,children:[t.jsxRuntimeExports.jsxs("span",{className:g.newPrice,children:["$ ",e.subscriptionSettings.price.amount||0]}),t.jsxRuntimeExports.jsxs("span",{className:g.oldPrice,children:["$ ",e.subscriptionSettings.compareAtPrice.amount||0]})]}):t.jsxRuntimeExports.jsxs("span",{className:g.newPrice,children:["$ ",e.subscriptionSettings.price.amount||0]})})]})]}),t.jsxRuntimeExports.jsxs("div",{className:g.buttons,children:[t.jsxRuntimeExports.jsx(t.Button,{type:"Primary",onClick:()=>u(),children:"Buy Now"}),i==="ONE_TIME"&&t.jsxRuntimeExports.jsx(t.Button,{type:"Secondary",onClick:()=>f(),children:"Add to Cart"})]})]})},Zs="_button_14i4s_1",tn="_login_14i4s_14",en="_signUp_14i4s_18",sn="_buttons_14i4s_23",nn="_modal_14i4s_32",on="_info_14i4s_48",cn="_top_14i4s_55",rn="_title_14i4s_66",an="_clear_14i4s_72",ln="_activeClear_14i4s_79",un="_count_14i4s_83",xn="_cart_14i4s_98",dn="_empty_14i4s_106",mn="_product_14i4s_132",pn="_products_14i4s_141",_n="_image_14i4s_149",jn="_productInfo_14i4s_155",hn="_content_14i4s_162",gn="_name_14i4s_168",fn="_price_14i4s_174",bn="_productButtons_14i4s_180",En="_productButton_14i4s_180",Rn="_productCount_14i4s_200",vn="_bottom_14i4s_216",kn="_subtotal_14i4s_224",In="_block_14i4s_232",yn="_shoppingCount_14i4s_239",j={button:Zs,login:tn,signUp:en,buttons:sn,modal:nn,info:on,top:cn,title:rn,clear:an,activeClear:ln,count:un,cart:xn,empty:dn,product:mn,products:pn,image:_n,productInfo:jn,content:hn,name:gn,price:fn,productButtons:bn,productButton:En,productCount:Rn,bottom:vn,subtotal:kn,block:In,shoppingCount:yn},Nn=l=>{const{shopping:n,signUp:e}=l,c=t.useNavigate();function i(r){c(r)}return t.jsxRuntimeExports.jsxs("div",{className:j.buttons,children:[n&&t.jsxRuntimeExports.jsx(it,{}),t.jsxRuntimeExports.jsx("div",{className:t.clx(j.button,j.login),onClick:()=>i("/customer-dash"),children:"Login"}),e&&t.jsxRuntimeExports.jsx("div",{className:t.clx(j.button,j.login,j.signUp),onClick:()=>i("/customer-dash"),children:"Sign Up"})]})},it=()=>{const[l,n]=h.useState(!1),{cart:e}=t.useCart();return t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsxs("div",{className:j.button,onClick:c=>{c.stopPropagation(),n(!0)},children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"Handbag",fill:"#252525"}),e.parts.length>0&&t.jsxRuntimeExports.jsx("div",{className:j.shoppingCount,children:e.parts.length})]}),l&&t.jsxRuntimeExports.jsx(t.Modal,{close:n,children:t.jsxRuntimeExports.jsx(ct,{})})]})},ct=()=>{const{cart:l,reset:n,getProducts:e,getTotalAndDiscount:c,updateQuantityOfProduct:i}=t.useCart(),[r,s]=h.useState([]),o=t.useNavigate();function d(u){for(let m=0;m<l.parts.length;m++)for(let a=0;a<u.variants.length;a++)if(l.parts[m].productVariantId===u.variants[m].id)return l.parts[m].productVariantId}function v(u){for(let m=0;m<l.parts.length;m++)for(let a=0;a<u.variants.length;a++)if(l.parts[m].productVariantId===u.variants[m].id)return l.parts[m].quantity}function _(u){o(u)}function E(u){i({productId:u.id,productVariantId:u.activeVariantId,quantity:u.quantity+1})}function f(u){i({productId:u.id,productVariantId:u.activeVariantId,quantity:u.quantity-1})}return h.useEffect(()=>{(async()=>{const m=l.parts.map(P=>String(P.productId)),$=(await e([...m])).map(P=>({...P,activeVariantId:d(P),quantity:v(P)}));s($)})()},[l]),t.jsxRuntimeExports.jsxs("div",{className:j.modal,onClick:u=>u.stopPropagation(),children:[t.jsxRuntimeExports.jsxs("div",{className:j.top,children:[t.jsxRuntimeExports.jsxs("div",{className:j.info,children:[t.jsxRuntimeExports.jsx("span",{className:j.title,children:"Cart"}),l.parts.length>0&&t.jsxRuntimeExports.jsx("div",{className:j.count,children:l.parts.length})]}),t.jsxRuntimeExports.jsx("button",{className:t.clx(j.clear,{[j.activeClear]:l.parts.length>0}),disabled:l.parts.length===0,onClick:()=>n(),children:"Clear all"})]}),l.parts.length>0?t.jsxRuntimeExports.jsxs("div",{className:j.cart,children:[t.jsxRuntimeExports.jsx("div",{className:j.products,children:r.map(u=>t.jsxRuntimeExports.jsxs("div",{className:j.product,children:[t.jsxRuntimeExports.jsxs("div",{className:j.productInfo,children:[t.jsxRuntimeExports.jsx("img",{src:`https://imagedelivery.net/${u.images[0].cfId}/w=500`,alt:"image",width:"100%",height:"100%",className:j.image}),t.jsxRuntimeExports.jsxs("div",{className:j.content,children:[t.jsxRuntimeExports.jsx("div",{className:j.name,children:u.name}),t.jsxRuntimeExports.jsxs("div",{className:j.price,children:["$",u.variants.find(m=>m.id===u.activeVariantId).price.amount*((u==null?void 0:u.quantity)||1)]})]})]}),t.jsxRuntimeExports.jsxs("div",{className:j.productButtons,children:[t.jsxRuntimeExports.jsx("div",{onClick:()=>{u.quantity!==1&&f(u)},className:j.productButton,children:t.jsxRuntimeExports.jsx(t.Icon,{name:"Minus",fill:"#757575",width:20,height:20})}),t.jsxRuntimeExports.jsx("div",{className:j.productCount,children:u.quantity}),t.jsxRuntimeExports.jsx("div",{onClick:()=>E(u),className:j.productButton,children:t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",fill:"#757575",width:20,height:20})})]})]},u.id))}),t.jsxRuntimeExports.jsxs("div",{className:j.bottom,children:[t.jsxRuntimeExports.jsxs("div",{className:j.subtotal,children:[t.jsxRuntimeExports.jsxs("div",{className:j.block,children:[t.jsxRuntimeExports.jsx("span",{children:"Subtotal"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Info",width:20,height:20,fill:"#757575"})]}),t.jsxRuntimeExports.jsxs("div",{children:["$",c().total]})]}),t.jsxRuntimeExports.jsx(t.Button,{onClick:()=>_("/checkout"),children:"Checkout"})]})]}):t.jsxRuntimeExports.jsx(rt,{})]})},rt=()=>t.jsxRuntimeExports.jsxs("div",{className:j.empty,children:[t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:"Handbag"})}),t.jsxRuntimeExports.jsx("span",{children:"Your cart is empty"}),t.jsxRuntimeExports.jsx("span",{children:"Check out the store's products and add them here"})]});exports.Button=t.Button;exports.Checkbox=t.Checkbox;exports.ChooseImage=t.ChooseImage;exports.ChooseImageModal=t.ChooseImageModal;exports.ColorPicker=t.ColorPicker;exports.ErrorableBlock=t.ErrorableBlock;exports.Icon=t.Icon;exports.Input=t.Input;exports.Loader=t.Loader;exports.Modal=t.Modal;exports.Picker=t.Picker;exports.Radio=t.Radio;exports.Select=t.Select;exports.Submodal=t.Submodal;exports.Switch=t.Switch;exports.Textarea=t.Textarea;exports.Tip=t.Tip;exports.Accordion=mt;exports.ButtonTypeSettings=st;exports.ButtonsSettings=Qe;exports.EmptyCart=rt;exports.HeaderButtons=Nn;exports.ItemsSettings=et;exports.LayoutSettings=Nt;exports.ListingSelector=Ps;exports.ProductOptions=Ks;exports.RangeSelector=nt;exports.ShoppingButton=it;exports.ShoppingModalCart=ct;exports.TextSettings=Z;exports.TypesText=K;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./index-psym68p4.cjs"),h=require("react"),at="_accordion_9e4oa_1",lt="_header_9e4oa_9",ut="_icon_9e4oa_18",xt="_open_9e4oa_21",dt="_content_9e4oa_25",z={accordion:at,header:lt,icon:ut,open:xt,content:dt},mt=({title:l,content:n})=>{const[e,c]=h.useState(!1),[i,r]=h.useState(0),s=h.useRef(null),o=()=>{c(!e)};return h.useEffect(()=>{s.current&&r(e?s.current.scrollHeight:0)},[e]),t.jsxRuntimeExports.jsxs("div",{className:z.accordion,children:[t.jsxRuntimeExports.jsxs("div",{className:z.header,onClick:o,children:[t.jsxRuntimeExports.jsx("h3",{children:l}),t.jsxRuntimeExports.jsx("div",{className:t.clx(z.icon,{[z.open]:e}),children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretDown"})})]}),t.jsxRuntimeExports.jsx("div",{ref:s,className:z.content,style:{height:`${i}px`},children:t.jsxRuntimeExports.jsx("p",{children:n})})]})},pt="_wrapper_9rr5j_2",_t="_alignmentBlock_9rr5j_8",jt="_title_9rr5j_15",ht="_subtitle_9rr5j_22",gt="_alignmentContent_9rr5j_29",ft="_alignments_9rr5j_37",bt="_alignment_9rr5j_8",Et="_circle_9rr5j_58",Rt="_paddings_9rr5j_65",vt="_padding_9rr5j_65",kt="_input_9rr5j_84",q={wrapper:pt,alignmentBlock:_t,title:jt,subtitle:ht,alignmentContent:gt,alignments:ft,alignment:bt,circle:Et,paddings:Rt,padding:vt,input:kt},It=["topLeft","top","topRight","left","center","right","bottomLeft","bottom","bottomRight"],yt=["left","top","right","bottom"],Nt=l=>{const{alignment:n,padding:e,setPadding:c,setAlignment:i}=l;function r(){switch(n){case"left":case"topLeft":case"bottomLeft":return"TextAlignLeft";case"right":case"topRight":case"bottomRight":return"TextAlignRight";case"center":case"top":case"bottom":return"TextAlignCenter";default:return"TextAlignCenter"}}function s(o){switch(o){case"left":return"AlignLeft";case"right":return"AlignRight";case"top":return"AlignTop";case"bottom":return"AlignBottom"}}return t.jsxRuntimeExports.jsxs("div",{className:q.layout,children:[t.jsxRuntimeExports.jsx("h3",{className:q.title,children:"Layout"}),t.jsxRuntimeExports.jsxs("div",{className:q.alignmentBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:q.subtitle,children:"Alignment"}),t.jsxRuntimeExports.jsxs("div",{className:q.alignmentContent,children:[t.jsxRuntimeExports.jsx("div",{className:q.alignments,children:It.map(o=>t.jsxRuntimeExports.jsxs("div",{onClick:()=>{i(o)},className:q.alignment,children:[o!==n&&t.jsxRuntimeExports.jsx("div",{className:q.circle}),o===n&&t.jsxRuntimeExports.jsx(t.Icon,{name:r(),fill:"#FF3F19",width:22,height:22})]},o))}),t.jsxRuntimeExports.jsx("div",{className:q.paddings,children:yt.map(o=>t.jsxRuntimeExports.jsxs("label",{className:q.padding,children:[t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:s(o),width:20,height:20})}),t.jsxRuntimeExports.jsx(t.Input,{type:"text",value:String(e[o]),onChange:d=>c({...e,[o]:Number(d)}),paddingless:!0,borderless:!0})]},o))})]})]})]})},$t="_subtitle_1qrz9_1",Ct="_header_1qrz9_8",Bt="_text_1qrz9_9",Pt="_top_1qrz9_17",St="_itemsBlock_1qrz9_26",G={subtitle:$t,header:Ct,text:Bt,top:Pt,itemsBlock:St},wt="_typeTexts_rcw8p_1",Tt="_block_rcw8p_8",qt="_active_rcw8p_21",W={typeTexts:wt,block:Tt,active:qt},At=["bold","italic","underline","strike-through","code"],K=l=>{const{typesText:n,setTypesText:e}=l;function c(i){switch(i){case"bold":return"TextB";case"italic":return"TextItalic";case"code":return"CodeSimple";case"strike-through":return"TextStrikethrough";case"underline":return"TextUnderline"}}return t.jsxRuntimeExports.jsx("div",{className:W.typeTexts,children:At.map(i=>t.jsxRuntimeExports.jsx("div",{className:t.clx(W.block,{[W.active]:n.includes(i)}),onClick:()=>{const r=[...n];if(r.includes(i)){const s=r.filter(o=>o!==i);e(s)}else r.push(i),e(r)},children:t.jsxRuntimeExports.jsx(t.Icon,{name:c(i),fill:n.includes(i)?"#252525":"#757575",width:20,height:20})},String(i)))})},Z=l=>{const{typesText:n,isActiveText:e,setIsActiveText:c,text:i,setText:r,setTypesText:s,title:o,subtitle:d="Items"}=l;return t.jsxRuntimeExports.jsxs("div",{className:G.text,children:[(o||e!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:G.top,children:[o&&t.jsxRuntimeExports.jsx("h3",{className:G.title,children:o}),e!==void 0&&c&&t.jsxRuntimeExports.jsx(t.Switch,{current:e,onChange:v=>c(v)})]}),t.jsxRuntimeExports.jsxs("div",{className:G.itemsBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:G.subtitle,children:d}),t.jsxRuntimeExports.jsx(t.Textarea,{onChange:v=>r(v),value:i,maxLength:150}),t.jsxRuntimeExports.jsx(K,{typesText:n,setTypesText:s})]})]})},Ot="_subtitle_cuny2_1",Dt="_header_cuny2_8",Mt="_text_cuny2_9",Lt="_productsBlock_cuny2_10",Ht="_top_cuny2_22",Vt="_itemsBlock_cuny2_31",Ft="_typeTexts_cuny2_37",Ut="_block_cuny2_44",zt="_active_cuny2_57",Gt="_products_cuny2_10",Yt="_product_cuny2_10",Xt="_button_cuny2_76",Qt="_disabled_cuny2_87",Wt="_image_cuny2_91",Jt="_info_cuny2_98",Kt="_name_cuny2_110",Zt="_buttons_cuny2_114",te="_modal_cuny2_121",ee="_link_cuny2_141",se="_modalOptions_cuny2_147",N={subtitle:Ot,header:Dt,text:Mt,productsBlock:Lt,top:Ht,itemsBlock:Vt,typeTexts:Ft,block:Ut,active:zt,products:Gt,product:Yt,button:Xt,disabled:Qt,image:Wt,info:Jt,name:Kt,buttons:Zt,modal:te,link:ee,modalOptions:se},ne=l=>{const{activeItem:n,setActiveItem:e,popupPosition:c,modalOptions:i,setIsOpenModal:r}=l;return t.jsxRuntimeExports.jsxs("div",{className:N.modal,onClick:s=>{s.stopPropagation()},style:{top:`${c.top}px`,left:`${c.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:N.top,children:[t.jsxRuntimeExports.jsx("h3",{children:n.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>{e(null),r(!1)}})]}),t.jsxRuntimeExports.jsx("div",{className:N.modalOptions,children:i.map(s=>{if(s.type==="image")return t.jsxRuntimeExports.jsx(t.ChooseImage,{label:"Put up an attractive image",onChange:o=>{const d={...n,[s.field]:o};e(d)}},String(s.field));if(s.type==="text")return t.jsxRuntimeExports.jsx(Z,{typesText:n[s.field.type],setTypesText:o=>{const d={...n,[s.field.type]:o};e(d)},text:n[s.field.text]||"",setText:o=>{const d={...n,[s.field.text]:o};e(d)},subtitle:s.label});if(s.type==="input")return t.jsxRuntimeExports.jsx(t.Input,{onChange:o=>{const d={...n,[s.field]:o};e(d)},value:n[s.field]||"",label:s.label,placeholder:s.placeholder});if(s.type==="inputSwitch")return t.jsxRuntimeExports.jsxs("div",{className:N.link,children:[t.jsxRuntimeExports.jsx(t.Input,{onChange:o=>{const d={...n,[s.field.text]:o};e(d)},value:n[s.field.text]||"",label:s.inputLabel,placeholder:s.placeholder}),t.jsxRuntimeExports.jsx(t.Switch,{current:!!n[s.field.switch]||!1,label:s.switchLabel,onChange:o=>{const d={...n,[s.field.switch]:o};e(d)}})]});if(s.type==="list")return t.jsxRuntimeExports.jsx(et,{items:n[s.field]||[],setItems:o=>{const d={...n,[s.field]:o};e(d)},itemsType:"select",draggable:s.draggable||!1,itemsOptions:s.itemsOptions,deletable:s.deletable||!1,editable:!1,subtitle:s.label});if(s.type==="select")return t.jsxRuntimeExports.jsx(t.Select,{options:s.itemsOptions,onChange:o=>{const d={...n,[s.field]:o};e(d)},label:s.label,value:n[s.field]||"String",leftAddon:s.leftAddon&&s.leftAddon==="icon"&&t.jsxRuntimeExports.jsx(t.Icon,{name:n[s.field]})})})})]})},oe="_other_g74jx_1",ie="_subtitle_g74jx_7",ce="_items_g74jx_14",J={other:oe,subtitle:ie,items:ce},tt=l=>{const{items:n,title:e="Other"}=l;return t.jsxRuntimeExports.jsxs("div",{className:J.other,children:[t.jsxRuntimeExports.jsx("h5",{className:J.subtitle,children:e}),t.jsxRuntimeExports.jsx("div",{className:J.items,children:n.map((c,i)=>t.jsxRuntimeExports.jsx(t.Switch,{current:c.isItem,onChange:r=>c.setIsItem(r),label:c.label,hasBackground:!0,paddingless:!1},i))})]})},re=l=>{const{index:n,moveProduct:e,children:c}=l,[,i]=t.useDrop({accept:"product",hover(o){o.index!==n&&(e(o.index,n),o.index=n)}}),[{isDragging:r},s]=t.useDrag({type:"product",item:{index:n},collect:o=>({isDragging:o.isDragging()})});return t.jsxRuntimeExports.jsx("div",{ref:o=>s(i(o)),className:`${N.product} ${r?N.dragging:""}`,children:c})},et=l=>{const{isActiveItems:n,setIsActiveItems:e,items:c,setItems:i,other:r,title:s,subtitle:o,editable:d=!0,draggable:v=!1,withImage:_=!1,deletable:E=!0,addable:f=!0,itemsType:u,itemsPlaceholder:m="",itemsOptions:a,hasRangeSelector:$=!1,rangeSelectorOptions:P,modalOptions:F,addableOptions:L={},limit:R}=l,[O,D]=h.useState(null),[Q,X]=h.useState({top:0,left:0}),[p,b]=h.useState(!1),S=(x,C)=>{const w=[...c],[k]=w.splice(x,1);w.splice(C,0,k),i(w)};h.useEffect(()=>{const x=()=>{D(null),b(!1)};return document.body.addEventListener("click",x),D(null),b(!1),()=>{D(null),b(!1),document.body.removeEventListener("click",x)}},[]),h.useEffect(()=>{if(O){const x=[...c].map(C=>C.id===O.id?O:C);i(x)}},[O]);const I=(x,C)=>{x.stopPropagation(),b(!0);const w=x.target.getBoundingClientRect(),k=500,U=window.innerHeight;let A=w.top+window.scrollY;A+k>U&&(A=U-k-20),X({top:A-80,left:w.left-30}),D(C)};function H(x){if(_)return x?t.jsxRuntimeExports.jsx("img",{src:`https://imagedelivery.net/${x[0]}/w=1000`,alt:"image",width:16,height:16}):t.jsxRuntimeExports.jsx(t.Icon,{name:"Image",width:16,height:16,fill:"#757575"})}const T=(x,C)=>{const w=t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[v&&t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:"DotsSixVertical",hoverable:!0,width:20,height:20})}),u==="select"&&t.jsxRuntimeExports.jsx(t.Select,{onChange:k=>{const A=[...c].map(M=>M.id===x.id?{...x,name:k}:M);D({...x,name:k}),i([...A])},value:x.name,options:a,leftAddon:H(x.images)}),u==="input"&&t.jsxRuntimeExports.jsx(t.Input,{onChange:k=>{const A=[...c].map(M=>M.id===x.id?{...x,name:k}:M);i([...A])},value:x.name,placeholder:m}),u==="image"&&t.jsxRuntimeExports.jsx(t.ChooseImage,{onChange:k=>{const A=[...c].map(M=>M.id===x.id?{...x,images:k}:M);i([...A])}}),t.jsxRuntimeExports.jsxs("div",{className:N.buttons,children:[d&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:k=>I(k,x)}),E&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,width:20,height:20,fill:"#C12A2A",onClick:()=>i(c.filter(k=>k.id!==x.id))})]})]});return v?t.jsxRuntimeExports.jsx(re,{product:x,index:C,moveProduct:S,children:w},x.id):t.jsxRuntimeExports.jsx("div",{className:N.product,children:w},x.id)};return t.jsxRuntimeExports.jsxs("div",{className:N.productsBlock,children:[(s||n!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:N.top,children:[s&&t.jsxRuntimeExports.jsx("h3",{className:N.title,children:s}),n!==void 0&&t.jsxRuntimeExports.jsx(t.Switch,{current:n,onChange:x=>e==null?void 0:e(x)})]}),O&&d&&F&&p&&t.jsxRuntimeExports.jsx(ne,{activeItem:O,setActiveItem:D,popupPosition:Q,modalOptions:F,setIsOpenModal:b}),$&&P&&t.jsxRuntimeExports.jsx(nt,{...P}),t.jsxRuntimeExports.jsxs("div",{className:N.products,children:[o&&t.jsxRuntimeExports.jsx("h5",{className:N.subtitle,children:o}),v?t.jsxRuntimeExports.jsx(t.DndProvider,{backend:t.HTML5Backend,children:c.map((x,C)=>T(x,C))}):c.map((x,C)=>T(x,C)),f&&t.jsxRuntimeExports.jsxs(t.Button,{className:t.clx(N.button,{[N.disabled]:!!(R&&R<=c.length)}),size:"s",disabled:!!(R&&R<=c.length),onClick:()=>{const x=[...c];u==="select"?x.push({name:a[0]||`Product ${c.length+1}`,id:t.v4(),...L}):u==="input"?x.push({name:"",id:t.v4(),...L}):x.push({name:`Image ${c.length+1}`,id:t.v4(),...L}),i(x)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]}),r!==void 0&&t.jsxRuntimeExports.jsx(tt,{items:r})]})},ae="_subtitle_1fb9q_1",le="_header_1fb9q_8",ue="_text_1fb9q_9",xe="_productsBlock_1fb9q_10",de="_buttonsBlock_1fb9q_11",me="_top_1fb9q_22",pe="_itemsBlock_1fb9q_31",_e="_typeTexts_1fb9q_37",je="_block_1fb9q_44",he="_active_1fb9q_56",ge="_products_1fb9q_10",fe="_product_1fb9q_10",be="_button_1fb9q_11",Ee="_image_1fb9q_86",Re="_info_1fb9q_93",ve="_name_1fb9q_105",ke="_buttons_1fb9q_11",Ie="_modal_1fb9q_116",ye="_other_1fb9q_135",Ne="_options_1fb9q_141",V={subtitle:ae,header:le,text:ue,productsBlock:xe,buttonsBlock:de,top:me,itemsBlock:pe,typeTexts:_e,block:je,active:he,products:ge,product:fe,button:be,image:Ee,info:Re,name:ve,buttons:ke,modal:Ie,other:ye,options:Ne},$e=l=>{const{activeButton:n,setActiveButton:e,popupPosition:c}=l,[i,r]=h.useState(n.typesText),[s,o]=h.useState(n.destination),[d,v]=h.useState(n.link||""),[_,E]=h.useState(n.text||"");return h.useEffect(()=>{e({...n,...{text:_,link:d,destination:s,typesText:i}})},[i,s,d,_]),t.jsxRuntimeExports.jsxs("div",{className:V.modal,onClick:f=>{f.stopPropagation()},style:{top:`${c.top}px`,left:`${c.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:V.top,children:[t.jsxRuntimeExports.jsx("h3",{children:n.type}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>e(null)})]}),t.jsxRuntimeExports.jsxs("div",{className:V.options,children:[t.jsxRuntimeExports.jsx(t.Select,{label:"Destination",onChange:f=>o(f),options:["Go to Page","Open Link"],value:s}),s==="Go to Page"?t.jsxRuntimeExports.jsx(t.Select,{label:"Go to",onChange:()=>{},options:[],value:"Homepage"}):t.jsxRuntimeExports.jsx(t.Input,{onChange:f=>v(f),value:d,placeholder:"https://",label:"Link"}),t.jsxRuntimeExports.jsx(t.Switch,{current:!1,label:"Open in new tab"}),t.jsxRuntimeExports.jsx(t.Textarea,{onChange:f=>E(f),value:_,label:"Text",maxLength:150}),t.jsxRuntimeExports.jsx(K,{typesText:i,setTypesText:r})]})]})},Ce="_subtitle_m8qel_1",Be="_header_m8qel_8",Pe="_text_m8qel_9",Se="_productsBlock_m8qel_10",we="_buttonsBlock_m8qel_11",Te="_top_m8qel_23",qe="_itemsBlock_m8qel_32",Ae="_typeTexts_m8qel_38",Oe="_block_m8qel_45",De="_active_m8qel_58",Me="_products_m8qel_10",Le="_product_m8qel_10",He="_button_m8qel_11",Ve="_image_m8qel_88",Fe="_info_m8qel_95",Ue="_name_m8qel_107",ze="_buttons_m8qel_11",Ge="_modal_m8qel_118",Ye="_other_m8qel_137",Xe="_options_m8qel_143",Y={subtitle:Ce,header:Be,text:Pe,productsBlock:Se,buttonsBlock:we,top:Te,itemsBlock:qe,typeTexts:Ae,block:Oe,active:De,products:Me,product:Le,button:He,image:Ve,info:Fe,name:Ue,buttons:ze,modal:Ge,other:Ye,options:Xe},st=l=>{const{buttons:n,setButtons:e,deletable:c=!0,addable:i=!0}=l,[r,s]=h.useState(null),[o,d]=h.useState({top:0,left:0});h.useEffect(()=>{const _=()=>{s(null)};return document.body.addEventListener("click",_),s(null),()=>{s(null),document.body.removeEventListener("click",_)}},[]),h.useEffect(()=>{if(r){const _=[...n].map(E=>E.id===r.id?r:E);e(_)}},[r]);const v=(_,E)=>{_.stopPropagation();const f=_.target.getBoundingClientRect(),u=490,m=window.innerHeight;let a=f.top+window.scrollY;a+u>m&&(a=m-u-20),d({top:a,left:f.left-30}),s(E)};return t.jsxRuntimeExports.jsxs("div",{className:Y.products,children:[t.jsxRuntimeExports.jsx("h5",{className:Y.subtitle,children:"Button Type"}),n.map(_=>t.jsxRuntimeExports.jsxs("div",{className:Y.product,children:[t.jsxRuntimeExports.jsx(t.Select,{onChange:E=>{const u=[...n].map(m=>m.id===_.id?{..._,type:E}:m);e(u)},value:_.type,options:["Primary","Secondary","Tertiary"]}),t.jsxRuntimeExports.jsxs("div",{className:Y.buttons,children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:E=>{v(E,_)}}),c&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,onClick:()=>{const E=n.filter(f=>f.id!==_.id);e(E)},width:20,height:20,fill:"#C12A2A"})]})]},_.id)),r&&t.jsxRuntimeExports.jsx($e,{activeButton:r,setActiveButton:s,popupPosition:o}),i&&t.jsxRuntimeExports.jsxs(t.Button,{className:Y.button,size:"s",onClick:()=>{const _=[...n];_.push({type:"Primary",id:t.v4(),typesText:[],destination:"Go to Page",text:""}),e(_)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]})},Qe=l=>{const{isActiveButtons:n,setIsActiveButtons:e,buttons:c,setButtons:i}=l;return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs("div",{className:V.buttonsBlock,children:[t.jsxRuntimeExports.jsxs("div",{className:V.top,children:[t.jsxRuntimeExports.jsx("h3",{className:V.title,children:"Buttons"}),t.jsxRuntimeExports.jsx(t.Switch,{current:n,onChange:r=>e(r)})]}),t.jsxRuntimeExports.jsx(st,{buttons:c,setButtons:i})]})})},We="_wrapper_m18qi_1",Je="_subtitle_m18qi_7",Ke="_content_m18qi_14",Ze="_range_m18qi_22",ts="_track_m18qi_27",es="_progress_m18qi_36",ss="_dots_m18qi_46",ns="_dot_m18qi_46",os="_active_m18qi_65",is="_input_m18qi_77",cs="_countBlock_m18qi_91",rs="_count_m18qi_91",as="_controls_m18qi_107",ls="_button_m18qi_113",y={wrapper:We,subtitle:Je,content:Ke,range:Ze,track:ts,progress:es,dots:ss,dot:ns,active:os,input:is,countBlock:cs,count:rs,controls:as,button:ls},nt=l=>{const{label:n,min:e=1,max:c=4,step:i=1,count:r,setCount:s}=l,[o,d]=h.useState(!1),v=Array.from({length:(c-e)/i+1}),_=(r-e)/(c-e)*100,E=()=>{r<c&&s(r+i)},f=()=>{r>e&&s(r-i)},u=m=>{const a=e+m*i;s(a)};return t.jsxRuntimeExports.jsxs("div",{className:y.wrapper,children:[n&&t.jsxRuntimeExports.jsx("h5",{className:y.subtitle,children:n}),t.jsxRuntimeExports.jsxs("div",{className:y.content,children:[t.jsxRuntimeExports.jsxs("div",{className:y.range,children:[t.jsxRuntimeExports.jsx("div",{className:y.track}),t.jsxRuntimeExports.jsx("div",{className:y.progress,style:{width:`${_}%`}}),t.jsxRuntimeExports.jsx("div",{className:y.dots,children:v.map((m,a)=>{const $=a<=(r-e)/i;return t.jsxRuntimeExports.jsx("button",{onClick:()=>u(a),className:t.clx(y.dot,{[y.active]:$,[y.inactive]:!$,[y.dragging]:o}),"aria-label":`Set value to ${e+a*i}`},a)})}),t.jsxRuntimeExports.jsx("input",{type:"range",min:e,max:c,step:i,value:r,onChange:m=>s(Number(m.target.value)),onMouseDown:()=>d(!0),onMouseUp:()=>d(!1),onTouchStart:()=>d(!0),onTouchEnd:()=>d(!1),className:y.input})]}),t.jsxRuntimeExports.jsxs("div",{className:y.countBlock,children:[t.jsxRuntimeExports.jsx(t.Input,{type:"number",min:e,max:c,paddingless:!0,onChange:m=>{const a=Number(m);a>c?s(c):a<e?s(e):s(a)},value:String(r)}),t.jsxRuntimeExports.jsxs("div",{className:y.controls,children:[t.jsxRuntimeExports.jsx("button",{onClick:E,disabled:r>=c,className:y.button,"aria-label":"Increment count",children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretUp",width:15,height:15})}),t.jsxRuntimeExports.jsx("button",{onClick:f,disabled:r<=e,className:y.button,"aria-label":"Decrement count",children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretDown",width:15,height:15})})]})]})]})]})},us="_subtitle_16rdk_1",xs="_header_16rdk_8",ds="_text_16rdk_9",ms="_productsBlock_16rdk_10",ps="_top_16rdk_22",_s="_itemsBlock_16rdk_31",js="_typeTexts_16rdk_37",hs="_block_16rdk_44",gs="_active_16rdk_57",fs="_products_16rdk_10",bs="_product_16rdk_10",Es="_button_16rdk_76",Rs="_image_16rdk_87",vs="_info_16rdk_94",ks="_name_16rdk_106",Is="_buttons_16rdk_110",ys="_modal_16rdk_117",Ns="_link_16rdk_137",$s="_modalOptions_16rdk_143",B={subtitle:us,header:xs,text:ds,productsBlock:ms,top:ps,itemsBlock:_s,typeTexts:js,block:hs,active:gs,products:fs,product:bs,button:Es,image:Rs,info:vs,name:ks,buttons:Is,modal:ys,link:Ns,modalOptions:$s},Cs=l=>{const{activeItem:n,setActiveItem:e,popupPosition:c,setIsOpenModal:i}=l;return t.jsxRuntimeExports.jsxs("div",{className:B.modal,onClick:r=>{r.stopPropagation()},style:{top:`${c.top}px`,left:`${c.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:B.top,children:[t.jsxRuntimeExports.jsx("h3",{children:n.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>{i(!1),e(null)}})]}),t.jsxRuntimeExports.jsx("div",{className:B.modalOptions,children:t.jsxRuntimeExports.jsx(t.ChooseImage,{label:"Put up an attractive image",onChange:r=>{const s={...n,images:r,imagePath:r[0]};e(s)}})})]})},Bs=l=>{const{index:n,moveProduct:e,children:c}=l,[,i]=t.useDrop({accept:"product",hover(o){o.index!==n&&(e(o.index,n),o.index=n)}}),[{isDragging:r},s]=t.useDrag({type:"product",item:{index:n},collect:o=>({isDragging:o.isDragging()})});return t.jsxRuntimeExports.jsx("div",{ref:o=>s(i(o)),className:`${B.product} ${r?B.dragging:""}`,children:c})},Ps=l=>{const{isActiveItems:n,setIsActiveItems:e,items:c,setItems:i,other:r,title:s,subtitle:o,editable:d=!0,draggable:v=!1,withImage:_=!1,deletable:E=!0,addable:f=!0,itemsType:u,itemsOptions:m}=l,[a,$]=h.useState(null),[P,F]=h.useState({top:0,left:0}),[L,R]=h.useState(!1),O=(p,b)=>{const S=[...c],[I]=S.splice(p,1);S.splice(b,0,I),i(S)};h.useEffect(()=>{const p=()=>{$(null),R(!1)};return document.body.addEventListener("click",p),$(null),R(!1),()=>{$(null),R(!1),document.body.removeEventListener("click",p)}},[]),h.useEffect(()=>{if(a){const p=[...c].map(b=>b.id===a.id?a:b);i(p)}},[a]);const D=(p,b)=>{p.stopPropagation();const S=p.target.getBoundingClientRect(),I=100,H=window.innerHeight;let T=S.top+window.scrollY;T+I>H&&(T=H-I-20),R(!0),F({top:T-80,left:S.left-30}),$(b)};function Q(p){if(_)return p?t.jsxRuntimeExports.jsx("img",{src:`https://imagedelivery.net/${p}/w=1000`,alt:"image",width:16,height:16}):t.jsxRuntimeExports.jsx(t.Icon,{name:"Image",width:16,height:16,fill:"#757575"})}const X=(p,b)=>{const S=t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[v&&t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:"DotsSixVertical",hoverable:!0,width:20,height:20})},b),u==="select"&&t.jsxRuntimeExports.jsx(t.Select,{onChange:I=>{const H=[...c],T=Number(I.split(" ")[1]),x=m.find(k=>k.id===T);if(!x)return;const C={...x.productData.stats,newPrice:x.productData.minPrice.amount,oldPrice:x.productData.compareAtPrice.amount},w=H.map(k=>k.id===p.id?{...p,name:I,listingId:T,stats:C}:k);$({...p,name:I,listingId:T}),i([...w])},value:p.name,options:[...m.map(I=>`Product ${I.id}`)],leftAddon:Q(p.images[0])},b),t.jsxRuntimeExports.jsxs("div",{className:B.buttons,children:[d&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:I=>D(I,p)}),E&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,width:20,height:20,fill:"#C12A2A",onClick:()=>i(c.filter(I=>I.id!==p.id))})]})]});return v?t.jsxRuntimeExports.jsx(Bs,{product:p,index:b,moveProduct:O,children:S},p.id):t.jsxRuntimeExports.jsx("div",{className:B.product,children:S},p.id)};return t.jsxRuntimeExports.jsxs("div",{className:B.productsBlock,children:[(s||n!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:B.top,children:[s&&t.jsxRuntimeExports.jsx("h3",{className:B.title,children:s}),n!==void 0&&t.jsxRuntimeExports.jsx(t.Switch,{current:n,onChange:p=>e==null?void 0:e(p)})]}),L&&a&&t.jsxRuntimeExports.jsx(Cs,{activeItem:a,setActiveItem:$,setIsOpenModal:R,popupPosition:P}),t.jsxRuntimeExports.jsxs("div",{className:B.products,children:[o&&t.jsxRuntimeExports.jsx("h5",{className:B.subtitle,children:o}),v?t.jsxRuntimeExports.jsx(t.DndProvider,{backend:t.HTML5Backend,children:c.map((p,b)=>X(p,b))}):c.map((p,b)=>X(p,b)),f&&t.jsxRuntimeExports.jsxs(t.Button,{className:B.button,size:"s",onClick:()=>{const p=[...c],b=m[0].id;p.push({name:`Product ${b}`,id:t.v4(),listingId:b,imagePath:"",images:[],stats:{...m[0].productData.stats,newPrice:m[0].productData.minPrice.amount,oldPrice:m[0].productData.compareAtPrice.amount}}),i(p)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]}),r!==void 0&&t.jsxRuntimeExports.jsx(tt,{items:r})]})},Ss="_options_10tml_1",ws="_price_10tml_12",Ts="_oldPrice_10tml_19",qs="_newPrice_10tml_27",As="_meta_10tml_34",Os="_info_10tml_40",Ds="_infoRight_10tml_48",Ms="_buttons_10tml_55",Ls="_variants_10tml_62",Hs="_variant_10tml_62",Vs="_stock_10tml_79",Fs="_variantInfo_10tml_86",Us="_quantity_10tml_92",zs="_count_10tml_99",Gs="_button_10tml_55",Ys="_activeVariant_10tml_120",Xs="_chargeTypes_10tml_124",Qs="_charge_10tml_124",Ws="_chargeActive_10tml_144",Js="_title_10tml_149",g={options:Ss,price:ws,oldPrice:Ts,newPrice:qs,meta:As,info:Os,infoRight:Ds,buttons:Ms,variants:Ls,variant:Hs,stock:Vs,variantInfo:Fs,quantity:Us,count:zs,button:Gs,activeVariant:Ys,chargeTypes:Xs,charge:Qs,chargeActive:Ws,title:Js};var ot=(l=>(l.ONE_TIME="One-Time",l.RECURRING="Subscribe & Save",l))(ot||{});const Ks=l=>{const{variants:n}=l,[e,c]=h.useState(n[0]),[i,r]=h.useState(e.chargeTypes[0]),s=t.useNavigate(),[o,d]=h.useState(1),{reset:v,addProductToCart:_,getProducts:E}=t.useCart();async function f(){await E(),await _({productId:l.id,productVariantId:e.id,quantity:o})}function u(){v(),f(),s("/checkout")}function m(a){if(a>=864e5){const R=Math.floor(a/864e5);return`${R} ${R===1?"day":"days"}`}else if(a>=36e5){const R=Math.floor(a/36e5);return`${R} ${R===1?"hour":"hours"}`}else if(a>=6e4){const R=Math.floor(a/6e4);return`${R} ${R===1?"minute":"minutes"}`}else{const R=Math.floor(a/1e3);return`${R} ${R===1?"second":"seconds"}`}}return t.jsxRuntimeExports.jsxs("div",{className:g.options,children:[t.jsxRuntimeExports.jsx("div",{className:g.chargeTypes,children:e.chargeTypes.map(a=>t.jsxRuntimeExports.jsx("div",{className:t.clx(g.charge,{[g.chargeActive]:i===a}),onClick:()=>r(a),children:ot[a]},a))}),t.jsxRuntimeExports.jsx("div",{className:g.variants,children:n.map(a=>t.jsxRuntimeExports.jsxs("div",{className:t.clx(g.variant,{[g.activeVariant]:e.id===a.id}),onClick:()=>c(a),children:[t.jsxRuntimeExports.jsxs("div",{className:g.variantInfo,children:[t.jsxRuntimeExports.jsx("span",{className:g.title,children:a.name}),t.jsxRuntimeExports.jsxs("span",{children:["$",i==="ONE_TIME"?a.price.amount:a.subscriptionSettings.price.amount]})]}),t.jsxRuntimeExports.jsx("div",{children:i==="ONE_TIME"&&t.jsxRuntimeExports.jsxs("span",{className:g.stock,children:[a.quantity.restrictions.max||0," in stock"]})})]},a.id))}),t.jsxRuntimeExports.jsxs("div",{className:g.quantity,children:[t.jsxRuntimeExports.jsx("div",{onClick:()=>{i==="ONE_TIME"&&(o>1?d(a=>a-1):d(1))},className:g.button,children:t.jsxRuntimeExports.jsx(t.Icon,{name:"Minus"})}),t.jsxRuntimeExports.jsx("div",{className:g.count,children:o}),t.jsxRuntimeExports.jsx("div",{onClick:()=>{i==="ONE_TIME"&&d(a=>a+1)},className:g.button,children:t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus"})})]}),t.jsxRuntimeExports.jsxs("div",{className:g.meta,children:[t.jsxRuntimeExports.jsxs("div",{className:g.info,children:[t.jsxRuntimeExports.jsx("span",{children:"Delivery"}),t.jsxRuntimeExports.jsxs("div",{className:g.infoRight,children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"Lightning",fill:"#FF3F19",width:20,height:20}),t.jsxRuntimeExports.jsx("span",{children:e.deliveryTime===0?"Instant":m(e.deliveryTime)})]})]}),t.jsxRuntimeExports.jsxs("div",{className:g.info,children:[t.jsxRuntimeExports.jsx("span",{children:"Price"}),t.jsxRuntimeExports.jsx("div",{className:g.infoRight,children:i==="ONE_TIME"?e.compareAtPrice&&(e.compareAtPrice.amount||0)-(e.price.amount||0)>0?t.jsxRuntimeExports.jsxs("div",{className:g.price,children:[t.jsxRuntimeExports.jsxs("span",{className:g.newPrice,children:["$ ",(e.price.amount||0)*o]}),t.jsxRuntimeExports.jsxs("span",{className:g.oldPrice,children:["$ ",(e.compareAtPrice.amount||0)*o]})]}):t.jsxRuntimeExports.jsxs("span",{className:g.newPrice,children:["$ ",(e.price.amount||0)*o]}):e.subscriptionSettings.compareAtPrice&&(e.subscriptionSettings.compareAtPrice.amount||0)-(e.subscriptionSettings.price.amount||0)>0?t.jsxRuntimeExports.jsxs("div",{className:g.price,children:[t.jsxRuntimeExports.jsxs("span",{className:g.newPrice,children:["$ ",e.subscriptionSettings.price.amount||0]}),t.jsxRuntimeExports.jsxs("span",{className:g.oldPrice,children:["$ ",e.subscriptionSettings.compareAtPrice.amount||0]})]}):t.jsxRuntimeExports.jsxs("span",{className:g.newPrice,children:["$ ",e.subscriptionSettings.price.amount||0]})})]})]}),t.jsxRuntimeExports.jsxs("div",{className:g.buttons,children:[t.jsxRuntimeExports.jsx(t.Button,{type:"Primary",onClick:()=>u(),children:"Buy Now"}),i==="ONE_TIME"&&t.jsxRuntimeExports.jsx(t.Button,{type:"Secondary",onClick:()=>f(),children:"Add to Cart"})]})]})},Zs="_button_14i4s_1",tn="_login_14i4s_14",en="_signUp_14i4s_18",sn="_buttons_14i4s_23",nn="_modal_14i4s_32",on="_info_14i4s_48",cn="_top_14i4s_55",rn="_title_14i4s_66",an="_clear_14i4s_72",ln="_activeClear_14i4s_79",un="_count_14i4s_83",xn="_cart_14i4s_98",dn="_empty_14i4s_106",mn="_product_14i4s_132",pn="_products_14i4s_141",_n="_image_14i4s_149",jn="_productInfo_14i4s_155",hn="_content_14i4s_162",gn="_name_14i4s_168",fn="_price_14i4s_174",bn="_productButtons_14i4s_180",En="_productButton_14i4s_180",Rn="_productCount_14i4s_200",vn="_bottom_14i4s_216",kn="_subtotal_14i4s_224",In="_block_14i4s_232",yn="_shoppingCount_14i4s_239",j={button:Zs,login:tn,signUp:en,buttons:sn,modal:nn,info:on,top:cn,title:rn,clear:an,activeClear:ln,count:un,cart:xn,empty:dn,product:mn,products:pn,image:_n,productInfo:jn,content:hn,name:gn,price:fn,productButtons:bn,productButton:En,productCount:Rn,bottom:vn,subtotal:kn,block:In,shoppingCount:yn},Nn=l=>{const{shopping:n,signUp:e}=l,c=t.useNavigate();function i(r){c(r)}return t.jsxRuntimeExports.jsxs("div",{className:j.buttons,children:[n&&t.jsxRuntimeExports.jsx(it,{}),t.jsxRuntimeExports.jsx("div",{className:t.clx(j.button,j.login),onClick:()=>i("/customer-dash"),children:"Login"}),e&&t.jsxRuntimeExports.jsx("div",{className:t.clx(j.button,j.login,j.signUp),onClick:()=>i("/customer-dash"),children:"Sign Up"})]})},it=()=>{const[l,n]=h.useState(!1),{cart:e}=t.useCart();return t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsxs("div",{className:j.button,onClick:c=>{c.stopPropagation(),n(!0)},children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"Handbag",fill:"#252525"}),e.parts.length>0&&t.jsxRuntimeExports.jsx("div",{className:j.shoppingCount,children:e.parts.length})]}),l&&t.jsxRuntimeExports.jsx(t.Modal,{close:n,children:t.jsxRuntimeExports.jsx(ct,{})})]})},ct=()=>{const{cart:l,reset:n,getProducts:e,getTotalAndDiscount:c,updateQuantityOfProduct:i}=t.useCart(),[r,s]=h.useState([]),o=t.useNavigate();function d(u){for(let m=0;m<l.parts.length;m++)for(let a=0;a<u.variants.length;a++)if(l.parts[m].productVariantId===u.variants[m].id)return l.parts[m].productVariantId}function v(u){for(let m=0;m<l.parts.length;m++)for(let a=0;a<u.variants.length;a++)if(l.parts[m].productVariantId===u.variants[m].id)return l.parts[m].quantity}function _(u){o(u)}function E(u){i({productId:u.id,productVariantId:u.activeVariantId,quantity:u.quantity+1})}function f(u){i({productId:u.id,productVariantId:u.activeVariantId,quantity:u.quantity-1})}return h.useEffect(()=>{(async()=>{const m=l.parts.map(P=>String(P.productId)),$=(await e([...m])).map(P=>({...P,activeVariantId:d(P),quantity:v(P)}));s($)})()},[l]),t.jsxRuntimeExports.jsxs("div",{className:j.modal,onClick:u=>u.stopPropagation(),children:[t.jsxRuntimeExports.jsxs("div",{className:j.top,children:[t.jsxRuntimeExports.jsxs("div",{className:j.info,children:[t.jsxRuntimeExports.jsx("span",{className:j.title,children:"Cart"}),l.parts.length>0&&t.jsxRuntimeExports.jsx("div",{className:j.count,children:l.parts.length})]}),t.jsxRuntimeExports.jsx("button",{className:t.clx(j.clear,{[j.activeClear]:l.parts.length>0}),disabled:l.parts.length===0,onClick:()=>n(),children:"Clear all"})]}),l.parts.length>0?t.jsxRuntimeExports.jsxs("div",{className:j.cart,children:[t.jsxRuntimeExports.jsx("div",{className:j.products,children:r.map(u=>t.jsxRuntimeExports.jsxs("div",{className:j.product,children:[t.jsxRuntimeExports.jsxs("div",{className:j.productInfo,children:[t.jsxRuntimeExports.jsx("img",{src:`https://imagedelivery.net/${u.images[0].cfId}/w=500`,alt:"image",width:"100%",height:"100%",className:j.image}),t.jsxRuntimeExports.jsxs("div",{className:j.content,children:[t.jsxRuntimeExports.jsx("div",{className:j.name,children:u.name}),t.jsxRuntimeExports.jsxs("div",{className:j.price,children:["$",u.variants.find(m=>m.id===u.activeVariantId).price.amount*((u==null?void 0:u.quantity)||1)]})]})]}),t.jsxRuntimeExports.jsxs("div",{className:j.productButtons,children:[t.jsxRuntimeExports.jsx("div",{onClick:()=>{u.quantity!==1&&f(u)},className:j.productButton,children:t.jsxRuntimeExports.jsx(t.Icon,{name:"Minus",fill:"#757575",width:20,height:20})}),t.jsxRuntimeExports.jsx("div",{className:j.productCount,children:u.quantity}),t.jsxRuntimeExports.jsx("div",{onClick:()=>E(u),className:j.productButton,children:t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",fill:"#757575",width:20,height:20})})]})]},u.id))}),t.jsxRuntimeExports.jsxs("div",{className:j.bottom,children:[t.jsxRuntimeExports.jsxs("div",{className:j.subtotal,children:[t.jsxRuntimeExports.jsxs("div",{className:j.block,children:[t.jsxRuntimeExports.jsx("span",{children:"Subtotal"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Info",width:20,height:20,fill:"#757575"})]}),t.jsxRuntimeExports.jsxs("div",{children:["$",c().total]})]}),t.jsxRuntimeExports.jsx(t.Button,{onClick:()=>_("/checkout"),children:"Checkout"})]})]}):t.jsxRuntimeExports.jsx(rt,{})]})},rt=()=>t.jsxRuntimeExports.jsxs("div",{className:j.empty,children:[t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:"Handbag"})}),t.jsxRuntimeExports.jsx("span",{children:"Your cart is empty"}),t.jsxRuntimeExports.jsx("span",{children:"Check out the store's products and add them here"})]});exports.Button=t.Button;exports.Checkbox=t.Checkbox;exports.ChooseImage=t.ChooseImage;exports.ChooseImageModal=t.ChooseImageModal;exports.ColorPicker=t.ColorPicker;exports.ErrorableBlock=t.ErrorableBlock;exports.Icon=t.Icon;exports.Input=t.Input;exports.Loader=t.Loader;exports.Modal=t.Modal;exports.Picker=t.Picker;exports.Radio=t.Radio;exports.Select=t.Select;exports.Submodal=t.Submodal;exports.Switch=t.Switch;exports.Textarea=t.Textarea;exports.Tip=t.Tip;exports.Accordion=mt;exports.ButtonTypeSettings=st;exports.ButtonsSettings=Qe;exports.EmptyCart=rt;exports.HeaderButtons=Nn;exports.ItemsSettings=et;exports.LayoutSettings=Nt;exports.ListingSelector=Ps;exports.ProductOptions=Ks;exports.RangeSelector=nt;exports.ShoppingButton=it;exports.ShoppingModalCart=ct;exports.TextSettings=Z;exports.TypesText=K;

package/dist/ui.es.js

@@ -1,5 +1,5 @@
-import { j as t, c as M, I as x, a as G, S as V, T as lt, C as it, b as Y, D as rt, H as dt, B as X, v as tt, u as ut, d as mt, e as ot, f as at, M as gt } from "./index-DM5BJdAq.js";
-import { k as Xn, l as Qn, h as Wn, E as Jn, L as Kn, P as Zn, R as tc, g as ec, i as sc } from "./index-DM5BJdAq.js";
+import { j as t, c as M, I as x, a as G, S as V, T as lt, C as it, b as Y, D as rt, H as dt, B as X, v as tt, u as ut, d as mt, e as ot, f as at, M as gt } from "./index-7EQb7Nur.js";
+import { k as Xn, l as Qn, h as Wn, E as Jn, L as Kn, P as Zn, R as tc, g as ec, i as sc } from "./index-7EQb7Nur.js";
 import f from "react";
 const xt = "_accordion_9e4oa_1", ft = "_header_9e4oa_9", bt = "_icon_9e4oa_18", jt = "_open_9e4oa_21", vt = "_content_9e4oa_25", J = {
   accordion: xt,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@billgangcom/theme-lib",
-  "version": "1.23.2",
+  "version": "1.24.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -23,7 +23,7 @@
     }
   },
   "dependencies": {
-    "@billgangcom/frontend-lib": "^4.4.0",
+    "@billgangcom/frontend-lib": "^4.5.0",
     "axios": "^1.7.7",
     "react": "^18.3.1",
     "react-dnd": "^16.0.1",