@enerex/template-studio 1.1.40 → 1.1.41

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

@@ -1,65 +1,65 @@
-import { jsx as t, jsxs as d, Fragment as pe } from "react/jsx-runtime";
-import W, { useContext as Se, useEffect as P, useState as N, useRef as Z, useCallback as Ee, createContext as Fe, memo as je, useMemo as se } from "react";
-import { QueryClient as qe, QueryClientProvider as Ue, useQuery as fe, useMutation as oe, useQueryClient as Ve } from "@tanstack/react-query";
+import { jsx as t, jsxs as c, Fragment as fe } from "react/jsx-runtime";
+import W, { useContext as Se, useEffect as L, useState as N, useRef as J, useCallback as xe, createContext as je, memo as qe, useMemo as re } from "react";
+import { QueryClient as Ue, QueryClientProvider as Ve, useQuery as he, useMutation as oe, useQueryClient as He } from "@tanstack/react-query";
 import be from "axios";
-import { Spinner as He } from "react-bootstrap";
-import { Controller as Ke, useForm as Ge } from "react-hook-form";
-import Ie, { components as Le } from "react-select";
-const De = W.createContext(
+import { Spinner as Ke } from "react-bootstrap";
+import { Controller as Ge, useForm as We } from "react-hook-form";
+import Le, { components as Pe } from "react-select";
+const Me = W.createContext(
   void 0
-), We = ({
+), ze = ({
   children: e,
   configs: n
 }) => {
-  const [s, a] = W.useState(n.clientId), [i, r] = W.useState(n.apiKey), [l, c] = W.useState(
+  const [s, a] = W.useState(n.clientId), [i, r] = W.useState(n.apiKey), [l, o] = W.useState(
     n.enerexIdentifier
-  ), [o, w] = W.useState(n.projectId), [f, C] = W.useState(n.userEmail), [g, S] = W.useState(n.isAdmin), [A, h] = W.useState(n.meBaseUrl), [y, b] = W.useState(
+  ), [d, y] = W.useState(n.projectId), [m, T] = W.useState(n.userEmail), [w, E] = W.useState(n.isAdmin), [A, h] = W.useState(n.meBaseUrl), [g, b] = W.useState(
     n.defaultSelector
-  ), m = (v) => {
-    r(v.apiKey), a(v.clientId), w(v.projectId), c(v.enerexIdentifier), C(v.userEmail), S(v.isAdmin), b(v.defaultSelector), h(v.meBaseUrl);
+  ), p = (v) => {
+    r(v.apiKey), a(v.clientId), y(v.projectId), o(v.enerexIdentifier), T(v.userEmail), E(v.isAdmin), b(v.defaultSelector), h(v.meBaseUrl);
   };
   return /* @__PURE__ */ t(
-    De.Provider,
+    Me.Provider,
     {
       value: {
         clientId: s,
         apiKey: i,
-        setConfiguration: m,
+        setConfiguration: p,
         enerexIdentifier: l,
-        projectId: o,
-        userEmail: f,
-        isAdmin: g,
-        defaultSelector: y,
+        projectId: d,
+        userEmail: m,
+        isAdmin: w,
+        defaultSelector: g,
         meBaseUrl: A
       },
       children: e
     }
   );
-}, H = () => {
-  const e = Se(De);
+}, q = () => {
+  const e = Se(Me);
   if (!e)
     throw new Error("widgetConfig must be used within a ConfigProvider");
   return e;
-}, ze = ({
+}, Qe = ({
   message: e,
   type: n = "info",
   duration: s = 3e3,
   onClose: a
-}) => (P(() => {
+}) => (L(() => {
   const i = setTimeout(a, s);
   return () => clearTimeout(i);
-}, [s, a]), /* @__PURE__ */ d("div", { className: `ts-toast ts-toast-${n}`, children: [
+}, [s, a]), /* @__PURE__ */ c("div", { className: `ts-toast ts-toast-${n}`, children: [
   /* @__PURE__ */ t("span", { className: "ts-toast-message", children: e }),
   /* @__PURE__ */ t("button", { className: "ts-toast-close", onClick: a, children: "×" })
-] })), Qe = () => {
-  const [e, n] = N(null), s = Z(null);
-  return { showNotification: Ee(
+] })), Xe = () => {
+  const [e, n] = N(null), s = J(null);
+  return { showNotification: xe(
     (r, l = "info") => {
       s.current !== r && (s.current = r, n({ message: r, type: l }));
     },
     []
   ), NotificationRenderer: () => e ? /* @__PURE__ */ t(
-    ze,
+    Qe,
     {
       message: e.message,
       type: e.type,
@@ -68,16 +68,16 @@ const De = W.createContext(
       }
     }
   ) : null };
-}, Me = Fe(null), Xe = ({
+}, Re = je(null), Ye = ({
   children: e
 }) => {
-  const n = Qe();
-  return /* @__PURE__ */ d(Me.Provider, { value: n, children: [
+  const n = Xe();
+  return /* @__PURE__ */ c(Re.Provider, { value: n, children: [
     e,
     /* @__PURE__ */ t(n.NotificationRenderer, {})
   ] });
-}, Re = () => {
-  const e = Se(Me);
+}, ke = () => {
+  const e = Se(Re);
   if (!e)
     throw new Error(
       "useGlobalNotification must be used within NotificationProvider"
@@ -85,37 +85,37 @@ const De = W.createContext(
   return e;
 }, Oe = (e = "", n) => ({ get: async (r, l) => {
   try {
-    const c = await be.get(
+    const o = await be.get(
       `${e}${r}`,
       l ?? n
     );
-    if (c.status === 200)
-      return c.data;
-  } catch (c) {
-    throw c;
+    if (o.status === 200)
+      return o.data;
+  } catch (o) {
+    throw o;
   }
-}, post: async (r, l, c) => {
+}, post: async (r, l, o) => {
   try {
-    const o = await be.post(
+    const d = await be.post(
       `${e}${r}`,
       l,
-      c ?? n
+      o ?? n
     );
-    if (o.status === 200)
-      return o.data;
-  } catch (o) {
-    throw o;
+    if (d.status === 200)
+      return d.data;
+  } catch (d) {
+    throw d;
   }
 }, delete: async (r, l) => {
   try {
-    const c = await be.delete(
+    const o = await be.delete(
       `${e}${r}`,
       l ?? n
     );
-    if (c.status === 200 || c.status === 204)
-      return c.data;
-  } catch (c) {
-    throw c;
+    if (o.status === 200 || o.status === 204)
+      return o.data;
+  } catch (o) {
+    throw o;
   }
 } }), Be = W.createContext({
   get: () => {
@@ -127,18 +127,18 @@ const De = W.createContext(
   delete: () => {
     throw new Error("HttpClientContext.delete not implemented");
   }
-}), Ye = ({ children: e }) => {
-  const { clientId: n, apiKey: s, isAdmin: a, meBaseUrl: i } = H(), r = {
+}), Je = ({ children: e }) => {
+  const { clientId: n, apiKey: s, isAdmin: a, meBaseUrl: i } = q(), r = {
     headers: {
       client_id: n,
       "x-api-key": s,
       "Security-Context": a ? "admin" : "viewer"
     }
-  }, { get: l, post: c, delete: o } = Oe(i, r);
-  return /* @__PURE__ */ t(Be.Provider, { value: { get: l, post: c, delete: o }, children: e });
-}, Je = ({ children: e }) => {
-  const n = new qe();
-  return /* @__PURE__ */ t(Ye, { children: /* @__PURE__ */ t(Ue, { client: n, children: e }) });
+  }, { get: l, post: o, delete: d } = Oe(i, r);
+  return /* @__PURE__ */ t(Be.Provider, { value: { get: l, post: o, delete: d }, children: e });
+}, Ze = ({ children: e }) => {
+  const n = new Ue();
+  return /* @__PURE__ */ t(Je, { children: /* @__PURE__ */ t(Ve, { client: n, children: e }) });
 }, z = () => {
   const e = Se(Be);
   if (e)
@@ -154,9 +154,9 @@ const De = W.createContext(
   markFavourite: "/Template/MarkFavourite/",
   deleteTemplate: "/Template/DeleteTemplate/",
   duplicateTemplate: "/Template/DuplicateTemplate/"
-}, Ze = () => {
-  const e = z(), { enerexIdentifier: n, projectId: s } = H();
-  return fe({
+}, et = () => {
+  const e = z(), { enerexIdentifier: n, projectId: s } = q();
+  return he({
     queryKey: ["getTemplatesList"],
     queryFn: async (i) => await e.get(
       `${Q.Template_list}${s}/${n}`
@@ -165,9 +165,9 @@ const De = W.createContext(
     refetchOnReconnect: !1,
     refetchOnMount: !1
   });
-}, et = () => {
-  const e = z(), { enerexIdentifier: n, projectId: s } = H();
-  return fe({
+}, tt = () => {
+  const e = z(), { enerexIdentifier: n, projectId: s } = q();
+  return he({
     queryKey: ["getTemplateTypes"],
     queryFn: async (i) => await e.get(
       `${Q.TemplateTypes}${n}/${s}`
@@ -176,8 +176,8 @@ const De = W.createContext(
     refetchOnReconnect: !1,
     refetchOnMount: !1
   });
-}, tt = () => {
-  const e = z(), { enerexIdentifier: n, projectId: s } = H();
+}, nt = () => {
+  const e = z(), { enerexIdentifier: n, projectId: s } = q();
   return oe({
     mutationKey: ["getTemplate"],
     mutationFn: async ({ id: i }) => {
@@ -187,48 +187,142 @@ const De = W.createContext(
         );
     }
   });
-}, ae = ({
+}, se = ({
   size: e = "md",
   center: n = !1,
   overlay: s = !1
 }) => {
   const a = /* @__PURE__ */ t("div", { className: `ts-loader ts-loader-${e}` });
   return s ? /* @__PURE__ */ t("div", { className: "ts-loader-overlay", children: a }) : n ? /* @__PURE__ */ t("div", { className: "ts-loader-center", children: a }) : a;
+}, Fe = () => {
+  const e = z(), { enerexIdentifier: n, projectId: s } = q();
+  return oe({
+    mutationKey: ["markFavourite"],
+    mutationFn: async (i) => await e.post(
+      `${Q.markFavourite}${s}/${n}`,
+      i
+    )
+  });
+}, Ee = (e) => {
+  let n = /* @__PURE__ */ t(
+    "span",
+    {
+      style: { width: "20px", height: "20px", display: "inline-block" }
+    }
+  );
+  return e.variant === "filled" ? n = /* @__PURE__ */ t(
+    "svg",
+    {
+      version: "1.0",
+      id: "Layer_1",
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "20px",
+      height: "20px",
+      viewBox: "0 0 64 64",
+      "enable-background": "new 0 0 64 64",
+      children: /* @__PURE__ */ t(
+        "path",
+        {
+          fill: "#2196F3",
+          d: `M63.893,24.277c-0.238-0.711-0.854-1.229-1.595-1.343l-19.674-3.006L33.809,1.15\r
+	C33.479,0.448,32.773,0,31.998,0s-1.48,0.448-1.811,1.15l-8.815,18.778L1.698,22.935c-0.741,0.113-1.356,0.632-1.595,1.343\r
+	c-0.238,0.71-0.059,1.494,0.465,2.031l14.294,14.657L11.484,61.67c-0.124,0.756,0.195,1.517,0.822,1.957\r
+	c0.344,0.243,0.747,0.366,1.151,0.366c0.332,0,0.666-0.084,0.968-0.25l17.572-9.719l17.572,9.719c0.302,0.166,0.636,0.25,0.968,0.25\r
+	c0.404,0,0.808-0.123,1.151-0.366c0.627-0.44,0.946-1.201,0.822-1.957l-3.378-20.704l14.294-14.657\r
+	C63.951,25.771,64.131,24.987,63.893,24.277z`
+        }
+      )
+    }
+  ) : e.variant === "outlined" && (n = /* @__PURE__ */ t(
+    "svg",
+    {
+      version: "1.0",
+      id: "Layer_1",
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "20px",
+      height: "20px",
+      viewBox: "0 0 64 64",
+      enableBackground: "new 0 0 64 64",
+      children: /* @__PURE__ */ t(
+        "path",
+        {
+          fill: e.fill || "rgba(247, 216, 40, 0)",
+          stroke: e.stroke || "#000000",
+          strokeWidth: e.strokeWidth || "2",
+          d: `M63.893,24.277c-0.238-0.711-0.854-1.229-1.595-1.343l-19.674-3.006L33.809,1.15\r
+	C33.479,0.448,32.773,0,31.998,0s-1.48,0.448-1.811,1.15l-8.815,18.778L1.698,22.935c-0.741,0.113-1.356,0.632-1.595,1.343\r
+	c-0.238,0.71-0.059,1.494,0.465,2.031l14.294,14.657L11.484,61.67c-0.124,0.756,0.195,1.517,0.822,1.957\r
+	c0.344,0.243,0.747,0.366,1.151,0.366c0.332,0,0.666-0.084,0.968-0.25l17.572-9.719l17.572,9.719c0.302,0.166,0.636,0.25,0.968,0.25\r
+	c0.404,0,0.808-0.123,1.151-0.366c0.627-0.44,0.946-1.201,0.822-1.957l-3.378-20.704l14.294-14.657\r
+	C63.951,25.771,64.131,24.987,63.893,24.277z`
+        }
+      )
+    }
+  )), n;
 };
-function nt({
+function rt({
   template: e,
   openActionId: n,
   setOpenActionId: s,
   onEdit: a,
   onDuplicate: i,
   onRemove: r,
-  onPreview: l
+  onPreview: l,
+  onRefresh: o
 }) {
-  const { isAdmin: c } = H(), o = n === e.id, w = Z(null), f = Z(null), [C, g, S] = e.categoryChain, A = C?.key, h = g?.key, y = S?.key, b = A === 28 || h === 9 && y === 3 || y === 2, m = c || h === 9 && y === 3, v = c || h === 9 && y === 3;
-  return P(() => {
-    function x(T) {
-      o && w.current && !w.current.contains(T.target) && !f.current?.contains(T.target) && s(null);
+  const { isAdmin: d } = q(), y = n === e.id, m = J(null), T = J(null), [w, E, A] = e.categoryChain, { mutateAsync: h, isPending: g } = Fe(), { showNotification: b } = ke(), p = E?.key, v = A?.key, O = p === 9, M = d || v !== 2, P = d || v !== 2;
+  L(() => {
+    function C(k) {
+      y && m.current && !m.current.contains(k.target) && !T.current?.contains(k.target) && s(null);
     }
-    return document.addEventListener("mousedown", x), () => document.removeEventListener("mousedown", x);
-  }, [o, s]), P(() => {
-    function x(T) {
-      T.key === "Escape" && s(null);
+    return document.addEventListener("mousedown", C), () => document.removeEventListener("mousedown", C);
+  }, [y, s]), L(() => {
+    function C(k) {
+      k.key === "Escape" && s(null);
     }
-    return o && document.addEventListener("keydown", x), () => document.removeEventListener("keydown", x);
-  }, [o, s]), P(() => {
-    if (!o || !w.current) return;
-    const x = Array.from(
-      w.current.querySelectorAll('[role="menuitem"]')
+    return y && document.addEventListener("keydown", C), () => document.removeEventListener("keydown", C);
+  }, [y, s]), L(() => {
+    if (!y || !m.current) return;
+    const C = Array.from(
+      m.current.querySelectorAll('[role="menuitem"]')
     );
-    if (!x.length) return;
-    let T = 0;
-    x[0].focus();
-    function k(O) {
-      O.key === "ArrowDown" && (T = (T + 1) % x.length, x[T].focus(), O.preventDefault()), O.key === "ArrowUp" && (T = (T - 1 + x.length) % x.length, x[T].focus(), O.preventDefault());
+    if (!C.length) return;
+    let k = 0;
+    C[0].focus();
+    function x($) {
+      $.key === "ArrowDown" && (k = (k + 1) % C.length, C[k].focus(), $.preventDefault()), $.key === "ArrowUp" && (k = (k - 1 + C.length) % C.length, C[k].focus(), $.preventDefault());
     }
-    return document.addEventListener("keydown", k), () => document.removeEventListener("keydown", k);
-  }, [o]), /* @__PURE__ */ t(pe, { children: /* @__PURE__ */ d("tr", { className: "ts-table-row", children: [
-    /* @__PURE__ */ t("td", { children: /* @__PURE__ */ d("div", { className: "ts-name-cell", children: [
+    return document.addEventListener("keydown", x), () => document.removeEventListener("keydown", x);
+  }, [y]);
+  const U = async () => {
+    try {
+      await h({
+        categoryId: v?.toString() ?? "",
+        templateId: e.id ?? ""
+      }), o(), b(
+        `Template "${e?.name}" marked as favourite`,
+        "success"
+      );
+    } catch (C) {
+      console.error(C), b(
+        "Unable to mark template as favourite. Please try again.",
+        "error"
+      );
+    }
+  };
+  return /* @__PURE__ */ t(fe, { children: /* @__PURE__ */ c("tr", { className: "ts-table-row", children: [
+    /* @__PURE__ */ t("td", { children: /* @__PURE__ */ c("div", { className: "ts-name-cell", children: [
+      O && /* @__PURE__ */ t(
+        "button",
+        {
+          type: "button",
+          className: "ts-fav-btn ts-btn-light",
+          disabled: e.is_favourite,
+          onClick: U,
+          title: "Mark as favourite",
+          children: g ? /* @__PURE__ */ t(se, { size: "sm" }) : e.is_favourite ? /* @__PURE__ */ t(Ee, { variant: "filled" }) : /* @__PURE__ */ t(Ee, { variant: "outlined" })
+        }
+      ),
       /* @__PURE__ */ t(
         "span",
         {
@@ -236,29 +330,29 @@ function nt({
           children: e.readonly ? "Default" : "Custom"
         }
       ),
-      /* @__PURE__ */ t("span", { children: e.name })
+      /* @__PURE__ */ t("span", { className: "ts-template-name", children: e.name })
     ] }) }),
-    /* @__PURE__ */ t("td", { children: C?.name ?? "" }),
-    /* @__PURE__ */ t("td", { children: g?.name ?? "" }),
-    /* @__PURE__ */ t("td", { children: S?.name ?? "" }),
+    /* @__PURE__ */ t("td", { children: w?.name ?? "" }),
+    /* @__PURE__ */ t("td", { children: E?.name ?? "" }),
+    /* @__PURE__ */ t("td", { children: A?.name ?? "" }),
     /* @__PURE__ */ t("td", { children: e?.updatedByName ?? "" }),
-    /* @__PURE__ */ t("td", { className: "ts-actions-cell", children: /* @__PURE__ */ d("div", { className: "ts-actions-wrapper", children: [
+    /* @__PURE__ */ t("td", { className: "ts-actions-cell", children: /* @__PURE__ */ c("div", { className: "ts-actions-wrapper", children: [
       /* @__PURE__ */ t(
         "button",
         {
-          ref: f,
+          ref: T,
           className: "ts-actions-btn",
           "aria-haspopup": "true",
-          "aria-expanded": o,
-          onClick: () => s(o ? null : e.id),
+          "aria-expanded": y,
+          onClick: () => s(y ? null : e.id),
           children: "⋯"
         }
       ),
-      /* @__PURE__ */ d(
+      /* @__PURE__ */ c(
         "div",
         {
-          ref: w,
-          className: `ts-actions-menu ${o ? "open" : ""}`,
+          ref: m,
+          className: `ts-actions-menu ${y ? "open" : ""}`,
           role: "menu",
           children: [
             /* @__PURE__ */ t(
@@ -273,7 +367,7 @@ function nt({
                 children: "Preview"
               }
             ),
-            m && /* @__PURE__ */ t(
+            M && /* @__PURE__ */ t(
               "button",
               {
                 type: "button",
@@ -285,7 +379,7 @@ function nt({
                 children: "Edit"
               }
             ),
-            b && /* @__PURE__ */ t(
+            /* @__PURE__ */ t(
               "button",
               {
                 type: "button",
@@ -297,7 +391,7 @@ function nt({
                 children: "Duplicate"
               }
             ),
-            v && /* @__PURE__ */ t(
+            P && /* @__PURE__ */ t(
               "button",
               {
                 type: "button",
@@ -315,36 +409,36 @@ function nt({
     ] }) })
   ] }) });
 }
-const rt = je(nt), ve = 5, st = ({
+const st = qe(rt), ve = 5, at = ({
   page: e,
   pageSize: n,
   totalRecords: s,
   onPageChange: a,
   onPageSizeChange: i
 }) => {
-  const r = Math.ceil(s / n), c = r <= ve ? Array.from({ length: r }, (f, C) => C + 1) : Array.from({ length: ve }, (f, C) => C + 1), o = r > ve, w = r;
-  return /* @__PURE__ */ d("div", { className: "ts-pagination-bar", children: [
-    /* @__PURE__ */ d("div", { className: "ts-page-container", children: [
-      /* @__PURE__ */ d("div", { className: "ts-page-size", children: [
+  const r = Math.ceil(s / n), o = r <= ve ? Array.from({ length: r }, (m, T) => T + 1) : Array.from({ length: ve }, (m, T) => T + 1), d = r > ve, y = r;
+  return /* @__PURE__ */ c("div", { className: "ts-pagination-bar", children: [
+    /* @__PURE__ */ c("div", { className: "ts-page-container", children: [
+      /* @__PURE__ */ c("div", { className: "ts-page-size", children: [
         "Display:",
         /* @__PURE__ */ t(
           "select",
           {
             value: n,
-            onChange: (f) => {
-              i(Number(f.target.value)), a(1);
+            onChange: (m) => {
+              i(Number(m.target.value)), a(1);
             },
-            children: [10, 25, 50, 100].map((f) => /* @__PURE__ */ t("option", { value: f, children: f }, f))
+            children: [10, 25, 50, 100].map((m) => /* @__PURE__ */ t("option", { value: m, children: m }, m))
           }
         )
       ] }),
-      /* @__PURE__ */ d("div", { className: "ts-page-info", children: [
+      /* @__PURE__ */ c("div", { className: "ts-page-info", children: [
         "Page ",
         e,
         " of ",
         r
       ] }),
-      /* @__PURE__ */ d("div", { className: "ts-go-to", children: [
+      /* @__PURE__ */ c("div", { className: "ts-go-to", children: [
         "Go to page:",
         /* @__PURE__ */ t(
           "input",
@@ -353,36 +447,36 @@ const rt = je(nt), ve = 5, st = ({
             min: 1,
             max: r,
             value: e,
-            onChange: (f) => {
-              const C = Number(f.target.value);
-              C >= 1 && C <= r && a(C);
+            onChange: (m) => {
+              const T = Number(m.target.value);
+              T >= 1 && T <= r && a(T);
             }
           }
         )
       ] })
     ] }),
-    /* @__PURE__ */ d("div", { className: "ts-total", children: [
+    /* @__PURE__ */ c("div", { className: "ts-total", children: [
       "Total: ",
       s
     ] }),
-    /* @__PURE__ */ d("div", { className: "ts-page-buttons", children: [
+    /* @__PURE__ */ c("div", { className: "ts-page-buttons", children: [
       /* @__PURE__ */ t("button", { disabled: e === 1, onClick: () => a(e - 1), children: "‹" }),
-      c.map((f) => /* @__PURE__ */ t(
+      o.map((m) => /* @__PURE__ */ t(
         "button",
         {
-          className: f === e ? "active" : "",
-          onClick: () => a(f),
-          children: f
+          className: m === e ? "active" : "",
+          onClick: () => a(m),
+          children: m
         },
-        f
+        m
       )),
-      o && /* @__PURE__ */ t("span", { style: { padding: "0 6px" }, children: "…" }),
-      o && /* @__PURE__ */ t(
+      d && /* @__PURE__ */ t("span", { style: { padding: "0 6px" }, children: "…" }),
+      d && /* @__PURE__ */ t(
         "button",
         {
-          className: e === w ? "active" : "",
-          onClick: () => a(w),
-          children: w
+          className: e === y ? "active" : "",
+          onClick: () => a(y),
+          children: y
         }
       ),
       /* @__PURE__ */ t(
@@ -395,7 +489,7 @@ const rt = je(nt), ve = 5, st = ({
       )
     ] })
   ] });
-}, at = ({
+}, it = ({
   show: e,
   variant: n,
   title: s = "Are you sure?",
@@ -403,56 +497,56 @@ const rt = je(nt), ve = 5, st = ({
   label: i = "Name",
   value: r = "",
   placeholder: l = "",
-  requiredMessage: c = "This field is required",
-  externalError: o = !1,
-  externalErrorMessage: w = "",
-  confirmText: f = "Ok",
-  cancelText: C = "Cancel",
-  confirmButtonVariant: g = "danger",
-  disableConfirm: S = !1,
+  requiredMessage: o = "This field is required",
+  externalError: d = !1,
+  externalErrorMessage: y = "",
+  confirmText: m = "Ok",
+  cancelText: T = "Cancel",
+  confirmButtonVariant: w = "danger",
+  disableConfirm: E = !1,
   onConfirm: A,
   onCancel: h,
-  onInputChange: y
+  onInputChange: g
 }) => {
-  const [b, m] = N(r), [v, x] = N(!1), T = Z(null);
-  if (P(() => {
+  const [b, p] = N(r), [v, O] = N(!1), M = J(null);
+  if (L(() => {
     if (!e) return;
-    const I = (D) => {
-      D.key === "Escape" && h();
+    const x = ($) => {
+      $.key === "Escape" && h();
     };
-    return document.addEventListener("keydown", I), () => document.removeEventListener("keydown", I);
-  }, [e, h]), P(() => {
+    return document.addEventListener("keydown", x), () => document.removeEventListener("keydown", x);
+  }, [e, h]), L(() => {
     if (!e) return;
-    const I = (D) => {
-      T.current && !T.current.contains(D.target) && h();
+    const x = ($) => {
+      M.current && !M.current.contains($.target) && h();
     };
-    return document.addEventListener("mousedown", I), () => document.removeEventListener("mousedown", I);
-  }, [e, h]), P(() => {
+    return document.addEventListener("mousedown", x), () => document.removeEventListener("mousedown", x);
+  }, [e, h]), L(() => {
     if (e)
       return document.body.style.overflow = "hidden", () => {
         document.body.style.overflow = "";
       };
-  }, [e]), P(() => {
-    e && (m(r), x(!1));
-  }, [e, r]), P(() => {
-    o && x(!0);
-  }, [o]), !e) return null;
-  const k = n === "input" && !b.trim(), O = n === "input" && (k || o), M = k ? c : o ? w : "", F = () => {
-    if (O || S) {
-      x(!0);
+  }, [e]), L(() => {
+    e && (p(r), O(!1));
+  }, [e, r]), L(() => {
+    d && O(!0);
+  }, [d]), !e) return null;
+  const P = n === "input" && !b.trim(), U = n === "input" && (P || d), C = P ? o : d ? y : "", k = () => {
+    if (U || E) {
+      O(!0);
       return;
     }
     A(b.trim());
   };
-  return /* @__PURE__ */ t("div", { className: "ts-modal-overlay", children: /* @__PURE__ */ d("div", { ref: T, className: "ts-modal", children: [
-    /* @__PURE__ */ d("div", { className: "ts-modal-header", children: [
+  return /* @__PURE__ */ t("div", { className: "ts-modal-overlay", children: /* @__PURE__ */ c("div", { ref: M, className: "ts-modal", children: [
+    /* @__PURE__ */ c("div", { className: "ts-modal-header", children: [
       /* @__PURE__ */ t("h4", { className: "ts-modal-title ", children: s }),
       /* @__PURE__ */ t("button", { className: "ts-modal-close", onClick: h, children: "✕" })
     ] }),
-    /* @__PURE__ */ d("div", { className: "ts-modal-body", children: [
+    /* @__PURE__ */ c("div", { className: "ts-modal-body", children: [
       a && /* @__PURE__ */ t("p", { className: "ts-modal-message", children: a }),
-      n === "input" && /* @__PURE__ */ d("div", { className: "ts-form-group", children: [
-        /* @__PURE__ */ d("label", { className: "ts-label", children: [
+      n === "input" && /* @__PURE__ */ c("div", { className: "ts-form-group", children: [
+        /* @__PURE__ */ c("label", { className: "ts-label", children: [
           i,
           /* @__PURE__ */ t("span", { className: "ts-required", children: "*" })
         ] }),
@@ -460,42 +554,42 @@ const rt = je(nt), ve = 5, st = ({
           "input",
           {
             type: "text",
-            className: `ts-input ${v && O ? "ts-input-error" : ""}`,
+            className: `ts-input ${v && U ? "ts-input-error" : ""}`,
             placeholder: l,
             value: b,
-            onChange: (I) => {
-              m(I.target.value), v && x(!1), y?.(I.target.value);
+            onChange: (x) => {
+              p(x.target.value), v && O(!1), g?.(x.target.value);
             },
             autoFocus: !0,
             style: { paddingBlock: "0", paddingInline: "0" }
           }
         ),
-        v && O && /* @__PURE__ */ t("div", { className: "ts-error-text", children: M })
+        v && U && /* @__PURE__ */ t("div", { className: "ts-error-text", children: C })
       ] })
     ] }),
-    /* @__PURE__ */ d("div", { className: "ts-modal-footer", children: [
+    /* @__PURE__ */ c("div", { className: "ts-modal-footer", children: [
       /* @__PURE__ */ t(
         "button",
         {
           type: "button",
           className: "ts-btn ts-btn-secondary",
           onClick: h,
-          children: C
+          children: T
         }
       ),
       /* @__PURE__ */ t(
         "button",
         {
           type: "button",
-          className: `ts-btn ts-btn-${g}`,
-          onClick: F,
-          disabled: S,
-          children: f
+          className: `ts-btn ts-btn-${w}`,
+          onClick: k,
+          disabled: E,
+          children: m
         }
       )
     ] })
   ] }) });
-}, it = () => /* @__PURE__ */ t(
+}, lt = () => /* @__PURE__ */ t(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -504,8 +598,8 @@ const rt = je(nt), ve = 5, st = ({
     height: "16px",
     children: /* @__PURE__ */ t("path", { fill: "#ffffff", d: "M368 208A160 160 0 1 0 48 208a160 160 0 1 0 320 0zM337.1 371.1C301.7 399.2 256.8 416 208 416C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208c0 48.8-16.8 93.7-44.9 129.1L505 471c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0L337.1 371.1z" })
   }
-), lt = () => {
-  const e = z(), { enerexIdentifier: n, projectId: s, userEmail: a } = H();
+), ot = () => {
+  const e = z(), { enerexIdentifier: n, projectId: s, userEmail: a } = q();
   return oe({
     mutationKey: ["duplicateTemplate"],
     mutationFn: async ({ templateId: r, request: l }) => (l.enerexIdentifier = n ?? "", l.projectId = s ?? "", l.updatedBy = a ?? "", await e.post(
@@ -513,7 +607,7 @@ const rt = je(nt), ve = 5, st = ({
       l
     ))
   });
-}, ot = () => {
+}, ct = () => {
   const e = z();
   return oe({
     mutationKey: ["deleteTemplate"],
@@ -523,17 +617,17 @@ const rt = je(nt), ve = 5, st = ({
       );
     }
   });
-}, ct = ({
+}, dt = ({
   data: e,
   page: n,
   pageSize: s
 }) => {
-  const a = se(() => Math.ceil(e.length / s), [e.length, s]);
-  return { pagedData: se(() => {
+  const a = re(() => Math.ceil(e.length / s), [e.length, s]);
+  return { pagedData: re(() => {
     const r = (n - 1) * s, l = n * s;
     return e.slice(r, l);
   }, [e, n, s]), totalPages: a };
-}, dt = ({
+}, mt = ({
   templates: e,
   templateTypes: n,
   onRefresh: s,
@@ -541,162 +635,164 @@ const rt = je(nt), ve = 5, st = ({
   onEdit: i,
   onPreview: r
 }) => {
-  const { mutateAsync: l, isPending: c } = lt(), { mutateAsync: o, isPending: w } = ot(), [f, C] = N(""), [g, S] = N(""), [A, h] = N(null), [y, b] = N(e), [m, v] = N(n), [x, T] = N(!1), [k, O] = N("input"), [M, F] = N(!1), [I, D] = N(null), [B, ce] = N("asc"), j = (p) => {
-    I === p ? ce((L) => L === "asc" ? "desc" : "asc") : (D(p), ce("asc")), ie(1);
-  }, [G, V] = N(null);
-  P(() => {
-    const p = [...e].sort((L, R) => {
-      const $ = new Date(R.updatedDateTime).getTime() - new Date(L.updatedDateTime).getTime();
-      return $ !== 0 ? $ : L.readonly !== R.readonly ? Number(L.readonly) - Number(R.readonly) : L.name.localeCompare(R.name);
+  const { mutateAsync: l, isPending: o } = ot(), { mutateAsync: d, isPending: y } = ct(), [m, T] = N(""), [w, E] = N(""), [A, h] = N(null), [g, b] = N(e), [p, v] = N(n), [O, M] = N(!1), [P, U] = N("input"), [C, k] = N(!1), [x, $] = N(null), [B, ce] = N("asc"), V = (u) => {
+    x === u ? ce((S) => S === "asc" ? "desc" : "asc") : ($(u), ce("asc")), ie(1);
+  }, [K, G] = N(null);
+  L(() => {
+    const u = [...e].sort((S, R) => {
+      if (S.is_favourite !== R.is_favourite)
+        return Number(R.is_favourite) - Number(S.is_favourite);
+      const D = new Date(R.updatedDateTime).getTime() - new Date(S.updatedDateTime).getTime();
+      return D !== 0 ? D : S.readonly !== R.readonly ? Number(S.readonly) - Number(R.readonly) : S.name.localeCompare(R.name);
     });
-    b(p), D(null);
-  }, [e]), P(() => {
-    v(n.filter((p) => p.id != null));
+    b(u), $(null);
+  }, [e]), L(() => {
+    v(n.filter((u) => u.id != null));
   }, [n]);
-  const ee = se(() => {
-    const p = /* @__PURE__ */ new Map();
-    return m.forEach((L) => p.set(L.id, L)), p;
-  }, [m]), he = Ee(
-    (p) => {
-      const L = [], R = /* @__PURE__ */ new Set();
-      let $ = ee.get(p);
-      for (; $ && !(R.has($.id) || (R.add($.id), L.push({ id: $.id, name: $.name, key: $.key }), !$.parent_id)); )
-        $ = ee.get($.parent_id);
-      return L.reverse();
+  const Z = re(() => {
+    const u = /* @__PURE__ */ new Map();
+    return p.forEach((S) => u.set(S.id, S)), u;
+  }, [p]), ye = xe(
+    (u) => {
+      const S = [], R = /* @__PURE__ */ new Set();
+      let D = Z.get(u);
+      for (; D && !(R.has(D.id) || (R.add(D.id), S.push({ id: D.id, name: D.name, key: D.key }), !D.parent_id)); )
+        D = Z.get(D.parent_id);
+      return S.reverse();
     },
-    [ee]
-  ), te = se(() => !y.length || !m.length ? [] : y.map((p) => ({
-    ...p,
-    categoryChain: he(p.type)
-  })), [y, m]);
-  P(() => {
-    const p = setTimeout(() => {
-      S(f), ie(1);
+    [Z]
+  ), ee = re(() => !g.length || !p.length ? [] : g.map((u) => ({
+    ...u,
+    categoryChain: ye(u.type)
+  })), [g, p]);
+  L(() => {
+    const u = setTimeout(() => {
+      E(m), ie(1);
     }, 300);
-    return () => clearTimeout(p);
-  }, [f]);
-  const [ne, Y] = N(10), [K, ie] = N(1), re = se(() => {
-    const p = g.trim().toLowerCase();
-    return p ? te.filter((L) => {
-      const R = L.name.toLowerCase().includes(p), $ = L.categoryChain?.some(
-        (J) => J.name.toLowerCase().includes(p)
+    return () => clearTimeout(u);
+  }, [m]);
+  const [te, ae] = N(10), [H, ie] = N(1), ne = re(() => {
+    const u = w.trim().toLowerCase();
+    return u ? ee.filter((S) => {
+      const R = S.name.toLowerCase().includes(u), D = S.categoryChain?.some(
+        (Y) => Y.name.toLowerCase().includes(u)
       );
-      return R || $;
-    }) : te;
-  }, [te, g]), de = se(() => {
-    const p = [...re];
-    return p.sort((L, R) => {
-      let $ = "", J = "";
-      switch (I) {
+      return R || D;
+    }) : ee;
+  }, [ee, w]), de = re(() => {
+    const u = [...ne];
+    return u.sort((S, R) => {
+      let D = "", Y = "";
+      switch (x) {
         case "name":
-          $ = L.name, J = R.name;
+          D = S.name, Y = R.name;
           break;
         case "category":
-          $ = L.categoryChain?.[0]?.name ?? "", J = R.categoryChain?.[0]?.name ?? "";
+          D = S.categoryChain?.[0]?.name ?? "", Y = R.categoryChain?.[0]?.name ?? "";
           break;
         case "type":
-          $ = L.categoryChain?.[1]?.name ?? "", J = R.categoryChain?.[1]?.name ?? "";
+          D = S.categoryChain?.[1]?.name ?? "", Y = R.categoryChain?.[1]?.name ?? "";
           break;
         case "subtype":
-          $ = L.categoryChain?.[2]?.name ?? "", J = R.categoryChain?.[2]?.name ?? "";
+          D = S.categoryChain?.[2]?.name ?? "", Y = R.categoryChain?.[2]?.name ?? "";
           break;
       }
-      const ke = $.localeCompare(J, void 0, {
+      const Ie = D.localeCompare(Y, void 0, {
         sensitivity: "base"
       });
-      return B === "asc" ? ke : -ke;
-    }), p;
-  }, [re, I, B]), { pagedData: ye } = ct({
+      return B === "asc" ? Ie : -Ie;
+    }), u;
+  }, [ne, x, B]), { pagedData: le } = dt({
     data: de,
-    page: K,
-    pageSize: ne
-  }), le = Ee(
-    (p) => y.some(
-      (L) => L.name.trim().toLowerCase() === p.trim().toLowerCase()
+    page: H,
+    pageSize: te
+  }), ge = xe(
+    (u) => g.some(
+      (S) => S.name.trim().toLowerCase() === u.trim().toLowerCase()
     ),
-    [y]
-  ), ge = (p) => {
-    V(p), F(!1), O("input"), T(!0);
-  }, u = (p) => {
-    V(p), O("confirm"), T(!0);
-  }, { showNotification: E } = Re(), _ = async (p) => {
-    if (G)
+    [g]
+  ), f = (u) => {
+    G(u), k(!1), U("input"), M(!0);
+  }, I = (u) => {
+    G(u), U("confirm"), M(!0);
+  }, { showNotification: _ } = ke(), j = async (u) => {
+    if (K)
       try {
-        if (k === "input") {
-          if (!p) return;
-          if (le(p)) {
-            F(!0);
+        if (P === "input") {
+          if (!u) return;
+          if (ge(u)) {
+            k(!0);
             return;
           }
           await l({
-            templateId: G.id,
+            templateId: K.id,
             request: {
               projectId: "",
               enerexIdentifier: "",
-              newName: p,
-              parent_id: G.id ?? null
+              newName: u,
+              parent_id: K.id ?? null
             }
-          }), E(
-            `Template "${p}" duplicated successfully`,
+          }), _(
+            `Template "${u}" duplicated successfully`,
             "success"
           );
         }
-        k === "confirm" && (await o(G.id), E(
-          `Template "${G.name}" deleted successfully`,
+        P === "confirm" && (await d(K.id), _(
+          `Template "${K.name}" deleted successfully`,
           "success"
-        )), T(!1), V(null), s();
+        )), M(!1), G(null), s();
       } catch {
-        E(
-          k === "confirm" ? "Failed to delete template. Please try again." : "Failed to duplicate template. Please try again.",
+        _(
+          P === "confirm" ? "Failed to delete template. Please try again." : "Failed to duplicate template. Please try again.",
           "error"
         );
       }
-  }, q = G?.categoryChain?.[2]?.name?.toLowerCase() ?? "this", X = G?.name?.toLowerCase() ?? "";
-  return /* @__PURE__ */ d(pe, { children: [
-    (c || w) && /* @__PURE__ */ t(ae, { overlay: !0 }),
-    /* @__PURE__ */ d("div", { className: "ts-page", children: [
-      /* @__PURE__ */ d("div", { className: "ts-header", children: [
+  }, X = K?.categoryChain?.[2]?.name?.toLowerCase() ?? "this", F = K?.name?.toLowerCase() ?? "";
+  return /* @__PURE__ */ c(fe, { children: [
+    (o || y) && /* @__PURE__ */ t(se, { overlay: !0 }),
+    /* @__PURE__ */ c("div", { className: "ts-page", children: [
+      /* @__PURE__ */ c("div", { className: "ts-header", children: [
         /* @__PURE__ */ t("h1", { className: "ts-title", children: "Templates" }),
         /* @__PURE__ */ t("button", { className: "ts-btn ts-btn-primary", onClick: a, children: "+ Add Template" })
       ] }),
-      /* @__PURE__ */ t("div", { className: "ts-search", children: /* @__PURE__ */ d("div", { className: "ts-search-box", children: [
+      /* @__PURE__ */ t("div", { className: "ts-search", children: /* @__PURE__ */ c("div", { className: "ts-search-box", children: [
         /* @__PURE__ */ t(
           "input",
           {
             type: "text",
             placeholder: "Search...",
-            value: f,
-            onChange: (p) => C(p.target.value)
+            value: m,
+            onChange: (u) => T(u.target.value)
           }
         ),
-        f && /* @__PURE__ */ t(
+        m && /* @__PURE__ */ t(
           "button",
           {
             className: "ts-clear-btn",
             "aria-label": "Clear search",
-            onClick: () => C(""),
+            onClick: () => T(""),
             children: "×"
           }
         ),
-        /* @__PURE__ */ t("button", { className: "ts-search-btn", "aria-label": "Search", children: /* @__PURE__ */ t(it, {}) })
+        /* @__PURE__ */ t("button", { className: "ts-search-btn", "aria-label": "Search", children: /* @__PURE__ */ t(lt, {}) })
       ] }) }),
-      /* @__PURE__ */ d("div", { className: "ts-table-wrapper", children: [
-        /* @__PURE__ */ d("table", { className: "ts-table", children: [
-          /* @__PURE__ */ t("thead", { children: /* @__PURE__ */ d("tr", { children: [
-            /* @__PURE__ */ t("th", { onClick: () => j("name"), className: "ts-sortable", children: /* @__PURE__ */ d("div", { className: "ts-th-sort", children: [
+      /* @__PURE__ */ c("div", { className: "ts-table-wrapper", children: [
+        /* @__PURE__ */ c("table", { className: "ts-table", children: [
+          /* @__PURE__ */ t("thead", { children: /* @__PURE__ */ c("tr", { children: [
+            /* @__PURE__ */ t("th", { onClick: () => V("name"), className: "ts-sortable", children: /* @__PURE__ */ c("div", { className: "ts-th-sort", children: [
               "Name",
-              /* @__PURE__ */ d("span", { className: "ts-sort-icons", children: [
+              /* @__PURE__ */ c("span", { className: "ts-sort-icons", children: [
                 /* @__PURE__ */ t(
                   "span",
                   {
-                    className: I === "name" && B === "asc" ? "active" : "",
+                    className: x === "name" && B === "asc" ? "active" : "",
                     children: "▲"
                   }
                 ),
                 /* @__PURE__ */ t(
                   "span",
                   {
-                    className: I === "name" && B === "desc" ? "active" : "",
+                    className: x === "name" && B === "desc" ? "active" : "",
                     children: "▼"
                   }
                 )
@@ -705,22 +801,22 @@ const rt = je(nt), ve = 5, st = ({
             /* @__PURE__ */ t(
               "th",
               {
-                onClick: () => j("category"),
+                onClick: () => V("category"),
                 className: "ts-sortable",
-                children: /* @__PURE__ */ d("div", { className: "ts-th-sort", children: [
+                children: /* @__PURE__ */ c("div", { className: "ts-th-sort", children: [
                   "Category",
-                  /* @__PURE__ */ d("span", { className: "ts-sort-icons", children: [
+                  /* @__PURE__ */ c("span", { className: "ts-sort-icons", children: [
                     /* @__PURE__ */ t(
                       "span",
                       {
-                        className: I === "category" && B === "asc" ? "active" : "",
+                        className: x === "category" && B === "asc" ? "active" : "",
                         children: "▲"
                       }
                     ),
                     /* @__PURE__ */ t(
                       "span",
                       {
-                        className: I === "category" && B === "desc" ? "active" : "",
+                        className: x === "category" && B === "desc" ? "active" : "",
                         children: "▼"
                       }
                     )
@@ -728,20 +824,20 @@ const rt = je(nt), ve = 5, st = ({
                 ] })
               }
             ),
-            /* @__PURE__ */ t("th", { onClick: () => j("type"), className: "ts-sortable", children: /* @__PURE__ */ d("div", { className: "ts-th-sort", children: [
+            /* @__PURE__ */ t("th", { onClick: () => V("type"), className: "ts-sortable", children: /* @__PURE__ */ c("div", { className: "ts-th-sort", children: [
               "Type",
-              /* @__PURE__ */ d("span", { className: "ts-sort-icons", children: [
+              /* @__PURE__ */ c("span", { className: "ts-sort-icons", children: [
                 /* @__PURE__ */ t(
                   "span",
                   {
-                    className: I === "type" && B === "asc" ? "active" : "",
+                    className: x === "type" && B === "asc" ? "active" : "",
                     children: "▲"
                   }
                 ),
                 /* @__PURE__ */ t(
                   "span",
                   {
-                    className: I === "type" && B === "desc" ? "active" : "",
+                    className: x === "type" && B === "desc" ? "active" : "",
                     children: "▼"
                   }
                 )
@@ -750,22 +846,22 @@ const rt = je(nt), ve = 5, st = ({
             /* @__PURE__ */ t(
               "th",
               {
-                onClick: () => j("subtype"),
+                onClick: () => V("subtype"),
                 className: "ts-sortable",
-                children: /* @__PURE__ */ d("div", { className: "ts-th-sort", children: [
+                children: /* @__PURE__ */ c("div", { className: "ts-th-sort", children: [
                   "Subtype",
-                  /* @__PURE__ */ d("span", { className: "ts-sort-icons", children: [
+                  /* @__PURE__ */ c("span", { className: "ts-sort-icons", children: [
                     /* @__PURE__ */ t(
                       "span",
                       {
-                        className: I === "subtype" && B === "asc" ? "active" : "",
+                        className: x === "subtype" && B === "asc" ? "active" : "",
                         children: "▲"
                       }
                     ),
                     /* @__PURE__ */ t(
                       "span",
                       {
-                        className: I === "subtype" && B === "desc" ? "active" : "",
+                        className: x === "subtype" && B === "desc" ? "active" : "",
                         children: "▼"
                       }
                     )
@@ -776,53 +872,54 @@ const rt = je(nt), ve = 5, st = ({
             /* @__PURE__ */ t("th", { children: "Updated by" }),
             /* @__PURE__ */ t("th", { className: "align-right", children: "Actions" })
           ] }) }),
-          /* @__PURE__ */ t("tbody", { children: ye.map((p) => /* @__PURE__ */ t(
-            rt,
+          /* @__PURE__ */ t("tbody", { children: le.map((u) => /* @__PURE__ */ t(
+            st,
             {
-              template: p,
+              template: u,
               openActionId: A,
               setOpenActionId: h,
-              onDuplicate: ge,
+              onDuplicate: f,
               onEdit: i,
-              onRemove: u,
-              onPreview: r
+              onRemove: I,
+              onPreview: r,
+              onRefresh: s
             },
-            p.id
+            u.id
           )) })
         ] }),
         /* @__PURE__ */ t(
-          st,
+          at,
           {
-            page: K,
-            pageSize: ne,
+            page: H,
+            pageSize: te,
             totalRecords: de.length,
             onPageChange: ie,
-            onPageSizeChange: Y
+            onPageSizeChange: ae
           }
         )
       ] })
     ] }),
     /* @__PURE__ */ t(
-      at,
+      it,
       {
-        show: x,
-        variant: k,
-        title: k === "confirm" ? "Are you sure?" : "Save Template As",
-        message: k === "confirm" ? `Are you sure you want to remove ${q} template "${X}"?` : "",
-        placeholder: k === "input" ? "New name" : "",
+        show: O,
+        variant: P,
+        title: P === "confirm" ? "Are you sure?" : "Save Template As",
+        message: P === "confirm" ? `Are you sure you want to remove ${X} template "${F}"?` : "",
+        placeholder: P === "input" ? "New name" : "",
         label: "New Name",
         requiredMessage: "Enter a new name",
-        externalError: M,
+        externalError: C,
         externalErrorMessage: "Template name already exists. Please choose a different name",
-        confirmText: k === "confirm" ? "Ok" : "Save as",
-        confirmButtonVariant: k === "confirm" ? "danger" : "primary",
-        onConfirm: _,
-        onCancel: () => T(!1),
-        onInputChange: k === "input" ? () => F(!1) : void 0
+        confirmText: P === "confirm" ? "Ok" : "Save as",
+        confirmButtonVariant: P === "confirm" ? "danger" : "primary",
+        onConfirm: j,
+        onCancel: () => M(!1),
+        onInputChange: P === "input" ? () => k(!1) : void 0
       }
     )
   ] });
-}, ue = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
+}, pe = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
 <html\r
   dir="ltr"\r
   xmlns:o="urn:schemas-microsoft-com:office:office"\r
@@ -1182,7 +1279,7 @@ const rt = je(nt), ve = 5, st = ({
   EDITOR_SCRIPT_URL: "https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js",
   EDITOR_PLUGIN_ID: "1afdc3161ec7409a8627a1c8561d45f5",
   EDITOR_SECRET_KEY: "54ba748ed7e94f2e929555783acb03da"
-}, mt = (e) => {
+}, ut = (e) => {
   const n = Array.from(new Set(e.map((a) => a.category))), s = [];
   return n.forEach((a) => {
     const i = e.filter((r) => r.category === a).map((r) => ({
@@ -1193,55 +1290,55 @@ const rt = je(nt), ve = 5, st = ({
     }));
     s.push({ category: a, entries: i });
   }), s;
-}, ut = () => {
-  const e = z(), { enerexIdentifier: n, projectId: s } = H();
-  return fe({
+}, pt = () => {
+  const e = z(), { enerexIdentifier: n, projectId: s } = q();
+  return he({
     queryKey: ["getTemplateTags"],
     queryFn: async (i) => await e.get(
       `${Q.MergeTags}${s}/${n}`
     )
   });
-}, pt = () => {
-  const e = z(), { enerexIdentifier: n, projectId: s } = H();
-  return fe({
+}, ft = () => {
+  const e = z(), { enerexIdentifier: n, projectId: s } = q();
+  return he({
     queryKey: ["getExcludeCategory"],
     queryFn: async (i) => await e.get(
       `${Q.ExcludeCategory}${s}/${n}`
     )
   });
-}, ft = ({
+}, ht = ({
   templateHTML: e,
   className: n = "",
   loading: s = !1,
   onEditorInitialized: a
 }) => {
-  const { post: i } = Oe(), { data: r } = ut(), { data: l } = pt(), [c, o] = N(
-    e ?? { html: ue, css: "" }
-  ), { userEmail: w } = H(), f = Z(null), C = "https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png", g = "https://plugins.stripo.email/api/v1/auth";
-  P(() => {
-    (async () => (await S(), r && l && await A(we.EDITOR_SCRIPT_URL)))();
+  const { post: i } = Oe(), { data: r } = pt(), { data: l } = ft(), [o, d] = N(
+    e ?? { html: pe, css: "" }
+  ), { userEmail: y } = q(), m = J(null), T = "https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png", w = "https://plugins.stripo.email/api/v1/auth";
+  L(() => {
+    (async () => (await E(), r && l && await A(we.EDITOR_SCRIPT_URL)))();
   }, [r, l]);
-  async function S() {
-    window.Zone || await new Promise((y, b) => {
-      const m = document.createElement("script");
-      m.src = "https://unpkg.com/zone.js@0.13.1/bundles/zone.umd.min.js";
+  async function E() {
+    window.Zone || await new Promise((g, b) => {
+      const p = document.createElement("script");
+      p.src = "https://unpkg.com/zone.js@0.13.1/bundles/zone.umd.min.js";
       const v = document.querySelector("script[nonce]")?.nonce;
-      v && m.setAttribute("nonce", v), m.onload = () => y(), m.onerror = () => b(new Error("Failed to load zone.js")), document.head.appendChild(m);
+      v && p.setAttribute("nonce", v), p.onload = () => g(), p.onerror = () => b(new Error("Failed to load zone.js")), document.head.appendChild(p);
     });
   }
-  async function A(y) {
+  async function A(g) {
     let b = document.getElementById(
       "UiEditorScript"
     );
-    b || (b = document.createElement("script"), b.id = "UiEditorScript", b.src = y, b.onload = async () => {
+    b || (b = document.createElement("script"), b.id = "UiEditorScript", b.src = g, b.onload = async () => {
       await h();
     }, document.body.appendChild(b)), await new Promise(
-      (m) => b.addEventListener("load", () => m(), { once: !0 })
+      (p) => b.addEventListener("load", () => p(), { once: !0 })
     );
   }
   const h = async () => {
-    const y = f.current;
-    if (!y) {
+    const g = m.current;
+    if (!g) {
       console.error("Missing #stripoEditorContainer in DOM");
       return;
     }
@@ -1250,47 +1347,47 @@ const rt = je(nt), ve = 5, st = ({
       return;
     }
     const b = {
-      html: c.html,
-      css: c.css,
+      html: o.html,
+      css: o.css,
       modulesExcludedCategories: l ?? [],
       forceRecreate: !0,
       metadata: {
-        emailId: w,
+        emailId: y,
         userId: "1",
         // username: userName,
-        avatarUrl: C
+        avatarUrl: T
       },
       locale: "en",
-      onTokenRefreshRequest: async (m) => {
+      onTokenRefreshRequest: async (p) => {
         const v = {
           pluginId: we.EDITOR_PLUGIN_ID,
           secretKey: we.EDITOR_SECRET_KEY,
-          userId: w,
+          userId: y,
           role: "user"
-        }, x = await i(
-          g,
+        }, O = await i(
+          w,
           v
         );
-        x?.token && m(x.token);
+        O?.token && p(O.token);
       },
       onTemplateLoaded: () => {
         a && a(!0);
       },
-      mergeTags: mt(r ?? [])
+      mergeTags: ut(r ?? [])
     };
-    for (const [m, v] of Object.entries({
+    for (const [p, v] of Object.entries({
       codeEditorButtonSelector: "#codeEditor",
       undoButtonSelector: "#undoButton",
       redoButtonSelector: "#redoButton",
       mobileViewButtonSelector: "#mobileViewButton",
       desktopViewButtonSelector: "#desktopViewButton"
     }))
-      y.ownerDocument && y.getRootNode() instanceof ShadowRoot && y.getRootNode().querySelector(v) && (b[m] = v);
-    await window.UIEditor.initEditor(y, b);
+      g.ownerDocument && g.getRootNode() instanceof ShadowRoot && g.getRootNode().querySelector(v) && (b[p] = v);
+    await window.UIEditor.initEditor(g, b);
   };
-  return /* @__PURE__ */ t("div", { className: "position-relative", children: /* @__PURE__ */ d("div", { className: `editor-container ${n}`, children: [
+  return /* @__PURE__ */ t("div", { className: "position-relative", children: /* @__PURE__ */ c("div", { className: `editor-container ${n}`, children: [
     s && /* @__PURE__ */ t("div", { className: "loading-overlay", children: /* @__PURE__ */ t(
-      He,
+      Ke,
       {
         animation: "border",
         style: { width: "11px", height: "11px" },
@@ -1301,9 +1398,9 @@ const rt = je(nt), ve = 5, st = ({
       }
     ) }),
     /* @__PURE__ */ t("div", { id: "externalSystemContainer" }),
-    /* @__PURE__ */ t("div", { id: "stripoEditorContainer", ref: f })
+    /* @__PURE__ */ t("div", { id: "stripoEditorContainer", ref: m })
   ] }) });
-}, Pe = ({
+}, $e = ({
   label: e,
   register: n,
   validation: s,
@@ -1311,11 +1408,11 @@ const rt = je(nt), ve = 5, st = ({
   name: i,
   error: r,
   className: l = "",
-  ...c
+  ...o
 }) => {
-  const o = !!(r && r[i]);
-  return /* @__PURE__ */ d("div", { className: `ts-form-group ${l}`, children: [
-    e && /* @__PURE__ */ d("label", { className: "ts-form-label", children: [
+  const d = !!(r && r[i]);
+  return /* @__PURE__ */ c("div", { className: `ts-form-group ${l}`, children: [
+    e && /* @__PURE__ */ c("label", { className: "ts-form-label", children: [
       e,
       a && /* @__PURE__ */ t("span", { className: "ts-required", children: "*" })
     ] }),
@@ -1324,47 +1421,37 @@ const rt = je(nt), ve = 5, st = ({
       {
         name: i,
         type: "text",
-        ...c,
+        ...o,
         ...n ? n(i, {
           ...s
         }) : {},
-        className: `ts-input ${o ? "ts-input-error" : ""}`,
-        "aria-invalid": o
+        className: `ts-input ${d ? "ts-input-error" : ""}`,
+        "aria-invalid": d
       }
     ),
-    o && /* @__PURE__ */ t("div", { className: "ts-error-text", children: r?.[i]?.message })
+    d && /* @__PURE__ */ t("div", { className: "ts-error-text", children: r?.[i]?.message })
   ] });
 };
-function Te(e) {
+function Ne(e) {
   return e.sort((n, s) => n.name.localeCompare(s.name));
 }
-function ht(e) {
+function yt(e) {
   const n = /* @__PURE__ */ new Map(), s = [];
   e.forEach((r) => n.set(r.id, r));
   let a = e.filter((r) => r.parent_id === 0), i = 0;
   for (; a.length > 0; ) {
     s.push({ level: i, data: a });
-    const r = a.map((c) => c.id);
+    const r = a.map((o) => o.id);
     a = e.filter(
-      (c) => r.includes(c.parent_id)
+      (o) => r.includes(o.parent_id)
     ), i++;
   }
   return s;
 }
-function Ne(e, n) {
-  const a = ht(e).find((i) => i.level === n);
+function Te(e, n) {
+  const a = yt(e).find((i) => i.level === n);
   return a ? a.data : [];
 }
-const yt = () => {
-  const e = z(), { enerexIdentifier: n, projectId: s } = H();
-  return oe({
-    mutationKey: ["markFavourite"],
-    mutationFn: async (i) => await e.post(
-      `${Q.markFavourite}${s}/${n}`,
-      i
-    )
-  });
-};
 function gt(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
@@ -1374,15 +1461,15 @@ var Ce = { exports: {} };
 	Licensed under the MIT License (MIT), see
 	http://jedwatson.github.io/classnames
 */
-var $e;
+var Ae;
 function bt() {
-  return $e || ($e = 1, function(e) {
+  return Ae || (Ae = 1, function(e) {
     (function() {
       var n = {}.hasOwnProperty;
       function s() {
         for (var r = "", l = 0; l < arguments.length; l++) {
-          var c = arguments[l];
-          c && (r = i(r, a(c)));
+          var o = arguments[l];
+          o && (r = i(r, a(o)));
         }
         return r;
       }
@@ -1396,8 +1483,8 @@ function bt() {
         if (r.toString !== Object.prototype.toString && !r.toString.toString().includes("[native code]"))
           return r.toString();
         var l = "";
-        for (var c in r)
-          n.call(r, c) && r[c] && (l = i(l, c));
+        for (var o in r)
+          n.call(r, o) && r[o] && (l = i(l, o));
         return l;
       }
       function i(r, l) {
@@ -1408,7 +1495,7 @@ function bt() {
   }(Ce)), Ce.exports;
 }
 var vt = bt();
-const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__ */ t("div", { style: { padding: 0, margin: "2px 0" }, children: /* @__PURE__ */ t(
+const _e = /* @__PURE__ */ gt(vt), De = (e) => e.data.isSeparator ? /* @__PURE__ */ t("div", { style: { padding: 0, margin: "2px 0" }, children: /* @__PURE__ */ t(
   "hr",
   {
     style: {
@@ -1418,10 +1505,10 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
       margin: 0
     }
   }
-) }) : e.data.icon ? /* @__PURE__ */ d("div", { className: "d-flex align-items-center", children: [
-  /* @__PURE__ */ t(Le.Option, { ...e }),
+) }) : e.data.icon ? /* @__PURE__ */ c("div", { className: "d-flex align-items-center", children: [
+  /* @__PURE__ */ t(Pe.Option, { ...e }),
   /* @__PURE__ */ t("span", { className: "px-1 template-studio-dropdown-postfix-icon", children: e.data.icon })
-] }) : /* @__PURE__ */ t(Le.Option, { ...e }), wt = ({
+] }) : /* @__PURE__ */ t(Pe.Option, { ...e }), wt = ({
   name: e = "",
   control: n,
   options: s,
@@ -1429,26 +1516,26 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
   placeholder: i,
   validation: r,
   labelKey: l = "name",
-  disabled: c,
-  isInvalid: o,
-  value: w,
-  onChange: f,
-  uncontrolled: C,
-  menuPlacement: g = "auto",
-  closeOnSelect: S = !0
+  disabled: o,
+  isInvalid: d,
+  value: y,
+  onChange: m,
+  uncontrolled: T,
+  menuPlacement: w = "auto",
+  closeOnSelect: E = !0
 }) => {
   const A = {
     control: (h) => ({
       ...h,
       minHeight: "33px",
       // state.isFocused can display different borderColor if you need it
-      borderColor: o ? "var(--bs-form-invalid-border-color) !important" : "var(--ct-input-border-color)",
-      backgroundImage: o ? '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",
+      borderColor: d ? "var(--bs-form-invalid-border-color) !important" : "var(--ct-input-border-color)",
+      backgroundImage: d ? '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: o ? "var(--bs-form-invalid-border-color)" : "var(--ct-input-border-color)"
+        borderColor: d ? "var(--bs-form-invalid-border-color)" : "var(--ct-input-border-color)"
       },
       "& .react-select__single-value": {
         color: "var(--ct-input-color) !important"
@@ -1472,44 +1559,44 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
     }),
     multiValueRemove: (h) => ({
       ...h,
-      display: c ? "none" : "block"
+      display: o ? "none" : "block"
     })
   };
-  return C ? /* @__PURE__ */ t(
-    Ie,
+  return T ? /* @__PURE__ */ t(
+    Le,
     {
-      components: { Option: _e },
+      components: { Option: De },
       isOptionDisabled: (h) => !!h.isSeparator,
-      className: Ae({
-        "is-invalid": o
+      className: _e({
+        "is-invalid": d
       }),
       styles: A,
       classNamePrefix: "react-select",
       isMulti: a,
       options: s,
-      onChange: f,
+      onChange: m,
       placeholder: i,
       menuPortalTarget: document.body,
-      value: w,
+      value: y,
       getOptionLabel: typeof l == "string" ? (h) => h[l] : l,
       getOptionValue: (h) => h.id,
-      isDisabled: c,
-      menuPlacement: g,
-      closeMenuOnSelect: S
+      isDisabled: o,
+      menuPlacement: w,
+      closeMenuOnSelect: E
     }
   ) : /* @__PURE__ */ t(
-    Ke,
+    Ge,
     {
       control: n,
       name: e,
       rules: r,
-      render: ({ field: { onChange: h, value: y, onBlur: b } }) => /* @__PURE__ */ t(
-        Ie,
+      render: ({ field: { onChange: h, value: g, onBlur: b } }) => /* @__PURE__ */ t(
+        Le,
         {
-          components: { Option: _e },
-          isOptionDisabled: (m) => !!m.isSeparator,
-          className: Ae({
-            "is-invalid": o
+          components: { Option: De },
+          isOptionDisabled: (p) => !!p.isSeparator,
+          className: _e({
+            "is-invalid": d
           }),
           styles: A,
           classNamePrefix: "react-select",
@@ -1519,18 +1606,18 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
           onChange: h,
           placeholder: i,
           menuPortalTarget: document.body,
-          value: y,
-          getOptionLabel: typeof l == "string" ? (m) => m[l] : l,
-          getOptionValue: (m) => m.id,
-          isDisabled: c,
-          menuPlacement: g,
-          closeMenuOnSelect: S
+          value: g,
+          getOptionLabel: typeof l == "string" ? (p) => p[l] : l,
+          getOptionValue: (p) => p.id,
+          isDisabled: o,
+          menuPlacement: w,
+          closeMenuOnSelect: E
         },
-        y ? y.id || y.value || JSON.stringify(y) : "reset"
+        g ? g.id || g.value || JSON.stringify(g) : "reset"
       )
     }
   );
-}, me = ({
+}, ue = ({
   label: e,
   name: n,
   validation: s,
@@ -1538,12 +1625,12 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
   error: i,
   options: r = [],
   required: l = !1,
-  disabled: c = !1,
-  className: o = ""
+  disabled: o = !1,
+  className: d = ""
 }) => {
-  const w = !!(i && i[n]);
-  return /* @__PURE__ */ d("div", { className: `ts-form-group ${o}`, children: [
-    e && /* @__PURE__ */ d("label", { className: "ts-form-label", children: [
+  const y = !!(i && i[n]);
+  return /* @__PURE__ */ c("div", { className: `ts-form-group ${d}`, children: [
+    e && /* @__PURE__ */ c("label", { className: "ts-form-label", children: [
       e,
       l && /* @__PURE__ */ t("span", { className: "ts-required", children: "*" })
     ] }),
@@ -1554,16 +1641,16 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
         control: a,
         options: r,
         validation: s,
-        disabled: c,
-        isInvalid: w
+        disabled: o,
+        isInvalid: y
       }
     ),
-    w && /* @__PURE__ */ t("div", { className: "ts-error-text", children: i?.[n]?.message })
+    y && /* @__PURE__ */ t("div", { className: "ts-error-text", children: i?.[n]?.message })
   ] });
-}, Tt = () => {
+}, Nt = () => {
   const e = z();
-  Ve();
-  const { enerexIdentifier: n, projectId: s } = H();
+  He();
+  const { enerexIdentifier: n, projectId: s } = q();
   return oe({
     mutationKey: ["saveTemplate"],
     mutationFn: async (i) => (i.enerexIdentifier = n ?? "", i.projectId = s ?? "", await e.post(
@@ -1571,63 +1658,7 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
       i
     ))
   });
-}, xe = (e) => {
-  let n = /* @__PURE__ */ t(
-    "span",
-    {
-      style: { width: "20px", height: "20px", display: "inline-block" }
-    }
-  );
-  return e.variant === "filled" ? n = /* @__PURE__ */ t(
-    "svg",
-    {
-      version: "1.0",
-      id: "Layer_1",
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "20px",
-      height: "20px",
-      viewBox: "0 0 64 64",
-      "enable-background": "new 0 0 64 64",
-      children: /* @__PURE__ */ t(
-        "path",
-        {
-          fill: "#2196F3",
-          d: `M63.893,24.277c-0.238-0.711-0.854-1.229-1.595-1.343l-19.674-3.006L33.809,1.15\r
-	C33.479,0.448,32.773,0,31.998,0s-1.48,0.448-1.811,1.15l-8.815,18.778L1.698,22.935c-0.741,0.113-1.356,0.632-1.595,1.343\r
-	c-0.238,0.71-0.059,1.494,0.465,2.031l14.294,14.657L11.484,61.67c-0.124,0.756,0.195,1.517,0.822,1.957\r
-	c0.344,0.243,0.747,0.366,1.151,0.366c0.332,0,0.666-0.084,0.968-0.25l17.572-9.719l17.572,9.719c0.302,0.166,0.636,0.25,0.968,0.25\r
-	c0.404,0,0.808-0.123,1.151-0.366c0.627-0.44,0.946-1.201,0.822-1.957l-3.378-20.704l14.294-14.657\r
-	C63.951,25.771,64.131,24.987,63.893,24.277z`
-        }
-      )
-    }
-  ) : e.variant === "outlined" && (n = /* @__PURE__ */ t(
-    "svg",
-    {
-      version: "1.0",
-      id: "Layer_1",
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "20px",
-      height: "20px",
-      viewBox: "0 0 64 64",
-      enableBackground: "new 0 0 64 64",
-      children: /* @__PURE__ */ t(
-        "path",
-        {
-          fill: e.fill || "rgba(247, 216, 40, 0)",
-          stroke: e.stroke || "#000000",
-          strokeWidth: e.strokeWidth || "2",
-          d: `M63.893,24.277c-0.238-0.711-0.854-1.229-1.595-1.343l-19.674-3.006L33.809,1.15\r
-	C33.479,0.448,32.773,0,31.998,0s-1.48,0.448-1.811,1.15l-8.815,18.778L1.698,22.935c-0.741,0.113-1.356,0.632-1.595,1.343\r
-	c-0.238,0.71-0.059,1.494,0.465,2.031l14.294,14.657L11.484,61.67c-0.124,0.756,0.195,1.517,0.822,1.957\r
-	c0.344,0.243,0.747,0.366,1.151,0.366c0.332,0,0.666-0.084,0.968-0.25l17.572-9.719l17.572,9.719c0.302,0.166,0.636,0.25,0.968,0.25\r
-	c0.404,0,0.808-0.123,1.151-0.366c0.627-0.44,0.946-1.201,0.822-1.957l-3.378-20.704l14.294-14.657\r
-	C63.951,25.771,64.131,24.987,63.893,24.277z`
-        }
-      )
-    }
-  )), n;
-}, Nt = {
+}, Tt = {
   id: "",
   name: "New (Blank)"
 }, Ct = ({
@@ -1638,238 +1669,222 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
   templateList: i,
   template: r,
   onRefresh: l,
-  closeEditorModal: c
+  closeEditorModal: o
 }) => {
-  const { defaultSelector: o, isAdmin: w, userEmail: f } = H(), { mutateAsync: C, isPending: g } = yt(), {
-    register: S,
+  const { defaultSelector: d, isAdmin: y, userEmail: m } = q(), { mutateAsync: T, isPending: w } = Fe(), {
+    register: E,
     handleSubmit: A,
     clearErrors: h,
-    setValue: y,
+    setValue: g,
     control: b,
-    watch: m,
+    watch: p,
     reset: v,
-    setError: x,
-    formState: { errors: T }
-  } = Ge({
+    setError: O,
+    formState: { errors: M }
+  } = We({
     defaultValues: {
       templateName: "",
       subTemplateType: void 0,
       subTemplateType2: void 0,
       subject: "",
       templateType: void 0,
-      template: Nt
+      template: Tt
     },
     mode: "onChange"
-  }), [k, O] = N([]), [M, F] = N(), { mutateAsync: I, isPending: D } = Tt(), [B, ce] = N([]), [j, G] = N([]), [V, ee] = N([]), [he, te] = N(!1), ne = Z(!1), { showNotification: Y } = Re(), K = s === "edit", ie = he || D || g || !n;
-  P(() => {
+  }), [P, U] = N([]), [C, k] = N(), { mutateAsync: x, isPending: $ } = Nt(), [B, ce] = N([]), [V, K] = N([]), [G, Z] = N([]), [ye, ee] = N(!1), te = J(!1), { showNotification: ae } = ke(), H = s === "edit", ie = ye || $ || w || !n;
+  L(() => {
     if (a) {
-      let u = a.filter((_) => _.id != null), E = Ne(u, 0);
-      ce(Te(E));
+      let f = a.filter((_) => _.id != null), I = Te(f, 0);
+      ce(Ne(I));
     }
-  }, [a]), P(() => {
-    s === "edit" && !ne.current && te(!0);
-  }, [s]), P(() => {
-    if (s !== "edit" || !r || !n || !a.length || !k.length || ne.current) return;
-    const u = k.find((U) => U.id === r.templateID);
-    if (!u) return;
-    const E = a.filter((U) => U.id != null), _ = E.find((U) => `${U.id}` == `${u.type}`), q = _ ? E.find((U) => `${U.id}` == `${_.parent_id}`) : void 0, X = q ? E.find((U) => `${U.id}` == `${q.parent_id}`) : void 0;
+  }, [a]), L(() => {
+    s === "edit" && !te.current && ee(!0);
+  }, [s]), L(() => {
+    if (s !== "edit" || !r || !n || !a.length || !P.length || te.current) return;
+    const f = P.find((F) => F.id === r.templateID);
+    if (!f) return;
+    const I = a.filter((F) => F.id != null), _ = I.find((F) => `${F.id}` == `${f.type}`), j = _ ? I.find((F) => `${F.id}` == `${_.parent_id}`) : void 0, X = j ? I.find((F) => `${F.id}` == `${j.parent_id}`) : void 0;
     v({
-      templateType: X ? re(X) : void 0,
-      subTemplateType: q ? re(q) : void 0,
-      subTemplateType2: _ ? re(_) : void 0,
-      template: u,
+      templateType: X ? ne(X) : void 0,
+      subTemplateType: j ? ne(j) : void 0,
+      subTemplateType2: _ ? ne(_) : void 0,
+      template: f,
       templateName: r.name ?? "",
       subject: r.subject ?? ""
-    }), F(u), ne.current = !0, te(!1);
-  }, [s, r, n, a, k, v]);
-  const re = (u) => ({
-    id: String(u.id),
-    name: u.name,
-    key: u.key
+    }), k(f), te.current = !0, ee(!1);
+  }, [s, r, n, a, P, v]);
+  const ne = (f) => ({
+    id: String(f.id),
+    name: f.name,
+    key: f.key
   });
-  P(() => {
-    i?.sort((u, E) => u.readonly !== E.readonly ? (u.readonly ? 0 : 1) - (E.readonly ? 0 : 1) : u.name.localeCompare(E.name)), O(i ?? []);
-  }, [i]), P(() => {
-    if (!m("templateType")) return;
-    const u = Ne(a, 1);
-    G(
-      Te(
-        u.filter((E) => `${E.parent_id}` == `${m("templateType")?.id}`)
+  L(() => {
+    i?.sort((f, I) => f.readonly !== I.readonly ? (f.readonly ? 0 : 1) - (I.readonly ? 0 : 1) : f.name.localeCompare(I.name)), U(i ?? []);
+  }, [i]), L(() => {
+    if (!p("templateType")) return;
+    const f = Te(a, 1);
+    K(
+      Ne(
+        f.filter((I) => `${I.parent_id}` == `${p("templateType")?.id}`)
       )
     );
-  }, [m("templateType"), a]), P(() => {
-    const u = m("subTemplateType");
-    if (!u) return;
-    const E = Ne(a, 2);
-    let _ = Te(
-      E.filter((q) => `${q.parent_id}` == `${u.id}`)
+  }, [p("templateType"), a]), L(() => {
+    const f = p("subTemplateType");
+    if (!f) return;
+    const I = Te(a, 2);
+    let _ = Ne(
+      I.filter((j) => `${j.parent_id}` == `${f.id}`)
     );
-    s !== "edit" && !w && (_ = _.filter((q) => q.key !== 2)), console.log(_), ee(_);
-  }, [m("subTemplateType"), a, s]), P(() => {
-    if (o && o.type1) {
-      const u = B?.find(
-        (E) => `${E.id}` === o.type1
+    s !== "edit" && !y && (_ = _.filter((j) => j.key !== 2)), Z(_);
+  }, [p("subTemplateType"), a, s]), L(() => {
+    if (d && d.type1) {
+      const f = B?.find(
+        (I) => `${I.id}` === d.type1
       );
-      y("templateType", u);
+      g("templateType", f);
     }
-  }, [a, B]), P(() => {
-    if (o && o.type2) {
-      const u = j?.find(
-        (E) => `${E.id}` === o.type2
+  }, [a, B]), L(() => {
+    if (d && d.type2) {
+      const f = V?.find(
+        (I) => `${I.id}` === d.type2
       );
-      y("subTemplateType", u);
+      g("subTemplateType", f);
     }
-  }, [a, j]), P(() => {
-    if (o && o.type3) {
-      const u = V?.find(
-        (E) => `${E.id}` === o.type3
+  }, [a, V]), L(() => {
+    if (d && d.type3) {
+      const f = G?.find(
+        (I) => `${I.id}` === d.type3
       );
-      y("subTemplateType2", u);
+      g("subTemplateType2", f);
     }
-  }, [a, V]);
-  const de = (u) => {
+  }, [a, G]);
+  const de = (f) => {
     window.StripoEditorApi.actionsApi.getTemplateData(
-      async (E) => {
+      async (I) => {
         try {
-          let _ = u.template.id, q = "";
-          const X = u.templateName.trim();
-          M?.readonly && (_ = "", q = u.template.id);
-          const U = k.find(
-            ($) => $.name === u.templateName.trim()
+          let _ = f.template.id, j = "";
+          const X = f.templateName.trim();
+          C?.readonly && (_ = "", j = f.template.id);
+          const F = P.find(
+            (R) => R.name === f.templateName.trim()
           );
-          if (U && U.id !== _) {
-            x("templateName", {
+          if (F && F.id !== _) {
+            O("templateName", {
               type: "validate",
               message: "Template name already exists. Please choose a different name."
             });
             return;
           }
-          let p = u.templateType.id;
-          V?.length > 0 ? p = u.subTemplateType2.id : j?.length > 0 && (p = u.subTemplateType.id);
-          const L = {
+          let me = f.templateType.id;
+          G?.length > 0 ? me = f.subTemplateType2.id : V?.length > 0 && (me = f.subTemplateType.id);
+          const u = {
             enerexIdentifier: "",
             projectId: "",
             templateId: _,
-            templateType: p,
+            templateType: me,
             name: X,
-            html: E.html,
-            css: E.css,
-            subject: u.templateType.id === "2" ? u?.subject ?? "" : "",
-            parent_id: q,
-            updatedBy: f ?? ""
+            html: I.html,
+            css: I.css,
+            subject: f.templateType.id === "2" ? f?.subject ?? "" : "",
+            parent_id: j,
+            updatedBy: m ?? ""
           };
-          if (!await I(L)) {
-            Y(
+          if (!await x(u)) {
+            ae(
               "Failed to save template. Please try again.",
               "error"
             );
             return;
           }
-          Y(
-            K ? `Template "${X}" updated successfully.` : `Template "${X}" created successfully.`,
+          ae(
+            H ? `Template "${X}" updated successfully.` : `Template "${X}" created successfully.`,
             "success"
-          ), h(), l(), c();
+          ), h(), l(), o();
         } catch (_) {
-          console.error(_), Y(
+          console.error(_), ae(
             "Something went wrong while saving the template.",
             "error"
           );
         }
       }
     );
-  }, ye = async () => {
-    try {
-      let u = m("templateType")?.id;
-      V && V.length > 0 ? u = m("subTemplateType2")?.id : j && j.length > 0 && (u = m("subTemplateType")?.id), await C({
-        categoryId: u ?? "",
-        templateId: m("template")?.id ?? ""
-      }), M && F({
-        ...M,
-        is_favourite: !0
-      }), Y("Template marked as favourite", "success"), l();
-    } catch (u) {
-      console.error("Mark favourite failed", u), Y(
-        "Unable to mark template as favourite. Please try again.",
-        "error"
-      );
-    }
-  }, le = m("templateType"), ge = m("subTemplateType");
-  return /* @__PURE__ */ d(pe, { children: [
-    ie && /* @__PURE__ */ t(ae, { overlay: !0 }),
-    /* @__PURE__ */ t("div", { className: "ts-card", children: /* @__PURE__ */ t("div", { className: "ts-card-body", children: /* @__PURE__ */ t("form", { children: /* @__PURE__ */ t("div", { className: "template-list-container", children: /* @__PURE__ */ d("div", { className: "ts-row", children: [
+  }, le = p("templateType"), ge = p("subTemplateType");
+  return /* @__PURE__ */ c(fe, { children: [
+    ie && /* @__PURE__ */ t(se, { overlay: !0 }),
+    /* @__PURE__ */ t("div", { className: "ts-card", children: /* @__PURE__ */ t("div", { className: "ts-card-body", children: /* @__PURE__ */ t("form", { children: /* @__PURE__ */ t("div", { className: "template-list-container", children: /* @__PURE__ */ c("div", { className: "ts-row", children: [
       /* @__PURE__ */ t("div", { className: "ts-col", children: /* @__PURE__ */ t(
-        me,
+        ue,
         {
           label: "Category",
           control: b,
-          error: T,
+          error: M,
           options: B,
           required: !0,
-          disabled: K || D || g || !n,
+          disabled: H || $ || w || !n,
           validation: {
             required: {
               value: !0,
               message: "Select a category"
             }
           },
-          ...S("templateType")
+          ...E("templateType")
         }
       ) }),
-      j && j.length > 0 && /* @__PURE__ */ t("div", { className: "ts-col", children: /* @__PURE__ */ t(
-        me,
+      V && V.length > 0 && /* @__PURE__ */ t("div", { className: "ts-col", children: /* @__PURE__ */ t(
+        ue,
         {
           label: "Type",
           control: b,
-          error: T,
-          options: j,
+          error: M,
+          options: V,
           required: !0,
-          disabled: K || D || g || !n,
+          disabled: H || $ || w || !n,
           validation: {
             required: {
               value: !0,
               message: "Select a type"
             }
           },
-          ...S("subTemplateType")
+          ...E("subTemplateType")
         }
       ) }),
-      V && V.length > 0 && /* @__PURE__ */ t("div", { className: "ts-col", children: /* @__PURE__ */ t(
-        me,
+      G && G.length > 0 && /* @__PURE__ */ t("div", { className: "ts-col", children: /* @__PURE__ */ t(
+        ue,
         {
           label: "Sub Type",
           control: b,
-          error: T,
-          options: V,
+          error: M,
+          options: G,
           required: !0,
-          disabled: K || D || g || !n,
+          disabled: H || $ || w || !n,
           validation: {
             required: {
               value: !0,
               message: "Select a subtype"
             }
           },
-          ...S("subTemplateType2")
+          ...E("subTemplateType2")
         }
       ) }),
       /* @__PURE__ */ t("div", { className: "ts-col", children: /* @__PURE__ */ t(
-        me,
+        ue,
         {
           label: "Template",
           control: b,
-          error: T,
-          disabled: K || !K || D || g || !n,
+          error: M,
+          disabled: H || !H || $ || w || !n,
           options: [],
           required: !1,
-          ...S("template")
+          ...E("template")
         }
       ) }),
-      /* @__PURE__ */ d("div", { className: "ts-col ts-template-name-col", children: [
+      /* @__PURE__ */ c("div", { className: "ts-col ts-template-name-col", children: [
         /* @__PURE__ */ t(
-          Pe,
+          $e,
           {
             label: "Name",
-            register: S,
-            error: T,
+            register: E,
+            error: M,
             required: !0,
             name: "templateName",
             validation: {
@@ -1880,50 +1895,65 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
             }
           }
         ),
-        ge?.key?.toString() === "9" && K && /* @__PURE__ */ t(
-          "button",
-          {
-            type: "button",
-            className: "template-favourite-btn ts-btn-light",
-            disabled: D || g || (M ? M?.is_favourite : !1),
-            onClick: ye,
-            children: D || g ? /* @__PURE__ */ t(ae, { size: "sm" }) : M ? M?.is_favourite ? /* @__PURE__ */ t(xe, { variant: "filled" }) : /* @__PURE__ */ t(xe, { variant: "outlined" }) : /* @__PURE__ */ t(xe, { variant: "outlined" })
-          }
-        )
+        ge?.key?.toString() === "9" && H && C?.is_favourite && // <button
+        //   type="button"
+        //   className="template-favourite-btn ts-btn-light"
+        //   disabled={
+        //     loading3 ||
+        //     loading5 ||
+        //     (selectedTemplateMeta
+        //       ? selectedTemplateMeta?.is_favourite
+        //       : false)
+        //   }
+        //   onClick={handlemarkFavourite}
+        // >
+        //   {loading3 || loading5 ? (
+        //     <Loader size="sm" />
+        //   ) : selectedTemplateMeta ? (
+        //     selectedTemplateMeta?.is_favourite ? (
+        //       <StarIcon variant="filled" />
+        //     ) : (
+        //       <StarIcon variant="outlined" />
+        //     )
+        //   ) : (
+        //     <StarIcon variant="outlined" />
+        //   )}
+        // </button>
+        /* @__PURE__ */ t("span", { className: "ts-favourite-icon", children: /* @__PURE__ */ t(Ee, { variant: "filled" }) })
       ] }),
       le?.key?.toString() === "12" && /* @__PURE__ */ t("div", { className: "ts-col", children: /* @__PURE__ */ t(
-        Pe,
+        $e,
         {
           label: "Subject",
-          register: S,
-          error: T,
+          register: E,
+          error: M,
           required: !1,
           name: "subject"
         }
       ) }),
-      /* @__PURE__ */ d("div", { className: "ts-col ts-actions btn-padding", children: [
-        !K && /* @__PURE__ */ t(
+      /* @__PURE__ */ c("div", { className: "ts-col ts-actions btn-padding", children: [
+        !H && /* @__PURE__ */ t(
           "button",
           {
             type: "button",
             className: "ts-btn ts-btn-primary",
-            disabled: D || g || !n,
+            disabled: $ || w || !n,
             onClick: () => {
-              F(void 0), v(), G([]), ee([]), e();
+              k(void 0), v(), K([]), Z([]), e();
             },
-            children: D || g ? /* @__PURE__ */ t(ae, { size: "sm" }) : "Clear"
+            children: $ || w ? /* @__PURE__ */ t(se, { size: "sm" }) : "Clear"
           }
         ),
-        (le?.key?.toString() !== "12" || (le?.key?.toString() === "12" && (M?.id ?? "")) !== "") && /* @__PURE__ */ t(
+        (le?.key?.toString() !== "12" || (le?.key?.toString() === "12" && (C?.id ?? "")) !== "") && /* @__PURE__ */ t(
           "button",
           {
             type: "button",
             className: "ts-btn ts-btn-primary",
-            disabled: D || g || !n,
+            disabled: $ || w || !n,
             onClick: A(de),
-            children: D || g ? (
+            children: $ || w ? (
               // <span className="ts-spinner" />
-              /* @__PURE__ */ t(ae, { size: "sm" })
+              /* @__PURE__ */ t(se, { size: "sm" })
             ) : "Save"
           }
         )
@@ -1938,57 +1968,57 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
   templateList: i,
   editorInitialized: r,
   previewHtml: l,
-  onEditorInitialized: c,
-  onClose: o,
-  onRefresh: w
+  onEditorInitialized: o,
+  onClose: d,
+  onRefresh: y
 }) => {
-  const f = Z(null), [C, g] = N(!1);
-  P(() => {
-    e && r && window.StripoEditorApi?.actionsApi && (n === "add" ? window.StripoEditorApi.actionsApi.updateHtmlAndCss(ue, "", "") : n === "edit" && s && window.StripoEditorApi.actionsApi.updateHtmlAndCss(
-      s.html ?? ue,
+  const m = J(null), [T, w] = N(!1);
+  L(() => {
+    e && r && window.StripoEditorApi?.actionsApi && (n === "add" ? window.StripoEditorApi.actionsApi.updateHtmlAndCss(pe, "", "") : n === "edit" && s && window.StripoEditorApi.actionsApi.updateHtmlAndCss(
+      s.html ?? pe,
       s.css ?? "",
       ""
     ));
-  }, [e, r, n, s]), P(() => {
-    e || g(!1);
+  }, [e, r, n, s]), L(() => {
+    e || w(!1);
   }, [e]);
-  const S = () => {
-    window.StripoEditorApi.actionsApi.updateHtmlAndCss(ue, "", "");
+  const E = () => {
+    window.StripoEditorApi.actionsApi.updateHtmlAndCss(pe, "", "");
   };
-  return e ? /* @__PURE__ */ t("div", { className: "ts-editor-modal-overlay", children: /* @__PURE__ */ d(
+  return e ? /* @__PURE__ */ t("div", { className: "ts-editor-modal-overlay", children: /* @__PURE__ */ c(
     "div",
     {
-      className: `ts-editor-modal ${C ? "ts-editor-modal--fullscreen" : ""}`,
-      ref: f,
+      className: `ts-editor-modal ${T ? "ts-editor-modal--fullscreen" : ""}`,
+      ref: m,
       children: [
-        /* @__PURE__ */ d("div", { className: "ts-editor-modal-header", children: [
-          /* @__PURE__ */ d("h3", { className: "ts-modal-title", children: [
+        /* @__PURE__ */ c("div", { className: "ts-editor-modal-header", children: [
+          /* @__PURE__ */ c("h3", { className: "ts-modal-title", children: [
             n === "add" && "Create Template",
             n === "edit" && "Edit Template",
             n === "preview" && "Preview Template"
           ] }),
-          /* @__PURE__ */ d("div", { className: "ts-editor-header-actions", children: [
+          /* @__PURE__ */ c("div", { className: "ts-editor-header-actions", children: [
             /* @__PURE__ */ t(
               "button",
               {
                 className: "ts-editor-fullscreen-btn",
-                onClick: () => g((A) => !A),
+                onClick: () => w((A) => !A),
                 "aria-label": "Toggle fullscreen",
-                children: C ? "🗗" : "🗖"
+                children: T ? "🗗" : "🗖"
               }
             ),
             /* @__PURE__ */ t(
               "button",
               {
                 className: "ts-editor-close-btn",
-                onClick: o,
+                onClick: d,
                 "aria-label": "Close editor",
                 children: "✕"
               }
             )
           ] })
         ] }),
-        /* @__PURE__ */ d("div", { className: "ts-editor-modal-body", children: [
+        /* @__PURE__ */ c("div", { className: "ts-editor-modal-body", children: [
           n !== "preview" && /* @__PURE__ */ t(
             Ct,
             {
@@ -1997,9 +2027,9 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
               templateTypes: a,
               templateList: i,
               editorInitialized: r,
-              onReset: S,
-              onRefresh: w,
-              closeEditorModal: o
+              onReset: E,
+              onRefresh: y,
+              closeEditorModal: d
             }
           ),
           n === "preview" ? /* @__PURE__ */ t("div", { className: "ts-template-preview", children: /* @__PURE__ */ t(
@@ -2010,9 +2040,9 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
               srcDoc: l ?? ""
             }
           ) }) : /* @__PURE__ */ t(
-            ft,
+            ht,
             {
-              onEditorInitialized: c,
+              onEditorInitialized: o,
               loading: !1,
               className: "editor-container"
             }
@@ -2027,55 +2057,55 @@ const Ae = /* @__PURE__ */ gt(vt), _e = (e) => e.data.isSeparator ? /* @__PURE__
     isLoading: n,
     isFetching: s,
     refetch: a
-  } = Ze(), {
+  } = et(), {
     data: i,
     isLoading: r,
     isFetching: l
-  } = et(), { mutateAsync: c, isPending: o } = tt(), [w, f] = N(!1), [C, g] = N("add"), [S, A] = N(!1), [h, y] = N(""), [b, m] = N(), v = () => {
-    g("add"), f(!0);
-  }, x = async (M) => {
-    const F = await c({ id: M.id });
-    m({ ...F }), g("edit"), f(!0);
-  }, T = (M) => {
+  } = tt(), { mutateAsync: o, isPending: d } = nt(), [y, m] = N(!1), [T, w] = N("add"), [E, A] = N(!1), [h, g] = N(""), [b, p] = N(), v = () => {
+    w("add"), m(!0);
+  }, O = async (C) => {
+    const k = await o({ id: C.id });
+    p({ ...k }), w("edit"), m(!0);
+  }, M = (C) => {
     if (!e || e.length === 0) return;
-    const F = e.find((I) => I.id === M.id);
-    y(F?.html ?? ""), g("preview"), f(!0);
-  }, k = () => {
-    f(!1), A(!1), document.getElementById("UiEditorScript")?.remove();
+    const k = e.find((x) => x.id === C.id);
+    g(k?.html ?? ""), w("preview"), m(!0);
+  }, P = () => {
+    m(!1), A(!1), document.getElementById("UiEditorScript")?.remove();
   };
-  return /* @__PURE__ */ d(pe, { children: [
-    (n || r || s || l || o) && /* @__PURE__ */ t(ae, { overlay: !0 }),
+  return /* @__PURE__ */ c(fe, { children: [
+    (n || r || s || l || d) && /* @__PURE__ */ t(se, { overlay: !0 }),
     /* @__PURE__ */ t(
-      dt,
+      mt,
       {
         templates: e ?? [],
         templateTypes: i ?? [],
         onRefresh: a,
         onAdd: v,
-        onEdit: x,
-        onPreview: T
+        onEdit: O,
+        onPreview: M
       }
     ),
     /* @__PURE__ */ t(
       xt,
       {
-        show: w,
-        mode: C,
+        show: y,
+        mode: T,
         template: b,
         templateTypes: i ?? [],
         templateList: e ?? [],
-        editorInitialized: S,
+        editorInitialized: E,
         onEditorInitialized: A,
-        onClose: k,
+        onClose: P,
         onSaved: () => {
-          k(), a();
+          P(), a();
         },
         onRefresh: a,
         previewHtml: h
       }
     )
   ] });
-}, _t = ({ config: e }) => /* @__PURE__ */ t(We, { configs: e, children: /* @__PURE__ */ t(Je, { children: /* @__PURE__ */ t(Xe, { children: /* @__PURE__ */ t("div", { className: "root-widget", children: /* @__PURE__ */ t(Et, {}) }) }) }) });
+}, _t = ({ config: e }) => /* @__PURE__ */ t(ze, { configs: e, children: /* @__PURE__ */ t(Ze, { children: /* @__PURE__ */ t(Ye, { children: /* @__PURE__ */ t("div", { className: "root-widget", children: /* @__PURE__ */ t(Et, {}) }) }) }) });
 export {
   _t as EditorWidget
 };