@enerex/template-studio 1.1.14 → 1.1.16

package/README.md

@@ -42,7 +42,8 @@ function App() {
         apiKey: "(api-key)",
         clientId: "(client-id)",
         projectId: "(project-id)",
-        enerexIdentifier: "(enerex-identifier)",
+        enerexIdentifier: "(enerex-identifier)",        
+	userName: "(username)",
       }}
     />
   );

package/dist/enerex-template-editor.es.js

@@ -1,7 +1,7 @@
 import { jsx as s, jsxs as b } from "react/jsx-runtime";
-import $, { useContext as te, useState as x, useEffect as k } from "react";
+import $, { useContext as te, useState as x, useEffect as q } from "react";
 import { QueryClient as pe, QueryClientProvider as me, useQuery as j, useMutation as ne, useQueryClient as ue } from "@tanstack/react-query";
-import V from "axios";
+import G from "axios";
 import { Spinner as U, Form as I, ListGroup as K, Popover as W, OverlayTrigger as ge, Card as Q, Button as Y, Row as fe, Col as X } from "react-bootstrap";
 import { Controller as ye, useForm as he } from "react-hook-form";
 import J from "react-select";
@@ -392,7 +392,7 @@ const re = $.createContext(
 </html>\r
 `, se = (t = "", r) => ({ get: async (n, e) => {
   try {
-    const o = await V.get(
+    const o = await G.get(
       `${t}${n}`,
       e ?? r
     );
@@ -403,7 +403,7 @@ const re = $.createContext(
   }
 }, post: async (n, e, o) => {
   try {
-    const l = await V.post(
+    const l = await G.post(
       `${t}${n}`,
       e,
       o ?? r
@@ -413,7 +413,7 @@ const re = $.createContext(
   } catch (l) {
     throw l;
   }
-} }), q = {
+} }), O = {
   EDITOR_SCRIPT_URL: "https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js",
   EDITOR_PLUGIN_ID: "1afdc3161ec7409a8627a1c8561d45f5",
   EDITOR_SECRET_KEY: "54ba748ed7e94f2e929555783acb03da",
@@ -433,7 +433,7 @@ const re = $.createContext(
       client_id: r,
       "x-api-key": i
     }
-  }, { get: n, post: e } = se(q.API_BASE_URL, a);
+  }, { get: n, post: e } = se(O.API_BASE_URL, a);
   return /* @__PURE__ */ s(ie.Provider, { value: { get: n, post: e }, children: t });
 }, ve = ({ children: t }) => {
   const r = new pe();
@@ -485,10 +485,10 @@ const re = $.createContext(
   const { post: a } = se(), { data: n } = Ce(), { data: e } = xe(), [o, l] = x(
     t ?? { html: H, css: "" }
   ), { enerexIdentifier: p, projectId: m } = w(), u = "https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png", h = "https://plugins.stripo.email/api/v1/auth";
-  k(() => {
+  q(() => {
     if (n && e && !document.getElementById("UiEditorScript")) {
       const g = document.createElement("script");
-      g.id = "UiEditorScript", g.type = "module", g.src = q.EDITOR_SCRIPT_URL, g.onload = v, document.body.appendChild(g);
+      g.id = "UiEditorScript", g.type = "module", g.src = O.EDITOR_SCRIPT_URL, g.onload = v, document.body.appendChild(g);
     }
   }, [n, e]);
   const v = async () => {
@@ -500,7 +500,7 @@ const re = $.createContext(
         modulesExcludedCategories: e ?? [],
         forceRecreate: !0,
         metadata: {
-          emailId: `plugin_${q.EDITOR_PLUGIN_ID}_demo_1_${m}_${p}`,
+          emailId: `${m}_${p}`,
           userId: "1",
           username: "Plugin Demo User",
           avatarUrl: u
@@ -508,8 +508,8 @@ const re = $.createContext(
         locale: "en",
         onTokenRefreshRequest: async function(g) {
           const T = {
-            pluginId: q.EDITOR_PLUGIN_ID,
-            secretKey: q.EDITOR_SECRET_KEY,
+            pluginId: O.EDITOR_PLUGIN_ID,
+            secretKey: O.EDITOR_SECRET_KEY,
             userId: "12",
             role: "user"
           }, c = await a(h, T);
@@ -698,7 +698,7 @@ const Se = (t) => /* @__PURE__ */ s("svg", { xmlns: "http://www.w3.org/2000/svg"
     )
   });
 };
-function De(t) {
+function ke(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
 var M = { exports: {} };
@@ -708,7 +708,7 @@ var M = { exports: {} };
 	http://jedwatson.github.io/classnames
 */
 var Z;
-function ke() {
+function qe() {
   return Z || (Z = 1, function(t) {
     (function() {
       var r = {}.hasOwnProperty;
@@ -740,8 +740,8 @@ function ke() {
     })();
   }(M)), M.exports;
 }
-var qe = ke();
-const ee = /* @__PURE__ */ De(qe), Oe = ({
+var De = qe();
+const ee = /* @__PURE__ */ ke(De), Oe = ({
   name: t = "",
   control: r,
   options: i,
@@ -904,17 +904,17 @@ const ee = /* @__PURE__ */ De(qe), Oe = ({
     data: u,
     refetch: h,
     isLoading: v
-  } = $e(), [g, T] = x([]), [c, C] = x(), [R, E] = x(), { mutateAsync: F, isPending: N } = Ae(), { mutateAsync: oe, isPending: O } = Be(), { data: D, isLoading: z } = Re(), [B, ae] = x([]);
-  k(() => {
-    D && ae(
-      D.map((d) => ({
+  } = $e(), [g, T] = x([]), [c, C] = x(), [R, E] = x(), { mutateAsync: F, isPending: N } = Ae(), { mutateAsync: oe, isPending: D } = Be(), { data: k, isLoading: z } = Re(), [B, ae] = x([]);
+  q(() => {
+    k && ae(
+      k.map((d) => ({
         id: `${d.id}`,
         name: d.name
       }))
     );
-  }, [D]), k(() => {
+  }, [k]), q(() => {
     r(!!N);
-  }, [N]), k(() => {
+  }, [N]), q(() => {
     T(u ?? []);
   }, [u]);
   const le = async (d, f) => {
@@ -924,14 +924,14 @@ const ee = /* @__PURE__ */ De(qe), Oe = ({
         L.name,
         S.map((_) => _.name)
       ), S.splice(d + 1, 0, L), C(L), o("templateName", L.name);
-      const G = B.find((_) => _.id === `${f.type}`);
-      return G ? o("templateType", G) : o("templateType", void 0), e(), F({ id: f?.id }).then((_) => {
+      const V = B.find((_) => _.id === `${f.type}`);
+      return V ? o("templateType", V) : o("templateType", void 0), e(), F({ id: f?.id }).then((_) => {
         _ && E(_);
       }), S;
     });
   }, ce = async (d) => {
     if (C(d), d) {
-      if (o("templateName", d?.name), D && D.find((y) => y.id === d.type)) {
+      if (o("templateName", d?.name), k && k.find((y) => y.id === d.type)) {
         const y = B.find((S) => S.id === `${d.type}`);
         y && o("templateType", y);
       } else
@@ -941,7 +941,7 @@ const ee = /* @__PURE__ */ De(qe), Oe = ({
     const f = await F({ id: d?.id });
     f && E(f);
   };
-  k(() => {
+  q(() => {
     t(R && c ? R : void 0);
   }, [R, c, t]);
   const de = (d) => {
@@ -1014,11 +1014,11 @@ const ee = /* @__PURE__ */ De(qe), Oe = ({
         {
           style: { width: "70px" },
           variant: "primary",
-          disabled: v || N || O || z,
+          disabled: v || N || D || z,
           onClick: () => {
             C(void 0), p(), i();
           },
-          children: N || O ? /* @__PURE__ */ s(
+          children: N || D ? /* @__PURE__ */ s(
             U,
             {
               animation: "border",
@@ -1037,8 +1037,8 @@ const ee = /* @__PURE__ */ De(qe), Oe = ({
           type: "submit",
           variant: "primary",
           style: { width: "80px" },
-          disabled: v || N || O || z,
-          children: N || O ? /* @__PURE__ */ s(
+          disabled: v || N || D || z,
+          children: N || D ? /* @__PURE__ */ s(
             U,
             {
               animation: "border",

package/dist/enerex-template-editor.umd.js

@@ -354,8 +354,8 @@
     </div>\r
   </body>\r
 </html>\r
-`,V=(n="",s)=>({get:async(r,e)=>{try{const o=await U.get(`${n}${r}`,e??s);if(o.status===200)return o.data}catch(o){throw o}},post:async(r,e,o)=>{try{const a=await U.post(`${n}${r}`,e,o??s);if(a.status===200)return a.data}catch(a){throw a}}}),A={EDITOR_SCRIPT_URL:"https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js",EDITOR_PLUGIN_ID:"1afdc3161ec7409a8627a1c8561d45f5",EDITOR_SECRET_KEY:"54ba748ed7e94f2e929555783acb03da",API_BASE_URL:"https://dev-socket.enerex.com/common/api"},K=p.createContext({get:()=>{throw new Error("HttpClientContext.get not implemented")},post:()=>{throw new Error("HttpClientContext.post not implemented")}}),Z=({children:n})=>{const{clientId:s,apiKey:i}=C(),l={headers:{client_id:s,"x-api-key":i}},{get:r,post:e}=V(A.API_BASE_URL,l);return t.jsx(K.Provider,{value:{get:r,post:e},children:n})},R=({children:n})=>{const s=new T.QueryClient;return t.jsx(Z,{children:t.jsx(T.QueryClientProvider,{client:s,children:n})})},ee=n=>{const s=Array.from(new Set(n.map(l=>l.category))),i=[];return s.forEach(l=>{const r=n.filter(e=>e.category===l).map(e=>({label:e.label,value:e.value,hint:e.hint,hidden:e.hidden}));i.push({category:l,entries:r})}),i},S=()=>{const n=p.useContext(K);if(n)return n;throw new Error("useHttpClient must be used within a HttpClientProvider")},N={Template_list:"/Template/list/",Template:"/Template/GetTemplate/",MergeTags:"/Template/TemplateMergeTags/",ExcludeCategory:"/Template/GetExcludeCategories/",SaveTemplate:"/Template/save-update/",TemplateTypes:"/Template/TemplateTypes/"},te=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getTemplateTags"],queryFn:async r=>await n.get(`${N.MergeTags}${i}/${s}`)})},ne=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getExcludeCategory"],queryFn:async r=>await n.get(`${N.ExcludeCategory}${i}/${s}`)})},re=({templateHTML:n,className:s="",loading:i=!1})=>{const{post:l}=V(),{data:r}=te(),{data:e}=ne(),[o,a]=p.useState(n??{html:O,css:""}),{enerexIdentifier:f,projectId:g}=C(),y="https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png",v="https://plugins.stripo.email/api/v1/auth";p.useEffect(()=>{if(r&&e&&!document.getElementById("UiEditorScript")){const h=document.createElement("script");h.id="UiEditorScript",h.type="module",h.src=A.EDITOR_SCRIPT_URL,h.onload=x,document.body.appendChild(h)}},[r,e]);const x=async()=>{window.UIEditor.initEditor(document.querySelector("#stripoEditorContainer"),{html:o.html,css:o.css,modulesExcludedCategories:e??[],forceRecreate:!0,metadata:{emailId:`plugin_${A.EDITOR_PLUGIN_ID}_demo_1_${g}_${f}`,userId:"1",username:"Plugin Demo User",avatarUrl:y},locale:"en",onTokenRefreshRequest:async function(h){const I={pluginId:A.EDITOR_PLUGIN_ID,secretKey:A.EDITOR_SECRET_KEY,userId:"12",role:"user"},d=await l(v,I);d&&h(d.token)},codeEditorButtonSelector:"#codeEditor",undoButtonSelector:"#undoButton",redoButtonSelector:"#redoButton",mobileViewButtonSelector:"#mobileViewButton",desktopViewButtonSelector:"#desktopViewButton",mergeTags:ee(r??[])})};return t.jsx("div",{className:"position-relative",children:t.jsxs("div",{className:`editor-container ${s}`,children:[i&&t.jsx("div",{className:"loading-overlay",children:t.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1"})}),t.jsx("div",{id:"externalSystemContainer"}),t.jsx("div",{id:"stripoEditorContainer"})]})})},se=({label:n,register:s,validation:i,required:l=!1,name:r,error:e,...o})=>t.jsxs(c.Form.Group,{className:"mb-1",children:[n?t.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[n,l&&t.jsx("label",{className:"text-danger",children:"*"})]}):null,t.jsx(c.Form.Control,{name:r,type:"text",...o,isInvalid:!!(e&&e[r]),...s?s(r,{...i}):{},className:`form-control ${e&&e[r]&&"border border-danger"}`}),e&&e[r]?t.jsx(c.Form.Control.Feedback,{type:"invalid",children:e[r].message}):null]});function oe({items:n,renderItem:s,className:i="",keyExtractor:l}){return t.jsx(c.ListGroup,{className:` ${i}`,children:n.map((r,e)=>t.jsx(c.ListGroup.Item,{children:s(r,e)},l?l(r,e):e))})}const ie=n=>t.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 640 640",...n,children:t.jsx("path",{d:"M352 528L128 528C119.2 528 112 520.8 112 512L112 288C112 279.2 119.2 272 128 272L176 272L176 224L128 224C92.7 224 64 252.7 64 288L64 512C64 547.3 92.7 576 128 576L352 576C387.3 576 416 547.3 416 512L416 464L368 464L368 512C368 520.8 360.8 528 352 528zM288 368C279.2 368 272 360.8 272 352L272 128C272 119.2 279.2 112 288 112L512 112C520.8 112 528 119.2 528 128L528 352C528 360.8 520.8 368 512 368L288 368zM224 352C224 387.3 252.7 416 288 416L512 416C547.3 416 576 387.3 576 352L576 128C576 92.7 547.3 64 512 64L288 64C252.7 64 224 92.7 224 128L224 352z"})}),le=({children:n,title:s,placement:i})=>{const l=t.jsx(c.Popover,{id:"popover-basic",className:"dark-popover",children:t.jsx(c.Popover.Body,{className:"p-0 text-white",children:s})});return t.jsx(c.OverlayTrigger,{trigger:["hover","focus"],placement:i,overlay:l,containerPadding:0,container:document.body,popperConfig:{modifiers:[{name:"flip",enabled:!1},{name:"preventOverflow",enabled:!0,options:{boundary:"window"}}]},children:n})},ae=({selected:n,group:s,value:i,label:l,onCopy:r,onSelect:e,subItem:o=!1})=>t.jsxs("div",{className:"ps-1 py-1 d-flex position-relative",style:{alignItems:"center"},children:[t.jsx("input",{type:"radio",onChange:()=>{e(i)},className:"me-2",checked:n,name:s}),t.jsx("p",{title:l,className:"mb-0 wraped-text",children:l}),!o&&t.jsx(le,{title:"Copy",placement:"top",children:t.jsx("button",{className:"btn btn-link",type:"button",style:{padding:0,marginLeft:"auto",position:"relative",minWidth:32,flexShrink:0},children:t.jsx(ie,{onClick:()=>r(i),height:20,fill:"black"})})})]}),de=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getTemplatesList"],queryFn:async r=>await n.get(`${N.Template_list}${i}/${s}`)})},ce=(n,s=[])=>{const i=/^(?:\(copy(?:-(\d+))?\)\s)?(.+)$/,l=n.match(i);if(!l)return`(copy) ${n}`;const r=l[2],e=new RegExp(`^\\(copy(?:-(\\d+))?\\) ${r.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}$`);let o=1;const a=s.filter(f=>e.test(f));return a.length===0?`(copy) ${r}`:(a.forEach(f=>{const g=f.match(e);if(g&&g[1]){const y=parseInt(g[1],10);!isNaN(y)&&y>=o&&(o=y+1)}else o=Math.max(o,2)}),`(copy-${o}) ${r}`)},pe=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useMutation({mutationKey:["getTemplate"],mutationFn:async({id:r})=>{if(r)return await n.get(`${N.Template}${s}/${r}/${i}`)}})},me=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getTemplateTypes"],queryFn:async r=>await n.get(`${N.TemplateTypes}${s}/${i}`)})};function fe(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}var M={exports:{}};/*!
+`,V=(n="",s)=>({get:async(r,e)=>{try{const o=await U.get(`${n}${r}`,e??s);if(o.status===200)return o.data}catch(o){throw o}},post:async(r,e,o)=>{try{const a=await U.post(`${n}${r}`,e,o??s);if(a.status===200)return a.data}catch(a){throw a}}}),j={EDITOR_SCRIPT_URL:"https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js",EDITOR_PLUGIN_ID:"1afdc3161ec7409a8627a1c8561d45f5",EDITOR_SECRET_KEY:"54ba748ed7e94f2e929555783acb03da",API_BASE_URL:"https://dev-socket.enerex.com/common/api"},K=p.createContext({get:()=>{throw new Error("HttpClientContext.get not implemented")},post:()=>{throw new Error("HttpClientContext.post not implemented")}}),Z=({children:n})=>{const{clientId:s,apiKey:i}=C(),l={headers:{client_id:s,"x-api-key":i}},{get:r,post:e}=V(j.API_BASE_URL,l);return t.jsx(K.Provider,{value:{get:r,post:e},children:n})},R=({children:n})=>{const s=new T.QueryClient;return t.jsx(Z,{children:t.jsx(T.QueryClientProvider,{client:s,children:n})})},ee=n=>{const s=Array.from(new Set(n.map(l=>l.category))),i=[];return s.forEach(l=>{const r=n.filter(e=>e.category===l).map(e=>({label:e.label,value:e.value,hint:e.hint,hidden:e.hidden}));i.push({category:l,entries:r})}),i},S=()=>{const n=p.useContext(K);if(n)return n;throw new Error("useHttpClient must be used within a HttpClientProvider")},N={Template_list:"/Template/list/",Template:"/Template/GetTemplate/",MergeTags:"/Template/TemplateMergeTags/",ExcludeCategory:"/Template/GetExcludeCategories/",SaveTemplate:"/Template/save-update/",TemplateTypes:"/Template/TemplateTypes/"},te=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getTemplateTags"],queryFn:async r=>await n.get(`${N.MergeTags}${i}/${s}`)})},ne=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getExcludeCategory"],queryFn:async r=>await n.get(`${N.ExcludeCategory}${i}/${s}`)})},re=({templateHTML:n,className:s="",loading:i=!1})=>{const{post:l}=V(),{data:r}=te(),{data:e}=ne(),[o,a]=p.useState(n??{html:O,css:""}),{enerexIdentifier:f,projectId:g}=C(),y="https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png",v="https://plugins.stripo.email/api/v1/auth";p.useEffect(()=>{if(r&&e&&!document.getElementById("UiEditorScript")){const h=document.createElement("script");h.id="UiEditorScript",h.type="module",h.src=j.EDITOR_SCRIPT_URL,h.onload=x,document.body.appendChild(h)}},[r,e]);const x=async()=>{window.UIEditor.initEditor(document.querySelector("#stripoEditorContainer"),{html:o.html,css:o.css,modulesExcludedCategories:e??[],forceRecreate:!0,metadata:{emailId:`${g}_${f}`,userId:"1",username:"Plugin Demo User",avatarUrl:y},locale:"en",onTokenRefreshRequest:async function(h){const I={pluginId:j.EDITOR_PLUGIN_ID,secretKey:j.EDITOR_SECRET_KEY,userId:"12",role:"user"},d=await l(v,I);d&&h(d.token)},codeEditorButtonSelector:"#codeEditor",undoButtonSelector:"#undoButton",redoButtonSelector:"#redoButton",mobileViewButtonSelector:"#mobileViewButton",desktopViewButtonSelector:"#desktopViewButton",mergeTags:ee(r??[])})};return t.jsx("div",{className:"position-relative",children:t.jsxs("div",{className:`editor-container ${s}`,children:[i&&t.jsx("div",{className:"loading-overlay",children:t.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1"})}),t.jsx("div",{id:"externalSystemContainer"}),t.jsx("div",{id:"stripoEditorContainer"})]})})},se=({label:n,register:s,validation:i,required:l=!1,name:r,error:e,...o})=>t.jsxs(c.Form.Group,{className:"mb-1",children:[n?t.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[n,l&&t.jsx("label",{className:"text-danger",children:"*"})]}):null,t.jsx(c.Form.Control,{name:r,type:"text",...o,isInvalid:!!(e&&e[r]),...s?s(r,{...i}):{},className:`form-control ${e&&e[r]&&"border border-danger"}`}),e&&e[r]?t.jsx(c.Form.Control.Feedback,{type:"invalid",children:e[r].message}):null]});function oe({items:n,renderItem:s,className:i="",keyExtractor:l}){return t.jsx(c.ListGroup,{className:` ${i}`,children:n.map((r,e)=>t.jsx(c.ListGroup.Item,{children:s(r,e)},l?l(r,e):e))})}const ie=n=>t.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 640 640",...n,children:t.jsx("path",{d:"M352 528L128 528C119.2 528 112 520.8 112 512L112 288C112 279.2 119.2 272 128 272L176 272L176 224L128 224C92.7 224 64 252.7 64 288L64 512C64 547.3 92.7 576 128 576L352 576C387.3 576 416 547.3 416 512L416 464L368 464L368 512C368 520.8 360.8 528 352 528zM288 368C279.2 368 272 360.8 272 352L272 128C272 119.2 279.2 112 288 112L512 112C520.8 112 528 119.2 528 128L528 352C528 360.8 520.8 368 512 368L288 368zM224 352C224 387.3 252.7 416 288 416L512 416C547.3 416 576 387.3 576 352L576 128C576 92.7 547.3 64 512 64L288 64C252.7 64 224 92.7 224 128L224 352z"})}),le=({children:n,title:s,placement:i})=>{const l=t.jsx(c.Popover,{id:"popover-basic",className:"dark-popover",children:t.jsx(c.Popover.Body,{className:"p-0 text-white",children:s})});return t.jsx(c.OverlayTrigger,{trigger:["hover","focus"],placement:i,overlay:l,containerPadding:0,container:document.body,popperConfig:{modifiers:[{name:"flip",enabled:!1},{name:"preventOverflow",enabled:!0,options:{boundary:"window"}}]},children:n})},ae=({selected:n,group:s,value:i,label:l,onCopy:r,onSelect:e,subItem:o=!1})=>t.jsxs("div",{className:"ps-1 py-1 d-flex position-relative",style:{alignItems:"center"},children:[t.jsx("input",{type:"radio",onChange:()=>{e(i)},className:"me-2",checked:n,name:s}),t.jsx("p",{title:l,className:"mb-0 wraped-text",children:l}),!o&&t.jsx(le,{title:"Copy",placement:"top",children:t.jsx("button",{className:"btn btn-link",type:"button",style:{padding:0,marginLeft:"auto",position:"relative",minWidth:32,flexShrink:0},children:t.jsx(ie,{onClick:()=>r(i),height:20,fill:"black"})})})]}),de=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getTemplatesList"],queryFn:async r=>await n.get(`${N.Template_list}${i}/${s}`)})},ce=(n,s=[])=>{const i=/^(?:\(copy(?:-(\d+))?\)\s)?(.+)$/,l=n.match(i);if(!l)return`(copy) ${n}`;const r=l[2],e=new RegExp(`^\\(copy(?:-(\\d+))?\\) ${r.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}$`);let o=1;const a=s.filter(f=>e.test(f));return a.length===0?`(copy) ${r}`:(a.forEach(f=>{const g=f.match(e);if(g&&g[1]){const y=parseInt(g[1],10);!isNaN(y)&&y>=o&&(o=y+1)}else o=Math.max(o,2)}),`(copy-${o}) ${r}`)},pe=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useMutation({mutationKey:["getTemplate"],mutationFn:async({id:r})=>{if(r)return await n.get(`${N.Template}${s}/${r}/${i}`)}})},me=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getTemplateTypes"],queryFn:async r=>await n.get(`${N.TemplateTypes}${s}/${i}`)})};function fe(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}var M={exports:{}};/*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
 	http://jedwatson.github.io/classnames
-*/var W;function ue(){return W||(W=1,function(n){(function(){var s={}.hasOwnProperty;function i(){for(var e="",o=0;o<arguments.length;o++){var a=arguments[o];a&&(e=r(e,l(a)))}return e}function l(e){if(typeof e=="string"||typeof e=="number")return e;if(typeof e!="object")return"";if(Array.isArray(e))return i.apply(null,e);if(e.toString!==Object.prototype.toString&&!e.toString.toString().includes("[native code]"))return e.toString();var o="";for(var a in e)s.call(e,a)&&e[a]&&(o=r(o,a));return o}function r(e,o){return o?e?e+" "+o:e+o:e}n.exports?(i.default=i,n.exports=i):window.classNames=i})()}(M)),M.exports}var ge=ue();const Y=fe(ge),ye=({name:n="",control:s,options:i,multiple:l=!1,placeholder:r,validation:e,labelKey:o="name",disabled:a,isInvalid:f,value:g,onChange:y,uncontrolled:v,menuPlacement:x="auto",closeOnSelect:h=!0})=>{const I={control:d=>({...d,minHeight:"33px",borderColor:f?"var(--bs-form-invalid-border-color) !important":"var(--ct-input-border-color)",backgroundImage:f?'url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 12%27 width=%2712%27 height=%2712%27 fill=%27none%27 stroke=%27%23fa5c7c%27%3e%3ccircle cx=%276%27 cy=%276%27 r=%274.5%27/%3e%3cpath stroke-linejoin=%27round%27 d=%27M5.8 3.6h.4L6 6.5z%27/%3e%3ccircle cx=%276%27 cy=%278.2%27 r=%27.6%27 fill=%27%23fa5c7c%27 stroke=%27none%27/%3e%3c/svg%3e")':"none",backgroundRepeat:"no-repeat",backgroundPosition:"right calc(0.375em + 0.225rem) center",backgroundSize:"calc(0.75em + 0.45rem) calc(0.75em + 0.45rem)","&:hover":{borderColor:f?"var(--bs-form-invalid-border-color)":"var(--ct-input-border-color)"},"& .react-select__single-value":{color:"var(--ct-input-color) !important"},"& .react-select__placeholder":{color:"var(--ct-input-placeholder-color) !important"},"& .react-select__indicators":{display:"none"}}),menu:d=>({...d,marginTop:0,width:"max-content",minWidth:"100%"}),menuPortal:d=>({...d,zIndex:9999}),multiValueRemove:d=>({...d,display:a?"none":"block"})};return v?t.jsx(z,{className:Y({"is-invalid":f}),styles:I,classNamePrefix:"react-select",isMulti:l,options:i,onChange:y,placeholder:r,menuPortalTarget:document.body,value:g,getOptionLabel:typeof o=="string"?d=>d[o]:o,getOptionValue:d=>d.id,isDisabled:a,menuPlacement:x,closeMenuOnSelect:h}):t.jsx(H.Controller,{control:s,name:n,rules:e,render:({field:{onChange:d,value:E,onBlur:k}})=>t.jsx(z,{className:Y({"is-invalid":f}),styles:I,classNamePrefix:"react-select",isMulti:l,options:i,onBlur:k,onChange:d,placeholder:r,menuPortalTarget:document.body,value:E,getOptionLabel:typeof o=="string"?L=>L[o]:o,getOptionValue:L=>L.id,isDisabled:a,menuPlacement:x,closeMenuOnSelect:h},E?JSON.stringify(E):"reset")})},he=({label:n,name:s,validation:i,control:l,error:r,...e})=>t.jsxs(c.Form.Group,{className:"mb-1",children:[n&&t.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[n," ",e.required&&t.jsx("span",{className:"text-danger",children:"*"})]}),t.jsx(ye,{control:l,options:e.options??[],validation:i,isInvalid:r&&!!r[s],name:s}),r&&r[s]?t.jsx(c.Form.Control.Feedback,{type:"invalid",children:r[s].message}):null]}),be=()=>{const n=S();T.useQueryClient();const{enerexIdentifier:s,projectId:i}=C();return T.useMutation({mutationKey:["saveTemplate"],mutationFn:async r=>(r.enerexIdentifier=s??"",r.projectId=i??"",await n.post(`${N.SaveTemplate}`,r))})},we=({onSelectItem:n,templateLoading:s,onReset:i})=>{const{register:l,handleSubmit:r,clearErrors:e,setValue:o,control:a,reset:f,formState:{errors:g}}=H.useForm({defaultValues:{templateName:"",templateType:void 0},mode:"onChange"}),{data:y,refetch:v,isLoading:x}=de(),[h,I]=p.useState([]),[d,E]=p.useState(),[k,L]=p.useState(),{mutateAsync:B,isPending:_}=pe(),{mutateAsync:Te,isPending:D}=be(),{data:j,isLoading:X}=me(),[F,Ce]=p.useState([]);p.useEffect(()=>{j&&Ce(j.map(m=>({id:`${m.id}`,name:m.name})))},[j]),p.useEffect(()=>{s(!!_)},[_]),p.useEffect(()=>{I(y??[])},[y]);const xe=async(m,b)=>{b&&I(w=>{const P=[...w],$={...b};$.id="",$.name=ce($.name,P.map(q=>q.name)),P.splice(m+1,0,$),E($),o("templateName",$.name);const J=F.find(q=>q.id===`${b.type}`);return J?o("templateType",J):o("templateType",void 0),e(),B({id:b?.id}).then(q=>{q&&L(q)}),P})},Ie=async m=>{if(E(m),m){if(o("templateName",m?.name),j&&j.find(w=>w.id===m.type)){const w=F.find(P=>P.id===`${m.type}`);w&&o("templateType",w)}else o("templateType",void 0);e()}const b=await B({id:m?.id});b&&L(b)};p.useEffect(()=>{n(k&&d?k:void 0)},[k,d,n]);const Ee=m=>{window.StripoEditorApi.actionsApi.getTemplateData(async b=>{const w={enerexIdentifier:"",projectId:"",templateId:d?.id??"",templateType:m.templateType.id,name:m.templateName,html:b.html,css:b.css};await Te(w)&&(e(),d?.id===""&&f(),v())})};return t.jsx(c.Card,{className:"border border-0 text-start",children:t.jsx(c.Card.Body,{className:"pe-0 ps-2",children:t.jsxs("form",{onSubmit:r(Ee),children:[t.jsx("label",{className:"mb-2",children:"Templates"}),t.jsx("div",{className:"template-list-container mb-3",children:t.jsx(oe,{items:h,renderItem:(m,b)=>t.jsx(ae,{selected:m===d,label:m.name,subItem:m.id==="",onCopy:w=>xe(b,w),onSelect:w=>Ie(w),value:m,group:"templates"})})}),t.jsx(he,{label:"Template Type",control:a,error:g,options:F,required:!0,validation:{required:{value:!0,message:"Template Type is required"}},...l("templateType")}),t.jsx(se,{label:"Template Name",register:l,error:g,required:!0,name:"templateName",validation:{required:{value:!0,message:"Template Name is required"}}}),t.jsx("hr",{}),t.jsxs("div",{className:"d-flex justify-content-between mt-3 ",children:[t.jsx(c.Button,{style:{width:"70px"},variant:"primary",disabled:x||_||D||X,onClick:()=>{E(void 0),f(),i()},children:_||D?t.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:t.jsx("span",{className:"visually-hidden",children:"Loading..."})}):"Clear"}),t.jsx(c.Button,{type:"submit",variant:"primary",style:{width:"80px"},disabled:x||_||D||X,children:_||D?t.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:t.jsx("span",{className:"visually-hidden",children:"Loading..."})}):(d?.id??"")===""?"Save":"Update"})]})]})})})},ve=({config:n})=>{const[s,i]=p.useState(),[l,r]=p.useState(!1),e=a=>{i(a),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&a&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(a?.html??"",a?.css??"","")},o=()=>{r(!1),i(void 0),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(O,"","")};return t.jsx(Q,{configs:n,children:t.jsx(R,{children:t.jsx("div",{className:"root-widget",children:t.jsxs(c.Row,{children:[t.jsx(c.Col,{md:3,lg:2,className:"p-0",children:t.jsx(we,{templateLoading:r,onSelectItem:e,onReset:o})}),t.jsx(c.Col,{md:9,lg:10,children:t.jsx(re,{templateHTML:{css:s?.css??"",html:s?.html??O},loading:l,className:"col-span-5"})})]})})})})};u.EditorWidget=ve,Object.defineProperty(u,Symbol.toStringTag,{value:"Module"})});
+*/var W;function ue(){return W||(W=1,function(n){(function(){var s={}.hasOwnProperty;function i(){for(var e="",o=0;o<arguments.length;o++){var a=arguments[o];a&&(e=r(e,l(a)))}return e}function l(e){if(typeof e=="string"||typeof e=="number")return e;if(typeof e!="object")return"";if(Array.isArray(e))return i.apply(null,e);if(e.toString!==Object.prototype.toString&&!e.toString.toString().includes("[native code]"))return e.toString();var o="";for(var a in e)s.call(e,a)&&e[a]&&(o=r(o,a));return o}function r(e,o){return o?e?e+" "+o:e+o:e}n.exports?(i.default=i,n.exports=i):window.classNames=i})()}(M)),M.exports}var ge=ue();const Y=fe(ge),ye=({name:n="",control:s,options:i,multiple:l=!1,placeholder:r,validation:e,labelKey:o="name",disabled:a,isInvalid:f,value:g,onChange:y,uncontrolled:v,menuPlacement:x="auto",closeOnSelect:h=!0})=>{const I={control:d=>({...d,minHeight:"33px",borderColor:f?"var(--bs-form-invalid-border-color) !important":"var(--ct-input-border-color)",backgroundImage:f?'url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 12%27 width=%2712%27 height=%2712%27 fill=%27none%27 stroke=%27%23fa5c7c%27%3e%3ccircle cx=%276%27 cy=%276%27 r=%274.5%27/%3e%3cpath stroke-linejoin=%27round%27 d=%27M5.8 3.6h.4L6 6.5z%27/%3e%3ccircle cx=%276%27 cy=%278.2%27 r=%27.6%27 fill=%27%23fa5c7c%27 stroke=%27none%27/%3e%3c/svg%3e")':"none",backgroundRepeat:"no-repeat",backgroundPosition:"right calc(0.375em + 0.225rem) center",backgroundSize:"calc(0.75em + 0.45rem) calc(0.75em + 0.45rem)","&:hover":{borderColor:f?"var(--bs-form-invalid-border-color)":"var(--ct-input-border-color)"},"& .react-select__single-value":{color:"var(--ct-input-color) !important"},"& .react-select__placeholder":{color:"var(--ct-input-placeholder-color) !important"},"& .react-select__indicators":{display:"none"}}),menu:d=>({...d,marginTop:0,width:"max-content",minWidth:"100%"}),menuPortal:d=>({...d,zIndex:9999}),multiValueRemove:d=>({...d,display:a?"none":"block"})};return v?t.jsx(z,{className:Y({"is-invalid":f}),styles:I,classNamePrefix:"react-select",isMulti:l,options:i,onChange:y,placeholder:r,menuPortalTarget:document.body,value:g,getOptionLabel:typeof o=="string"?d=>d[o]:o,getOptionValue:d=>d.id,isDisabled:a,menuPlacement:x,closeMenuOnSelect:h}):t.jsx(H.Controller,{control:s,name:n,rules:e,render:({field:{onChange:d,value:E,onBlur:A}})=>t.jsx(z,{className:Y({"is-invalid":f}),styles:I,classNamePrefix:"react-select",isMulti:l,options:i,onBlur:A,onChange:d,placeholder:r,menuPortalTarget:document.body,value:E,getOptionLabel:typeof o=="string"?L=>L[o]:o,getOptionValue:L=>L.id,isDisabled:a,menuPlacement:x,closeMenuOnSelect:h},E?JSON.stringify(E):"reset")})},he=({label:n,name:s,validation:i,control:l,error:r,...e})=>t.jsxs(c.Form.Group,{className:"mb-1",children:[n&&t.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[n," ",e.required&&t.jsx("span",{className:"text-danger",children:"*"})]}),t.jsx(ye,{control:l,options:e.options??[],validation:i,isInvalid:r&&!!r[s],name:s}),r&&r[s]?t.jsx(c.Form.Control.Feedback,{type:"invalid",children:r[s].message}):null]}),be=()=>{const n=S();T.useQueryClient();const{enerexIdentifier:s,projectId:i}=C();return T.useMutation({mutationKey:["saveTemplate"],mutationFn:async r=>(r.enerexIdentifier=s??"",r.projectId=i??"",await n.post(`${N.SaveTemplate}`,r))})},we=({onSelectItem:n,templateLoading:s,onReset:i})=>{const{register:l,handleSubmit:r,clearErrors:e,setValue:o,control:a,reset:f,formState:{errors:g}}=H.useForm({defaultValues:{templateName:"",templateType:void 0},mode:"onChange"}),{data:y,refetch:v,isLoading:x}=de(),[h,I]=p.useState([]),[d,E]=p.useState(),[A,L]=p.useState(),{mutateAsync:B,isPending:P}=pe(),{mutateAsync:Te,isPending:D}=be(),{data:k,isLoading:X}=me(),[F,Ce]=p.useState([]);p.useEffect(()=>{k&&Ce(k.map(m=>({id:`${m.id}`,name:m.name})))},[k]),p.useEffect(()=>{s(!!P)},[P]),p.useEffect(()=>{I(y??[])},[y]);const xe=async(m,b)=>{b&&I(w=>{const _=[...w],$={...b};$.id="",$.name=ce($.name,_.map(q=>q.name)),_.splice(m+1,0,$),E($),o("templateName",$.name);const J=F.find(q=>q.id===`${b.type}`);return J?o("templateType",J):o("templateType",void 0),e(),B({id:b?.id}).then(q=>{q&&L(q)}),_})},Ie=async m=>{if(E(m),m){if(o("templateName",m?.name),k&&k.find(w=>w.id===m.type)){const w=F.find(_=>_.id===`${m.type}`);w&&o("templateType",w)}else o("templateType",void 0);e()}const b=await B({id:m?.id});b&&L(b)};p.useEffect(()=>{n(A&&d?A:void 0)},[A,d,n]);const Ee=m=>{window.StripoEditorApi.actionsApi.getTemplateData(async b=>{const w={enerexIdentifier:"",projectId:"",templateId:d?.id??"",templateType:m.templateType.id,name:m.templateName,html:b.html,css:b.css};await Te(w)&&(e(),d?.id===""&&f(),v())})};return t.jsx(c.Card,{className:"border border-0 text-start",children:t.jsx(c.Card.Body,{className:"pe-0 ps-2",children:t.jsxs("form",{onSubmit:r(Ee),children:[t.jsx("label",{className:"mb-2",children:"Templates"}),t.jsx("div",{className:"template-list-container mb-3",children:t.jsx(oe,{items:h,renderItem:(m,b)=>t.jsx(ae,{selected:m===d,label:m.name,subItem:m.id==="",onCopy:w=>xe(b,w),onSelect:w=>Ie(w),value:m,group:"templates"})})}),t.jsx(he,{label:"Template Type",control:a,error:g,options:F,required:!0,validation:{required:{value:!0,message:"Template Type is required"}},...l("templateType")}),t.jsx(se,{label:"Template Name",register:l,error:g,required:!0,name:"templateName",validation:{required:{value:!0,message:"Template Name is required"}}}),t.jsx("hr",{}),t.jsxs("div",{className:"d-flex justify-content-between mt-3 ",children:[t.jsx(c.Button,{style:{width:"70px"},variant:"primary",disabled:x||P||D||X,onClick:()=>{E(void 0),f(),i()},children:P||D?t.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:t.jsx("span",{className:"visually-hidden",children:"Loading..."})}):"Clear"}),t.jsx(c.Button,{type:"submit",variant:"primary",style:{width:"80px"},disabled:x||P||D||X,children:P||D?t.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:t.jsx("span",{className:"visually-hidden",children:"Loading..."})}):(d?.id??"")===""?"Save":"Update"})]})]})})})},ve=({config:n})=>{const[s,i]=p.useState(),[l,r]=p.useState(!1),e=a=>{i(a),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&a&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(a?.html??"",a?.css??"","")},o=()=>{r(!1),i(void 0),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(O,"","")};return t.jsx(Q,{configs:n,children:t.jsx(R,{children:t.jsx("div",{className:"root-widget",children:t.jsxs(c.Row,{children:[t.jsx(c.Col,{md:3,lg:2,className:"p-0",children:t.jsx(we,{templateLoading:r,onSelectItem:e,onReset:o})}),t.jsx(c.Col,{md:9,lg:10,children:t.jsx(re,{templateHTML:{css:s?.css??"",html:s?.html??O},loading:l,className:"col-span-5"})})]})})})})};u.EditorWidget=ve,Object.defineProperty(u,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@enerex/template-studio",
-  "version": "1.1.14",
+  "version": "1.1.16",
   "main": "./dist/enerex-template-editor.umd.js",
   "module": "./dist/enerex-template-editor.es.js",
   "types": "./dist/types/index.d.ts",