@billgangcom/theme-lib 1.4.0 → 1.5.0

package/dist/shared/lib/api.d.ts

@@ -1,3 +1,5 @@
 import { Method } from 'axios';
 export declare const API_URL = "https://g-api.billgang.com";
 export declare const updateSettings: (method: Method | undefined, endpoint: string, data?: Record<string, any>) => Promise<any>;
+export declare const getImages: () => Promise<any>;
+export declare const updateImages: (formData: FormData) => Promise<any>;

package/dist/shared/ui/Checkbox/index.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface Props {
+    value: boolean;
+    onChange: (value: boolean) => void;
+}
+export declare const Checkbox: React.FC<Props>;
+export {};

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

@@ -10,3 +10,4 @@ export * from './Modal';
 export * from './Textarea';
 export * from './Radio';
 export * from './Tip';
+export * from './Checkbox';

package/dist/store/index.d.ts

@@ -10,3 +10,4 @@ export * from './useFontsStore';
 export * from './useSettingsStore';
 export * from './useColorPickerStore';
 export * from './usePagesStore';
+export * from './useChooseImageStore';

package/dist/store/useChooseImageStore.d.ts

@@ -0,0 +1,6 @@
+interface Options {
+    openModal: boolean;
+    setOpenModal: (openModal: boolean) => void;
+}
+export declare const useChooseImageStore: import("zustand").UseBoundStore<import("zustand").StoreApi<Options>>;
+export {};

package/dist/store/useLayersStore.d.ts

@@ -1,11 +1,16 @@
+import { IBlock } from '../abstractions';
 interface Block {
     name: string;
     value: any;
 }
 interface Options {
+    header: IBlock | null;
+    footer: IBlock | null;
     blocks: Record<string, Record<string, Block>>;
     currentBlock: string | null;
     positionBlock: number | null;
+    setHeader: (header: IBlock) => void;
+    setFooter: (footer: IBlock) => void;
     createPage: (name: string) => void;
     deletePage: (name: string) => void;
     updatePage: (oldName: string, newName: string) => void;

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

@@ -0,0 +1,14 @@
+import React from 'react';
+interface Props {
+    label?: string;
+}
+export declare const ChooseImage: React.FC<Props>;
+export interface Image {
+    cfId: string;
+    createdAt: string;
+    fileName: string;
+    id: number;
+    isSelected: boolean;
+}
+export declare const ChooseImageModal: React.FC;
+export {};

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

@@ -0,0 +1,25 @@
+import React from 'react';
+export interface ItemBase {
+    image?: string;
+    name: string;
+    id: string;
+}
+export interface Product extends ItemBase {
+}
+export interface Pages extends ItemBase {
+}
+interface Props<T extends ItemBase> {
+    isActiveItems: boolean;
+    setIsActiveItems: React.Dispatch<React.SetStateAction<boolean>>;
+    items: T[];
+    setItems: React.Dispatch<React.SetStateAction<T[]>>;
+    isProductStats?: boolean;
+    setIsProductStats?: React.Dispatch<React.SetStateAction<boolean>>;
+    title?: string;
+    subtitle?: string;
+    editable?: boolean;
+    draggable?: boolean;
+    withImage?: boolean;
+}
+export declare const ItemsSettings: <T extends ItemBase>(props: Props<T>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/ui/ItemsSettings/popup.d.ts

@@ -0,0 +1,12 @@
+import { ItemBase } from '.';
+import React from 'react';
+interface Props<T extends ItemBase> {
+    activeItem: T;
+    setActiveItem: React.Dispatch<React.SetStateAction<T | null>>;
+    popupPosition: {
+        top: number;
+        left: number;
+    };
+}
+export declare const ProductPopup: <T extends ItemBase>(props: Props<T>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/ui/index.d.ts

@@ -1,6 +1,7 @@
 export * from '../shared/ui';
 export * from './LayoutSettings';
 export * from './TextSettings';
-export * from './ProductSettings';
+export * from './ItemsSettings';
 export * from './ButtonsSettings';
 export * from './TypeTexts';
+export * from './ChooseImage';

package/dist/ui.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./index-DUXD-4un.cjs"),h=require("react"),f="_wrapper_o1bnv_2",P="_alignmentBlock_o1bnv_8",T="_title_o1bnv_16",$="_subtitle_o1bnv_23",C="_alignmentContent_o1bnv_30",S="_alignments_o1bnv_37",I="_alignment_o1bnv_8",A="_circle_o1bnv_56",L="_paddings_o1bnv_63",z="_padding_o1bnv_63",O="_input_o1bnv_81",_={wrapper:f,alignmentBlock:P,title:T,subtitle:$,alignmentContent:C,alignments:S,alignment:I,circle:A,paddings:L,padding:z,input:O},H=["topLeft","top","topRight","left","center","right","bottomLeft","bottom","bottomRight"],F=["left","top","right","bottom"],G=a=>{const{alignment:o,padding:u,setPadding:n,setAlignment:x}=a;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:H.map(i=>t.jsxRuntimeExports.jsxs("div",{onClick:()=>{x(c=>i)},className:_.alignment,children:[i!==o&&t.jsxRuntimeExports.jsx("div",{className:_.circle}),i===o&&t.jsxRuntimeExports.jsx(t.Icon,{name:"text-align-left",fill:"#FF3F19"})]},i))}),t.jsxRuntimeExports.jsx("div",{className:_.paddings,children:F.map(i=>t.jsxRuntimeExports.jsxs("label",{className:_.padding,children:[t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:`align-${i}`,width:20,height:20})}),t.jsxRuntimeExports.jsx(t.Input,{type:"text",value:String(u[i]),onChange:c=>n(j=>({...j,[i]:Number(c)})),paddingless:!0})]}))})]})]})]})},M="_subtitle_2zbxx_1",q="_header_2zbxx_8",D="_text_2zbxx_9",Y="_top_2zbxx_16",J="_itemsBlock_2zbxx_23",v={subtitle:M,header:q,text:D,top:Y,itemsBlock:J},K="_typeTexts_3zlec_1",Q="_block_3zlec_7",U="_active_3zlec_18",k={typeTexts:K,block:Q,active:U},V=["bold","italic","underline","strike-through","code"],w=a=>{const{typeText:o,setTypeText:u}=a;return t.jsxRuntimeExports.jsx("div",{className:k.typeTexts,children:V.map(n=>t.jsxRuntimeExports.jsx("div",{className:t.clx(k.block,{[k.active]:o===n}),onClick:()=>u(x=>n),children:t.jsxRuntimeExports.jsx(t.Icon,{name:`text-${n}`,fill:o===n?"#252525":"#757575",width:20,height:20})},String(n)))})},W=a=>{const{typeText:o,isActiveText:u,setIsActiveText:n,text:x,setText:i,setTypeText:c,title:j,subtitle:g="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:j}),t.jsxRuntimeExports.jsx(t.Switch,{current:u,onChange:m=>n(s=>m)})]}),t.jsxRuntimeExports.jsxs("div",{className:v.itemsBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:v.subtitle,children:g}),t.jsxRuntimeExports.jsx(t.Textarea,{onChange:m=>i(s=>m),value:x,maxLength:150}),t.jsxRuntimeExports.jsx(w,{typeText:o,setTypeText:c})]})]})},X="_subtitle_2l7ty_1",Z="_header_2l7ty_8",tt="_text_2l7ty_9",st="_productsBlock_2l7ty_10",et="_top_2l7ty_22",nt="_itemsBlock_2l7ty_29",ot="_typeTexts_2l7ty_35",it="_block_2l7ty_41",ct="_active_2l7ty_52",lt="_products_2l7ty_10",xt="_product_2l7ty_10",rt="_button_2l7ty_70",at="_image_2l7ty_80",ut="_info_2l7ty_87",pt="_name_2l7ty_98",dt="_buttons_2l7ty_102",mt="_modal_2l7ty_108",_t="_other_2l7ty_125",l={subtitle:X,header:Z,text:tt,productsBlock:st,top:et,itemsBlock:nt,typeTexts:ot,block:it,active:ct,products:lt,product:xt,button:rt,image:at,info:ut,name:pt,buttons:dt,modal:mt,other:_t},jt=a=>{const{activeProduct:o,setActiveProduct:u,popupPosition:n}=a;return t.jsxRuntimeExports.jsxs("div",{className:l.modal,onClick:x=>{x.stopPropagation()},style:{top:`${n.top}px`,left:`${n.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:l.top,children:[t.jsxRuntimeExports.jsx("h3",{children:o.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"x",height:20,width:20,hoverable:!0,onClick:()=>u(null)})]}),t.jsxRuntimeExports.jsxs("div",{children:[t.jsxRuntimeExports.jsx("span",{children:"Put up an attractive image"}),t.jsxRuntimeExports.jsx("div",{children:"Choose Image"})]})]})},ht=a=>{const{isActiveProducts:o,setIsActiveProducts:u,products:n,setProducts:x,isProductStats:i,setIsProductStats:c,title:j="Product",subtitle:g="Products will appear in this section"}=a,[m,s]=h.useState(null),[d,b]=h.useState({top:0,left:0});h.useEffect(()=>{const e=()=>{s(null)};return document.body.addEventListener("click",e),s(null),()=>{s(null),document.body.removeEventListener("click",e)}},[]);const R=(e,r)=>{e.stopPropagation();const E=e.target.getBoundingClientRect(),N=100,B=window.innerHeight;let y=E.top+window.scrollY;y+N>B&&(y=B-N-20),b({top:y-80,left:E.left-30}),s(r)};return t.jsxRuntimeExports.jsxs("div",{className:l.productsBlock,children:[t.jsxRuntimeExports.jsxs("div",{className:l.top,children:[t.jsxRuntimeExports.jsx("h3",{className:l.title,children:j}),t.jsxRuntimeExports.jsx(t.Switch,{current:o,onChange:e=>u(r=>e)})]}),m&&t.jsxRuntimeExports.jsx(jt,{activeProduct:m,setActiveProduct:s,popupPosition:d}),t.jsxRuntimeExports.jsxs("div",{className:l.products,children:[t.jsxRuntimeExports.jsx("h5",{className:l.subtitle,children:g}),n.map(e=>t.jsxRuntimeExports.jsxs("div",{className:l.product,children:[t.jsxRuntimeExports.jsxs("div",{className:l.info,children:[t.jsxRuntimeExports.jsx("div",{className:l.image,children:e.image?t.jsxRuntimeExports.jsx("img",{src:e.image}):t.jsxRuntimeExports.jsx(t.Icon,{name:"image",width:16,height:16,fill:"#757575"})}),t.jsxRuntimeExports.jsx("span",{className:l.name,children:e.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"arrow-down"})]}),t.jsxRuntimeExports.jsxs("div",{className:l.buttons,children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"sliders",hoverable:!0,width:20,height:20,onClick:r=>{R(r,e)}}),t.jsxRuntimeExports.jsx(t.Icon,{name:"trash",hoverable:!0,onClick:()=>x(r=>r.filter(E=>E.id!==e.id)),width:20,height:20,fill:"#C12A2A"})]})]},e.id)),t.jsxRuntimeExports.jsxs(t.Button,{className:l.button,size:"s",onClick:()=>x(e=>{const r=[...e];return r.push({name:"Product 1",id:t.v4()}),r}),children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"plus",width:16,height:16})]})]}),i!==void 0&&t.jsxRuntimeExports.jsxs("div",{className:l.other,children:[t.jsxRuntimeExports.jsx("h5",{className:l.subtitle,children:"Other"}),t.jsxRuntimeExports.jsx(t.Switch,{current:i,onChange:e=>c==null?void 0:c(r=>e),label:"Product Stats",hasBackground:!0,paddingless:!1})]})]})},gt="_subtitle_1y5sw_1",bt="_header_1y5sw_8",vt="_text_1y5sw_9",Rt="_productsBlock_1y5sw_10",Et="_buttonsBlock_1y5sw_11",yt="_top_1y5sw_22",kt="_itemsBlock_1y5sw_29",wt="_typeTexts_1y5sw_35",Nt="_block_1y5sw_41",Bt="_active_1y5sw_52",ft="_products_1y5sw_10",Pt="_product_1y5sw_10",Tt="_button_1y5sw_11",$t="_image_1y5sw_80",Ct="_info_1y5sw_87",St="_name_1y5sw_98",It="_buttons_1y5sw_11",At="_modal_1y5sw_108",Lt="_other_1y5sw_125",zt="_options_1y5sw_131",p={subtitle:gt,header:bt,text:vt,productsBlock:Rt,buttonsBlock:Et,top:yt,itemsBlock:kt,typeTexts:wt,block:Nt,active:Bt,products:ft,product:Pt,button:Tt,image:$t,info:Ct,name:St,buttons:It,modal:At,other:Lt,options:zt},Ot=a=>{const{activeButton:o,setActiveButton:u,popupPosition:n}=a,[x,i]=h.useState(o.typeText),[c,j]=h.useState(o.destination),[g,m]=h.useState(o.link||"");return t.jsxRuntimeExports.jsxs("div",{className:p.modal,onClick:s=>{s.stopPropagation()},style:{top:`${n.top}px`,left:`${n.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:p.top,children:[t.jsxRuntimeExports.jsx("h3",{children:o.type}),t.jsxRuntimeExports.jsx(t.Icon,{name:"x",height:20,width:20,hoverable:!0,onClick:()=>u(null)})]}),t.jsxRuntimeExports.jsxs("div",{className:p.options,children:[t.jsxRuntimeExports.jsx(t.Select,{label:"Destination",onChange:s=>j(s),options:["Go to Page","Open Link"],value:c}),c==="Go to Page"?t.jsxRuntimeExports.jsx(t.Select,{label:"Go to",onChange:()=>{},options:[],value:"Homepage"}):t.jsxRuntimeExports.jsx(t.Input,{onChange:s=>m(s),value:g,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(w,{typeText:x,setTypeText:i})]})]})},Ht=a=>{const{isActiveButtons:o,setIsActiveButtons:u,buttons:n,setButtons:x}=a,[i,c]=h.useState(null),[j,g]=h.useState({top:0,left:0});h.useEffect(()=>{const s=()=>{c(null)};return document.body.addEventListener("click",s),c(null),()=>{c(null),document.body.removeEventListener("click",s)}},[]);const m=(s,d)=>{s.stopPropagation();const b=s.target.getBoundingClientRect(),R=490,e=window.innerHeight;let r=b.top+window.scrollY;r+R>e&&(r=e-R-20),g({top:r,left:b.left-30}),c(d)};return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs("div",{className:p.buttonsBlock,children:[t.jsxRuntimeExports.jsxs("div",{className:p.top,children:[t.jsxRuntimeExports.jsx("h3",{className:p.title,children:"Buttons"}),t.jsxRuntimeExports.jsx(t.Switch,{current:o,onChange:s=>u(d=>s)})]}),t.jsxRuntimeExports.jsxs("div",{className:p.products,children:[t.jsxRuntimeExports.jsx("h5",{className:p.subtitle,children:"Button Type"}),n.map(s=>t.jsxRuntimeExports.jsxs("div",{className:p.product,children:[t.jsxRuntimeExports.jsxs("div",{className:p.info,children:[t.jsxRuntimeExports.jsx("span",{className:p.name,children:s.type}),t.jsxRuntimeExports.jsx(t.Icon,{name:"arrow-down"})]}),t.jsxRuntimeExports.jsxs("div",{className:p.buttons,children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"sliders",hoverable:!0,width:20,height:20,onClick:d=>{m(d,s)}}),t.jsxRuntimeExports.jsx(t.Icon,{name:"trash",hoverable:!0,onClick:()=>x(d=>d.filter(b=>b.id!==s.id)),width:20,height:20,fill:"#C12A2A"})]})]},s.id)),i&&t.jsxRuntimeExports.jsx(Ot,{activeButton:i,setActiveButton:c,popupPosition:j}),t.jsxRuntimeExports.jsxs(t.Button,{className:p.button,size:"s",onClick:()=>x(s=>{const d=[...s];return d.push({type:"Primary",id:t.v4(),typeText:"bold",destination:"Go to Page"}),d}),children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"plus",width:16,height:16})]})]})]})})};exports.Button=t.Button;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.ButtonsSettings=Ht;exports.LayoutSettings=G;exports.ProductSettings=ht;exports.TextSettings=W;exports.TypeTexts=w;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./index-BO6B5tl0.cjs"),h=require("react"),T="_wrapper_o1bnv_2",$="_alignmentBlock_o1bnv_8",S="_title_o1bnv_16",P="_subtitle_o1bnv_23",A="_alignmentContent_o1bnv_30",L="_alignments_o1bnv_37",z="_alignment_o1bnv_8",O="_circle_o1bnv_56",H="_paddings_o1bnv_63",M="_padding_o1bnv_63",F="_input_o1bnv_81",j={wrapper:T,alignmentBlock:$,title:S,subtitle:P,alignmentContent:A,alignments:L,alignment:z,circle:O,paddings:H,padding:M,input:F},G=["topLeft","top","topRight","left","center","right","bottomLeft","bottom","bottomRight"],q=["left","top","right","bottom"],D=x=>{const{alignment:n,padding:r,setPadding:e,setAlignment:a}=x;return t.jsxRuntimeExports.jsxs("div",{className:j.layout,children:[t.jsxRuntimeExports.jsx("h3",{className:j.title,children:"Layout"}),t.jsxRuntimeExports.jsxs("div",{className:j.alignmentBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:j.subtitle,children:"Alignment"}),t.jsxRuntimeExports.jsxs("div",{className:j.alignmentContent,children:[t.jsxRuntimeExports.jsx("div",{className:j.alignments,children:G.map(o=>t.jsxRuntimeExports.jsxs("div",{onClick:()=>{a(c=>o)},className:j.alignment,children:[o!==n&&t.jsxRuntimeExports.jsx("div",{className:j.circle}),o===n&&t.jsxRuntimeExports.jsx(t.Icon,{name:"text-align-left",fill:"#FF3F19"})]},o))}),t.jsxRuntimeExports.jsx("div",{className:j.paddings,children:q.map(o=>t.jsxRuntimeExports.jsxs("label",{className:j.padding,children:[t.jsxRuntimeExports.jsx("div",{children:t.jsxRuntimeExports.jsx(t.Icon,{name:`align-${o}`,width:20,height:20})}),t.jsxRuntimeExports.jsx(t.Input,{type:"text",value:String(r[o]),onChange:c=>e(m=>({...m,[o]:Number(c)})),paddingless:!0})]}))})]})]})]})},Y="_subtitle_2zbxx_1",J="_header_2zbxx_8",K="_text_2zbxx_9",Q="_top_2zbxx_16",U="_itemsBlock_2zbxx_23",E={subtitle:Y,header:J,text:K,top:Q,itemsBlock:U},V="_typeTexts_3zlec_1",W="_block_3zlec_7",X="_active_3zlec_18",N={typeTexts:V,block:W,active:X},Z=["bold","italic","underline","strike-through","code"],f=x=>{const{typeText:n,setTypeText:r}=x;return t.jsxRuntimeExports.jsx("div",{className:N.typeTexts,children:Z.map(e=>t.jsxRuntimeExports.jsx("div",{className:t.clx(N.block,{[N.active]:n===e}),onClick:()=>r(a=>e),children:t.jsxRuntimeExports.jsx(t.Icon,{name:`text-${e}`,fill:n===e?"#252525":"#757575",width:20,height:20})},String(e)))})},tt=x=>{const{typeText:n,isActiveText:r,setIsActiveText:e,text:a,setText:o,setTypeText:c,title:m,subtitle:g="Items"}=x;return t.jsxRuntimeExports.jsxs("div",{className:E.text,children:[t.jsxRuntimeExports.jsxs("div",{className:E.top,children:[t.jsxRuntimeExports.jsx("h3",{className:E.title,children:m}),t.jsxRuntimeExports.jsx(t.Switch,{current:r,onChange:d=>e(s=>d)})]}),t.jsxRuntimeExports.jsxs("div",{className:E.itemsBlock,children:[t.jsxRuntimeExports.jsx("h5",{className:E.subtitle,children:g}),t.jsxRuntimeExports.jsx(t.Textarea,{onChange:d=>o(s=>d),value:a,maxLength:150}),t.jsxRuntimeExports.jsx(f,{typeText:n,setTypeText:c})]})]})},st="_subtitle_2l7ty_1",et="_header_2l7ty_8",nt="_text_2l7ty_9",ot="_productsBlock_2l7ty_10",it="_top_2l7ty_22",ct="_itemsBlock_2l7ty_29",lt="_typeTexts_2l7ty_35",at="_block_2l7ty_41",xt="_active_2l7ty_52",rt="_products_2l7ty_10",ut="_product_2l7ty_10",pt="_button_2l7ty_70",mt="_image_2l7ty_80",dt="_info_2l7ty_87",_t="_name_2l7ty_98",jt="_buttons_2l7ty_102",ht="_modal_2l7ty_108",gt="_other_2l7ty_125",l={subtitle:st,header:et,text:nt,productsBlock:ot,top:it,itemsBlock:ct,typeTexts:lt,block:at,active:xt,products:rt,product:ut,button:pt,image:mt,info:dt,name:_t,buttons:jt,modal:ht,other:gt},bt=x=>{const{activeItem:n,setActiveItem:r,popupPosition:e}=x;return t.jsxRuntimeExports.jsxs("div",{className:l.modal,onClick:a=>{a.stopPropagation()},style:{top:`${e.top}px`,left:`${e.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:l.top,children:[t.jsxRuntimeExports.jsx("h3",{children:n.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"x",height:20,width:20,hoverable:!0,onClick:()=>r(null)})]}),t.jsxRuntimeExports.jsxs("div",{children:[t.jsxRuntimeExports.jsx("span",{children:"Put up an attractive image"}),t.jsxRuntimeExports.jsx("div",{children:"Choose Image"})]})]})},vt=x=>{const{isActiveItems:n,setIsActiveItems:r,items:e,setItems:a,isProductStats:o,setIsProductStats:c,title:m,subtitle:g,editable:d=!0,draggable:s=!1,withImage:p=!0}=x,[v,b]=h.useState(null),[y,R]=h.useState({top:0,left:0});h.useEffect(()=>{const i=()=>{b(null)};return document.body.addEventListener("click",i),b(null),()=>{b(null),document.body.removeEventListener("click",i)}},[]);const I=(i,_)=>{i.stopPropagation();const k=i.target.getBoundingClientRect(),B=100,C=window.innerHeight;let w=k.top+window.scrollY;w+B>C&&(w=C-B-20),R({top:w-80,left:k.left-30}),b(_)};return t.jsxRuntimeExports.jsxs("div",{className:l.productsBlock,children:[t.jsxRuntimeExports.jsxs("div",{className:l.top,children:[m&&t.jsxRuntimeExports.jsx("h3",{className:l.title,children:m}),t.jsxRuntimeExports.jsx(t.Switch,{current:n,onChange:i=>r(_=>i)})]}),v&&d&&t.jsxRuntimeExports.jsx(bt,{activeItem:v,setActiveItem:b,popupPosition:y}),t.jsxRuntimeExports.jsxs("div",{className:l.products,children:[g&&t.jsxRuntimeExports.jsx("h5",{className:l.subtitle,children:g}),e.map(i=>t.jsxRuntimeExports.jsxs("div",{className:l.product,children:[s&&t.jsxRuntimeExports.jsx(t.Icon,{name:"drag",hoverable:!0,width:20,height:20}),t.jsxRuntimeExports.jsxs("div",{className:l.info,children:[p&&t.jsxRuntimeExports.jsx("div",{className:l.image,children:i.image?t.jsxRuntimeExports.jsx("img",{src:i.image}):t.jsxRuntimeExports.jsx(t.Icon,{name:"image",width:16,height:16,fill:"#757575"})}),t.jsxRuntimeExports.jsx("span",{className:l.name,children:i.name}),t.jsxRuntimeExports.jsx(t.Icon,{name:"arrow-down"})]}),t.jsxRuntimeExports.jsxs("div",{className:l.buttons,children:[d&&t.jsxRuntimeExports.jsx(t.Icon,{name:"sliders",hoverable:!0,width:20,height:20,onClick:_=>{I(_,i)}}),t.jsxRuntimeExports.jsx(t.Icon,{name:"trash",hoverable:!0,onClick:()=>a(_=>_.filter(k=>k.id!==i.id)),width:20,height:20,fill:"#C12A2A"})]})]},i.id)),t.jsxRuntimeExports.jsxs(t.Button,{className:l.button,size:"s",onClick:()=>a(i=>{const _=[...i];return _.push({name:"Product 1",id:t.v4()}),_}),children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"plus",width:16,height:16})]})]}),o!==void 0&&t.jsxRuntimeExports.jsxs("div",{className:l.other,children:[t.jsxRuntimeExports.jsx("h5",{className:l.subtitle,children:"Other"}),t.jsxRuntimeExports.jsx(t.Switch,{current:o,onChange:i=>c==null?void 0:c(_=>i),label:"Product Stats",hasBackground:!0,paddingless:!1})]})]})},Rt="_subtitle_1y5sw_1",Et="_header_1y5sw_8",yt="_text_1y5sw_9",kt="_productsBlock_1y5sw_10",wt="_buttonsBlock_1y5sw_11",Nt="_top_1y5sw_22",ft="_itemsBlock_1y5sw_29",Bt="_typeTexts_1y5sw_35",Ct="_block_1y5sw_41",It="_active_1y5sw_52",Tt="_products_1y5sw_10",$t="_product_1y5sw_10",St="_button_1y5sw_11",Pt="_image_1y5sw_80",At="_info_1y5sw_87",Lt="_name_1y5sw_98",zt="_buttons_1y5sw_11",Ot="_modal_1y5sw_108",Ht="_other_1y5sw_125",Mt="_options_1y5sw_131",u={subtitle:Rt,header:Et,text:yt,productsBlock:kt,buttonsBlock:wt,top:Nt,itemsBlock:ft,typeTexts:Bt,block:Ct,active:It,products:Tt,product:$t,button:St,image:Pt,info:At,name:Lt,buttons:zt,modal:Ot,other:Ht,options:Mt},Ft=x=>{const{activeButton:n,setActiveButton:r,popupPosition:e}=x,[a,o]=h.useState(n.typeText),[c,m]=h.useState(n.destination),[g,d]=h.useState(n.link||"");return t.jsxRuntimeExports.jsxs("div",{className:u.modal,onClick:s=>{s.stopPropagation()},style:{top:`${e.top}px`,left:`${e.left}px`},children:[t.jsxRuntimeExports.jsxs("div",{className:u.top,children:[t.jsxRuntimeExports.jsx("h3",{children:n.type}),t.jsxRuntimeExports.jsx(t.Icon,{name:"x",height:20,width:20,hoverable:!0,onClick:()=>r(null)})]}),t.jsxRuntimeExports.jsxs("div",{className:u.options,children:[t.jsxRuntimeExports.jsx(t.Select,{label:"Destination",onChange:s=>m(s),options:["Go to Page","Open Link"],value:c}),c==="Go to Page"?t.jsxRuntimeExports.jsx(t.Select,{label:"Go to",onChange:()=>{},options:[],value:"Homepage"}):t.jsxRuntimeExports.jsx(t.Input,{onChange:s=>d(s),value:g,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(f,{typeText:a,setTypeText:o})]})]})},Gt=x=>{const{isActiveButtons:n,setIsActiveButtons:r,buttons:e,setButtons:a}=x,[o,c]=h.useState(null),[m,g]=h.useState({top:0,left:0});h.useEffect(()=>{const s=()=>{c(null)};return document.body.addEventListener("click",s),c(null),()=>{c(null),document.body.removeEventListener("click",s)}},[]);const d=(s,p)=>{s.stopPropagation();const v=s.target.getBoundingClientRect(),b=490,y=window.innerHeight;let R=v.top+window.scrollY;R+b>y&&(R=y-b-20),g({top:R,left:v.left-30}),c(p)};return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs("div",{className:u.buttonsBlock,children:[t.jsxRuntimeExports.jsxs("div",{className:u.top,children:[t.jsxRuntimeExports.jsx("h3",{className:u.title,children:"Buttons"}),t.jsxRuntimeExports.jsx(t.Switch,{current:n,onChange:s=>r(p=>s)})]}),t.jsxRuntimeExports.jsxs("div",{className:u.products,children:[t.jsxRuntimeExports.jsx("h5",{className:u.subtitle,children:"Button Type"}),e.map(s=>t.jsxRuntimeExports.jsxs("div",{className:u.product,children:[t.jsxRuntimeExports.jsxs("div",{className:u.info,children:[t.jsxRuntimeExports.jsx("span",{className:u.name,children:s.type}),t.jsxRuntimeExports.jsx(t.Icon,{name:"arrow-down"})]}),t.jsxRuntimeExports.jsxs("div",{className:u.buttons,children:[t.jsxRuntimeExports.jsx(t.Icon,{name:"sliders",hoverable:!0,width:20,height:20,onClick:p=>{d(p,s)}}),t.jsxRuntimeExports.jsx(t.Icon,{name:"trash",hoverable:!0,onClick:()=>a(p=>p.filter(v=>v.id!==s.id)),width:20,height:20,fill:"#C12A2A"})]})]},s.id)),o&&t.jsxRuntimeExports.jsx(Ft,{activeButton:o,setActiveButton:c,popupPosition:m}),t.jsxRuntimeExports.jsxs(t.Button,{className:u.button,size:"s",onClick:()=>a(s=>{const p=[...s];return p.push({type:"Primary",id:t.v4(),typeText:"bold",destination:"Go to Page"}),p}),children:[t.jsxRuntimeExports.jsx("span",{children:"Add Option"}),t.jsxRuntimeExports.jsx(t.Icon,{name:"plus",width:16,height:16})]})]})]})})};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.ButtonsSettings=Gt;exports.ItemsSettings=vt;exports.LayoutSettings=D;exports.TextSettings=tt;exports.TypeTexts=f;