@billgangcom/theme-lib 1.7.0 → 1.8.1

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

@@ -1,8 +1,11 @@
-interface Props {
-    title?: string;
+export interface Other {
     isItem: boolean;
-    setIsItem: React.Dispatch<React.SetStateAction<boolean>>;
+    setIsItem: (value: boolean) => void;
     label?: string;
 }
+interface Props {
+    title?: string;
+    items: Other[];
+}
 export declare const OtherSettings: React.FC<Props>;
 export {};

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

@@ -0,0 +1,11 @@
+import React from 'react';
+interface Props {
+    min?: number;
+    max?: number;
+    step?: number;
+    count: number;
+    setCount: (value: number) => void;
+    label?: string;
+}
+export declare const RangeSelector: React.FC<Props>;
+export {};

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

@@ -1,13 +1,13 @@
 import React from 'react';
-import { TextType } from '../TypeTexts';
+import { TextType } from '../TypesText';
 interface Props {
-    typeText: TextType;
-    setTypeText: React.Dispatch<React.SetStateAction<TextType>>;
-    isActiveText: boolean;
-    setIsActiveText: React.Dispatch<React.SetStateAction<boolean>>;
+    typesText: TextType[];
+    setTypesText: (value: TextType[]) => void;
+    isActiveText?: boolean;
+    setIsActiveText?: (value: boolean) => void;
     text: string;
-    setText: React.Dispatch<React.SetStateAction<string>>;
-    title: string;
+    setText: (value: string) => void;
+    title?: string;
     subtitle?: string;
 }
 export declare const TextSettings: React.FC<Props>;

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

@@ -0,0 +1,7 @@
+export type TextType = 'bold' | 'italic' | 'underline' | 'strike-through' | 'code';
+interface Props {
+    typesText: TextType[];
+    setTypesText: (value: TextType[]) => void;
+}
+export declare const TypesText: React.FC<Props>;
+export {};

package/dist/ui/index.d.ts

@@ -3,6 +3,7 @@ export * from './LayoutSettings';
 export * from './TextSettings';
 export * from './ItemsSettings';
 export * from './ButtonsSettings';
-export * from './TypeTexts';
+export * from './TypesText';
 export * from './ChooseImage';
 export * from './ButtonTypeSettings';
+export * from './RangeSelector';

package/dist/ui.cjs.js

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