@enerex/template-studio 1.1.30 → 1.1.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,11 +1,11 @@
1
- import { jsx as i, jsxs as C, Fragment as ve } from "react/jsx-runtime";
2
- import q, { useContext as oe, useState as S, useRef as xe, useEffect as N } from "react";
3
- import { QueryClient as Se, QueryClientProvider as Ce, useQuery as H, useMutation as se, useQueryClient as Ee } from "@tanstack/react-query";
4
- import Y from "axios";
5
- import { Spinner as Q, Form as P, Card as J, Row as Ie, Col as O, Button as X } from "react-bootstrap";
6
- import { Controller as _e, useForm as Ne } from "react-hook-form";
7
- import Z, { components as Pe } from "react-select";
8
- const M = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
1
+ import { jsx as i, jsxs as E, Fragment as Ie } from "react/jsx-runtime";
2
+ import L, { useContext as de, useState as v, useRef as _e, useEffect as C } from "react";
3
+ import { QueryClient as Ne, QueryClientProvider as Pe, useQuery as z, useMutation as ce, useQueryClient as Ae } from "@tanstack/react-query";
4
+ import ee from "axios";
5
+ import { Spinner as Y, Form as N, Card as te, Row as je, Col as _, Button as ne } from "react-bootstrap";
6
+ import { Controller as Oe, useForm as qe } from "react-hook-form";
7
+ import re, { components as Le } from "react-select";
8
+ const F = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
9
9
  <html\r
10
10
  dir="ltr"\r
11
11
  xmlns:o="urn:schemas-microsoft-com:office:office"\r
@@ -361,38 +361,38 @@ const M = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
361
361
  </div>\r
362
362
  </body>\r
363
363
  </html>\r
364
- `, ae = q.createContext(
364
+ `, pe = L.createContext(
365
365
  void 0
366
- ), je = ({
366
+ ), Re = ({
367
367
  children: e,
368
368
  configs: r
369
369
  }) => {
370
- const [o, a] = q.useState(r.clientId), [n, t] = q.useState(r.apiKey), [s, d] = q.useState(
370
+ const [o, l] = L.useState(r.clientId), [n, t] = L.useState(r.apiKey), [s, d] = L.useState(
371
371
  r.enerexIdentifier
372
- ), [p, T] = q.useState(r.projectId), v = (y) => {
373
- t(y.apiKey), a(y.clientId), T(y.projectId), d(y.enerexIdentifier);
372
+ ), [p, x] = L.useState(r.projectId), I = (g) => {
373
+ t(g.apiKey), l(g.clientId), x(g.projectId), d(g.enerexIdentifier);
374
374
  };
375
375
  return /* @__PURE__ */ i(
376
- ae.Provider,
376
+ pe.Provider,
377
377
  {
378
378
  value: {
379
379
  clientId: o,
380
380
  apiKey: n,
381
- setConfiguration: v,
381
+ setConfiguration: I,
382
382
  enerexIdentifier: s,
383
383
  projectId: p
384
384
  },
385
385
  children: e
386
386
  }
387
387
  );
388
- }, E = () => {
389
- const e = oe(ae);
388
+ }, P = () => {
389
+ const e = de(pe);
390
390
  if (!e)
391
391
  throw new Error("widgetConfig must be used within a ConfigProvider");
392
392
  return e;
393
- }, le = (e = "", r) => ({ get: async (n, t) => {
393
+ }, me = (e = "", r) => ({ get: async (n, t) => {
394
394
  try {
395
- const s = await Y.get(
395
+ const s = await ee.get(
396
396
  `${e}${n}`,
397
397
  t ?? r
398
398
  );
@@ -403,7 +403,7 @@ const M = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
403
403
  }
404
404
  }, post: async (n, t, s) => {
405
405
  try {
406
- const d = await Y.post(
406
+ const d = await ee.post(
407
407
  `${e}${n}`,
408
408
  t,
409
409
  s ?? r
@@ -413,102 +413,104 @@ const M = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
413
413
  } catch (d) {
414
414
  throw d;
415
415
  }
416
- } }), F = {
416
+ } }), H = {
417
417
  EDITOR_SCRIPT_URL: "https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js",
418
418
  EDITOR_PLUGIN_ID: "1afdc3161ec7409a8627a1c8561d45f5",
419
419
  EDITOR_SECRET_KEY: "54ba748ed7e94f2e929555783acb03da",
420
420
  API_BASE_URL: "https://dev-socket.enerex.com/common/api"
421
421
  //API_BASE_URL: "https://localhost:44338/api",
422
422
  // more env variables...
423
- }, de = q.createContext({
423
+ }, ue = L.createContext({
424
424
  get: () => {
425
425
  throw new Error("HttpClientContext.get not implemented");
426
426
  },
427
427
  post: () => {
428
428
  throw new Error("HttpClientContext.post not implemented");
429
429
  }
430
- }), Ae = ({ children: e }) => {
431
- const { clientId: r, apiKey: o } = E(), a = {
430
+ }), De = ({ children: e }) => {
431
+ const { clientId: r, apiKey: o } = P(), l = {
432
432
  headers: {
433
433
  client_id: r,
434
434
  "x-api-key": o
435
435
  }
436
- }, { get: n, post: t } = le(F.API_BASE_URL, a);
437
- return /* @__PURE__ */ i(de.Provider, { value: { get: n, post: t }, children: e });
438
- }, Re = ({ children: e }) => {
439
- const r = new Se();
440
- return /* @__PURE__ */ i(Ae, { children: /* @__PURE__ */ i(Ce, { client: r, children: e }) });
441
- }, Oe = (e) => {
442
- const r = Array.from(new Set(e.map((a) => a.category))), o = [];
443
- return r.forEach((a) => {
444
- const n = e.filter((t) => t.category === a).map((t) => ({
436
+ }, { get: n, post: t } = me(H.API_BASE_URL, l);
437
+ return /* @__PURE__ */ i(ue.Provider, { value: { get: n, post: t }, children: e });
438
+ }, $e = ({ children: e }) => {
439
+ const r = new Ne();
440
+ return /* @__PURE__ */ i(De, { children: /* @__PURE__ */ i(Pe, { client: r, children: e }) });
441
+ }, ke = (e) => {
442
+ const r = Array.from(new Set(e.map((l) => l.category))), o = [];
443
+ return r.forEach((l) => {
444
+ const n = e.filter((t) => t.category === l).map((t) => ({
445
445
  label: t.label,
446
446
  value: t.value,
447
447
  hint: t.hint,
448
448
  hidden: t.hidden
449
449
  }));
450
- o.push({ category: a, entries: n });
450
+ o.push({ category: l, entries: n });
451
451
  }), o;
452
- }, D = () => {
453
- const e = oe(de);
452
+ }, R = () => {
453
+ const e = de(ue);
454
454
  if (e)
455
455
  return e;
456
456
  throw new Error("useHttpClient must be used within a HttpClientProvider");
457
- }, $ = {
457
+ }, D = {
458
458
  Template_list: "/Template/list/",
459
459
  Template: "/Template/GetTemplate/",
460
460
  MergeTags: "/Template/TemplateMergeTags/",
461
461
  ExcludeCategory: "/Template/GetExcludeCategories/",
462
462
  SaveTemplate: "/Template/save-update/",
463
463
  TemplateTypes: "/Template/TemplateTypes/"
464
- }, qe = () => {
465
- const e = D(), { enerexIdentifier: r, projectId: o } = E();
466
- return H({
464
+ }, Be = () => {
465
+ const e = R(), { enerexIdentifier: r, projectId: o } = P();
466
+ return z({
467
467
  queryKey: ["getTemplateTags"],
468
468
  queryFn: async (n) => await e.get(
469
- `${$.MergeTags}${o}/${r}`
469
+ `${D.MergeTags}${o}/${r}`
470
470
  )
471
471
  });
472
- }, De = () => {
473
- const e = D(), { enerexIdentifier: r, projectId: o } = E();
474
- return H({
472
+ }, Me = () => {
473
+ const e = R(), { enerexIdentifier: r, projectId: o } = P();
474
+ return z({
475
475
  queryKey: ["getExcludeCategory"],
476
476
  queryFn: async (n) => await e.get(
477
- `${$.ExcludeCategory}${o}/${r}`
477
+ `${D.ExcludeCategory}${o}/${r}`
478
478
  )
479
479
  });
480
- }, $e = ({
480
+ }, J = Date.now().toString(36) + Math.random().toString(36).substr(2);
481
+ console.log("uniqueId", J);
482
+ const Ue = ({
481
483
  templateHTML: e,
482
484
  className: r = "",
483
485
  loading: o = !1
484
486
  }) => {
485
- const { post: a } = le(), { data: n } = qe(), { data: t } = De(), [s, d] = S(
486
- e ?? { html: M, css: "" }
487
- ), { enerexIdentifier: p, projectId: T } = E(), v = xe(null), y = "https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png", x = "https://plugins.stripo.email/api/v1/auth";
488
- N(() => {
489
- (async () => (await j(), n && t && await I(F.EDITOR_SCRIPT_URL)))();
487
+ const { post: l } = me(), { data: n } = Be(), { data: t } = Me(), [s, d] = v(
488
+ e ?? { html: F, css: "" }
489
+ ), p = _e(null), x = "https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png", I = "https://plugins.stripo.email/api/v1/auth";
490
+ C(() => {
491
+ (async () => (await g(), n && t && await S(H.EDITOR_SCRIPT_URL)))();
490
492
  }, [n, t]);
491
- async function j() {
492
- window.Zone || await new Promise((g, u) => {
493
+ async function g() {
494
+ window.Zone || await new Promise((y, c) => {
493
495
  const f = document.createElement("script");
494
496
  f.src = "https://unpkg.com/zone.js@0.13.1/bundles/zone.umd.min.js";
495
- const b = document.querySelector("script[nonce]")?.nonce;
496
- b && f.setAttribute("nonce", b), f.onload = () => g(), f.onerror = () => u(new Error("Failed to load zone.js")), document.head.appendChild(f);
497
+ const h = document.querySelector("script[nonce]")?.nonce;
498
+ h && f.setAttribute("nonce", h), f.onload = () => y(), f.onerror = () => c(new Error("Failed to load zone.js")), document.head.appendChild(f);
497
499
  });
498
500
  }
499
- async function I(g) {
500
- let u = document.getElementById(
501
+ async function S(y) {
502
+ let c = document.getElementById(
501
503
  "UiEditorScript"
502
504
  );
503
- u || (u = document.createElement("script"), u.id = "UiEditorScript", u.src = g, u.onload = async () => {
504
- await m();
505
- }, document.body.appendChild(u)), await new Promise(
506
- (f) => u.addEventListener("load", () => f(), { once: !0 })
505
+ c || (c = document.createElement("script"), c.id = "UiEditorScript", c.src = y, c.onload = async () => {
506
+ await A();
507
+ }, document.body.appendChild(c)), await new Promise(
508
+ (f) => c.addEventListener("load", () => f(), { once: !0 })
507
509
  );
508
510
  }
509
- const m = async () => {
510
- const g = v.current;
511
- if (!g) {
511
+ const A = async () => {
512
+ const y = p.current;
513
+ if (!y) {
512
514
  console.error("Missing #stripoEditorContainer in DOM");
513
515
  return;
514
516
  }
@@ -516,45 +518,45 @@ const M = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
516
518
  console.error("UIEditor script not loaded or not exposing initEditor");
517
519
  return;
518
520
  }
519
- const u = {
521
+ const c = {
520
522
  html: s.html,
521
523
  css: s.css,
522
524
  modulesExcludedCategories: t ?? [],
523
525
  forceRecreate: !0,
524
526
  metadata: {
525
- emailId: `${T}_${p}`,
527
+ emailId: J,
526
528
  userId: "1",
527
529
  // username: userName,
528
- avatarUrl: y
530
+ avatarUrl: x
529
531
  },
530
532
  locale: "en",
531
533
  onTokenRefreshRequest: async (f) => {
532
- const b = {
533
- pluginId: F.EDITOR_PLUGIN_ID,
534
- secretKey: F.EDITOR_SECRET_KEY,
535
- userId: "12",
534
+ const h = {
535
+ pluginId: H.EDITOR_PLUGIN_ID,
536
+ secretKey: H.EDITOR_SECRET_KEY,
537
+ userId: J,
536
538
  role: "user"
537
- }, A = await a(
538
- x,
539
- b
539
+ }, w = await l(
540
+ I,
541
+ h
540
542
  );
541
- A?.token && f(A.token);
543
+ w?.token && f(w.token);
542
544
  },
543
- mergeTags: Oe(n ?? [])
545
+ mergeTags: ke(n ?? [])
544
546
  };
545
- for (const [f, b] of Object.entries({
547
+ for (const [f, h] of Object.entries({
546
548
  codeEditorButtonSelector: "#codeEditor",
547
549
  undoButtonSelector: "#undoButton",
548
550
  redoButtonSelector: "#redoButton",
549
551
  mobileViewButtonSelector: "#mobileViewButton",
550
552
  desktopViewButtonSelector: "#desktopViewButton"
551
553
  }))
552
- g.ownerDocument && g.getRootNode() instanceof ShadowRoot && g.getRootNode().querySelector(b) && (u[f] = b);
553
- await window.UIEditor.initEditor(g, u);
554
+ y.ownerDocument && y.getRootNode() instanceof ShadowRoot && y.getRootNode().querySelector(h) && (c[f] = h);
555
+ await window.UIEditor.initEditor(y, c);
554
556
  };
555
- return /* @__PURE__ */ i("div", { className: "position-relative", children: /* @__PURE__ */ C("div", { className: `editor-container ${r}`, children: [
557
+ return /* @__PURE__ */ i("div", { className: "position-relative", children: /* @__PURE__ */ E("div", { className: `editor-container ${r}`, children: [
556
558
  o && /* @__PURE__ */ i("div", { className: "loading-overlay", children: /* @__PURE__ */ i(
557
- Q,
559
+ Y,
558
560
  {
559
561
  animation: "border",
560
562
  style: { width: "11px", height: "11px" },
@@ -564,24 +566,24 @@ const M = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
564
566
  }
565
567
  ) }),
566
568
  /* @__PURE__ */ i("div", { id: "externalSystemContainer" }),
567
- /* @__PURE__ */ i("div", { id: "stripoEditorContainer", ref: v })
569
+ /* @__PURE__ */ i("div", { id: "stripoEditorContainer", ref: p })
568
570
  ] }) });
569
- }, ee = ({
571
+ }, ie = ({
570
572
  label: e,
571
573
  register: r,
572
574
  validation: o,
573
- required: a = !1,
575
+ required: l = !1,
574
576
  name: n,
575
577
  error: t,
576
578
  className: s = "",
577
579
  ...d
578
- }) => /* @__PURE__ */ C(P.Group, { className: s + " mb-1", children: [
579
- e ? /* @__PURE__ */ C(P.Label, { className: "mb-3 d-block form-label", children: [
580
+ }) => /* @__PURE__ */ E(N.Group, { className: s + " mb-1", children: [
581
+ e ? /* @__PURE__ */ E(N.Label, { className: "mb-3 d-block form-label", children: [
580
582
  e,
581
- a && /* @__PURE__ */ i("label", { className: "text-danger", children: "*" })
583
+ l && /* @__PURE__ */ i("label", { className: "text-danger", children: "*" })
582
584
  ] }) : null,
583
585
  /* @__PURE__ */ i(
584
- P.Control,
586
+ N.Control,
585
587
  {
586
588
  name: n,
587
589
  type: "text",
@@ -593,61 +595,78 @@ const M = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
593
595
  className: `react-select__control ${t && t[n] && "border border-danger"}`
594
596
  }
595
597
  ),
596
- t && t[n] ? /* @__PURE__ */ i(P.Control.Feedback, { type: "invalid", children: t[n].message }) : null
597
- ] }), Le = () => {
598
- const e = D(), { enerexIdentifier: r, projectId: o } = E();
599
- return H({
598
+ t && t[n] ? /* @__PURE__ */ i(N.Control.Feedback, { type: "invalid", children: t[n].message }) : null
599
+ ] }), Fe = () => {
600
+ const e = R(), { enerexIdentifier: r, projectId: o } = P();
601
+ return z({
600
602
  queryKey: ["getTemplatesList"],
601
603
  queryFn: async (n) => await e.get(
602
- `${$.Template_list}${o}/${r}`
604
+ `${D.Template_list}${o}/${r}`
603
605
  )
604
606
  });
605
607
  };
606
- function z(e) {
608
+ function K(e) {
607
609
  return e.sort((r, o) => r.name.localeCompare(o.name));
608
610
  }
609
- const ke = () => {
610
- const e = D(), { enerexIdentifier: r, projectId: o } = E();
611
- return se({
611
+ function He(e) {
612
+ const r = /* @__PURE__ */ new Map(), o = [];
613
+ e.forEach((t) => r.set(t.id, t));
614
+ let l = e.filter((t) => t.parent_id === 0), n = 0;
615
+ for (; l.length > 0; ) {
616
+ o.push({ level: n, data: l });
617
+ const t = l.map((d) => d.id);
618
+ l = e.filter(
619
+ (d) => t.includes(d.parent_id)
620
+ ), n++;
621
+ }
622
+ return o;
623
+ }
624
+ function Q(e, r) {
625
+ const l = He(e).find((n) => n.level === r);
626
+ return l ? l.data : [];
627
+ }
628
+ const ze = () => {
629
+ const e = R(), { enerexIdentifier: r, projectId: o } = P();
630
+ return ce({
612
631
  mutationKey: ["getTemplate"],
613
632
  mutationFn: async ({ id: n }) => {
614
633
  if (n)
615
634
  return await e.get(
616
- `${$.Template}${r}/${n}/${o}`
635
+ `${D.Template}${r}/${n}/${o}`
617
636
  );
618
637
  }
619
638
  });
620
- }, Be = () => {
621
- const e = D(), { enerexIdentifier: r, projectId: o } = E();
622
- return H({
639
+ }, Ge = () => {
640
+ const e = R(), { enerexIdentifier: r, projectId: o } = P();
641
+ return z({
623
642
  queryKey: ["getTemplateTypes"],
624
643
  queryFn: async (n) => await e.get(
625
- `${$.TemplateTypes}${r}/${o}`
644
+ `${D.TemplateTypes}${r}/${o}`
626
645
  )
627
646
  });
628
647
  };
629
- function Ue(e) {
648
+ function Ve(e) {
630
649
  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
631
650
  }
632
- var V = { exports: {} };
651
+ var W = { exports: {} };
633
652
  /*!
634
653
  Copyright (c) 2018 Jed Watson.
635
654
  Licensed under the MIT License (MIT), see
636
655
  http://jedwatson.github.io/classnames
637
656
  */
638
- var te;
639
- function Me() {
640
- return te || (te = 1, function(e) {
657
+ var oe;
658
+ function Ke() {
659
+ return oe || (oe = 1, function(e) {
641
660
  (function() {
642
661
  var r = {}.hasOwnProperty;
643
662
  function o() {
644
663
  for (var t = "", s = 0; s < arguments.length; s++) {
645
664
  var d = arguments[s];
646
- d && (t = n(t, a(d)));
665
+ d && (t = n(t, l(d)));
647
666
  }
648
667
  return t;
649
668
  }
650
- function a(t) {
669
+ function l(t) {
651
670
  if (typeof t == "string" || typeof t == "number")
652
671
  return t;
653
672
  if (typeof t != "object")
@@ -666,10 +685,10 @@ function Me() {
666
685
  }
667
686
  e.exports ? (o.default = o, e.exports = o) : window.classNames = o;
668
687
  })();
669
- }(V)), V.exports;
688
+ }(W)), W.exports;
670
689
  }
671
- var Fe = Me();
672
- const ne = /* @__PURE__ */ Ue(Fe), re = (e) => e.data.isSeparator ? /* @__PURE__ */ i("div", { style: { padding: 0, margin: "2px 0" }, children: /* @__PURE__ */ i(
690
+ var Qe = Ke();
691
+ const se = /* @__PURE__ */ Ve(Qe), le = (e) => e.data.isSeparator ? /* @__PURE__ */ i("div", { style: { padding: 0, margin: "2px 0" }, children: /* @__PURE__ */ i(
673
692
  "hr",
674
693
  {
675
694
  style: {
@@ -679,25 +698,25 @@ const ne = /* @__PURE__ */ Ue(Fe), re = (e) => e.data.isSeparator ? /* @__PURE__
679
698
  margin: 0
680
699
  }
681
700
  }
682
- ) }) : /* @__PURE__ */ i(Pe.Option, { ...e }), He = ({
701
+ ) }) : /* @__PURE__ */ i(Le.Option, { ...e }), We = ({
683
702
  name: e = "",
684
703
  control: r,
685
704
  options: o,
686
- multiple: a = !1,
705
+ multiple: l = !1,
687
706
  placeholder: n,
688
707
  validation: t,
689
708
  labelKey: s = "name",
690
709
  disabled: d,
691
710
  isInvalid: p,
692
- value: T,
693
- onChange: v,
694
- uncontrolled: y,
695
- menuPlacement: x = "auto",
696
- closeOnSelect: j = !0
711
+ value: x,
712
+ onChange: I,
713
+ uncontrolled: g,
714
+ menuPlacement: S = "auto",
715
+ closeOnSelect: A = !0
697
716
  }) => {
698
- const I = {
699
- control: (m) => ({
700
- ...m,
717
+ const y = {
718
+ control: (c) => ({
719
+ ...c,
701
720
  minHeight: "33px",
702
721
  // state.isFocused can display different borderColor if you need it
703
722
  borderColor: p ? "var(--bs-form-invalid-border-color) !important" : "var(--ct-input-border-color)",
@@ -718,247 +737,272 @@ const ne = /* @__PURE__ */ Ue(Fe), re = (e) => e.data.isSeparator ? /* @__PURE__
718
737
  display: "none"
719
738
  }
720
739
  }),
721
- menu: (m) => ({
722
- ...m,
740
+ menu: (c) => ({
741
+ ...c,
723
742
  marginTop: 0,
724
743
  width: "max-content",
725
744
  minWidth: "100%"
726
745
  }),
727
- menuPortal: (m) => ({
728
- ...m,
746
+ menuPortal: (c) => ({
747
+ ...c,
729
748
  zIndex: 9999
730
749
  }),
731
- multiValueRemove: (m) => ({
732
- ...m,
750
+ multiValueRemove: (c) => ({
751
+ ...c,
733
752
  display: d ? "none" : "block"
734
753
  })
735
754
  };
736
- return y ? /* @__PURE__ */ i(
737
- Z,
755
+ return g ? /* @__PURE__ */ i(
756
+ re,
738
757
  {
739
- components: { Option: re },
740
- isOptionDisabled: (m) => !!m.isSeparator,
741
- className: ne({
758
+ components: { Option: le },
759
+ isOptionDisabled: (c) => !!c.isSeparator,
760
+ className: se({
742
761
  "is-invalid": p
743
762
  }),
744
- styles: I,
763
+ styles: y,
745
764
  classNamePrefix: "react-select",
746
- isMulti: a,
765
+ isMulti: l,
747
766
  options: o,
748
- onChange: v,
767
+ onChange: I,
749
768
  placeholder: n,
750
769
  menuPortalTarget: document.body,
751
- value: T,
752
- getOptionLabel: typeof s == "string" ? (m) => m[s] : s,
753
- getOptionValue: (m) => m.id,
770
+ value: x,
771
+ getOptionLabel: typeof s == "string" ? (c) => c[s] : s,
772
+ getOptionValue: (c) => c.id,
754
773
  isDisabled: d,
755
- menuPlacement: x,
756
- closeMenuOnSelect: j
774
+ menuPlacement: S,
775
+ closeMenuOnSelect: A
757
776
  }
758
777
  ) : /* @__PURE__ */ i(
759
- _e,
778
+ Oe,
760
779
  {
761
780
  control: r,
762
781
  name: e,
763
782
  rules: t,
764
- render: ({ field: { onChange: m, value: g, onBlur: u } }) => /* @__PURE__ */ i(
765
- Z,
783
+ render: ({ field: { onChange: c, value: f, onBlur: h } }) => /* @__PURE__ */ i(
784
+ re,
766
785
  {
767
- components: { Option: re },
768
- isOptionDisabled: (f) => !!f.isSeparator,
769
- className: ne({
786
+ components: { Option: le },
787
+ isOptionDisabled: (w) => !!w.isSeparator,
788
+ className: se({
770
789
  "is-invalid": p
771
790
  }),
772
- styles: I,
791
+ styles: y,
773
792
  classNamePrefix: "react-select",
774
- isMulti: a,
793
+ isMulti: l,
775
794
  options: o,
776
- onBlur: u,
777
- onChange: m,
795
+ onBlur: h,
796
+ onChange: c,
778
797
  placeholder: n,
779
798
  menuPortalTarget: document.body,
780
- value: g,
781
- getOptionLabel: typeof s == "string" ? (f) => f[s] : s,
782
- getOptionValue: (f) => f.id,
799
+ value: f,
800
+ getOptionLabel: typeof s == "string" ? (w) => w[s] : s,
801
+ getOptionValue: (w) => w.id,
783
802
  isDisabled: d,
784
- menuPlacement: x,
785
- closeMenuOnSelect: j
803
+ menuPlacement: S,
804
+ closeMenuOnSelect: A
786
805
  },
787
- g ? JSON.stringify(g) : "reset"
806
+ f ? JSON.stringify(f) : "reset"
788
807
  )
789
808
  }
790
809
  );
791
- }, K = ({
810
+ }, M = ({
792
811
  label: e,
793
812
  name: r,
794
813
  validation: o,
795
- control: a,
814
+ control: l,
796
815
  error: n,
797
816
  ...t
798
- }) => /* @__PURE__ */ C(P.Group, { className: "mb-1", children: [
799
- e && /* @__PURE__ */ C(P.Label, { className: "mb-3 d-block form-label", children: [
817
+ }) => /* @__PURE__ */ E(N.Group, { className: "mb-1", children: [
818
+ e && /* @__PURE__ */ E(N.Label, { className: "mb-3 d-block form-label", children: [
800
819
  e,
801
820
  " ",
802
821
  t.required && /* @__PURE__ */ i("span", { className: "text-danger", children: "*" })
803
822
  ] }),
804
823
  /* @__PURE__ */ i(
805
- He,
824
+ We,
806
825
  {
807
- control: a,
826
+ control: l,
808
827
  options: t.options ?? [],
809
828
  validation: o,
810
829
  isInvalid: n && !!n[r],
811
830
  name: r
812
831
  }
813
832
  ),
814
- n && n[r] ? /* @__PURE__ */ i(P.Control.Feedback, { type: "invalid", children: n[r].message }) : null
815
- ] }), ze = () => {
816
- const e = D();
817
- Ee();
818
- const { enerexIdentifier: r, projectId: o } = E();
819
- return se({
833
+ n && n[r] ? /* @__PURE__ */ i(N.Control.Feedback, { type: "invalid", children: n[r].message }) : null
834
+ ] }), Ye = () => {
835
+ const e = R();
836
+ Ae();
837
+ const { enerexIdentifier: r, projectId: o } = P();
838
+ return ce({
820
839
  mutationKey: ["saveTemplate"],
821
840
  mutationFn: async (n) => (n.enerexIdentifier = r ?? "", n.projectId = o ?? "", await e.post(
822
- `${$.SaveTemplate}`,
841
+ `${D.SaveTemplate}`,
823
842
  n
824
843
  ))
825
844
  });
826
- }, G = {
845
+ }, U = {
827
846
  id: "",
828
847
  name: "New (Blank)"
829
- }, ie = {
848
+ }, ae = {
830
849
  id: "",
831
850
  name: "Separator",
832
851
  isSeparator: !0
833
- }, Ve = ({
852
+ }, Je = ({
834
853
  onSelectItem: e,
835
854
  templateLoading: r,
836
855
  onReset: o
837
856
  }) => {
838
857
  const {
839
- register: a,
858
+ register: l,
840
859
  handleSubmit: n,
841
860
  clearErrors: t,
842
861
  setValue: s,
843
862
  control: d,
844
863
  watch: p,
845
- reset: T,
846
- setError: v,
847
- formState: { errors: y }
848
- } = Ne({
864
+ reset: x,
865
+ setError: I,
866
+ formState: { errors: g }
867
+ } = qe({
849
868
  defaultValues: {
850
869
  templateName: "",
851
870
  subTemplateType: void 0,
871
+ subTemplateType2: void 0,
852
872
  subject: "",
853
873
  templateType: void 0,
854
- template: G
874
+ template: U
855
875
  },
856
876
  mode: "onChange"
857
877
  }), {
858
- data: x,
859
- refetch: j,
860
- isLoading: I
861
- } = Le(), [m, g] = S([]), [u, f] = S(), [b, A] = S(), { mutateAsync: ce, isPending: R } = ke(), { mutateAsync: pe, isPending: k } = ze(), { data: B, isLoading: W } = Be(), [me, ue] = S([]), [_, U] = S([]);
862
- N(() => {
863
- if (B) {
864
- let l = B.filter((c) => c.id != null).sort((c, w) => c.name.localeCompare(w.name));
865
- ue(
866
- z(l.filter((c) => c.parent_id === 0))
867
- ), U(
868
- z(
869
- l.filter(
870
- (c) => c.parent_id.toString() === `${p("templateType")?.id}`
871
- )
872
- )
873
- );
878
+ data: S,
879
+ refetch: A,
880
+ isLoading: y
881
+ } = Fe(), [c, f] = v([]), [h, w] = v(), [k, X] = v(), { mutateAsync: fe, isPending: j } = ze(), { mutateAsync: ge, isPending: B } = Ye(), { data: $, isLoading: Z } = Ge(), [ye, he] = v([]), [O, G] = v([]), [q, be] = v([]);
882
+ C(() => {
883
+ if ($) {
884
+ let a = $.filter((u) => u.id != null), m = Q(a, 0);
885
+ he(K(m));
874
886
  }
875
- }, [B]);
876
- const fe = (l, c) => {
877
- let w = [];
878
- return l.forEach((h, L) => {
879
- c.includes(L) && L !== 0 && w.push(ie), w.push(h);
880
- }), w;
887
+ }, [$]);
888
+ const we = (a, m) => {
889
+ let u = [];
890
+ return a.forEach((T, b) => {
891
+ m.includes(b) && b !== 0 && u.push(ae), u.push(T);
892
+ }), u;
881
893
  };
882
- N(() => {
883
- r(!!R);
884
- }, [R]), N(() => {
885
- x?.sort((l, c) => l.readonly !== c.readonly ? (l.readonly ? 0 : 1) - (c.readonly ? 0 : 1) : l.name.localeCompare(c.name)), g(x ?? []);
886
- }, [x]);
887
- const ge = async (l) => {
888
- f(l), l && !l.readonly ? (s("templateName", l?.name), t()) : (s("templateName", ""), s("subject", ""));
889
- const c = await ce({ id: l?.id });
890
- A(c || void 0);
894
+ C(() => {
895
+ r(!!j);
896
+ }, [j]), C(() => {
897
+ S?.sort((a, m) => a.readonly !== m.readonly ? (a.readonly ? 0 : 1) - (m.readonly ? 0 : 1) : a.name.localeCompare(m.name)), f(S ?? []);
898
+ }, [S]);
899
+ const Te = async (a) => {
900
+ w(a), a && !a.readonly ? (s("templateName", a?.name), t()) : (s("templateName", ""), s("subject", ""));
901
+ const m = await fe({ id: a?.id });
902
+ X(m || void 0);
891
903
  };
892
- N(() => {
893
- if (s("template", G), p("templateType")) {
894
- let l = B?.filter((c) => c.id !== void 0) ?? [];
895
- U(
896
- z(
897
- l.filter(
898
- (c) => c.parent_id.toString() === `${p("templateType")?.id}`
904
+ C(() => {
905
+ if (s("template", U), p("templateType")) {
906
+ let a = $?.filter((u) => u.id !== void 0) ?? [], m = Q(a, 1);
907
+ G(
908
+ K(
909
+ m.filter(
910
+ (u) => u.parent_id.toString() === `${p("templateType")?.id}`
899
911
  )
900
912
  )
901
913
  ), s("subTemplateType", void 0);
902
914
  }
903
- }, [p("templateType")]), N(() => {
904
- let l = m.find((c) => c.id === p("template")?.id);
905
- ge(l);
906
- }, [p("template")]), N(() => {
907
- b && u ? (e(b), s("subject", b.subject ?? "")) : e(void 0);
908
- }, [b, u, e]);
909
- const ye = () => {
910
- let l = [G], c = m.filter(
911
- (h) => (h.type?.toString() === p(
912
- _.length > 0 ? "subTemplateType" : "templateType"
913
- )?.id.toString() || h.type === null) && p(_.length > 0 ? "subTemplateType" : "templateType")?.id != null
914
- ), w = fe(c, [c.findIndex((h) => !h.readonly)]);
915
- return w.length > 0 && (l.push(ie), l = [
916
- ...l,
917
- ...w.map((h) => ({
918
- id: h.id,
919
- name: h.name,
920
- isSeparator: h.isSeparator
915
+ }, [p("templateType")]), C(() => {
916
+ if (s("template", U), p("subTemplateType")) {
917
+ let a = $?.filter((u) => u.id !== void 0) ?? [], m = Q(a, 2);
918
+ be(
919
+ K(
920
+ m.filter(
921
+ (u) => u.parent_id.toString() === `${p("subTemplateType")?.id}`
922
+ )
923
+ )
924
+ ), s("subTemplateType2", void 0);
925
+ }
926
+ }, [p("subTemplateType")]), C(() => {
927
+ let a = c.find((m) => m.id === p("template")?.id);
928
+ Te(a);
929
+ }, [p("template")]), C(() => {
930
+ k && h ? (e(k), s("subject", k.subject ?? "")) : e(void 0);
931
+ }, [k, h, e]);
932
+ const ve = () => {
933
+ let a = [U], m = "templateType";
934
+ q.length > 0 ? m = "subTemplateType2" : O.length > 0 && (m = "subTemplateType");
935
+ let u = c.filter(
936
+ (b) => (b.type?.toString() === p(m)?.id.toString() || b.type === null) && p(m)?.id != null
937
+ ), T = we(u, [u.findIndex((b) => !b.readonly)]);
938
+ return T.length > 0 && (a.push(ae), a = [
939
+ ...a,
940
+ ...T.map((b) => ({
941
+ id: b.id,
942
+ name: xe(u, b.id),
943
+ isSeparator: b.isSeparator
921
944
  }))
922
- ]), l.length ? l : [];
923
- }, he = (l) => {
945
+ ]), a.length ? a : [];
946
+ }, xe = (a, m) => {
947
+ let u = a.find((T) => T.id === m);
948
+ return u ? `${u.readonly ? "Default - " : "Custom - "} ${u.name}` : "";
949
+ }, Se = (a) => {
924
950
  window.StripoEditorApi.actionsApi.getTemplateData(
925
- async (c) => {
926
- let w = l.template.id, h = "";
927
- u?.readonly && (w = "", h = l.template.id);
928
- let L = m.find(
929
- (Te) => Te.name === l.templateName.trim()
951
+ async (m) => {
952
+ let u = a.template.id, T = "";
953
+ h?.readonly && (u = "", T = a.template.id);
954
+ let b = c.find(
955
+ (Ee) => Ee.name === a.templateName.trim()
930
956
  );
931
- if (L && L.id !== w) {
932
- v("templateName", {
957
+ if (b && b.id !== u) {
958
+ I("templateName", {
933
959
  type: "validate",
934
960
  message: "Template name already exists. Please choose a different name."
935
961
  });
936
962
  return;
937
963
  }
938
- let be = !!(_ && _.length > 0);
939
- const we = {
964
+ let V = a.templateType.id;
965
+ q && q.length > 0 ? V = a.subTemplateType2.id : O && O.length > 0 && (V = a.subTemplateType.id);
966
+ const Ce = {
940
967
  enerexIdentifier: "",
941
968
  projectId: "",
942
- templateId: w,
943
- templateType: be ? l.subTemplateType.id : l.templateType.id,
944
- name: l.templateName.trim(),
945
- html: c.html,
946
- css: c.css,
947
- subject: l.templateType.id === "2" ? l?.subject ?? "" : "",
948
- parent_id: h
969
+ templateId: u,
970
+ templateType: V,
971
+ name: a.templateName.trim(),
972
+ html: m.html,
973
+ css: m.css,
974
+ subject: a.templateType.id === "2" ? a?.subject ?? "" : "",
975
+ parent_id: T
949
976
  };
950
- await pe(we) && (t(), T(), U([]), j());
977
+ await ge(Ce) && (t(), x(), G([]), A());
951
978
  }
952
979
  );
953
980
  };
954
- return /* @__PURE__ */ i(J, { className: "border border-0 text-start", children: /* @__PURE__ */ i(J.Body, { className: "pe-0 ps-2", children: /* @__PURE__ */ i("form", { onSubmit: n(he), children: /* @__PURE__ */ i("div", { className: "template-list-container gap-3", children: /* @__PURE__ */ C(Ie, { children: [
955
- /* @__PURE__ */ i(O, { children: /* @__PURE__ */ i(
956
- K,
981
+ return /* @__PURE__ */ i(te, { className: "border border-0 text-start", children: /* @__PURE__ */ i(te.Body, { className: "pe-0 ps-2", children: /* @__PURE__ */ i("form", { onSubmit: n(Se), children: /* @__PURE__ */ i("div", { className: "template-list-container gap-3", children: /* @__PURE__ */ E(je, { children: [
982
+ /* @__PURE__ */ i(_, { children: /* @__PURE__ */ i(
983
+ M,
984
+ {
985
+ label: "Category",
986
+ control: d,
987
+ error: g,
988
+ options: ye,
989
+ required: !0,
990
+ validation: {
991
+ required: {
992
+ value: !0,
993
+ message: "Select a category"
994
+ }
995
+ },
996
+ ...l("templateType")
997
+ }
998
+ ) }),
999
+ O && O.length > 0 && /* @__PURE__ */ i(_, { children: /* @__PURE__ */ i(
1000
+ M,
957
1001
  {
958
1002
  label: "Type",
959
1003
  control: d,
960
- error: y,
961
- options: me,
1004
+ error: g,
1005
+ options: O,
962
1006
  required: !0,
963
1007
  validation: {
964
1008
  required: {
@@ -966,43 +1010,43 @@ const ne = /* @__PURE__ */ Ue(Fe), re = (e) => e.data.isSeparator ? /* @__PURE__
966
1010
  message: "Select a type"
967
1011
  }
968
1012
  },
969
- ...a("templateType")
1013
+ ...l("subTemplateType")
970
1014
  }
971
1015
  ) }),
972
- _ && _.length > 0 && /* @__PURE__ */ i(O, { children: /* @__PURE__ */ i(
973
- K,
1016
+ q && q.length > 0 && /* @__PURE__ */ i(_, { children: /* @__PURE__ */ i(
1017
+ M,
974
1018
  {
975
1019
  label: "Sub Type",
976
1020
  control: d,
977
- error: y,
978
- options: _,
1021
+ error: g,
1022
+ options: q,
979
1023
  required: !0,
980
1024
  validation: {
981
1025
  required: {
982
1026
  value: !0,
983
- message: "Select a type"
1027
+ message: "Select a subtype"
984
1028
  }
985
1029
  },
986
- ...a("subTemplateType")
1030
+ ...l("subTemplateType2")
987
1031
  }
988
1032
  ) }),
989
- /* @__PURE__ */ i(O, { children: /* @__PURE__ */ i(
990
- K,
1033
+ /* @__PURE__ */ i(_, { children: /* @__PURE__ */ i(
1034
+ M,
991
1035
  {
992
1036
  label: "Template",
993
1037
  control: d,
994
- error: y,
995
- options: ye(),
1038
+ error: g,
1039
+ options: ve(),
996
1040
  required: !1,
997
- ...a("template")
1041
+ ...l("template")
998
1042
  }
999
1043
  ) }),
1000
- /* @__PURE__ */ i(O, { children: /* @__PURE__ */ i(
1001
- ee,
1044
+ /* @__PURE__ */ i(_, { children: /* @__PURE__ */ i(
1045
+ ie,
1002
1046
  {
1003
1047
  label: "Name",
1004
- register: a,
1005
- error: y,
1048
+ register: l,
1049
+ error: g,
1006
1050
  required: !0,
1007
1051
  name: "templateName",
1008
1052
  validation: {
@@ -1013,28 +1057,28 @@ const ne = /* @__PURE__ */ Ue(Fe), re = (e) => e.data.isSeparator ? /* @__PURE__
1013
1057
  }
1014
1058
  }
1015
1059
  ) }),
1016
- p("templateType")?.id === "2" && /* @__PURE__ */ i(O, { children: /* @__PURE__ */ i(
1017
- ee,
1060
+ p("templateType")?.id === "2" && /* @__PURE__ */ i(_, { children: /* @__PURE__ */ i(
1061
+ ie,
1018
1062
  {
1019
1063
  label: "Subject",
1020
- register: a,
1021
- error: y,
1064
+ register: l,
1065
+ error: g,
1022
1066
  required: !1,
1023
1067
  name: "subject"
1024
1068
  }
1025
1069
  ) }),
1026
- /* @__PURE__ */ C(O, { className: "d-flex align-items-end justify-content-end gap-2 mb-3", children: [
1070
+ /* @__PURE__ */ E(_, { className: "d-flex align-items-end justify-content-end gap-2 mb-3", children: [
1027
1071
  /* @__PURE__ */ i(
1028
- X,
1072
+ ne,
1029
1073
  {
1030
1074
  style: { width: "70px" },
1031
1075
  variant: "primary",
1032
- disabled: I || R || k || W,
1076
+ disabled: y || j || B || Z,
1033
1077
  onClick: () => {
1034
- f(void 0), T(), U([]), o();
1078
+ w(void 0), x(), G([]), o();
1035
1079
  },
1036
- children: R || k ? /* @__PURE__ */ i(
1037
- Q,
1080
+ children: j || B ? /* @__PURE__ */ i(
1081
+ Y,
1038
1082
  {
1039
1083
  animation: "border",
1040
1084
  style: { width: "11px", height: "11px" },
@@ -1046,15 +1090,15 @@ const ne = /* @__PURE__ */ Ue(Fe), re = (e) => e.data.isSeparator ? /* @__PURE__
1046
1090
  ) : "Clear"
1047
1091
  }
1048
1092
  ),
1049
- (p("templateType")?.id.toString() !== "2" || (p("templateType")?.id.toString() === "2" && (u?.id ?? "")) !== "") && /* @__PURE__ */ i(ve, { children: /* @__PURE__ */ i(
1050
- X,
1093
+ (p("templateType")?.id.toString() !== "2" || (p("templateType")?.id.toString() === "2" && (h?.id ?? "")) !== "") && /* @__PURE__ */ i(Ie, { children: /* @__PURE__ */ i(
1094
+ ne,
1051
1095
  {
1052
1096
  type: "submit",
1053
1097
  variant: "primary",
1054
1098
  style: { width: "80px" },
1055
- disabled: I || R || k || W,
1056
- children: R || k ? /* @__PURE__ */ i(
1057
- Q,
1099
+ disabled: y || j || B || Z,
1100
+ children: j || B ? /* @__PURE__ */ i(
1101
+ Y,
1058
1102
  {
1059
1103
  animation: "border",
1060
1104
  style: { width: "11px", height: "11px" },
@@ -1063,21 +1107,21 @@ const ne = /* @__PURE__ */ Ue(Fe), re = (e) => e.data.isSeparator ? /* @__PURE__
1063
1107
  className: "me-1",
1064
1108
  children: /* @__PURE__ */ i("span", { className: "visually-hidden", children: "Loading..." })
1065
1109
  }
1066
- ) : u?.readonly ? "Save as" : "Save"
1110
+ ) : h?.readonly ? "Save as" : "Save"
1067
1111
  }
1068
1112
  ) })
1069
1113
  ] })
1070
1114
  ] }) }) }) }) });
1071
- }, et = ({ config: e }) => {
1072
- const [r, o] = S(), [a, n] = S(!1);
1073
- return /* @__PURE__ */ i(je, { configs: e, children: /* @__PURE__ */ i(Re, { children: /* @__PURE__ */ C("div", { className: "root-widget", children: [
1115
+ }, st = ({ config: e }) => {
1116
+ const [r, o] = v(), [l, n] = v(!1);
1117
+ return /* @__PURE__ */ i(Re, { configs: e, children: /* @__PURE__ */ i($e, { children: /* @__PURE__ */ E("div", { className: "root-widget", children: [
1074
1118
  /* @__PURE__ */ i(
1075
- Ve,
1119
+ Je,
1076
1120
  {
1077
1121
  templateLoading: n,
1078
1122
  onSelectItem: (d) => {
1079
1123
  if (o(d), window.StripoEditorApi && window.StripoEditorApi.actionsApi) {
1080
- let p = M;
1124
+ let p = F;
1081
1125
  window.StripoEditorApi.actionsApi.updateHtmlAndCss(
1082
1126
  d?.html ?? p,
1083
1127
  d?.css ?? "",
@@ -1087,7 +1131,7 @@ const ne = /* @__PURE__ */ Ue(Fe), re = (e) => e.data.isSeparator ? /* @__PURE__
1087
1131
  },
1088
1132
  onReset: () => {
1089
1133
  n(!1), o(void 0), window.StripoEditorApi && window.StripoEditorApi.actionsApi && window.StripoEditorApi.actionsApi.updateHtmlAndCss(
1090
- M,
1134
+ F,
1091
1135
  "",
1092
1136
  ""
1093
1137
  );
@@ -1095,11 +1139,11 @@ const ne = /* @__PURE__ */ Ue(Fe), re = (e) => e.data.isSeparator ? /* @__PURE__
1095
1139
  }
1096
1140
  ),
1097
1141
  /* @__PURE__ */ i(
1098
- $e,
1142
+ Ue,
1099
1143
  {
1100
1144
  templateHTML: {
1101
1145
  css: r?.css ?? "",
1102
- html: r?.html ?? M
1146
+ html: r?.html ?? F
1103
1147
  },
1104
1148
  loading: !1,
1105
1149
  className: "col-span-5"
@@ -1108,5 +1152,5 @@ const ne = /* @__PURE__ */ Ue(Fe), re = (e) => e.data.isSeparator ? /* @__PURE__
1108
1152
  ] }) }) });
1109
1153
  };
1110
1154
  export {
1111
- et as EditorWidget
1155
+ st as EditorWidget
1112
1156
  };
@@ -1,4 +1,4 @@
1
- (function(w,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("react/jsx-runtime"),require("react"),require("@tanstack/react-query"),require("axios"),require("react-bootstrap"),require("react-hook-form"),require("react-select")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@tanstack/react-query","axios","react-bootstrap","react-hook-form","react-select"],e):(w=typeof globalThis<"u"?globalThis:w||self,e(w.EnerexTemplateEditor={},w.jsxRuntime,w.React,w.reactQuery,w.axios,w.reactBootstrap,w.reactHookForm,w.Select$1))})(this,function(w,e,p,S,W,u,B,H){"use strict";const L=`<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
1
+ (function(v,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("react/jsx-runtime"),require("react"),require("@tanstack/react-query"),require("axios"),require("react-bootstrap"),require("react-hook-form"),require("react-select")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@tanstack/react-query","axios","react-bootstrap","react-hook-form","react-select"],n):(v=typeof globalThis<"u"?globalThis:v||self,n(v.EnerexTemplateEditor={},v.jsxRuntime,v.React,v.reactQuery,v.axios,v.reactBootstrap,v.reactHookForm,v.Select$1))})(this,function(v,n,p,S,J,g,X,z){"use strict";const k=`<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
2
2
  <html\r
3
3
  dir="ltr"\r
4
4
  xmlns:o="urn:schemas-microsoft-com:office:office"\r
@@ -354,8 +354,8 @@
354
354
  </div>\r
355
355
  </body>\r
356
356
  </html>\r
357
- `,Y=p.createContext(void 0),re=({children:t,configs:s})=>{const[o,l]=p.useState(s.clientId),[r,n]=p.useState(s.apiKey),[i,d]=p.useState(s.enerexIdentifier),[m,E]=p.useState(s.projectId),I=b=>{n(b.apiKey),l(b.clientId),E(b.projectId),d(b.enerexIdentifier)};return e.jsx(Y.Provider,{value:{clientId:o,apiKey:r,setConfiguration:I,enerexIdentifier:i,projectId:m},children:t})},C=()=>{const t=p.useContext(Y);if(!t)throw new Error("widgetConfig must be used within a ConfigProvider");return t},J=(t="",s)=>({get:async(r,n)=>{try{const i=await W.get(`${t}${r}`,n??s);if(i.status===200)return i.data}catch(i){throw i}},post:async(r,n,i)=>{try{const d=await W.post(`${t}${r}`,n,i??s);if(d.status===200)return d.data}catch(d){throw d}}}),$={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"},X=p.createContext({get:()=>{throw new Error("HttpClientContext.get not implemented")},post:()=>{throw new Error("HttpClientContext.post not implemented")}}),se=({children:t})=>{const{clientId:s,apiKey:o}=C(),l={headers:{client_id:s,"x-api-key":o}},{get:r,post:n}=J($.API_BASE_URL,l);return e.jsx(X.Provider,{value:{get:r,post:n},children:t})},oe=({children:t})=>{const s=new S.QueryClient;return e.jsx(se,{children:e.jsx(S.QueryClientProvider,{client:s,children:t})})},ie=t=>{const s=Array.from(new Set(t.map(l=>l.category))),o=[];return s.forEach(l=>{const r=t.filter(n=>n.category===l).map(n=>({label:n.label,value:n.value,hint:n.hint,hidden:n.hidden}));o.push({category:l,entries:r})}),o},q=()=>{const t=p.useContext(X);if(t)return t;throw new Error("useHttpClient must be used within a HttpClientProvider")},P={Template_list:"/Template/list/",Template:"/Template/GetTemplate/",MergeTags:"/Template/TemplateMergeTags/",ExcludeCategory:"/Template/GetExcludeCategories/",SaveTemplate:"/Template/save-update/",TemplateTypes:"/Template/TemplateTypes/"},le=()=>{const t=q(),{enerexIdentifier:s,projectId:o}=C();return S.useQuery({queryKey:["getTemplateTags"],queryFn:async r=>await t.get(`${P.MergeTags}${o}/${s}`)})},ae=()=>{const t=q(),{enerexIdentifier:s,projectId:o}=C();return S.useQuery({queryKey:["getExcludeCategory"],queryFn:async r=>await t.get(`${P.ExcludeCategory}${o}/${s}`)})},de=({templateHTML:t,className:s="",loading:o=!1})=>{const{post:l}=J(),{data:r}=le(),{data:n}=ae(),[i,d]=p.useState(t??{html:L,css:""}),{enerexIdentifier:m,projectId:E}=C(),I=p.useRef(null),b="https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png",_="https://plugins.stripo.email/api/v1/auth";p.useEffect(()=>{(async()=>(await A(),r&&n&&await N($.EDITOR_SCRIPT_URL)))()},[r,n]);async function A(){window.Zone||await new Promise((h,g)=>{const y=document.createElement("script");y.src="https://unpkg.com/zone.js@0.13.1/bundles/zone.umd.min.js";const v=document.querySelector("script[nonce]")?.nonce;v&&y.setAttribute("nonce",v),y.onload=()=>h(),y.onerror=()=>g(new Error("Failed to load zone.js")),document.head.appendChild(y)})}async function N(h){let g=document.getElementById("UiEditorScript");g||(g=document.createElement("script"),g.id="UiEditorScript",g.src=h,g.onload=async()=>{await f()},document.body.appendChild(g)),await new Promise(y=>g.addEventListener("load",()=>y(),{once:!0}))}const f=async()=>{const h=I.current;if(!h){console.error("Missing #stripoEditorContainer in DOM");return}if(!window.UIEditor||typeof window.UIEditor.initEditor!="function"){console.error("UIEditor script not loaded or not exposing initEditor");return}const g={html:i.html,css:i.css,modulesExcludedCategories:n??[],forceRecreate:!0,metadata:{emailId:`${E}_${m}`,userId:"1",avatarUrl:b},locale:"en",onTokenRefreshRequest:async y=>{const v={pluginId:$.EDITOR_PLUGIN_ID,secretKey:$.EDITOR_SECRET_KEY,userId:"12",role:"user"},O=await l(_,v);O?.token&&y(O.token)},mergeTags:ie(r??[])};for(const[y,v]of Object.entries({codeEditorButtonSelector:"#codeEditor",undoButtonSelector:"#undoButton",redoButtonSelector:"#redoButton",mobileViewButtonSelector:"#mobileViewButton",desktopViewButtonSelector:"#desktopViewButton"}))h.ownerDocument&&h.getRootNode()instanceof ShadowRoot&&h.getRootNode().querySelector(v)&&(g[y]=v);await window.UIEditor.initEditor(h,g)};return e.jsx("div",{className:"position-relative",children:e.jsxs("div",{className:`editor-container ${s}`,children:[o&&e.jsx("div",{className:"loading-overlay",children:e.jsx(u.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1"})}),e.jsx("div",{id:"externalSystemContainer"}),e.jsx("div",{id:"stripoEditorContainer",ref:I})]})})},Z=({label:t,register:s,validation:o,required:l=!1,name:r,error:n,className:i="",...d})=>e.jsxs(u.Form.Group,{className:i+" mb-1",children:[t?e.jsxs(u.Form.Label,{className:"mb-3 d-block form-label",children:[t,l&&e.jsx("label",{className:"text-danger",children:"*"})]}):null,e.jsx(u.Form.Control,{name:r,type:"text",...d,isInvalid:!!(n&&n[r]),...s?s(r,{...o}):{},className:`react-select__control ${n&&n[r]&&"border border-danger"}`}),n&&n[r]?e.jsx(u.Form.Control.Feedback,{type:"invalid",children:n[r].message}):null]}),ce=()=>{const t=q(),{enerexIdentifier:s,projectId:o}=C();return S.useQuery({queryKey:["getTemplatesList"],queryFn:async r=>await t.get(`${P.Template_list}${o}/${s}`)})};function z(t){return t.sort((s,o)=>s.name.localeCompare(o.name))}const pe=()=>{const t=q(),{enerexIdentifier:s,projectId:o}=C();return S.useMutation({mutationKey:["getTemplate"],mutationFn:async({id:r})=>{if(r)return await t.get(`${P.Template}${s}/${r}/${o}`)}})},me=()=>{const t=q(),{enerexIdentifier:s,projectId:o}=C();return S.useQuery({queryKey:["getTemplateTypes"],queryFn:async r=>await t.get(`${P.TemplateTypes}${s}/${o}`)})};function ue(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var V={exports:{}};/*!
357
+ `,Z=p.createContext(void 0),ie=({children:e,configs:s})=>{const[l,i]=p.useState(s.clientId),[r,t]=p.useState(s.apiKey),[o,d]=p.useState(s.enerexIdentifier),[u,E]=p.useState(s.projectId),N=h=>{t(h.apiKey),i(h.clientId),E(h.projectId),d(h.enerexIdentifier)};return n.jsx(Z.Provider,{value:{clientId:l,apiKey:r,setConfiguration:N,enerexIdentifier:o,projectId:u},children:e})},_=()=>{const e=p.useContext(Z);if(!e)throw new Error("widgetConfig must be used within a ConfigProvider");return e},Q=(e="",s)=>({get:async(r,t)=>{try{const o=await J.get(`${e}${r}`,t??s);if(o.status===200)return o.data}catch(o){throw o}},post:async(r,t,o)=>{try{const d=await J.post(`${e}${r}`,t,o??s);if(d.status===200)return d.data}catch(d){throw d}}}),$={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"},R=p.createContext({get:()=>{throw new Error("HttpClientContext.get not implemented")},post:()=>{throw new Error("HttpClientContext.post not implemented")}}),ae=({children:e})=>{const{clientId:s,apiKey:l}=_(),i={headers:{client_id:s,"x-api-key":l}},{get:r,post:t}=Q($.API_BASE_URL,i);return n.jsx(R.Provider,{value:{get:r,post:t},children:e})},de=({children:e})=>{const s=new S.QueryClient;return n.jsx(ae,{children:n.jsx(S.QueryClientProvider,{client:s,children:e})})},ce=e=>{const s=Array.from(new Set(e.map(i=>i.category))),l=[];return s.forEach(i=>{const r=e.filter(t=>t.category===i).map(t=>({label:t.label,value:t.value,hint:t.hint,hidden:t.hidden}));l.push({category:i,entries:r})}),l},q=()=>{const e=p.useContext(R);if(e)return e;throw new Error("useHttpClient must be used within a HttpClientProvider")},P={Template_list:"/Template/list/",Template:"/Template/GetTemplate/",MergeTags:"/Template/TemplateMergeTags/",ExcludeCategory:"/Template/GetExcludeCategories/",SaveTemplate:"/Template/save-update/",TemplateTypes:"/Template/TemplateTypes/"},pe=()=>{const e=q(),{enerexIdentifier:s,projectId:l}=_();return S.useQuery({queryKey:["getTemplateTags"],queryFn:async r=>await e.get(`${P.MergeTags}${l}/${s}`)})},ue=()=>{const e=q(),{enerexIdentifier:s,projectId:l}=_();return S.useQuery({queryKey:["getExcludeCategory"],queryFn:async r=>await e.get(`${P.ExcludeCategory}${l}/${s}`)})},G=Date.now().toString(36)+Math.random().toString(36).substr(2);console.log("uniqueId",G);const me=({templateHTML:e,className:s="",loading:l=!1})=>{const{post:i}=Q(),{data:r}=pe(),{data:t}=ue(),[o,d]=p.useState(e??{html:k,css:""}),u=p.useRef(null),E="https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png",N="https://plugins.stripo.email/api/v1/auth";p.useEffect(()=>{(async()=>(await h(),r&&t&&await I($.EDITOR_SCRIPT_URL)))()},[r,t]);async function h(){window.Zone||await new Promise((b,c)=>{const y=document.createElement("script");y.src="https://unpkg.com/zone.js@0.13.1/bundles/zone.umd.min.js";const w=document.querySelector("script[nonce]")?.nonce;w&&y.setAttribute("nonce",w),y.onload=()=>b(),y.onerror=()=>c(new Error("Failed to load zone.js")),document.head.appendChild(y)})}async function I(b){let c=document.getElementById("UiEditorScript");c||(c=document.createElement("script"),c.id="UiEditorScript",c.src=b,c.onload=async()=>{await j()},document.body.appendChild(c)),await new Promise(y=>c.addEventListener("load",()=>y(),{once:!0}))}const j=async()=>{const b=u.current;if(!b){console.error("Missing #stripoEditorContainer in DOM");return}if(!window.UIEditor||typeof window.UIEditor.initEditor!="function"){console.error("UIEditor script not loaded or not exposing initEditor");return}const c={html:o.html,css:o.css,modulesExcludedCategories:t??[],forceRecreate:!0,metadata:{emailId:G,userId:"1",avatarUrl:E},locale:"en",onTokenRefreshRequest:async y=>{const w={pluginId:$.EDITOR_PLUGIN_ID,secretKey:$.EDITOR_SECRET_KEY,userId:G,role:"user"},x=await i(N,w);x?.token&&y(x.token)},mergeTags:ce(r??[])};for(const[y,w]of Object.entries({codeEditorButtonSelector:"#codeEditor",undoButtonSelector:"#undoButton",redoButtonSelector:"#redoButton",mobileViewButtonSelector:"#mobileViewButton",desktopViewButtonSelector:"#desktopViewButton"}))b.ownerDocument&&b.getRootNode()instanceof ShadowRoot&&b.getRootNode().querySelector(w)&&(c[y]=w);await window.UIEditor.initEditor(b,c)};return n.jsx("div",{className:"position-relative",children:n.jsxs("div",{className:`editor-container ${s}`,children:[l&&n.jsx("div",{className:"loading-overlay",children:n.jsx(g.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1"})}),n.jsx("div",{id:"externalSystemContainer"}),n.jsx("div",{id:"stripoEditorContainer",ref:u})]})})},ee=({label:e,register:s,validation:l,required:i=!1,name:r,error:t,className:o="",...d})=>n.jsxs(g.Form.Group,{className:o+" mb-1",children:[e?n.jsxs(g.Form.Label,{className:"mb-3 d-block form-label",children:[e,i&&n.jsx("label",{className:"text-danger",children:"*"})]}):null,n.jsx(g.Form.Control,{name:r,type:"text",...d,isInvalid:!!(t&&t[r]),...s?s(r,{...l}):{},className:`react-select__control ${t&&t[r]&&"border border-danger"}`}),t&&t[r]?n.jsx(g.Form.Control.Feedback,{type:"invalid",children:t[r].message}):null]}),fe=()=>{const e=q(),{enerexIdentifier:s,projectId:l}=_();return S.useQuery({queryKey:["getTemplatesList"],queryFn:async r=>await e.get(`${P.Template_list}${l}/${s}`)})};function V(e){return e.sort((s,l)=>s.name.localeCompare(l.name))}function ge(e){const s=new Map,l=[];e.forEach(t=>s.set(t.id,t));let i=e.filter(t=>t.parent_id===0),r=0;for(;i.length>0;){l.push({level:r,data:i});const t=i.map(d=>d.id);i=e.filter(d=>t.includes(d.parent_id)),r++}return l}function K(e,s){const i=ge(e).find(r=>r.level===s);return i?i.data:[]}const ye=()=>{const e=q(),{enerexIdentifier:s,projectId:l}=_();return S.useMutation({mutationKey:["getTemplate"],mutationFn:async({id:r})=>{if(r)return await e.get(`${P.Template}${s}/${r}/${l}`)}})},he=()=>{const e=q(),{enerexIdentifier:s,projectId:l}=_();return S.useQuery({queryKey:["getTemplateTypes"],queryFn:async r=>await e.get(`${P.TemplateTypes}${s}/${l}`)})};function be(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var W={exports:{}};/*!
358
358
  Copyright (c) 2018 Jed Watson.
359
359
  Licensed under the MIT License (MIT), see
360
360
  http://jedwatson.github.io/classnames
361
- */var Q;function fe(){return Q||(Q=1,function(t){(function(){var s={}.hasOwnProperty;function o(){for(var n="",i=0;i<arguments.length;i++){var d=arguments[i];d&&(n=r(n,l(d)))}return n}function l(n){if(typeof n=="string"||typeof n=="number")return n;if(typeof n!="object")return"";if(Array.isArray(n))return o.apply(null,n);if(n.toString!==Object.prototype.toString&&!n.toString.toString().includes("[native code]"))return n.toString();var i="";for(var d in n)s.call(n,d)&&n[d]&&(i=r(i,d));return i}function r(n,i){return i?n?n+" "+i:n+i:n}t.exports?(o.default=o,t.exports=o):window.classNames=o})()}(V)),V.exports}var ge=fe();const R=ue(ge),ee=t=>t.data.isSeparator?e.jsx("div",{style:{padding:0,margin:"2px 0"},children:e.jsx("hr",{style:{border:0,borderTop:"1px solid #bdbdbdff",padding:0,margin:0}})}):e.jsx(H.components.Option,{...t}),ye=({name:t="",control:s,options:o,multiple:l=!1,placeholder:r,validation:n,labelKey:i="name",disabled:d,isInvalid:m,value:E,onChange:I,uncontrolled:b,menuPlacement:_="auto",closeOnSelect:A=!0})=>{const N={control:f=>({...f,minHeight:"33px",borderColor:m?"var(--bs-form-invalid-border-color) !important":"var(--ct-input-border-color)",backgroundImage:m?'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:m?"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:f=>({...f,marginTop:0,width:"max-content",minWidth:"100%"}),menuPortal:f=>({...f,zIndex:9999}),multiValueRemove:f=>({...f,display:d?"none":"block"})};return b?e.jsx(H,{components:{Option:ee},isOptionDisabled:f=>!!f.isSeparator,className:R({"is-invalid":m}),styles:N,classNamePrefix:"react-select",isMulti:l,options:o,onChange:I,placeholder:r,menuPortalTarget:document.body,value:E,getOptionLabel:typeof i=="string"?f=>f[i]:i,getOptionValue:f=>f.id,isDisabled:d,menuPlacement:_,closeMenuOnSelect:A}):e.jsx(B.Controller,{control:s,name:t,rules:n,render:({field:{onChange:f,value:h,onBlur:g}})=>e.jsx(H,{components:{Option:ee},isOptionDisabled:y=>!!y.isSeparator,className:R({"is-invalid":m}),styles:N,classNamePrefix:"react-select",isMulti:l,options:o,onBlur:g,onChange:f,placeholder:r,menuPortalTarget:document.body,value:h,getOptionLabel:typeof i=="string"?y=>y[i]:i,getOptionValue:y=>y.id,isDisabled:d,menuPlacement:_,closeMenuOnSelect:A},h?JSON.stringify(h):"reset")})},K=({label:t,name:s,validation:o,control:l,error:r,...n})=>e.jsxs(u.Form.Group,{className:"mb-1",children:[t&&e.jsxs(u.Form.Label,{className:"mb-3 d-block form-label",children:[t," ",n.required&&e.jsx("span",{className:"text-danger",children:"*"})]}),e.jsx(ye,{control:l,options:n.options??[],validation:o,isInvalid:r&&!!r[s],name:s}),r&&r[s]?e.jsx(u.Form.Control.Feedback,{type:"invalid",children:r[s].message}):null]}),he=()=>{const t=q();S.useQueryClient();const{enerexIdentifier:s,projectId:o}=C();return S.useMutation({mutationKey:["saveTemplate"],mutationFn:async r=>(r.enerexIdentifier=s??"",r.projectId=o??"",await t.post(`${P.SaveTemplate}`,r))})},G={id:"",name:"New (Blank)"},te={id:"",name:"Separator",isSeparator:!0},be=({onSelectItem:t,templateLoading:s,onReset:o})=>{const{register:l,handleSubmit:r,clearErrors:n,setValue:i,control:d,watch:m,reset:E,setError:I,formState:{errors:b}}=B.useForm({defaultValues:{templateName:"",subTemplateType:void 0,subject:"",templateType:void 0,template:G},mode:"onChange"}),{data:_,refetch:A,isLoading:N}=ce(),[f,h]=p.useState([]),[g,y]=p.useState(),[v,O]=p.useState(),{mutateAsync:Te,isPending:k}=pe(),{mutateAsync:ve,isPending:F}=he(),{data:M,isLoading:ne}=me(),[xe,Se]=p.useState([]),[j,U]=p.useState([]);p.useEffect(()=>{if(M){let a=M.filter(c=>c.id!=null).sort((c,x)=>c.name.localeCompare(x.name));Se(z(a.filter(c=>c.parent_id===0))),U(z(a.filter(c=>c.parent_id.toString()===`${m("templateType")?.id}`)))}},[M]);const Ce=(a,c)=>{let x=[];return a.forEach((T,D)=>{c.includes(D)&&D!==0&&x.push(te),x.push(T)}),x};p.useEffect(()=>{s(!!k)},[k]),p.useEffect(()=>{_?.sort((a,c)=>a.readonly!==c.readonly?(a.readonly?0:1)-(c.readonly?0:1):a.name.localeCompare(c.name)),h(_??[])},[_]);const Ee=async a=>{y(a),a&&!a.readonly?(i("templateName",a?.name),n()):(i("templateName",""),i("subject",""));const c=await Te({id:a?.id});O(c||void 0)};p.useEffect(()=>{if(i("template",G),m("templateType")){let a=M?.filter(c=>c.id!==void 0)??[];U(z(a.filter(c=>c.parent_id.toString()===`${m("templateType")?.id}`))),i("subTemplateType",void 0)}},[m("templateType")]),p.useEffect(()=>{let a=f.find(c=>c.id===m("template")?.id);Ee(a)},[m("template")]),p.useEffect(()=>{v&&g?(t(v),i("subject",v.subject??"")):t(void 0)},[v,g,t]);const Ie=()=>{let a=[G],c=f.filter(T=>(T.type?.toString()===m(j.length>0?"subTemplateType":"templateType")?.id.toString()||T.type===null)&&m(j.length>0?"subTemplateType":"templateType")?.id!=null),x=Ce(c,[c.findIndex(T=>!T.readonly)]);return x.length>0&&(a.push(te),a=[...a,...x.map(T=>({id:T.id,name:T.name,isSeparator:T.isSeparator}))]),a.length?a:[]},_e=a=>{window.StripoEditorApi.actionsApi.getTemplateData(async c=>{let x=a.template.id,T="";g?.readonly&&(x="",T=a.template.id);let D=f.find(qe=>qe.name===a.templateName.trim());if(D&&D.id!==x){I("templateName",{type:"validate",message:"Template name already exists. Please choose a different name."});return}let Ne=!!(j&&j.length>0);const je={enerexIdentifier:"",projectId:"",templateId:x,templateType:Ne?a.subTemplateType.id:a.templateType.id,name:a.templateName.trim(),html:c.html,css:c.css,subject:a.templateType.id==="2"?a?.subject??"":"",parent_id:T};await ve(je)&&(n(),E(),U([]),A())})};return e.jsx(u.Card,{className:"border border-0 text-start",children:e.jsx(u.Card.Body,{className:"pe-0 ps-2",children:e.jsx("form",{onSubmit:r(_e),children:e.jsx("div",{className:"template-list-container gap-3",children:e.jsxs(u.Row,{children:[e.jsx(u.Col,{children:e.jsx(K,{label:"Type",control:d,error:b,options:xe,required:!0,validation:{required:{value:!0,message:"Select a type"}},...l("templateType")})}),j&&j.length>0&&e.jsx(u.Col,{children:e.jsx(K,{label:"Sub Type",control:d,error:b,options:j,required:!0,validation:{required:{value:!0,message:"Select a type"}},...l("subTemplateType")})}),e.jsx(u.Col,{children:e.jsx(K,{label:"Template",control:d,error:b,options:Ie(),required:!1,...l("template")})}),e.jsx(u.Col,{children:e.jsx(Z,{label:"Name",register:l,error:b,required:!0,name:"templateName",validation:{required:{value:!0,message:"Enter a name"}}})}),m("templateType")?.id==="2"&&e.jsx(u.Col,{children:e.jsx(Z,{label:"Subject",register:l,error:b,required:!1,name:"subject"})}),e.jsxs(u.Col,{className:"d-flex align-items-end justify-content-end gap-2 mb-3",children:[e.jsx(u.Button,{style:{width:"70px"},variant:"primary",disabled:N||k||F||ne,onClick:()=>{y(void 0),E(),U([]),o()},children:k||F?e.jsx(u.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:e.jsx("span",{className:"visually-hidden",children:"Loading..."})}):"Clear"}),(m("templateType")?.id.toString()!=="2"||(m("templateType")?.id.toString()==="2"&&(g?.id??""))!=="")&&e.jsx(e.Fragment,{children:e.jsx(u.Button,{type:"submit",variant:"primary",style:{width:"80px"},disabled:N||k||F||ne,children:k||F?e.jsx(u.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:e.jsx("span",{className:"visually-hidden",children:"Loading..."})}):g?.readonly?"Save as":"Save"})})]})]})})})})})},we=({config:t})=>{const[s,o]=p.useState(),[l,r]=p.useState(!1),n=d=>{if(o(d),window.StripoEditorApi&&window.StripoEditorApi.actionsApi){let m=L;window.StripoEditorApi.actionsApi.updateHtmlAndCss(d?.html??m,d?.css??"","")}},i=()=>{r(!1),o(void 0),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(L,"","")};return e.jsx(re,{configs:t,children:e.jsx(oe,{children:e.jsxs("div",{className:"root-widget",children:[e.jsx(be,{templateLoading:r,onSelectItem:n,onReset:i}),e.jsx(de,{templateHTML:{css:s?.css??"",html:s?.html??L},loading:!1,className:"col-span-5"})]})})})};w.EditorWidget=we,Object.defineProperty(w,Symbol.toStringTag,{value:"Module"})});
361
+ */var te;function we(){return te||(te=1,function(e){(function(){var s={}.hasOwnProperty;function l(){for(var t="",o=0;o<arguments.length;o++){var d=arguments[o];d&&(t=r(t,i(d)))}return t}function i(t){if(typeof t=="string"||typeof t=="number")return t;if(typeof t!="object")return"";if(Array.isArray(t))return l.apply(null,t);if(t.toString!==Object.prototype.toString&&!t.toString.toString().includes("[native code]"))return t.toString();var o="";for(var d in t)s.call(t,d)&&t[d]&&(o=r(o,d));return o}function r(t,o){return o?t?t+" "+o:t+o:t}e.exports?(l.default=l,e.exports=l):window.classNames=l})()}(W)),W.exports}var Te=we();const ne=be(Te),re=e=>e.data.isSeparator?n.jsx("div",{style:{padding:0,margin:"2px 0"},children:n.jsx("hr",{style:{border:0,borderTop:"1px solid #bdbdbdff",padding:0,margin:0}})}):n.jsx(z.components.Option,{...e}),ve=({name:e="",control:s,options:l,multiple:i=!1,placeholder:r,validation:t,labelKey:o="name",disabled:d,isInvalid:u,value:E,onChange:N,uncontrolled:h,menuPlacement:I="auto",closeOnSelect:j=!0})=>{const b={control:c=>({...c,minHeight:"33px",borderColor:u?"var(--bs-form-invalid-border-color) !important":"var(--ct-input-border-color)",backgroundImage:u?'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:u?"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:c=>({...c,marginTop:0,width:"max-content",minWidth:"100%"}),menuPortal:c=>({...c,zIndex:9999}),multiValueRemove:c=>({...c,display:d?"none":"block"})};return h?n.jsx(z,{components:{Option:re},isOptionDisabled:c=>!!c.isSeparator,className:ne({"is-invalid":u}),styles:b,classNamePrefix:"react-select",isMulti:i,options:l,onChange:N,placeholder:r,menuPortalTarget:document.body,value:E,getOptionLabel:typeof o=="string"?c=>c[o]:o,getOptionValue:c=>c.id,isDisabled:d,menuPlacement:I,closeMenuOnSelect:j}):n.jsx(X.Controller,{control:s,name:e,rules:t,render:({field:{onChange:c,value:y,onBlur:w}})=>n.jsx(z,{components:{Option:re},isOptionDisabled:x=>!!x.isSeparator,className:ne({"is-invalid":u}),styles:b,classNamePrefix:"react-select",isMulti:i,options:l,onBlur:w,onChange:c,placeholder:r,menuPortalTarget:document.body,value:y,getOptionLabel:typeof o=="string"?x=>x[o]:o,getOptionValue:x=>x.id,isDisabled:d,menuPlacement:I,closeMenuOnSelect:j},y?JSON.stringify(y):"reset")})},M=({label:e,name:s,validation:l,control:i,error:r,...t})=>n.jsxs(g.Form.Group,{className:"mb-1",children:[e&&n.jsxs(g.Form.Label,{className:"mb-3 d-block form-label",children:[e," ",t.required&&n.jsx("span",{className:"text-danger",children:"*"})]}),n.jsx(ve,{control:i,options:t.options??[],validation:l,isInvalid:r&&!!r[s],name:s}),r&&r[s]?n.jsx(g.Form.Control.Feedback,{type:"invalid",children:r[s].message}):null]}),xe=()=>{const e=q();S.useQueryClient();const{enerexIdentifier:s,projectId:l}=_();return S.useMutation({mutationKey:["saveTemplate"],mutationFn:async r=>(r.enerexIdentifier=s??"",r.projectId=l??"",await e.post(`${P.SaveTemplate}`,r))})},F={id:"",name:"New (Blank)"},se={id:"",name:"Separator",isSeparator:!0},Se=({onSelectItem:e,templateLoading:s,onReset:l})=>{const{register:i,handleSubmit:r,clearErrors:t,setValue:o,control:d,watch:u,reset:E,setError:N,formState:{errors:h}}=X.useForm({defaultValues:{templateName:"",subTemplateType:void 0,subTemplateType2:void 0,subject:"",templateType:void 0,template:F},mode:"onChange"}),{data:I,refetch:j,isLoading:b}=fe(),[c,y]=p.useState([]),[w,x]=p.useState(),[U,le]=p.useState(),{mutateAsync:Ee,isPending:A}=ye(),{mutateAsync:Ie,isPending:H}=xe(),{data:D,isLoading:oe}=he(),[_e,Ne]=p.useState([]),[O,B]=p.useState([]),[L,qe]=p.useState([]);p.useEffect(()=>{if(D){let a=D.filter(f=>f.id!=null),m=K(a,0);Ne(V(m))}},[D]);const Pe=(a,m)=>{let f=[];return a.forEach((C,T)=>{m.includes(T)&&T!==0&&f.push(se),f.push(C)}),f};p.useEffect(()=>{s(!!A)},[A]),p.useEffect(()=>{I?.sort((a,m)=>a.readonly!==m.readonly?(a.readonly?0:1)-(m.readonly?0:1):a.name.localeCompare(m.name)),y(I??[])},[I]);const je=async a=>{x(a),a&&!a.readonly?(o("templateName",a?.name),t()):(o("templateName",""),o("subject",""));const m=await Ee({id:a?.id});le(m||void 0)};p.useEffect(()=>{if(o("template",F),u("templateType")){let a=D?.filter(f=>f.id!==void 0)??[],m=K(a,1);B(V(m.filter(f=>f.parent_id.toString()===`${u("templateType")?.id}`))),o("subTemplateType",void 0)}},[u("templateType")]),p.useEffect(()=>{if(o("template",F),u("subTemplateType")){let a=D?.filter(f=>f.id!==void 0)??[],m=K(a,2);qe(V(m.filter(f=>f.parent_id.toString()===`${u("subTemplateType")?.id}`))),o("subTemplateType2",void 0)}},[u("subTemplateType")]),p.useEffect(()=>{let a=c.find(m=>m.id===u("template")?.id);je(a)},[u("template")]),p.useEffect(()=>{U&&w?(e(U),o("subject",U.subject??"")):e(void 0)},[U,w,e]);const Ae=()=>{let a=[F],m="templateType";L.length>0?m="subTemplateType2":O.length>0&&(m="subTemplateType");let f=c.filter(T=>(T.type?.toString()===u(m)?.id.toString()||T.type===null)&&u(m)?.id!=null),C=Pe(f,[f.findIndex(T=>!T.readonly)]);return C.length>0&&(a.push(se),a=[...a,...C.map(T=>({id:T.id,name:Oe(f,T.id),isSeparator:T.isSeparator}))]),a.length?a:[]},Oe=(a,m)=>{let f=a.find(C=>C.id===m);return f?`${f.readonly?"Default - ":"Custom - "} ${f.name}`:""},Le=a=>{window.StripoEditorApi.actionsApi.getTemplateData(async m=>{let f=a.template.id,C="";w?.readonly&&(f="",C=a.template.id);let T=c.find(ke=>ke.name===a.templateName.trim());if(T&&T.id!==f){N("templateName",{type:"validate",message:"Template name already exists. Please choose a different name."});return}let Y=a.templateType.id;L&&L.length>0?Y=a.subTemplateType2.id:O&&O.length>0&&(Y=a.subTemplateType.id);const De={enerexIdentifier:"",projectId:"",templateId:f,templateType:Y,name:a.templateName.trim(),html:m.html,css:m.css,subject:a.templateType.id==="2"?a?.subject??"":"",parent_id:C};await Ie(De)&&(t(),E(),B([]),j())})};return n.jsx(g.Card,{className:"border border-0 text-start",children:n.jsx(g.Card.Body,{className:"pe-0 ps-2",children:n.jsx("form",{onSubmit:r(Le),children:n.jsx("div",{className:"template-list-container gap-3",children:n.jsxs(g.Row,{children:[n.jsx(g.Col,{children:n.jsx(M,{label:"Category",control:d,error:h,options:_e,required:!0,validation:{required:{value:!0,message:"Select a category"}},...i("templateType")})}),O&&O.length>0&&n.jsx(g.Col,{children:n.jsx(M,{label:"Type",control:d,error:h,options:O,required:!0,validation:{required:{value:!0,message:"Select a type"}},...i("subTemplateType")})}),L&&L.length>0&&n.jsx(g.Col,{children:n.jsx(M,{label:"Sub Type",control:d,error:h,options:L,required:!0,validation:{required:{value:!0,message:"Select a subtype"}},...i("subTemplateType2")})}),n.jsx(g.Col,{children:n.jsx(M,{label:"Template",control:d,error:h,options:Ae(),required:!1,...i("template")})}),n.jsx(g.Col,{children:n.jsx(ee,{label:"Name",register:i,error:h,required:!0,name:"templateName",validation:{required:{value:!0,message:"Enter a name"}}})}),u("templateType")?.id==="2"&&n.jsx(g.Col,{children:n.jsx(ee,{label:"Subject",register:i,error:h,required:!1,name:"subject"})}),n.jsxs(g.Col,{className:"d-flex align-items-end justify-content-end gap-2 mb-3",children:[n.jsx(g.Button,{style:{width:"70px"},variant:"primary",disabled:b||A||H||oe,onClick:()=>{x(void 0),E(),B([]),l()},children:A||H?n.jsx(g.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:n.jsx("span",{className:"visually-hidden",children:"Loading..."})}):"Clear"}),(u("templateType")?.id.toString()!=="2"||(u("templateType")?.id.toString()==="2"&&(w?.id??""))!=="")&&n.jsx(n.Fragment,{children:n.jsx(g.Button,{type:"submit",variant:"primary",style:{width:"80px"},disabled:b||A||H||oe,children:A||H?n.jsx(g.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:n.jsx("span",{className:"visually-hidden",children:"Loading..."})}):w?.readonly?"Save as":"Save"})})]})]})})})})})},Ce=({config:e})=>{const[s,l]=p.useState(),[i,r]=p.useState(!1),t=d=>{if(l(d),window.StripoEditorApi&&window.StripoEditorApi.actionsApi){let u=k;window.StripoEditorApi.actionsApi.updateHtmlAndCss(d?.html??u,d?.css??"","")}},o=()=>{r(!1),l(void 0),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(k,"","")};return n.jsx(ie,{configs:e,children:n.jsx(de,{children:n.jsxs("div",{className:"root-widget",children:[n.jsx(Se,{templateLoading:r,onSelectItem:t,onReset:o}),n.jsx(me,{templateHTML:{css:s?.css??"",html:s?.html??k},loading:!1,className:"col-span-5"})]})})})};v.EditorWidget=Ce,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})});
@@ -2,3 +2,8 @@ import type { ITemplateTypes } from "../queries/types";
2
2
  export declare const generateFileName: (originalName: string, existingNames?: string[]) => string;
3
3
  export declare function toReactSelectMixed(data: ITemplateTypes[]): any[];
4
4
  export declare function sortingTemplateTypeByName(list: ITemplateTypes[]): ITemplateTypes[];
5
+ export declare function groupBy(array: any[]): {
6
+ level: number;
7
+ data: any[];
8
+ }[];
9
+ export declare function groupByLevel(array: any[], level: number): any[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@enerex/template-studio",
3
- "version": "1.1.30",
3
+ "version": "1.1.32",
4
4
  "main": "./dist/enerex-template-editor.umd.js",
5
5
  "module": "./dist/enerex-template-editor.es.js",
6
6
  "types": "./dist/types/index.d.ts",