@billgangcom/theme-lib 1.20.1 → 1.21.0

package/dist/ui.cjs.js

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

package/dist/ui.es.js

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

package/package.json

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