@billgangcom/theme-lib 1.11.0 → 1.12.0

package/dist/ui/ListingSelector/index.d.ts

@@ -1,6 +1,6 @@
 import { Other } from '../OtherSettings';
 import { Listing } from '../../abstractions';
-interface ListingData {
+export interface ProductData {
     id: number;
     link: {
         to: string;
@@ -10,7 +10,10 @@ interface ListingData {
             amount: number;
             currency: string;
         };
-        images: string[];
+        images: {
+            cfId: string;
+            id: number;
+        }[];
         isInStock: boolean;
         minPrice: {
             amount: number;
@@ -25,8 +28,52 @@ interface ListingData {
         };
         uniquePath: string;
     };
-    type: string;
+    type: 'PRODUCT';
 }
+export interface GroupData {
+    id: number;
+    link: {
+        to: string;
+    };
+    groupData: {
+        id: 254676093;
+        image: {
+            id: number;
+            cfId: string;
+        };
+        listingIdList: number[];
+        name: string;
+        shortDescription: string;
+        uniquePath: string;
+    };
+    type: 'GROUP';
+}
+export interface PostData {
+    id: number;
+    link: {
+        to: string;
+    };
+    postData: {
+        button: {
+            text: 'Read More';
+            link: 'https://google.com';
+        };
+        link: 'https://google.com';
+        text: 'Read More';
+        createdAtIso: '2024-11-05T13:25:34.121775Z';
+        image: {
+            id: 254785144;
+            cfId: 'A5gbiev6F8AaBvp6M146Kw/ea9b1c91-b69d-45a1-ab60-1f13656ed800';
+        };
+        cfId: 'A5gbiev6F8AaBvp6M146Kw/ea9b1c91-b69d-45a1-ab60-1f13656ed800';
+        id: 254785144;
+        shortDescription: 'test-subtitle';
+        title: 'test-post';
+        uniquePath: 'test-post';
+    };
+    type: 'POST';
+}
+export type ListingData<T extends 'GROUP' | 'PRODUCT' | 'POST' = 'PRODUCT'> = T extends 'GROUP' ? GroupData : T extends 'PRODUCT' ? ProductData : PostData;
 interface Props {
     isActiveItems?: boolean;
     setIsActiveItems?: (value: boolean) => void;
@@ -43,7 +90,7 @@ interface Props {
     addableOptions?: Record<string, any>;
     itemsType: 'select';
     itemsPlaceholder?: never;
-    itemsOptions: ListingData[];
+    itemsOptions: ListingData<'PRODUCT'>[];
 }
 export declare const ListingSelector: (props: Props) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/ui.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./index-C4eTUjpB.cjs"),m=require("react"),st="_accordion_2tiiw_1",nt="_header_2tiiw_9",ot="_icon_2tiiw_16",it="_open_2tiiw_19",ct="_content_2tiiw_23",H={accordion:st,header:nt,icon:ot,open:it,content:ct},lt=({title:x,content:s})=>{const[n,i]=m.useState(!1),[c,l]=m.useState(0),e=m.useRef(null),o=()=>{i(!n)};return m.useEffect(()=>{e.current&&l(n?e.current.scrollHeight:0)},[n]),t.jsxRuntimeExports.jsxs("div",{className:H.accordion,children:[t.jsxRuntimeExports.jsxs("div",{className:H.header,onClick:o,children:[t.jsxRuntimeExports.jsx("h3",{children:x}),t.jsxRuntimeExports.jsx("div",{className:t.clx(H.icon,{[H.open]:n}),children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretDown"})})]}),t.jsxRuntimeExports.jsx("div",{ref:e,className:H.content,style:{height:`${c}px`},children:t.jsxRuntimeExports.jsx("p",{children:s})})]})},rt="_wrapper_1g82c_2",at="_alignmentBlock_1g82c_8",ut="_title_1g82c_15",xt="_subtitle_1g82c_22",dt="_alignmentContent_1g82c_29",pt="_alignments_1g82c_35",mt="_alignment_1g82c_8",_t="_circle_1g82c_54",ht="_paddings_1g82c_61",gt="_padding_1g82c_61",jt="_input_1g82c_79",T={wrapper:rt,alignmentBlock:at,title:ut,subtitle:xt,alignmentContent:dt,alignments:pt,alignment:mt,circle:_t,paddings:ht,padding:gt,input:jt},bt=["topLeft","top","topRight","left","center","right","bottomLeft","bottom","bottomRight"],ft=["left","top","right","bottom"],Rt=x=>{const{alignment:s,padding:n,setPadding:i,setAlignment:c}=x;function l(){switch(s){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 e(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:T.layout,children:[t.jsxRuntimeExports.jsx("h3",{className:T.title,children:"Layout"}),t.jsxRuntimeExports.jsxs("div",{className:T.alignmentBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:T.subtitle,children:"Alignment"}),t.jsxRuntimeExports.jsxs("div",{className:T.alignmentContent,children:[t.jsxRuntimeExports.jsx("div",{className:T.alignments,children:bt.map(o=>t.jsxRuntimeExports.jsxs("div",{onClick:()=>{c(o)},className:T.alignment,children:[o!==s&&t.jsxRuntimeExports.jsx("div",{className:T.circle}),o===s&&t.jsxRuntimeExports.jsx(t.Icon,{name:l(),fill:"#FF3F19",width:22,height:22})]},o))}),t.jsxRuntimeExports.jsx("div",{className:T.paddings,children:ft.map(o=>t.jsxRuntimeExports.jsxs("label",{className:T.padding,children:[t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:e(o),width:20,height:20})}),t.jsxRuntimeExports.jsx(t.Input,{type:"text",value:String(n[o]),onChange:a=>i({...n,[o]:Number(a)}),paddingless:!0,borderless:!0})]}))})]})]})]})},Et="_subtitle_2zbxx_1",vt="_header_2zbxx_8",kt="_text_2zbxx_9",yt="_top_2zbxx_16",$t="_itemsBlock_2zbxx_23",z={subtitle:Et,header:vt,text:kt,top:yt,itemsBlock:$t},wt="_typeTexts_3zlec_1",It="_block_3zlec_7",Bt="_active_3zlec_18",V={typeTexts:wt,block:It,active:Bt},Ct=["bold","italic","underline","strike-through","code"],K=x=>{const{typesText:s,setTypesText:n}=x;function i(c){switch(c){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:V.typeTexts,children:Ct.map(c=>t.jsxRuntimeExports.jsx("div",{className:t.clx(V.block,{[V.active]:s.includes(c)}),onClick:()=>{const l=[...s];if(l.includes(c)){const e=l.filter(o=>o!==c);n(e)}else l.push(c),n(l)},children:t.jsxRuntimeExports.jsx(t.Icon,{name:i(c),fill:s.includes(c)?"#252525":"#757575",width:20,height:20})},String(c)))})},Q=x=>{const{typesText:s,isActiveText:n,setIsActiveText:i,text:c,setText:l,setTypesText:e,title:o,subtitle:a="Items"}=x;return t.jsxRuntimeExports.jsxs("div",{className:z.text,children:[(o||n!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:z.top,children:[o&&t.jsxRuntimeExports.jsx("h3",{className:z.title,children:o}),n!==void 0&&i&&t.jsxRuntimeExports.jsx(t.Switch,{current:n,onChange:f=>i(f)})]}),t.jsxRuntimeExports.jsxs("div",{className:z.itemsBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:z.subtitle,children:a}),t.jsxRuntimeExports.jsx(t.Textarea,{onChange:f=>l(f),value:c,maxLength:150}),t.jsxRuntimeExports.jsx(K,{typesText:s,setTypesText:e})]})]})},Nt="_subtitle_11qr1_1",Tt="_header_11qr1_8",St="_text_11qr1_9",Pt="_productsBlock_11qr1_10",At="_top_11qr1_22",Ot="_itemsBlock_11qr1_29",Dt="_typeTexts_11qr1_35",Lt="_block_11qr1_41",qt="_active_11qr1_52",Mt="_products_11qr1_10",Ht="_product_11qr1_10",zt="_button_11qr1_70",Ft="_disabled_11qr1_80",Gt="_image_11qr1_84",Ut="_info_11qr1_91",Xt="_name_11qr1_102",Yt="_buttons_11qr1_106",Vt="_modal_11qr1_112",Jt="_link_11qr1_130",Kt="_modalOptions_11qr1_136",v={subtitle:Nt,header:Tt,text:St,productsBlock:Pt,top:At,itemsBlock:Ot,typeTexts:Dt,block:Lt,active:qt,products:Mt,product:Ht,button:zt,disabled:Ft,image:Gt,info:Ut,name:Xt,buttons:Yt,modal:Vt,link:Jt,modalOptions:Kt},Qt=x=>{const{activeItem:s,setActiveItem:n,popupPosition:i,modalOptions:c,setIsOpenModal:l}=x;return t.jsxRuntimeExports.jsxs("div",{className:v.modal,onClick:e=>{e.stopPropagation()},style:{top:`${i.top}px`,left:`${i.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:v.top,children:[t.jsxRuntimeExports.jsx("h3",{children:s.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>{n(null),l(!1)}})]}),t.jsxRuntimeExports.jsx("div",{className:v.modalOptions,children:c.map(e=>{if(e.type==="image")return t.jsxRuntimeExports.jsx(t.ChooseImage,{label:"Put up an attractive image",onChange:o=>{const a={...s,[e.field]:o};n(a)}});if(e.type==="text")return t.jsxRuntimeExports.jsx(Q,{typesText:s[e.field.type],setTypesText:o=>{const a={...s,[e.field.type]:o};n(a)},text:s[e.field.text]||"",setText:o=>{const a={...s,[e.field.text]:o};n(a)},subtitle:e.label});if(e.type==="input")return t.jsxRuntimeExports.jsx(t.Input,{onChange:o=>{const a={...s,[e.field]:o};n(a)},value:s[e.field]||"",label:e.label,placeholder:e.placeholder});if(e.type==="inputSwitch")return t.jsxRuntimeExports.jsxs("div",{className:v.link,children:[t.jsxRuntimeExports.jsx(t.Input,{onChange:o=>{const a={...s,[e.field.text]:o};n(a)},value:s[e.field.text]||"",label:e.inputLabel,placeholder:e.placeholder}),t.jsxRuntimeExports.jsx(t.Switch,{current:!!s[e.field.switch]||!1,label:e.switchLabel,onChange:o=>{const a={...s,[e.field.switch]:o};n(a)}})]});if(e.type==="list")return t.jsxRuntimeExports.jsx(Z,{items:s[e.field]||[],setItems:o=>{const a={...s,[e.field]:o};n(a)},itemsType:"select",draggable:e.draggable||!1,itemsOptions:e.itemsOptions,deletable:e.deletable||!1,editable:!1,subtitle:e.label});if(e.type==="select")return t.jsxRuntimeExports.jsx(t.Select,{options:e.itemsOptions,onChange:o=>{const a={...s,[e.field]:o};n(a)},label:e.label,value:s[e.field]||"String",leftAddon:e.leftAddon&&e.leftAddon==="icon"&&t.jsxRuntimeExports.jsx(t.Icon,{name:s[e.field]})})})})]})},Wt="_other_1wtgi_1",Zt="_subtitle_1wtgi_7",te="_items_1wtgi_14",J={other:Wt,subtitle:Zt,items:te},W=x=>{const{items:s,title:n="Other"}=x;return t.jsxRuntimeExports.jsxs("div",{className:J.other,children:[t.jsxRuntimeExports.jsx("h5",{className:J.subtitle,children:n}),t.jsxRuntimeExports.jsx("div",{className:J.items,children:s.map(i=>t.jsxRuntimeExports.jsx(t.Switch,{current:i.isItem,onChange:c=>i.setIsItem(c),label:i.label,hasBackground:!0,paddingless:!1}))})]})},ee=x=>{const{index:s,moveProduct:n,children:i}=x,[,c]=t.useDrop({accept:"product",hover(o){o.index!==s&&(n(o.index,s),o.index=s)}}),[{isDragging:l},e]=t.useDrag({type:"product",item:{index:s},collect:o=>({isDragging:o.isDragging()})});return t.jsxRuntimeExports.jsx("div",{ref:o=>e(c(o)),className:`${v.product} ${l?v.dragging:""}`,children:i})},Z=x=>{const{isActiveItems:s,setIsActiveItems:n,items:i,setItems:c,other:l,title:e,subtitle:o,editable:a=!0,draggable:f=!1,withImage:d=!1,deletable:b=!0,addable:j=!0,itemsType:k,itemsPlaceholder:_="",itemsOptions:p,hasRangeSelector:w=!1,rangeSelectorOptions:G,modalOptions:U,addableOptions:q={},limit:C}=x,[P,A]=m.useState(null),[Y,X]=m.useState({top:0,left:0}),[u,h]=m.useState(!1),I=(r,y)=>{const B=[...i],[g]=B.splice(r,1);B.splice(y,0,g),c(B)};m.useEffect(()=>{const r=()=>{A(null),h(!1)};return document.body.addEventListener("click",r),A(null),h(!1),()=>{A(null),h(!1),document.body.removeEventListener("click",r)}},[]),m.useEffect(()=>{if(P){const r=[...i].map(y=>y.id===P.id?P:y);c(r)}},[P]);const R=(r,y)=>{r.stopPropagation(),h(!0);const B=r.target.getBoundingClientRect(),g=500,M=window.innerHeight;let S=B.top+window.scrollY;console.log(g),S+g>M&&(S=M-g-20),X({top:S-80,left:B.left-30}),A(y)};function D(r){if(d)return r?t.jsxRuntimeExports.jsx("img",{src:`https://imagedelivery.net/${r[0]}/w=1000`,alt:"image",width:16,height:16}):t.jsxRuntimeExports.jsx(t.Icon,{name:"Image",width:16,height:16,fill:"#757575"})}const N=(r,y)=>{const B=t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[f&&t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:"DotsSixVertical",hoverable:!0,width:20,height:20})}),k==="select"&&t.jsxRuntimeExports.jsx(t.Select,{onChange:g=>{const S=[...i].map(O=>O.id===r.id?{...r,name:g}:O);A({...r,name:g}),c([...S])},value:r.name,options:p,leftAddon:D(r.images)}),k==="input"&&t.jsxRuntimeExports.jsx(t.Input,{onChange:g=>{const S=[...i].map(O=>O.id===r.id?{...r,name:g}:O);c([...S])},value:r.name,placeholder:_}),k==="image"&&t.jsxRuntimeExports.jsx(t.ChooseImage,{onChange:g=>{const S=[...i].map(O=>O.id===r.id?{...r,images:g}:O);c([...S])}}),t.jsxRuntimeExports.jsxs("div",{className:v.buttons,children:[a&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:g=>R(g,r)}),b&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,width:20,height:20,fill:"#C12A2A",onClick:()=>c(i.filter(g=>g.id!==r.id))})]})]});return f?t.jsxRuntimeExports.jsx(ee,{product:r,index:y,moveProduct:I,children:B},r.id):t.jsxRuntimeExports.jsx("div",{className:v.product,children:B},r.id)};return t.jsxRuntimeExports.jsxs("div",{className:v.productsBlock,children:[(e||s!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:v.top,children:[e&&t.jsxRuntimeExports.jsx("h3",{className:v.title,children:e}),s!==void 0&&t.jsxRuntimeExports.jsx(t.Switch,{current:s,onChange:r=>n==null?void 0:n(r)})]}),P&&a&&U&&u&&t.jsxRuntimeExports.jsx(Qt,{activeItem:P,setActiveItem:A,popupPosition:Y,modalOptions:U,setIsOpenModal:h}),w&&G&&t.jsxRuntimeExports.jsx(et,{...G}),t.jsxRuntimeExports.jsxs("div",{className:v.products,children:[o&&t.jsxRuntimeExports.jsx("h5",{className:v.subtitle,children:o}),f?t.jsxRuntimeExports.jsx(t.DndProvider,{backend:t.HTML5Backend,children:i.map((r,y)=>N(r,y))}):i.map((r,y)=>N(r,y)),j&&t.jsxRuntimeExports.jsxs(t.Button,{className:t.clx(v.button,{[v.disabled]:!!(C&&C<=i.length)}),size:"s",disabled:!!(C&&C<=i.length),onClick:()=>{const r=[...i];k==="select"?r.push({name:p[0]||`Product ${i.length+1}`,id:t.v4(),...q}):k==="input"?r.push({name:"",id:t.v4(),...q}):r.push({name:`Image ${i.length+1}`,id:t.v4(),...q}),c(r)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]}),l!==void 0&&t.jsxRuntimeExports.jsx(W,{items:l})]})},se="_subtitle_41klp_1",ne="_header_41klp_8",oe="_text_41klp_9",ie="_productsBlock_41klp_10",ce="_buttonsBlock_41klp_11",le="_top_41klp_21",re="_itemsBlock_41klp_28",ae="_typeTexts_41klp_34",ue="_block_41klp_40",xe="_active_41klp_51",de="_products_41klp_10",pe="_product_41klp_10",me="_button_41klp_11",_e="_image_41klp_79",he="_info_41klp_86",ge="_name_41klp_97",je="_buttons_41klp_11",be="_modal_41klp_107",fe="_other_41klp_124",Re="_options_41klp_130",L={subtitle:se,header:ne,text:oe,productsBlock:ie,buttonsBlock:ce,top:le,itemsBlock:re,typeTexts:ae,block:ue,active:xe,products:de,product:pe,button:me,image:_e,info:he,name:ge,buttons:je,modal:be,other:fe,options:Re},Ee=x=>{const{activeButton:s,setActiveButton:n,popupPosition:i}=x,[c,l]=m.useState(s.typesText),[e,o]=m.useState(s.destination),[a,f]=m.useState(s.link||""),[d,b]=m.useState(s.text||"");return m.useEffect(()=>{n({...s,...{text:d,link:a,destination:e,typesText:c}})},[c,e,a,d]),t.jsxRuntimeExports.jsxs("div",{className:L.modal,onClick:j=>{j.stopPropagation()},style:{top:`${i.top}px`,left:`${i.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:L.top,children:[t.jsxRuntimeExports.jsx("h3",{children:s.type}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>n(null)})]}),t.jsxRuntimeExports.jsxs("div",{className:L.options,children:[t.jsxRuntimeExports.jsx(t.Select,{label:"Destination",onChange:j=>o(j),options:["Go to Page","Open Link"],value:e}),e==="Go to Page"?t.jsxRuntimeExports.jsx(t.Select,{label:"Go to",onChange:()=>{},options:[],value:"Homepage"}):t.jsxRuntimeExports.jsx(t.Input,{onChange:j=>f(j),value:a,placeholder:"https://",label:"Link"}),t.jsxRuntimeExports.jsx(t.Switch,{current:!1,label:"Open in new tab"}),t.jsxRuntimeExports.jsx(t.Textarea,{onChange:j=>b(j),value:d,label:"Text",maxLength:150}),t.jsxRuntimeExports.jsx(K,{typesText:c,setTypesText:l})]})]})},ve="_subtitle_1y5sw_1",ke="_header_1y5sw_8",ye="_text_1y5sw_9",$e="_productsBlock_1y5sw_10",we="_buttonsBlock_1y5sw_11",Ie="_top_1y5sw_22",Be="_itemsBlock_1y5sw_29",Ce="_typeTexts_1y5sw_35",Ne="_block_1y5sw_41",Te="_active_1y5sw_52",Se="_products_1y5sw_10",Pe="_product_1y5sw_10",Ae="_button_1y5sw_11",Oe="_image_1y5sw_80",De="_info_1y5sw_87",Le="_name_1y5sw_98",qe="_buttons_1y5sw_11",Me="_modal_1y5sw_108",He="_other_1y5sw_125",ze="_options_1y5sw_131",F={subtitle:ve,header:ke,text:ye,productsBlock:$e,buttonsBlock:we,top:Ie,itemsBlock:Be,typeTexts:Ce,block:Ne,active:Te,products:Se,product:Pe,button:Ae,image:Oe,info:De,name:Le,buttons:qe,modal:Me,other:He,options:ze},tt=x=>{const{buttons:s,setButtons:n,deletable:i=!0,addable:c=!0}=x,[l,e]=m.useState(null),[o,a]=m.useState({top:0,left:0});m.useEffect(()=>{const d=()=>{e(null)};return document.body.addEventListener("click",d),e(null),()=>{e(null),document.body.removeEventListener("click",d)}},[]),m.useEffect(()=>{if(l){const d=[...s].map(b=>b.id===l.id?l:b);n(d)}},[l]);const f=(d,b)=>{d.stopPropagation();const j=d.target.getBoundingClientRect(),k=490,_=window.innerHeight;let p=j.top+window.scrollY;p+k>_&&(p=_-k-20),a({top:p,left:j.left-30}),e(b)};return t.jsxRuntimeExports.jsxs("div",{className:F.products,children:[t.jsxRuntimeExports.jsx("h5",{className:F.subtitle,children:"Button Type"}),s.map(d=>t.jsxRuntimeExports.jsxs("div",{className:F.product,children:[t.jsxRuntimeExports.jsx(t.Select,{onChange:b=>{const k=[...s].map(_=>_.id===d.id?{...d,type:b}:_);n(k)},value:d.type,options:["Primary","Secondary","Tertiary"]}),t.jsxRuntimeExports.jsxs("div",{className:F.buttons,children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:b=>{f(b,d)}}),i&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,onClick:()=>{const b=s.filter(j=>j.id!==d.id);n(b)},width:20,height:20,fill:"#C12A2A"})]})]},d.id)),l&&t.jsxRuntimeExports.jsx(Ee,{activeButton:l,setActiveButton:e,popupPosition:o}),c&&t.jsxRuntimeExports.jsxs(t.Button,{className:F.button,size:"s",onClick:()=>{const d=[...s];d.push({type:"Primary",id:t.v4(),typesText:[],destination:"Go to Page",text:""}),n(d)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]})},Fe=x=>{const{isActiveButtons:s,setIsActiveButtons:n,buttons:i,setButtons:c}=x;return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs("div",{className:L.buttonsBlock,children:[t.jsxRuntimeExports.jsxs("div",{className:L.top,children:[t.jsxRuntimeExports.jsx("h3",{className:L.title,children:"Buttons"}),t.jsxRuntimeExports.jsx(t.Switch,{current:s,onChange:l=>n(l)})]}),t.jsxRuntimeExports.jsx(tt,{buttons:i,setButtons:c})]})})},Ge="_wrapper_tn7gb_1",Ue="_subtitle_tn7gb_7",Xe="_content_tn7gb_14",Ye="_range_tn7gb_21",Ve="_track_tn7gb_26",Je="_progress_tn7gb_35",Ke="_dots_tn7gb_45",Qe="_dot_tn7gb_45",We="_active_tn7gb_62",Ze="_input_tn7gb_74",ts="_countBlock_tn7gb_88",es="_count_tn7gb_88",ss="_controls_tn7gb_103",ns="_button_tn7gb_108",E={wrapper:Ge,subtitle:Ue,content:Xe,range:Ye,track:Ve,progress:Je,dots:Ke,dot:Qe,active:We,input:Ze,countBlock:ts,count:es,controls:ss,button:ns},et=x=>{const{label:s,min:n=1,max:i=4,step:c=1,count:l,setCount:e}=x,[o,a]=m.useState(!1),f=Array.from({length:(i-n)/c+1}),d=(l-n)/(i-n)*100,b=()=>{l<i&&e(l+c)},j=()=>{l>n&&e(l-c)},k=_=>{const p=n+_*c;e(p)};return t.jsxRuntimeExports.jsxs("div",{className:E.wrapper,children:[s&&t.jsxRuntimeExports.jsx("h5",{className:E.subtitle,children:s}),t.jsxRuntimeExports.jsxs("div",{className:E.content,children:[t.jsxRuntimeExports.jsxs("div",{className:E.range,children:[t.jsxRuntimeExports.jsx("div",{className:E.track}),t.jsxRuntimeExports.jsx("div",{className:E.progress,style:{width:`${d}%`}}),t.jsxRuntimeExports.jsx("div",{className:E.dots,children:f.map((_,p)=>{const w=p<=(l-n)/c;return t.jsxRuntimeExports.jsx("button",{onClick:()=>k(p),className:t.clx(E.dot,{[E.active]:w,[E.inactive]:!w,[E.dragging]:o}),"aria-label":`Set value to ${n+p*c}`},p)})}),t.jsxRuntimeExports.jsx("input",{type:"range",min:n,max:i,step:c,value:l,onChange:_=>e(Number(_.target.value)),onMouseDown:()=>a(!0),onMouseUp:()=>a(!1),onTouchStart:()=>a(!0),onTouchEnd:()=>a(!1),className:E.input})]}),t.jsxRuntimeExports.jsxs("div",{className:E.countBlock,children:[t.jsxRuntimeExports.jsx(t.Input,{type:"number",min:n,max:i,paddingless:!0,onChange:_=>{const p=Number(_);p>i?e(i):p<n?e(n):e(p)},value:String(l)}),t.jsxRuntimeExports.jsxs("div",{className:E.controls,children:[t.jsxRuntimeExports.jsx("button",{onClick:b,disabled:l>=i,className:E.button,"aria-label":"Increment count",children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretUp",width:15,height:15})}),t.jsxRuntimeExports.jsx("button",{onClick:j,disabled:l<=n,className:E.button,"aria-label":"Decrement count",children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretDown",width:15,height:15})})]})]})]})]})},os="_subtitle_1nl8x_1",is="_header_1nl8x_8",cs="_text_1nl8x_9",ls="_productsBlock_1nl8x_10",rs="_top_1nl8x_22",as="_itemsBlock_1nl8x_29",us="_typeTexts_1nl8x_35",xs="_block_1nl8x_41",ds="_active_1nl8x_52",ps="_products_1nl8x_10",ms="_product_1nl8x_10",_s="_button_1nl8x_70",hs="_image_1nl8x_80",gs="_info_1nl8x_87",js="_name_1nl8x_98",bs="_buttons_1nl8x_102",fs="_modal_1nl8x_108",Rs="_link_1nl8x_126",Es="_modalOptions_1nl8x_132",$={subtitle:os,header:is,text:cs,productsBlock:ls,top:rs,itemsBlock:as,typeTexts:us,block:xs,active:ds,products:ps,product:ms,button:_s,image:hs,info:gs,name:js,buttons:bs,modal:fs,link:Rs,modalOptions:Es},vs=x=>{const{activeItem:s,setActiveItem:n,popupPosition:i,setIsOpenModal:c}=x;return t.jsxRuntimeExports.jsxs("div",{className:$.modal,onClick:l=>{l.stopPropagation()},style:{top:`${i.top}px`,left:`${i.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:$.top,children:[t.jsxRuntimeExports.jsx("h3",{children:s.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>{c(!1),n(null)}})]}),t.jsxRuntimeExports.jsx("div",{className:$.modalOptions,children:t.jsxRuntimeExports.jsx(t.ChooseImage,{label:"Put up an attractive image",onChange:l=>{const e={...s,images:l,imagePath:l[0]};n(e)}})})]})},ks=x=>{const{index:s,moveProduct:n,children:i}=x,[,c]=t.useDrop({accept:"product",hover(o){o.index!==s&&(n(o.index,s),o.index=s)}}),[{isDragging:l},e]=t.useDrag({type:"product",item:{index:s},collect:o=>({isDragging:o.isDragging()})});return t.jsxRuntimeExports.jsx("div",{ref:o=>e(c(o)),className:`${$.product} ${l?$.dragging:""}`,children:i})},ys=x=>{const{isActiveItems:s,setIsActiveItems:n,items:i,setItems:c,other:l,title:e,subtitle:o,editable:a=!0,draggable:f=!1,withImage:d=!1,deletable:b=!0,addable:j=!0,itemsType:k,itemsOptions:_}=x,[p,w]=m.useState(null),[G,U]=m.useState({top:0,left:0}),[q,C]=m.useState(!1),P=(u,h)=>{const I=[...i],[R]=I.splice(u,1);I.splice(h,0,R),c(I)};m.useEffect(()=>{const u=()=>{w(null),C(!1)};return document.body.addEventListener("click",u),w(null),C(!1),()=>{w(null),C(!1),document.body.removeEventListener("click",u)}},[]),m.useEffect(()=>{if(p){const u=[...i].map(h=>h.id===p.id?p:h);c(u)}},[p]);const A=(u,h)=>{u.stopPropagation();const I=u.target.getBoundingClientRect(),R=100,D=window.innerHeight;let N=I.top+window.scrollY;N+R>D&&(N=D-R-20),C(!0),U({top:N-80,left:I.left-30}),w(h)};function Y(u){if(d)return u?t.jsxRuntimeExports.jsx("img",{src:`https://imagedelivery.net/${u}/w=1000`,alt:"image",width:16,height:16}):t.jsxRuntimeExports.jsx(t.Icon,{name:"Image",width:16,height:16,fill:"#757575"})}const X=(u,h)=>{const I=t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[f&&t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:"DotsSixVertical",hoverable:!0,width:20,height:20})}),k==="select"&&t.jsxRuntimeExports.jsx(t.Select,{onChange:R=>{const D=[...i],N=Number(R.split(" ")[1]),r=_.find(g=>g.id===N);if(!r)return;const y={...r.productData.stats,newPrice:r.productData.minPrice.amount,oldPrice:r.productData.compareAtPrice.amount},B=D.map(g=>g.id===u.id?{...u,name:R,listingId:N,stats:y}:g);w({...u,name:R,listingId:N}),c([...B])},value:u.name,options:[..._.map(R=>`Product ${R.id}`)],leftAddon:Y(u.images[0])}),t.jsxRuntimeExports.jsxs("div",{className:$.buttons,children:[a&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:R=>A(R,u)}),b&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,width:20,height:20,fill:"#C12A2A",onClick:()=>c(i.filter(R=>R.id!==u.id))})]})]});return f?t.jsxRuntimeExports.jsx(ks,{product:u,index:h,moveProduct:P,children:I},u.id):t.jsxRuntimeExports.jsx("div",{className:$.product,children:I},u.id)};return t.jsxRuntimeExports.jsxs("div",{className:$.productsBlock,children:[(e||s!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:$.top,children:[e&&t.jsxRuntimeExports.jsx("h3",{className:$.title,children:e}),s!==void 0&&t.jsxRuntimeExports.jsx(t.Switch,{current:s,onChange:u=>n==null?void 0:n(u)})]}),q&&p&&t.jsxRuntimeExports.jsx(vs,{activeItem:p,setActiveItem:w,setIsOpenModal:C,popupPosition:G}),t.jsxRuntimeExports.jsxs("div",{className:$.products,children:[o&&t.jsxRuntimeExports.jsx("h5",{className:$.subtitle,children:o}),f?t.jsxRuntimeExports.jsx(t.DndProvider,{backend:t.HTML5Backend,children:i.map((u,h)=>X(u,h))}):i.map((u,h)=>X(u,h)),j&&t.jsxRuntimeExports.jsxs(t.Button,{className:$.button,size:"s",onClick:()=>{const u=[...i],h=_[0].id;u.push({name:`Product ${h}`,id:t.v4(),listingId:h,imagePath:"",images:[],stats:{..._[0].productData.stats,newPrice:_[0].productData.minPrice.amount,oldPrice:_[0].productData.compareAtPrice.amount}}),c(u)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]}),l!==void 0&&t.jsxRuntimeExports.jsx(W,{items:l})]})};exports.Button=t.Button;exports.Checkbox=t.Checkbox;exports.ChooseImage=t.ChooseImage;exports.ChooseImageModal=t.ChooseImageModal;exports.ColorPicker=t.ColorPicker;exports.Icon=t.Icon;exports.Input=t.Input;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=lt;exports.ButtonTypeSettings=tt;exports.ButtonsSettings=Fe;exports.ItemsSettings=Z;exports.LayoutSettings=Rt;exports.ListingSelector=ys;exports.RangeSelector=et;exports.TextSettings=Q;exports.TypesText=K;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./index-C4eTUjpB.cjs"),m=require("react"),st="_accordion_2tiiw_1",nt="_header_2tiiw_9",ot="_icon_2tiiw_16",it="_open_2tiiw_19",ct="_content_2tiiw_23",H={accordion:st,header:nt,icon:ot,open:it,content:ct},lt=({title:x,content:s})=>{const[n,i]=m.useState(!1),[c,l]=m.useState(0),e=m.useRef(null),o=()=>{i(!n)};return m.useEffect(()=>{e.current&&l(n?e.current.scrollHeight:0)},[n]),t.jsxRuntimeExports.jsxs("div",{className:H.accordion,children:[t.jsxRuntimeExports.jsxs("div",{className:H.header,onClick:o,children:[t.jsxRuntimeExports.jsx("h3",{children:x}),t.jsxRuntimeExports.jsx("div",{className:t.clx(H.icon,{[H.open]:n}),children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretDown"})})]}),t.jsxRuntimeExports.jsx("div",{ref:e,className:H.content,style:{height:`${c}px`},children:t.jsxRuntimeExports.jsx("p",{children:s})})]})},rt="_wrapper_1g82c_2",at="_alignmentBlock_1g82c_8",ut="_title_1g82c_15",xt="_subtitle_1g82c_22",dt="_alignmentContent_1g82c_29",pt="_alignments_1g82c_35",mt="_alignment_1g82c_8",_t="_circle_1g82c_54",ht="_paddings_1g82c_61",gt="_padding_1g82c_61",jt="_input_1g82c_79",T={wrapper:rt,alignmentBlock:at,title:ut,subtitle:xt,alignmentContent:dt,alignments:pt,alignment:mt,circle:_t,paddings:ht,padding:gt,input:jt},bt=["topLeft","top","topRight","left","center","right","bottomLeft","bottom","bottomRight"],ft=["left","top","right","bottom"],Rt=x=>{const{alignment:s,padding:n,setPadding:i,setAlignment:c}=x;function l(){switch(s){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 e(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:T.layout,children:[t.jsxRuntimeExports.jsx("h3",{className:T.title,children:"Layout"}),t.jsxRuntimeExports.jsxs("div",{className:T.alignmentBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:T.subtitle,children:"Alignment"}),t.jsxRuntimeExports.jsxs("div",{className:T.alignmentContent,children:[t.jsxRuntimeExports.jsx("div",{className:T.alignments,children:bt.map(o=>t.jsxRuntimeExports.jsxs("div",{onClick:()=>{c(o)},className:T.alignment,children:[o!==s&&t.jsxRuntimeExports.jsx("div",{className:T.circle}),o===s&&t.jsxRuntimeExports.jsx(t.Icon,{name:l(),fill:"#FF3F19",width:22,height:22})]},o))}),t.jsxRuntimeExports.jsx("div",{className:T.paddings,children:ft.map(o=>t.jsxRuntimeExports.jsxs("label",{className:T.padding,children:[t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:e(o),width:20,height:20})}),t.jsxRuntimeExports.jsx(t.Input,{type:"text",value:String(n[o]),onChange:a=>i({...n,[o]:Number(a)}),paddingless:!0,borderless:!0})]}))})]})]})]})},Et="_subtitle_2zbxx_1",vt="_header_2zbxx_8",kt="_text_2zbxx_9",yt="_top_2zbxx_16",$t="_itemsBlock_2zbxx_23",z={subtitle:Et,header:vt,text:kt,top:yt,itemsBlock:$t},wt="_typeTexts_3zlec_1",It="_block_3zlec_7",Bt="_active_3zlec_18",V={typeTexts:wt,block:It,active:Bt},Ct=["bold","italic","underline","strike-through","code"],K=x=>{const{typesText:s,setTypesText:n}=x;function i(c){switch(c){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:V.typeTexts,children:Ct.map(c=>t.jsxRuntimeExports.jsx("div",{className:t.clx(V.block,{[V.active]:s.includes(c)}),onClick:()=>{const l=[...s];if(l.includes(c)){const e=l.filter(o=>o!==c);n(e)}else l.push(c),n(l)},children:t.jsxRuntimeExports.jsx(t.Icon,{name:i(c),fill:s.includes(c)?"#252525":"#757575",width:20,height:20})},String(c)))})},Q=x=>{const{typesText:s,isActiveText:n,setIsActiveText:i,text:c,setText:l,setTypesText:e,title:o,subtitle:a="Items"}=x;return t.jsxRuntimeExports.jsxs("div",{className:z.text,children:[(o||n!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:z.top,children:[o&&t.jsxRuntimeExports.jsx("h3",{className:z.title,children:o}),n!==void 0&&i&&t.jsxRuntimeExports.jsx(t.Switch,{current:n,onChange:f=>i(f)})]}),t.jsxRuntimeExports.jsxs("div",{className:z.itemsBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:z.subtitle,children:a}),t.jsxRuntimeExports.jsx(t.Textarea,{onChange:f=>l(f),value:c,maxLength:150}),t.jsxRuntimeExports.jsx(K,{typesText:s,setTypesText:e})]})]})},Nt="_subtitle_11qr1_1",Tt="_header_11qr1_8",St="_text_11qr1_9",Pt="_productsBlock_11qr1_10",At="_top_11qr1_22",Ot="_itemsBlock_11qr1_29",Dt="_typeTexts_11qr1_35",Lt="_block_11qr1_41",qt="_active_11qr1_52",Mt="_products_11qr1_10",Ht="_product_11qr1_10",zt="_button_11qr1_70",Ft="_disabled_11qr1_80",Gt="_image_11qr1_84",Ut="_info_11qr1_91",Xt="_name_11qr1_102",Yt="_buttons_11qr1_106",Vt="_modal_11qr1_112",Jt="_link_11qr1_130",Kt="_modalOptions_11qr1_136",v={subtitle:Nt,header:Tt,text:St,productsBlock:Pt,top:At,itemsBlock:Ot,typeTexts:Dt,block:Lt,active:qt,products:Mt,product:Ht,button:zt,disabled:Ft,image:Gt,info:Ut,name:Xt,buttons:Yt,modal:Vt,link:Jt,modalOptions:Kt},Qt=x=>{const{activeItem:s,setActiveItem:n,popupPosition:i,modalOptions:c,setIsOpenModal:l}=x;return t.jsxRuntimeExports.jsxs("div",{className:v.modal,onClick:e=>{e.stopPropagation()},style:{top:`${i.top}px`,left:`${i.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:v.top,children:[t.jsxRuntimeExports.jsx("h3",{children:s.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>{n(null),l(!1)}})]}),t.jsxRuntimeExports.jsx("div",{className:v.modalOptions,children:c.map(e=>{if(e.type==="image")return t.jsxRuntimeExports.jsx(t.ChooseImage,{label:"Put up an attractive image",onChange:o=>{const a={...s,[e.field]:o};n(a)}});if(e.type==="text")return t.jsxRuntimeExports.jsx(Q,{typesText:s[e.field.type],setTypesText:o=>{const a={...s,[e.field.type]:o};n(a)},text:s[e.field.text]||"",setText:o=>{const a={...s,[e.field.text]:o};n(a)},subtitle:e.label});if(e.type==="input")return t.jsxRuntimeExports.jsx(t.Input,{onChange:o=>{const a={...s,[e.field]:o};n(a)},value:s[e.field]||"",label:e.label,placeholder:e.placeholder});if(e.type==="inputSwitch")return t.jsxRuntimeExports.jsxs("div",{className:v.link,children:[t.jsxRuntimeExports.jsx(t.Input,{onChange:o=>{const a={...s,[e.field.text]:o};n(a)},value:s[e.field.text]||"",label:e.inputLabel,placeholder:e.placeholder}),t.jsxRuntimeExports.jsx(t.Switch,{current:!!s[e.field.switch]||!1,label:e.switchLabel,onChange:o=>{const a={...s,[e.field.switch]:o};n(a)}})]});if(e.type==="list")return t.jsxRuntimeExports.jsx(Z,{items:s[e.field]||[],setItems:o=>{const a={...s,[e.field]:o};n(a)},itemsType:"select",draggable:e.draggable||!1,itemsOptions:e.itemsOptions,deletable:e.deletable||!1,editable:!1,subtitle:e.label});if(e.type==="select")return t.jsxRuntimeExports.jsx(t.Select,{options:e.itemsOptions,onChange:o=>{const a={...s,[e.field]:o};n(a)},label:e.label,value:s[e.field]||"String",leftAddon:e.leftAddon&&e.leftAddon==="icon"&&t.jsxRuntimeExports.jsx(t.Icon,{name:s[e.field]})})})})]})},Wt="_other_1wtgi_1",Zt="_subtitle_1wtgi_7",te="_items_1wtgi_14",J={other:Wt,subtitle:Zt,items:te},W=x=>{const{items:s,title:n="Other"}=x;return t.jsxRuntimeExports.jsxs("div",{className:J.other,children:[t.jsxRuntimeExports.jsx("h5",{className:J.subtitle,children:n}),t.jsxRuntimeExports.jsx("div",{className:J.items,children:s.map(i=>t.jsxRuntimeExports.jsx(t.Switch,{current:i.isItem,onChange:c=>i.setIsItem(c),label:i.label,hasBackground:!0,paddingless:!1}))})]})},ee=x=>{const{index:s,moveProduct:n,children:i}=x,[,c]=t.useDrop({accept:"product",hover(o){o.index!==s&&(n(o.index,s),o.index=s)}}),[{isDragging:l},e]=t.useDrag({type:"product",item:{index:s},collect:o=>({isDragging:o.isDragging()})});return t.jsxRuntimeExports.jsx("div",{ref:o=>e(c(o)),className:`${v.product} ${l?v.dragging:""}`,children:i})},Z=x=>{const{isActiveItems:s,setIsActiveItems:n,items:i,setItems:c,other:l,title:e,subtitle:o,editable:a=!0,draggable:f=!1,withImage:d=!1,deletable:b=!0,addable:g=!0,itemsType:k,itemsPlaceholder:_="",itemsOptions:p,hasRangeSelector:w=!1,rangeSelectorOptions:G,modalOptions:U,addableOptions:q={},limit:C}=x,[P,A]=m.useState(null),[Y,X]=m.useState({top:0,left:0}),[u,h]=m.useState(!1),I=(r,y)=>{const B=[...i],[j]=B.splice(r,1);B.splice(y,0,j),c(B)};m.useEffect(()=>{const r=()=>{A(null),h(!1)};return document.body.addEventListener("click",r),A(null),h(!1),()=>{A(null),h(!1),document.body.removeEventListener("click",r)}},[]),m.useEffect(()=>{if(P){const r=[...i].map(y=>y.id===P.id?P:y);c(r)}},[P]);const R=(r,y)=>{r.stopPropagation(),h(!0);const B=r.target.getBoundingClientRect(),j=500,M=window.innerHeight;let S=B.top+window.scrollY;S+j>M&&(S=M-j-20),X({top:S-80,left:B.left-30}),A(y)};function D(r){if(d)return r?t.jsxRuntimeExports.jsx("img",{src:`https://imagedelivery.net/${r[0]}/w=1000`,alt:"image",width:16,height:16}):t.jsxRuntimeExports.jsx(t.Icon,{name:"Image",width:16,height:16,fill:"#757575"})}const N=(r,y)=>{const B=t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[f&&t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:"DotsSixVertical",hoverable:!0,width:20,height:20})}),k==="select"&&t.jsxRuntimeExports.jsx(t.Select,{onChange:j=>{const S=[...i].map(O=>O.id===r.id?{...r,name:j}:O);A({...r,name:j}),c([...S])},value:r.name,options:p,leftAddon:D(r.images)}),k==="input"&&t.jsxRuntimeExports.jsx(t.Input,{onChange:j=>{const S=[...i].map(O=>O.id===r.id?{...r,name:j}:O);c([...S])},value:r.name,placeholder:_}),k==="image"&&t.jsxRuntimeExports.jsx(t.ChooseImage,{onChange:j=>{const S=[...i].map(O=>O.id===r.id?{...r,images:j}:O);c([...S])}}),t.jsxRuntimeExports.jsxs("div",{className:v.buttons,children:[a&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:j=>R(j,r)}),b&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,width:20,height:20,fill:"#C12A2A",onClick:()=>c(i.filter(j=>j.id!==r.id))})]})]});return f?t.jsxRuntimeExports.jsx(ee,{product:r,index:y,moveProduct:I,children:B},r.id):t.jsxRuntimeExports.jsx("div",{className:v.product,children:B},r.id)};return t.jsxRuntimeExports.jsxs("div",{className:v.productsBlock,children:[(e||s!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:v.top,children:[e&&t.jsxRuntimeExports.jsx("h3",{className:v.title,children:e}),s!==void 0&&t.jsxRuntimeExports.jsx(t.Switch,{current:s,onChange:r=>n==null?void 0:n(r)})]}),P&&a&&U&&u&&t.jsxRuntimeExports.jsx(Qt,{activeItem:P,setActiveItem:A,popupPosition:Y,modalOptions:U,setIsOpenModal:h}),w&&G&&t.jsxRuntimeExports.jsx(et,{...G}),t.jsxRuntimeExports.jsxs("div",{className:v.products,children:[o&&t.jsxRuntimeExports.jsx("h5",{className:v.subtitle,children:o}),f?t.jsxRuntimeExports.jsx(t.DndProvider,{backend:t.HTML5Backend,children:i.map((r,y)=>N(r,y))}):i.map((r,y)=>N(r,y)),g&&t.jsxRuntimeExports.jsxs(t.Button,{className:t.clx(v.button,{[v.disabled]:!!(C&&C<=i.length)}),size:"s",disabled:!!(C&&C<=i.length),onClick:()=>{const r=[...i];k==="select"?r.push({name:p[0]||`Product ${i.length+1}`,id:t.v4(),...q}):k==="input"?r.push({name:"",id:t.v4(),...q}):r.push({name:`Image ${i.length+1}`,id:t.v4(),...q}),c(r)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]}),l!==void 0&&t.jsxRuntimeExports.jsx(W,{items:l})]})},se="_subtitle_41klp_1",ne="_header_41klp_8",oe="_text_41klp_9",ie="_productsBlock_41klp_10",ce="_buttonsBlock_41klp_11",le="_top_41klp_21",re="_itemsBlock_41klp_28",ae="_typeTexts_41klp_34",ue="_block_41klp_40",xe="_active_41klp_51",de="_products_41klp_10",pe="_product_41klp_10",me="_button_41klp_11",_e="_image_41klp_79",he="_info_41klp_86",ge="_name_41klp_97",je="_buttons_41klp_11",be="_modal_41klp_107",fe="_other_41klp_124",Re="_options_41klp_130",L={subtitle:se,header:ne,text:oe,productsBlock:ie,buttonsBlock:ce,top:le,itemsBlock:re,typeTexts:ae,block:ue,active:xe,products:de,product:pe,button:me,image:_e,info:he,name:ge,buttons:je,modal:be,other:fe,options:Re},Ee=x=>{const{activeButton:s,setActiveButton:n,popupPosition:i}=x,[c,l]=m.useState(s.typesText),[e,o]=m.useState(s.destination),[a,f]=m.useState(s.link||""),[d,b]=m.useState(s.text||"");return m.useEffect(()=>{n({...s,...{text:d,link:a,destination:e,typesText:c}})},[c,e,a,d]),t.jsxRuntimeExports.jsxs("div",{className:L.modal,onClick:g=>{g.stopPropagation()},style:{top:`${i.top}px`,left:`${i.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:L.top,children:[t.jsxRuntimeExports.jsx("h3",{children:s.type}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>n(null)})]}),t.jsxRuntimeExports.jsxs("div",{className:L.options,children:[t.jsxRuntimeExports.jsx(t.Select,{label:"Destination",onChange:g=>o(g),options:["Go to Page","Open Link"],value:e}),e==="Go to Page"?t.jsxRuntimeExports.jsx(t.Select,{label:"Go to",onChange:()=>{},options:[],value:"Homepage"}):t.jsxRuntimeExports.jsx(t.Input,{onChange:g=>f(g),value:a,placeholder:"https://",label:"Link"}),t.jsxRuntimeExports.jsx(t.Switch,{current:!1,label:"Open in new tab"}),t.jsxRuntimeExports.jsx(t.Textarea,{onChange:g=>b(g),value:d,label:"Text",maxLength:150}),t.jsxRuntimeExports.jsx(K,{typesText:c,setTypesText:l})]})]})},ve="_subtitle_1y5sw_1",ke="_header_1y5sw_8",ye="_text_1y5sw_9",$e="_productsBlock_1y5sw_10",we="_buttonsBlock_1y5sw_11",Ie="_top_1y5sw_22",Be="_itemsBlock_1y5sw_29",Ce="_typeTexts_1y5sw_35",Ne="_block_1y5sw_41",Te="_active_1y5sw_52",Se="_products_1y5sw_10",Pe="_product_1y5sw_10",Ae="_button_1y5sw_11",Oe="_image_1y5sw_80",De="_info_1y5sw_87",Le="_name_1y5sw_98",qe="_buttons_1y5sw_11",Me="_modal_1y5sw_108",He="_other_1y5sw_125",ze="_options_1y5sw_131",F={subtitle:ve,header:ke,text:ye,productsBlock:$e,buttonsBlock:we,top:Ie,itemsBlock:Be,typeTexts:Ce,block:Ne,active:Te,products:Se,product:Pe,button:Ae,image:Oe,info:De,name:Le,buttons:qe,modal:Me,other:He,options:ze},tt=x=>{const{buttons:s,setButtons:n,deletable:i=!0,addable:c=!0}=x,[l,e]=m.useState(null),[o,a]=m.useState({top:0,left:0});m.useEffect(()=>{const d=()=>{e(null)};return document.body.addEventListener("click",d),e(null),()=>{e(null),document.body.removeEventListener("click",d)}},[]),m.useEffect(()=>{if(l){const d=[...s].map(b=>b.id===l.id?l:b);n(d)}},[l]);const f=(d,b)=>{d.stopPropagation();const g=d.target.getBoundingClientRect(),k=490,_=window.innerHeight;let p=g.top+window.scrollY;p+k>_&&(p=_-k-20),a({top:p,left:g.left-30}),e(b)};return t.jsxRuntimeExports.jsxs("div",{className:F.products,children:[t.jsxRuntimeExports.jsx("h5",{className:F.subtitle,children:"Button Type"}),s.map(d=>t.jsxRuntimeExports.jsxs("div",{className:F.product,children:[t.jsxRuntimeExports.jsx(t.Select,{onChange:b=>{const k=[...s].map(_=>_.id===d.id?{...d,type:b}:_);n(k)},value:d.type,options:["Primary","Secondary","Tertiary"]}),t.jsxRuntimeExports.jsxs("div",{className:F.buttons,children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:b=>{f(b,d)}}),i&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,onClick:()=>{const b=s.filter(g=>g.id!==d.id);n(b)},width:20,height:20,fill:"#C12A2A"})]})]},d.id)),l&&t.jsxRuntimeExports.jsx(Ee,{activeButton:l,setActiveButton:e,popupPosition:o}),c&&t.jsxRuntimeExports.jsxs(t.Button,{className:F.button,size:"s",onClick:()=>{const d=[...s];d.push({type:"Primary",id:t.v4(),typesText:[],destination:"Go to Page",text:""}),n(d)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]})},Fe=x=>{const{isActiveButtons:s,setIsActiveButtons:n,buttons:i,setButtons:c}=x;return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs("div",{className:L.buttonsBlock,children:[t.jsxRuntimeExports.jsxs("div",{className:L.top,children:[t.jsxRuntimeExports.jsx("h3",{className:L.title,children:"Buttons"}),t.jsxRuntimeExports.jsx(t.Switch,{current:s,onChange:l=>n(l)})]}),t.jsxRuntimeExports.jsx(tt,{buttons:i,setButtons:c})]})})},Ge="_wrapper_tn7gb_1",Ue="_subtitle_tn7gb_7",Xe="_content_tn7gb_14",Ye="_range_tn7gb_21",Ve="_track_tn7gb_26",Je="_progress_tn7gb_35",Ke="_dots_tn7gb_45",Qe="_dot_tn7gb_45",We="_active_tn7gb_62",Ze="_input_tn7gb_74",ts="_countBlock_tn7gb_88",es="_count_tn7gb_88",ss="_controls_tn7gb_103",ns="_button_tn7gb_108",E={wrapper:Ge,subtitle:Ue,content:Xe,range:Ye,track:Ve,progress:Je,dots:Ke,dot:Qe,active:We,input:Ze,countBlock:ts,count:es,controls:ss,button:ns},et=x=>{const{label:s,min:n=1,max:i=4,step:c=1,count:l,setCount:e}=x,[o,a]=m.useState(!1),f=Array.from({length:(i-n)/c+1}),d=(l-n)/(i-n)*100,b=()=>{l<i&&e(l+c)},g=()=>{l>n&&e(l-c)},k=_=>{const p=n+_*c;e(p)};return t.jsxRuntimeExports.jsxs("div",{className:E.wrapper,children:[s&&t.jsxRuntimeExports.jsx("h5",{className:E.subtitle,children:s}),t.jsxRuntimeExports.jsxs("div",{className:E.content,children:[t.jsxRuntimeExports.jsxs("div",{className:E.range,children:[t.jsxRuntimeExports.jsx("div",{className:E.track}),t.jsxRuntimeExports.jsx("div",{className:E.progress,style:{width:`${d}%`}}),t.jsxRuntimeExports.jsx("div",{className:E.dots,children:f.map((_,p)=>{const w=p<=(l-n)/c;return t.jsxRuntimeExports.jsx("button",{onClick:()=>k(p),className:t.clx(E.dot,{[E.active]:w,[E.inactive]:!w,[E.dragging]:o}),"aria-label":`Set value to ${n+p*c}`},p)})}),t.jsxRuntimeExports.jsx("input",{type:"range",min:n,max:i,step:c,value:l,onChange:_=>e(Number(_.target.value)),onMouseDown:()=>a(!0),onMouseUp:()=>a(!1),onTouchStart:()=>a(!0),onTouchEnd:()=>a(!1),className:E.input})]}),t.jsxRuntimeExports.jsxs("div",{className:E.countBlock,children:[t.jsxRuntimeExports.jsx(t.Input,{type:"number",min:n,max:i,paddingless:!0,onChange:_=>{const p=Number(_);p>i?e(i):p<n?e(n):e(p)},value:String(l)}),t.jsxRuntimeExports.jsxs("div",{className:E.controls,children:[t.jsxRuntimeExports.jsx("button",{onClick:b,disabled:l>=i,className:E.button,"aria-label":"Increment count",children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretUp",width:15,height:15})}),t.jsxRuntimeExports.jsx("button",{onClick:g,disabled:l<=n,className:E.button,"aria-label":"Decrement count",children:t.jsxRuntimeExports.jsx(t.Icon,{name:"CaretDown",width:15,height:15})})]})]})]})]})},os="_subtitle_1nl8x_1",is="_header_1nl8x_8",cs="_text_1nl8x_9",ls="_productsBlock_1nl8x_10",rs="_top_1nl8x_22",as="_itemsBlock_1nl8x_29",us="_typeTexts_1nl8x_35",xs="_block_1nl8x_41",ds="_active_1nl8x_52",ps="_products_1nl8x_10",ms="_product_1nl8x_10",_s="_button_1nl8x_70",hs="_image_1nl8x_80",gs="_info_1nl8x_87",js="_name_1nl8x_98",bs="_buttons_1nl8x_102",fs="_modal_1nl8x_108",Rs="_link_1nl8x_126",Es="_modalOptions_1nl8x_132",$={subtitle:os,header:is,text:cs,productsBlock:ls,top:rs,itemsBlock:as,typeTexts:us,block:xs,active:ds,products:ps,product:ms,button:_s,image:hs,info:gs,name:js,buttons:bs,modal:fs,link:Rs,modalOptions:Es},vs=x=>{const{activeItem:s,setActiveItem:n,popupPosition:i,setIsOpenModal:c}=x;return t.jsxRuntimeExports.jsxs("div",{className:$.modal,onClick:l=>{l.stopPropagation()},style:{top:`${i.top}px`,left:`${i.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:$.top,children:[t.jsxRuntimeExports.jsx("h3",{children:s.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"X",height:20,width:20,hoverable:!0,onClick:()=>{c(!1),n(null)}})]}),t.jsxRuntimeExports.jsx("div",{className:$.modalOptions,children:t.jsxRuntimeExports.jsx(t.ChooseImage,{label:"Put up an attractive image",onChange:l=>{const e={...s,images:l,imagePath:l[0]};n(e)}})})]})},ks=x=>{const{index:s,moveProduct:n,children:i}=x,[,c]=t.useDrop({accept:"product",hover(o){o.index!==s&&(n(o.index,s),o.index=s)}}),[{isDragging:l},e]=t.useDrag({type:"product",item:{index:s},collect:o=>({isDragging:o.isDragging()})});return t.jsxRuntimeExports.jsx("div",{ref:o=>e(c(o)),className:`${$.product} ${l?$.dragging:""}`,children:i})},ys=x=>{const{isActiveItems:s,setIsActiveItems:n,items:i,setItems:c,other:l,title:e,subtitle:o,editable:a=!0,draggable:f=!1,withImage:d=!1,deletable:b=!0,addable:g=!0,itemsType:k,itemsOptions:_}=x,[p,w]=m.useState(null),[G,U]=m.useState({top:0,left:0}),[q,C]=m.useState(!1),P=(u,h)=>{const I=[...i],[R]=I.splice(u,1);I.splice(h,0,R),c(I)};m.useEffect(()=>{const u=()=>{w(null),C(!1)};return document.body.addEventListener("click",u),w(null),C(!1),()=>{w(null),C(!1),document.body.removeEventListener("click",u)}},[]),m.useEffect(()=>{if(p){const u=[...i].map(h=>h.id===p.id?p:h);c(u)}},[p]);const A=(u,h)=>{u.stopPropagation();const I=u.target.getBoundingClientRect(),R=100,D=window.innerHeight;let N=I.top+window.scrollY;N+R>D&&(N=D-R-20),C(!0),U({top:N-80,left:I.left-30}),w(h)};function Y(u){if(d)return u?t.jsxRuntimeExports.jsx("img",{src:`https://imagedelivery.net/${u}/w=1000`,alt:"image",width:16,height:16}):t.jsxRuntimeExports.jsx(t.Icon,{name:"Image",width:16,height:16,fill:"#757575"})}const X=(u,h)=>{const I=t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[f&&t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:"DotsSixVertical",hoverable:!0,width:20,height:20})}),k==="select"&&t.jsxRuntimeExports.jsx(t.Select,{onChange:R=>{const D=[...i],N=Number(R.split(" ")[1]),r=_.find(j=>j.id===N);if(!r)return;const y={...r.productData.stats,newPrice:r.productData.minPrice.amount,oldPrice:r.productData.compareAtPrice.amount},B=D.map(j=>j.id===u.id?{...u,name:R,listingId:N,stats:y}:j);w({...u,name:R,listingId:N}),c([...B])},value:u.name,options:[..._.map(R=>`Product ${R.id}`)],leftAddon:Y(u.images[0])}),t.jsxRuntimeExports.jsxs("div",{className:$.buttons,children:[a&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Sliders",hoverable:!0,width:20,height:20,onClick:R=>A(R,u)}),b&&t.jsxRuntimeExports.jsx(t.Icon,{name:"Trash",hoverable:!0,width:20,height:20,fill:"#C12A2A",onClick:()=>c(i.filter(R=>R.id!==u.id))})]})]});return f?t.jsxRuntimeExports.jsx(ks,{product:u,index:h,moveProduct:P,children:I},u.id):t.jsxRuntimeExports.jsx("div",{className:$.product,children:I},u.id)};return t.jsxRuntimeExports.jsxs("div",{className:$.productsBlock,children:[(e||s!==void 0)&&t.jsxRuntimeExports.jsxs("div",{className:$.top,children:[e&&t.jsxRuntimeExports.jsx("h3",{className:$.title,children:e}),s!==void 0&&t.jsxRuntimeExports.jsx(t.Switch,{current:s,onChange:u=>n==null?void 0:n(u)})]}),q&&p&&t.jsxRuntimeExports.jsx(vs,{activeItem:p,setActiveItem:w,setIsOpenModal:C,popupPosition:G}),t.jsxRuntimeExports.jsxs("div",{className:$.products,children:[o&&t.jsxRuntimeExports.jsx("h5",{className:$.subtitle,children:o}),f?t.jsxRuntimeExports.jsx(t.DndProvider,{backend:t.HTML5Backend,children:i.map((u,h)=>X(u,h))}):i.map((u,h)=>X(u,h)),g&&t.jsxRuntimeExports.jsxs(t.Button,{className:$.button,size:"s",onClick:()=>{const u=[...i],h=_[0].id;u.push({name:`Product ${h}`,id:t.v4(),listingId:h,imagePath:"",images:[],stats:{..._[0].productData.stats,newPrice:_[0].productData.minPrice.amount,oldPrice:_[0].productData.compareAtPrice.amount}}),c(u)},children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"Plus",width:16,height:16})]})]}),l!==void 0&&t.jsxRuntimeExports.jsx(W,{items:l})]})};exports.Button=t.Button;exports.Checkbox=t.Checkbox;exports.ChooseImage=t.ChooseImage;exports.ChooseImageModal=t.ChooseImageModal;exports.ColorPicker=t.ColorPicker;exports.Icon=t.Icon;exports.Input=t.Input;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=lt;exports.ButtonTypeSettings=tt;exports.ButtonsSettings=Fe;exports.ItemsSettings=Z;exports.LayoutSettings=Rt;exports.ListingSelector=ys;exports.RangeSelector=et;exports.TextSettings=Q;exports.TypesText=K;

package/dist/ui.es.js

@@ -465,7 +465,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
     draggable: j = !1,
     withImage: _ = !1,
     deletable: v = !0,
-    addable: f = !0,
+    addable: b = !0,
     itemsType: w,
     itemsPlaceholder: g = "",
     itemsOptions: p,
@@ -478,8 +478,8 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
     top: 0,
     left: 0
   }), [d, x] = m.useState(!1), T = (a, N) => {
-    const P = [...c], [b] = P.splice(a, 1);
-    P.splice(N, 0, b), i(P);
+    const P = [...c], [f] = P.splice(a, 1);
+    P.splice(N, 0, f), i(P);
   };
   m.useEffect(() => {
     const a = () => {
@@ -496,9 +496,9 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
   }, [D]);
   const k = (a, N) => {
     a.stopPropagation(), x(!0);
-    const P = a.target.getBoundingClientRect(), b = 500, G = window.innerHeight;
+    const P = a.target.getBoundingClientRect(), f = 500, G = window.innerHeight;
     let O = P.top + window.scrollY;
-    console.log(b), O + b > G && (O = G - b - 20), Q({
+    O + f > G && (O = G - f - 20), Q({
       top: O - 80,
       left: P.left - 30
     }), L(N);
@@ -537,14 +537,14 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
       w === "select" && /* @__PURE__ */ t.jsx(
         z,
         {
-          onChange: (b) => {
+          onChange: (f) => {
             const O = [...c].map((q) => q.id === a.id ? {
               ...a,
-              name: b
+              name: f
             } : q);
             L({
               ...a,
-              name: b
+              name: f
             }), i([...O]);
           },
           value: a.name,
@@ -555,10 +555,10 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
       w === "input" && /* @__PURE__ */ t.jsx(
         M,
         {
-          onChange: (b) => {
+          onChange: (f) => {
             const O = [...c].map((q) => q.id === a.id ? {
               ...a,
-              name: b
+              name: f
             } : q);
             i([...O]);
           },
@@ -569,10 +569,10 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
       w === "image" && /* @__PURE__ */ t.jsx(
         st,
         {
-          onChange: (b) => {
+          onChange: (f) => {
             const O = [...c].map((q) => q.id === a.id ? {
               ...a,
-              images: b
+              images: f
             } : q);
             i([...O]);
           }
@@ -586,7 +586,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (b) => k(b, a)
+            onClick: (f) => k(f, a)
           }
         ),
         v && /* @__PURE__ */ t.jsx(
@@ -597,7 +597,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(c.filter((b) => b.id !== a.id))
+            onClick: () => i(c.filter((f) => f.id !== a.id))
           }
         )
       ] })
@@ -645,7 +645,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
     /* @__PURE__ */ t.jsxs("div", { className: y.products, children: [
       o && /* @__PURE__ */ t.jsx("h5", { className: y.subtitle, children: o }),
       j ? /* @__PURE__ */ t.jsx(ct, { backend: it, children: c.map((a, N) => A(a, N)) }) : c.map((a, N) => A(a, N)),
-      f && /* @__PURE__ */ t.jsxs(
+      b && /* @__PURE__ */ t.jsxs(
         nt,
         {
           className: W(y.button, {
@@ -722,8 +722,8 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
     "div",
     {
       className: H.modal,
-      onClick: (f) => {
-        f.stopPropagation();
+      onClick: (b) => {
+        b.stopPropagation();
       },
       style: {
         top: `${c.top}px`,
@@ -748,7 +748,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
             z,
             {
               label: "Destination",
-              onChange: (f) => o(f),
+              onChange: (b) => o(b),
               options: ["Go to Page", "Open Link"],
               value: e
             }
@@ -765,7 +765,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
           ) : /* @__PURE__ */ t.jsx(
             M,
             {
-              onChange: (f) => j(f),
+              onChange: (b) => j(b),
               value: r,
               placeholder: "https://",
               label: "Link"
@@ -781,7 +781,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
           /* @__PURE__ */ t.jsx(
             ot,
             {
-              onChange: (f) => v(f),
+              onChange: (b) => v(b),
               value: _,
               label: "Text",
               maxLength: 150
@@ -839,11 +839,11 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
   }, [l]);
   const j = (_, v) => {
     _.stopPropagation();
-    const f = _.target.getBoundingClientRect(), w = 490, g = window.innerHeight;
-    let p = f.top + window.scrollY;
+    const b = _.target.getBoundingClientRect(), w = 490, g = window.innerHeight;
+    let p = b.top + window.scrollY;
     p + w > g && (p = g - w - 20), r({
       top: p,
-      left: f.left - 30
+      left: b.left - 30
     }), e(v);
   };
   return /* @__PURE__ */ t.jsxs("div", { className: Y.products, children: [
@@ -886,7 +886,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
                 name: "Trash",
                 hoverable: !0,
                 onClick: () => {
-                  const v = s.filter((f) => f.id !== _.id);
+                  const v = s.filter((b) => b.id !== _.id);
                   n(v);
                 },
                 width: 20,
@@ -975,7 +975,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
 }, ps = (u) => {
   const { label: s, min: n = 1, max: c = 4, step: i = 1, count: l, setCount: e } = u, [o, r] = m.useState(!1), j = Array.from({ length: (c - n) / i + 1 }), _ = (l - n) / (c - n) * 100, v = () => {
     l < c && e(l + i);
-  }, f = () => {
+  }, b = () => {
     l > n && e(l - i);
   }, w = (g) => {
     const p = n + g * i;
@@ -1062,7 +1062,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
           /* @__PURE__ */ t.jsx(
             "button",
             {
-              onClick: f,
+              onClick: b,
               disabled: l <= n,
               className: $.button,
               "aria-label": "Decrement count",
@@ -1180,7 +1180,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
     draggable: j = !1,
     withImage: _ = !1,
     deletable: v = !0,
-    addable: f = !0,
+    addable: b = !0,
     itemsType: w,
     itemsOptions: g
   } = u, [p, C] = m.useState(null), [J, K] = m.useState({
@@ -1247,18 +1247,18 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
         z,
         {
           onChange: (k) => {
-            const R = [...c], A = Number(k.split(" ")[1]), a = g.find((b) => b.id === A);
+            const R = [...c], A = Number(k.split(" ")[1]), a = g.find((f) => f.id === A);
             if (!a) return;
             const N = {
               ...a.productData.stats,
               newPrice: a.productData.minPrice.amount,
               oldPrice: a.productData.compareAtPrice.amount
-            }, P = R.map((b) => b.id === d.id ? {
+            }, P = R.map((f) => f.id === d.id ? {
               ...d,
               name: k,
               listingId: A,
               stats: N
-            } : b);
+            } : f);
             C({
               ...d,
               name: k,
@@ -1335,7 +1335,7 @@ const ut = "_accordion_2tiiw_1", _t = "_header_2tiiw_9", pt = "_icon_2tiiw_16",
     /* @__PURE__ */ t.jsxs("div", { className: B.products, children: [
       o && /* @__PURE__ */ t.jsx("h5", { className: B.subtitle, children: o }),
       j ? /* @__PURE__ */ t.jsx(ct, { backend: it, children: c.map((d, x) => Q(d, x)) }) : c.map((d, x) => Q(d, x)),
-      f && /* @__PURE__ */ t.jsxs(
+      b && /* @__PURE__ */ t.jsxs(
         nt,
         {
           className: B.button,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@billgangcom/theme-lib",
-  "version": "1.11.0",
+  "version": "1.12.0",
   "type": "module",
   "publishConfig": {
     "access": "public"