@enerex/template-studio 1.1.23 → 1.1.25

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.
Files changed (6) hide show
  1. package/dist/enerex-template-editor.es.js +291 -289
  2. package/dist/enerex-template-editor.umd.js +3 -3
  3. package/dist/types/component/form-input/select.d.ts +4 -1
  4. package/dist/types/queries/types.d.ts +1 -0
  5. package/dist/types/utils/utility.d.ts +2 -0
  6. package/package.json +1 -1
package/dist/enerex-template-editor.es.js CHANGED
@@ -1,11 +1,11 @@
1
- import { jsx as s, jsxs as T } from "react/jsx-runtime";
2
- import I, { useContext as Z, useState as S, useEffect as _ } from "react";
3
- import { QueryClient as ce, QueryClientProvider as pe, useQuery as O, useMutation as ee, useQueryClient as me } from "@tanstack/react-query";
1
+ import { jsx as a, jsxs as v } from "react/jsx-runtime";
2
+ import I, { useContext as J, useState as E, useEffect as C } from "react";
3
+ import { QueryClient as ce, QueryClientProvider as pe, useQuery as q, useMutation as Z, useQueryClient as me } from "@tanstack/react-query";
4
4
  import V from "axios";
5
- import { Spinner as U, Form as E, Card as K, Row as ue, Col as $, Button as z } from "react-bootstrap";
6
- import { Controller as ge, useForm as fe } from "react-hook-form";
5
+ import { Spinner as B, Form as S, Card as K, Row as ue, Col as P, Button as z } from "react-bootstrap";
6
+ import { Controller as fe, useForm as ge } from "react-hook-form";
7
7
  import G from "react-select";
8
- const D = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
8
+ const L = `<!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,173 +361,173 @@ const D = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
361
361
  </div>\r
362
362
  </body>\r
363
363
  </html>\r
364
- `, te = I.createContext(
364
+ `, ee = I.createContext(
365
365
  void 0
366
366
  ), ye = ({
367
- children: t,
367
+ children: n,
368
368
  configs: r
369
369
  }) => {
370
- const [i, l] = I.useState(r.clientId), [n, e] = I.useState(r.apiKey), [a, o] = I.useState(
370
+ const [s, l] = I.useState(r.clientId), [e, t] = I.useState(r.apiKey), [i, o] = I.useState(
371
371
  r.enerexIdentifier
372
- ), [p, y] = I.useState(r.userName), [f, h] = I.useState(r.projectId), b = (m) => {
373
- e(m.apiKey), l(m.clientId), h(m.projectId), o(m.enerexIdentifier), y(m.userName);
372
+ ), [c, y] = I.useState(r.userName), [g, h] = I.useState(r.projectId), b = (m) => {
373
+ t(m.apiKey), l(m.clientId), h(m.projectId), o(m.enerexIdentifier), y(m.userName);
374
374
  };
375
- return /* @__PURE__ */ s(
376
- te.Provider,
375
+ return /* @__PURE__ */ a(
376
+ ee.Provider,
377
377
  {
378
378
  value: {
379
- clientId: i,
380
- apiKey: n,
379
+ clientId: s,
380
+ apiKey: e,
381
381
  setConfiguration: b,
382
- enerexIdentifier: a,
383
- projectId: f,
384
- userName: p
382
+ enerexIdentifier: i,
383
+ projectId: g,
384
+ userName: c
385
385
  },
386
- children: t
386
+ children: n
387
387
  }
388
388
  );
389
- }, v = () => {
390
- const t = Z(te);
391
- if (!t)
389
+ }, T = () => {
390
+ const n = J(ee);
391
+ if (!n)
392
392
  throw new Error("widgetConfig must be used within a ConfigProvider");
393
- return t;
394
- }, ne = (t = "", r) => ({ get: async (n, e) => {
393
+ return n;
394
+ }, te = (n = "", r) => ({ get: async (e, t) => {
395
395
  try {
396
- const a = await V.get(
397
- `${t}${n}`,
398
- e ?? r
396
+ const i = await V.get(
397
+ `${n}${e}`,
398
+ t ?? r
399
399
  );
400
- if (a.status === 200)
401
- return a.data;
402
- } catch (a) {
403
- throw a;
400
+ if (i.status === 200)
401
+ return i.data;
402
+ } catch (i) {
403
+ throw i;
404
404
  }
405
- }, post: async (n, e, a) => {
405
+ }, post: async (e, t, i) => {
406
406
  try {
407
407
  const o = await V.post(
408
- `${t}${n}`,
409
- e,
410
- a ?? r
408
+ `${n}${e}`,
409
+ t,
410
+ i ?? r
411
411
  );
412
412
  if (o.status === 200)
413
413
  return o.data;
414
414
  } catch (o) {
415
415
  throw o;
416
416
  }
417
- } }), k = {
417
+ } }), $ = {
418
418
  EDITOR_SCRIPT_URL: "https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js",
419
419
  EDITOR_PLUGIN_ID: "1afdc3161ec7409a8627a1c8561d45f5",
420
420
  EDITOR_SECRET_KEY: "54ba748ed7e94f2e929555783acb03da",
421
421
  API_BASE_URL: "https://dev-socket.enerex.com/common/api"
422
422
  //API_BASE_URL: "https://localhost:44338/api",
423
423
  // more env variables...
424
- }, re = I.createContext({
424
+ }, ne = I.createContext({
425
425
  get: () => {
426
426
  throw new Error("HttpClientContext.get not implemented");
427
427
  },
428
428
  post: () => {
429
429
  throw new Error("HttpClientContext.post not implemented");
430
430
  }
431
- }), he = ({ children: t }) => {
432
- const { clientId: r, apiKey: i } = v(), l = {
431
+ }), he = ({ children: n }) => {
432
+ const { clientId: r, apiKey: s } = T(), l = {
433
433
  headers: {
434
434
  client_id: r,
435
- "x-api-key": i
435
+ "x-api-key": s
436
436
  }
437
- }, { get: n, post: e } = ne(k.API_BASE_URL, l);
438
- return /* @__PURE__ */ s(re.Provider, { value: { get: n, post: e }, children: t });
439
- }, be = ({ children: t }) => {
437
+ }, { get: e, post: t } = te($.API_BASE_URL, l);
438
+ return /* @__PURE__ */ a(ne.Provider, { value: { get: e, post: t }, children: n });
439
+ }, be = ({ children: n }) => {
440
440
  const r = new ce();
441
- return /* @__PURE__ */ s(he, { children: /* @__PURE__ */ s(pe, { client: r, children: t }) });
442
- }, we = (t) => {
443
- const r = Array.from(new Set(t.map((l) => l.category))), i = [];
441
+ return /* @__PURE__ */ a(he, { children: /* @__PURE__ */ a(pe, { client: r, children: n }) });
442
+ }, we = (n) => {
443
+ const r = Array.from(new Set(n.map((l) => l.category))), s = [];
444
444
  return r.forEach((l) => {
445
- const n = t.filter((e) => e.category === l).map((e) => ({
446
- label: e.label,
447
- value: e.value,
448
- hint: e.hint,
449
- hidden: e.hidden
445
+ const e = n.filter((t) => t.category === l).map((t) => ({
446
+ label: t.label,
447
+ value: t.value,
448
+ hint: t.hint,
449
+ hidden: t.hidden
450
450
  }));
451
- i.push({ category: l, entries: n });
452
- }), i;
453
- }, A = () => {
454
- const t = Z(re);
455
- if (t)
456
- return t;
451
+ s.push({ category: l, entries: e });
452
+ }), s;
453
+ }, N = () => {
454
+ const n = J(ne);
455
+ if (n)
456
+ return n;
457
457
  throw new Error("useHttpClient must be used within a HttpClientProvider");
458
- }, P = {
458
+ }, A = {
459
459
  Template_list: "/Template/list/",
460
460
  Template: "/Template/GetTemplate/",
461
461
  MergeTags: "/Template/TemplateMergeTags/",
462
462
  ExcludeCategory: "/Template/GetExcludeCategories/",
463
463
  SaveTemplate: "/Template/save-update/",
464
464
  TemplateTypes: "/Template/TemplateTypes/"
465
- }, Te = () => {
466
- const t = A(), { enerexIdentifier: r, projectId: i } = v();
467
- return O({
465
+ }, ve = () => {
466
+ const n = N(), { enerexIdentifier: r, projectId: s } = T();
467
+ return q({
468
468
  queryKey: ["getTemplateTags"],
469
- queryFn: async (n) => await t.get(
470
- `${P.MergeTags}${i}/${r}`
469
+ queryFn: async (e) => await n.get(
470
+ `${A.MergeTags}${s}/${r}`
471
471
  )
472
472
  });
473
- }, ve = () => {
474
- const t = A(), { enerexIdentifier: r, projectId: i } = v();
475
- return O({
473
+ }, Te = () => {
474
+ const n = N(), { enerexIdentifier: r, projectId: s } = T();
475
+ return q({
476
476
  queryKey: ["getExcludeCategory"],
477
- queryFn: async (n) => await t.get(
478
- `${P.ExcludeCategory}${i}/${r}`
477
+ queryFn: async (e) => await n.get(
478
+ `${A.ExcludeCategory}${s}/${r}`
479
479
  )
480
480
  });
481
481
  }, xe = ({
482
- templateHTML: t,
482
+ templateHTML: n,
483
483
  className: r = "",
484
- loading: i = !1
484
+ loading: s = !1
485
485
  }) => {
486
- const { post: l } = ne(), { data: n } = Te(), { data: e } = ve(), [a, o] = S(
487
- t ?? { html: D, css: "" }
488
- ), { enerexIdentifier: p, projectId: y, userName: f } = v(), h = "https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png", b = "https://plugins.stripo.email/api/v1/auth";
489
- _(() => {
490
- if (n && e && !document.getElementById("UiEditorScript")) {
486
+ const { post: l } = te(), { data: e } = ve(), { data: t } = Te(), [i, o] = E(
487
+ n ?? { html: L, css: "" }
488
+ ), { enerexIdentifier: c, projectId: y, userName: g } = T(), h = "https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png", b = "https://plugins.stripo.email/api/v1/auth";
489
+ C(() => {
490
+ if (e && t && !document.getElementById("UiEditorScript")) {
491
491
  const u = document.createElement("script");
492
- u.id = "UiEditorScript", u.type = "module", u.src = k.EDITOR_SCRIPT_URL, u.onload = m, document.body.appendChild(u);
492
+ u.id = "UiEditorScript", u.type = "module", u.src = $.EDITOR_SCRIPT_URL, u.onload = m, document.body.appendChild(u);
493
493
  }
494
- }, [n, e]);
494
+ }, [e, t]);
495
495
  const m = async () => {
496
496
  window.UIEditor.initEditor(
497
497
  document.querySelector("#stripoEditorContainer"),
498
498
  {
499
- html: a.html,
500
- css: a.css,
501
- modulesExcludedCategories: e ?? [],
499
+ html: i.html,
500
+ css: i.css,
501
+ modulesExcludedCategories: t ?? [],
502
502
  forceRecreate: !0,
503
503
  metadata: {
504
- emailId: `${y}_${p}`,
504
+ emailId: `${y}_${c}`,
505
505
  userId: "1",
506
- username: f,
506
+ username: g,
507
507
  avatarUrl: h
508
508
  },
509
509
  locale: "en",
510
510
  onTokenRefreshRequest: async function(u) {
511
- const c = {
512
- pluginId: k.EDITOR_PLUGIN_ID,
513
- secretKey: k.EDITOR_SECRET_KEY,
511
+ const p = {
512
+ pluginId: $.EDITOR_PLUGIN_ID,
513
+ secretKey: $.EDITOR_SECRET_KEY,
514
514
  userId: "12",
515
515
  role: "user"
516
- }, g = await l(b, c);
517
- g && u(g.token);
516
+ }, f = await l(b, p);
517
+ f && u(f.token);
518
518
  },
519
519
  codeEditorButtonSelector: "#codeEditor",
520
520
  undoButtonSelector: "#undoButton",
521
521
  redoButtonSelector: "#redoButton",
522
522
  mobileViewButtonSelector: "#mobileViewButton",
523
523
  desktopViewButtonSelector: "#desktopViewButton",
524
- mergeTags: we(n ?? [])
524
+ mergeTags: we(e ?? [])
525
525
  }
526
526
  );
527
527
  };
528
- return /* @__PURE__ */ s("div", { className: "position-relative", children: /* @__PURE__ */ T("div", { className: `editor-container ${r}`, children: [
529
- i && /* @__PURE__ */ s("div", { className: "loading-overlay", children: /* @__PURE__ */ s(
530
- U,
528
+ return /* @__PURE__ */ a("div", { className: "position-relative", children: /* @__PURE__ */ v("div", { className: `editor-container ${r}`, children: [
529
+ s && /* @__PURE__ */ a("div", { className: "loading-overlay", children: /* @__PURE__ */ a(
530
+ B,
531
531
  {
532
532
  animation: "border",
533
533
  style: { width: "11px", height: "11px" },
@@ -536,69 +536,81 @@ const D = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:
536
536
  className: "me-1"
537
537
  }
538
538
  ) }),
539
- /* @__PURE__ */ s("div", { id: "externalSystemContainer" }),
540
- /* @__PURE__ */ s("div", { id: "stripoEditorContainer" })
539
+ /* @__PURE__ */ a("div", { id: "externalSystemContainer" }),
540
+ /* @__PURE__ */ a("div", { id: "stripoEditorContainer" })
541
541
  ] }) });
542
542
  }, Q = ({
543
- label: t,
543
+ label: n,
544
544
  register: r,
545
- validation: i,
545
+ validation: s,
546
546
  required: l = !1,
547
- name: n,
548
- error: e,
549
- className: a = "",
547
+ name: e,
548
+ error: t,
549
+ className: i = "",
550
550
  ...o
551
- }) => /* @__PURE__ */ T(E.Group, { className: a + " mb-1", children: [
552
- t ? /* @__PURE__ */ T(E.Label, { className: "mb-3 d-block form-label", children: [
553
- t,
554
- l && /* @__PURE__ */ s("label", { className: "text-danger", children: "*" })
551
+ }) => /* @__PURE__ */ v(S.Group, { className: i + " mb-1", children: [
552
+ n ? /* @__PURE__ */ v(S.Label, { className: "mb-3 d-block form-label", children: [
553
+ n,
554
+ l && /* @__PURE__ */ a("label", { className: "text-danger", children: "*" })
555
555
  ] }) : null,
556
- /* @__PURE__ */ s(
557
- E.Control,
556
+ /* @__PURE__ */ a(
557
+ S.Control,
558
558
  {
559
- name: n,
559
+ name: e,
560
560
  type: "text",
561
561
  ...o,
562
- isInvalid: !!(e && e[n]),
563
- ...r ? r(n, {
564
- ...i
562
+ isInvalid: !!(t && t[e]),
563
+ ...r ? r(e, {
564
+ ...s
565
565
  }) : {},
566
- className: `react-select__control ${e && e[n] && "border border-danger"}`
566
+ className: `react-select__control ${t && t[e] && "border border-danger"}`
567
567
  }
568
568
  ),
569
- e && e[n] ? /* @__PURE__ */ s(E.Control.Feedback, { type: "invalid", children: e[n].message }) : null
569
+ t && t[e] ? /* @__PURE__ */ a(S.Control.Feedback, { type: "invalid", children: t[e].message }) : null
570
570
  ] }), Ce = () => {
571
- const t = A(), { enerexIdentifier: r, projectId: i } = v();
572
- return O({
571
+ const n = N(), { enerexIdentifier: r, projectId: s } = T();
572
+ return q({
573
573
  queryKey: ["getTemplatesList"],
574
- queryFn: async (n) => await t.get(
575
- `${P.Template_list}${i}/${r}`
574
+ queryFn: async (e) => await n.get(
575
+ `${A.Template_list}${s}/${r}`
576
576
  )
577
577
  });
578
- }, Ie = () => {
579
- const t = A(), { enerexIdentifier: r, projectId: i } = v();
580
- return ee({
578
+ };
579
+ function Ie(n) {
580
+ let r = [], s = n.filter((e) => e.id != null), l = [];
581
+ return s.forEach((e) => {
582
+ e.parent_id !== 0 && !l.includes(e.parent_id) && l.push(e.parent_id);
583
+ }), l.forEach((e) => {
584
+ let t = s.filter((o) => o.parent_id === e).map((o) => ({ name: o.name, id: o.id })), i = s.find((o) => o.id === e)?.name;
585
+ i && r.push({ label: i, options: t });
586
+ }), s.forEach((e) => {
587
+ e.parent_id === 0 && !l.includes(e.id) && r.push({ name: e.name, id: e.id });
588
+ }), r;
589
+ }
590
+ const Ee = () => {
591
+ const n = N(), { enerexIdentifier: r, projectId: s } = T();
592
+ return Z({
581
593
  mutationKey: ["getTemplate"],
582
- mutationFn: async ({ id: n }) => {
583
- if (n)
584
- return await t.get(
585
- `${P.Template}${r}/${n}/${i}`
594
+ mutationFn: async ({ id: e }) => {
595
+ if (e)
596
+ return await n.get(
597
+ `${A.Template}${r}/${e}/${s}`
586
598
  );
587
599
  }
588
600
  });
589
601
  }, Se = () => {
590
- const t = A(), { enerexIdentifier: r, projectId: i } = v();
591
- return O({
602
+ const n = N(), { enerexIdentifier: r, projectId: s } = T();
603
+ return q({
592
604
  queryKey: ["getTemplateTypes"],
593
- queryFn: async (n) => await t.get(
594
- `${P.TemplateTypes}${r}/${i}`
605
+ queryFn: async (e) => await n.get(
606
+ `${A.TemplateTypes}${r}/${s}`
595
607
  )
596
608
  });
597
609
  };
598
- function Ee(t) {
599
- return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
610
+ function _e(n) {
611
+ return n && n.__esModule && Object.prototype.hasOwnProperty.call(n, "default") ? n.default : n;
600
612
  }
601
- var B = { exports: {} };
613
+ var k = { exports: {} };
602
614
  /*!
603
615
  Copyright (c) 2018 Jed Watson.
604
616
  Licensed under the MIT License (MIT), see
@@ -606,66 +618,66 @@ var B = { exports: {} };
606
618
  */
607
619
  var W;
608
620
  function Ne() {
609
- return W || (W = 1, function(t) {
621
+ return W || (W = 1, function(n) {
610
622
  (function() {
611
623
  var r = {}.hasOwnProperty;
612
- function i() {
613
- for (var e = "", a = 0; a < arguments.length; a++) {
614
- var o = arguments[a];
615
- o && (e = n(e, l(o)));
624
+ function s() {
625
+ for (var t = "", i = 0; i < arguments.length; i++) {
626
+ var o = arguments[i];
627
+ o && (t = e(t, l(o)));
616
628
  }
617
- return e;
629
+ return t;
618
630
  }
619
- function l(e) {
620
- if (typeof e == "string" || typeof e == "number")
621
- return e;
622
- if (typeof e != "object")
631
+ function l(t) {
632
+ if (typeof t == "string" || typeof t == "number")
633
+ return t;
634
+ if (typeof t != "object")
623
635
  return "";
624
- if (Array.isArray(e))
625
- return i.apply(null, e);
626
- if (e.toString !== Object.prototype.toString && !e.toString.toString().includes("[native code]"))
627
- return e.toString();
628
- var a = "";
629
- for (var o in e)
630
- r.call(e, o) && e[o] && (a = n(a, o));
631
- return a;
636
+ if (Array.isArray(t))
637
+ return s.apply(null, t);
638
+ if (t.toString !== Object.prototype.toString && !t.toString.toString().includes("[native code]"))
639
+ return t.toString();
640
+ var i = "";
641
+ for (var o in t)
642
+ r.call(t, o) && t[o] && (i = e(i, o));
643
+ return i;
632
644
  }
633
- function n(e, a) {
634
- return a ? e ? e + " " + a : e + a : e;
645
+ function e(t, i) {
646
+ return i ? t ? t + " " + i : t + i : t;
635
647
  }
636
- t.exports ? (i.default = i, t.exports = i) : window.classNames = i;
648
+ n.exports ? (s.default = s, n.exports = s) : window.classNames = s;
637
649
  })();
638
- }(B)), B.exports;
650
+ }(k)), k.exports;
639
651
  }
640
- var _e = Ne();
641
- const Y = /* @__PURE__ */ Ee(_e), Ae = ({
642
- name: t = "",
652
+ var Ae = Ne();
653
+ const Y = /* @__PURE__ */ _e(Ae), Pe = ({
654
+ name: n = "",
643
655
  control: r,
644
- options: i,
656
+ options: s,
645
657
  multiple: l = !1,
646
- placeholder: n,
647
- validation: e,
648
- labelKey: a = "name",
658
+ placeholder: e,
659
+ validation: t,
660
+ labelKey: i = "name",
649
661
  disabled: o,
650
- isInvalid: p,
662
+ isInvalid: c,
651
663
  value: y,
652
- onChange: f,
664
+ onChange: g,
653
665
  uncontrolled: h,
654
666
  menuPlacement: b = "auto",
655
667
  closeOnSelect: m = !0
656
668
  }) => {
657
669
  const u = {
658
- control: (c) => ({
659
- ...c,
670
+ control: (p) => ({
671
+ ...p,
660
672
  minHeight: "33px",
661
673
  // state.isFocused can display different borderColor if you need it
662
- borderColor: p ? "var(--bs-form-invalid-border-color) !important" : "var(--ct-input-border-color)",
663
- backgroundImage: p ? '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",
674
+ borderColor: c ? "var(--bs-form-invalid-border-color) !important" : "var(--ct-input-border-color)",
675
+ backgroundImage: c ? '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",
664
676
  backgroundRepeat: "no-repeat",
665
677
  backgroundPosition: "right calc(0.375em + 0.225rem) center",
666
678
  backgroundSize: "calc(0.75em + 0.45rem) calc(0.75em + 0.45rem)",
667
679
  "&:hover": {
668
- borderColor: p ? "var(--bs-form-invalid-border-color)" : "var(--ct-input-border-color)"
680
+ borderColor: c ? "var(--bs-form-invalid-border-color)" : "var(--ct-input-border-color)"
669
681
  },
670
682
  "& .react-select__single-value": {
671
683
  color: "var(--ct-input-color) !important"
@@ -677,192 +689,182 @@ const Y = /* @__PURE__ */ Ee(_e), Ae = ({
677
689
  display: "none"
678
690
  }
679
691
  }),
680
- menu: (c) => ({
681
- ...c,
692
+ menu: (p) => ({
693
+ ...p,
682
694
  marginTop: 0,
683
695
  width: "max-content",
684
696
  minWidth: "100%"
685
697
  }),
686
- menuPortal: (c) => ({
687
- ...c,
698
+ menuPortal: (p) => ({
699
+ ...p,
688
700
  zIndex: 9999
689
701
  }),
690
- multiValueRemove: (c) => ({
691
- ...c,
702
+ multiValueRemove: (p) => ({
703
+ ...p,
692
704
  display: o ? "none" : "block"
693
705
  })
694
706
  };
695
- return h ? /* @__PURE__ */ s(
707
+ return h ? /* @__PURE__ */ a(
696
708
  G,
697
709
  {
698
710
  className: Y({
699
- "is-invalid": p
711
+ "is-invalid": c
700
712
  }),
701
713
  styles: u,
702
714
  classNamePrefix: "react-select",
703
715
  isMulti: l,
704
- options: i,
705
- onChange: f,
706
- placeholder: n,
716
+ options: s,
717
+ onChange: g,
718
+ placeholder: e,
707
719
  menuPortalTarget: document.body,
708
720
  value: y,
709
- getOptionLabel: typeof a == "string" ? (c) => c[a] : a,
710
- getOptionValue: (c) => c.id,
721
+ getOptionLabel: typeof i == "string" ? (p) => p[i] : i,
722
+ getOptionValue: (p) => p.id,
711
723
  isDisabled: o,
712
724
  menuPlacement: b,
713
725
  closeMenuOnSelect: m
714
726
  }
715
- ) : /* @__PURE__ */ s(
716
- ge,
727
+ ) : /* @__PURE__ */ a(
728
+ fe,
717
729
  {
718
730
  control: r,
719
- name: t,
720
- rules: e,
721
- render: ({ field: { onChange: c, value: g, onBlur: L } }) => /* @__PURE__ */ s(
731
+ name: n,
732
+ rules: t,
733
+ render: ({ field: { onChange: p, value: f, onBlur: j } }) => /* @__PURE__ */ a(
722
734
  G,
723
735
  {
724
736
  className: Y({
725
- "is-invalid": p
737
+ "is-invalid": c
726
738
  }),
727
739
  styles: u,
728
740
  classNamePrefix: "react-select",
729
741
  isMulti: l,
730
- options: i,
731
- onBlur: L,
732
- onChange: c,
733
- placeholder: n,
742
+ options: s,
743
+ onBlur: j,
744
+ onChange: p,
745
+ placeholder: e,
734
746
  menuPortalTarget: document.body,
735
- value: g,
736
- getOptionLabel: typeof a == "string" ? (w) => w[a] : a,
747
+ value: f,
748
+ getOptionLabel: typeof i == "string" ? (w) => w[i] : i,
737
749
  getOptionValue: (w) => w.id,
738
750
  isDisabled: o,
739
751
  menuPlacement: b,
740
752
  closeMenuOnSelect: m
741
753
  },
742
- g ? JSON.stringify(g) : "reset"
754
+ f ? JSON.stringify(f) : "reset"
743
755
  )
744
756
  }
745
757
  );
746
758
  }, X = ({
747
- label: t,
759
+ label: n,
748
760
  name: r,
749
- validation: i,
761
+ validation: s,
750
762
  control: l,
751
- error: n,
752
- ...e
753
- }) => /* @__PURE__ */ T(E.Group, { className: "mb-1", children: [
754
- t && /* @__PURE__ */ T(E.Label, { className: "mb-3 d-block form-label", children: [
755
- t,
763
+ error: e,
764
+ ...t
765
+ }) => /* @__PURE__ */ v(S.Group, { className: "mb-1", children: [
766
+ n && /* @__PURE__ */ v(S.Label, { className: "mb-3 d-block form-label", children: [
767
+ n,
756
768
  " ",
757
- e.required && /* @__PURE__ */ s("span", { className: "text-danger", children: "*" })
769
+ t.required && /* @__PURE__ */ a("span", { className: "text-danger", children: "*" })
758
770
  ] }),
759
- /* @__PURE__ */ s(
760
- Ae,
771
+ /* @__PURE__ */ a(
772
+ Pe,
761
773
  {
762
774
  control: l,
763
- options: e.options ?? [],
764
- validation: i,
765
- isInvalid: n && !!n[r],
775
+ options: t.options ?? [],
776
+ validation: s,
777
+ isInvalid: e && !!e[r],
766
778
  name: r
767
779
  }
768
780
  ),
769
- n && n[r] ? /* @__PURE__ */ s(E.Control.Feedback, { type: "invalid", children: n[r].message }) : null
770
- ] }), Pe = () => {
771
- const t = A();
781
+ e && e[r] ? /* @__PURE__ */ a(S.Control.Feedback, { type: "invalid", children: e[r].message }) : null
782
+ ] }), je = () => {
783
+ const n = N();
772
784
  me();
773
- const { enerexIdentifier: r, projectId: i } = v();
774
- return ee({
785
+ const { enerexIdentifier: r, projectId: s } = T();
786
+ return Z({
775
787
  mutationKey: ["saveTemplate"],
776
- mutationFn: async (n) => (n.enerexIdentifier = r ?? "", n.projectId = i ?? "", await t.post(
777
- `${P.SaveTemplate}`,
778
- n
788
+ mutationFn: async (e) => (e.enerexIdentifier = r ?? "", e.projectId = s ?? "", await n.post(
789
+ `${A.SaveTemplate}`,
790
+ e
779
791
  ))
780
792
  });
781
- }, J = { id: "", name: "New (Blank)" }, je = ({
782
- onSelectItem: t,
793
+ }, O = { id: "", name: "New (Blank)" }, Re = ({
794
+ onSelectItem: n,
783
795
  templateLoading: r,
784
- onReset: i
796
+ onReset: s
785
797
  }) => {
786
798
  const {
787
799
  register: l,
788
- handleSubmit: n,
789
- clearErrors: e,
790
- setValue: a,
800
+ handleSubmit: e,
801
+ clearErrors: t,
802
+ setValue: i,
791
803
  control: o,
792
- watch: p,
804
+ watch: c,
793
805
  reset: y,
794
- formState: { errors: f }
795
- } = fe({
806
+ formState: { errors: g }
807
+ } = ge({
796
808
  defaultValues: {
797
809
  templateName: "",
798
810
  subject: "",
799
811
  templateType: void 0,
800
- template: J
812
+ template: O
801
813
  },
802
814
  mode: "onChange"
803
815
  }), {
804
816
  data: h,
805
817
  refetch: b,
806
818
  isLoading: m
807
- } = Ce(), [u, c] = S([]), [g, L] = S(), [w, H] = S(), { mutateAsync: se, isPending: N } = Ie(), { mutateAsync: ie, isPending: R } = Pe(), { data: j, isLoading: M } = Se(), [F, ae] = S([]);
808
- _(() => {
809
- j && ae(
810
- j.filter((d) => d.id !== void 0).map((d) => ({
811
- id: `${d.id}`,
812
- name: d.name
813
- }))
814
- );
815
- }, [j]), _(() => {
816
- r(!!N);
817
- }, [N]), _(() => {
818
- c(h ?? []);
819
+ } = Ce(), [u, p] = E([]), [f, j] = E(), [w, M] = E(), { mutateAsync: re, isPending: _ } = Ee(), { mutateAsync: se, isPending: R } = je(), { data: D, isLoading: U } = Se(), [ie, ae] = E([]);
820
+ C(() => {
821
+ D && ae(Ie(D));
822
+ }, [D]), C(() => {
823
+ r(!!_);
824
+ }, [_]), C(() => {
825
+ p(h ?? []);
819
826
  }, [h]);
820
827
  const le = async (d) => {
821
- if (L(d), d) {
822
- if (a("templateName", d?.name), j && j.find((C) => C.id === d.type)) {
823
- const C = F.find((q) => q.id === `${d.type}`);
824
- C && a("templateType", C);
825
- }
826
- e();
827
- } else
828
- a("templateName", ""), a("subject", "");
829
- const x = await se({ id: d?.id });
830
- H(x || void 0);
828
+ j(d), d ? (i("templateName", d?.name), t()) : (i("templateName", ""), i("subject", ""));
829
+ const x = await re({ id: d?.id });
830
+ M(x || void 0);
831
831
  };
832
- _(() => {
833
- let d = u.find((x) => x.id === p("template")?.id);
832
+ C(() => {
833
+ i("template", O);
834
+ }, [c("templateType")]), C(() => {
835
+ let d = u.find((x) => x.id === c("template")?.id);
834
836
  le(d);
835
- }, [p("template")]), _(() => {
836
- w && g ? (t(w), a("subject", w.subject ?? "")) : t(void 0);
837
- }, [w, g, t]);
837
+ }, [c("template")]), C(() => {
838
+ w && f ? (n(w), i("subject", w.subject ?? "")) : n(void 0);
839
+ }, [w, f, n]);
838
840
  const oe = (d) => {
839
841
  window.StripoEditorApi.actionsApi.getTemplateData(
840
842
  async (x) => {
841
- let C = d.template.id, q = "";
842
- g?.readonly && (C = "", q = d.template.id);
843
+ let H = d.template.id, F = "";
844
+ f?.readonly && (H = "", F = d.template.id);
843
845
  const de = {
844
846
  enerexIdentifier: "",
845
847
  projectId: "",
846
- templateId: C,
848
+ templateId: H,
847
849
  templateType: d.templateType.id,
848
850
  name: d.templateName,
849
851
  html: x.html,
850
852
  css: x.css,
851
853
  subject: d.templateType.id === "2" ? d?.subject ?? "" : "",
852
- parent_id: q
854
+ parent_id: F
853
855
  };
854
- await ie(de) && (e(), y(), b());
856
+ await se(de) && (t(), y(), b());
855
857
  }
856
858
  );
857
859
  };
858
- return /* @__PURE__ */ s(K, { className: "border border-0 text-start", children: /* @__PURE__ */ s(K.Body, { className: "pe-0 ps-2", children: /* @__PURE__ */ s("form", { onSubmit: n(oe), children: /* @__PURE__ */ s("div", { className: "template-list-container gap-3", children: /* @__PURE__ */ T(ue, { children: [
859
- /* @__PURE__ */ s($, { children: /* @__PURE__ */ s(
860
+ return /* @__PURE__ */ a(K, { className: "border border-0 text-start", children: /* @__PURE__ */ a(K.Body, { className: "pe-0 ps-2", children: /* @__PURE__ */ a("form", { onSubmit: e(oe), children: /* @__PURE__ */ a("div", { className: "template-list-container gap-3", children: /* @__PURE__ */ v(ue, { children: [
861
+ /* @__PURE__ */ a(P, { children: /* @__PURE__ */ a(
860
862
  X,
861
863
  {
862
864
  label: "Type",
863
865
  control: o,
864
- error: f,
865
- options: F,
866
+ error: g,
867
+ options: ie,
866
868
  required: !0,
867
869
  validation: {
868
870
  required: {
@@ -873,16 +875,16 @@ const Y = /* @__PURE__ */ Ee(_e), Ae = ({
873
875
  ...l("templateType")
874
876
  }
875
877
  ) }),
876
- /* @__PURE__ */ s($, { children: /* @__PURE__ */ s(
878
+ /* @__PURE__ */ a(P, { children: /* @__PURE__ */ a(
877
879
  X,
878
880
  {
879
881
  label: "Template",
880
882
  control: o,
881
- error: f,
883
+ error: g,
882
884
  options: [
883
- J,
885
+ O,
884
886
  ...u.filter(
885
- (d) => (d.type?.toString() === p("templateType")?.id || d.type === null) && p("templateType")?.id != null
887
+ (d) => (d.type?.toString() === c("templateType")?.id || d.type === null) && c("templateType")?.id != null
886
888
  ).map((d) => ({
887
889
  id: d.id,
888
890
  name: d.name
@@ -892,12 +894,12 @@ const Y = /* @__PURE__ */ Ee(_e), Ae = ({
892
894
  ...l("template")
893
895
  }
894
896
  ) }),
895
- /* @__PURE__ */ s($, { children: /* @__PURE__ */ s(
897
+ /* @__PURE__ */ a(P, { children: /* @__PURE__ */ a(
896
898
  Q,
897
899
  {
898
900
  label: "Name",
899
901
  register: l,
900
- error: f,
902
+ error: g,
901
903
  required: !0,
902
904
  name: "templateName",
903
905
  validation: {
@@ -908,86 +910,86 @@ const Y = /* @__PURE__ */ Ee(_e), Ae = ({
908
910
  }
909
911
  }
910
912
  ) }),
911
- p("templateType")?.id === "2" && /* @__PURE__ */ s($, { children: /* @__PURE__ */ s(
913
+ c("templateType")?.id === "2" && /* @__PURE__ */ a(P, { children: /* @__PURE__ */ a(
912
914
  Q,
913
915
  {
914
916
  label: "Subject",
915
917
  register: l,
916
- error: f,
918
+ error: g,
917
919
  required: !1,
918
920
  name: "subject"
919
921
  }
920
922
  ) }),
921
- /* @__PURE__ */ T($, { className: "d-flex align-items-end justify-content-end gap-2 mb-3", children: [
922
- /* @__PURE__ */ s(
923
+ /* @__PURE__ */ v(P, { className: "d-flex align-items-end justify-content-end gap-2 mb-3", children: [
924
+ /* @__PURE__ */ a(
923
925
  z,
924
926
  {
925
927
  style: { width: "70px" },
926
928
  variant: "primary",
927
- disabled: m || N || R || M,
929
+ disabled: m || _ || R || U,
928
930
  onClick: () => {
929
- L(void 0), y(), i();
931
+ j(void 0), y(), s();
930
932
  },
931
- children: N || R ? /* @__PURE__ */ s(
932
- U,
933
+ children: _ || R ? /* @__PURE__ */ a(
934
+ B,
933
935
  {
934
936
  animation: "border",
935
937
  style: { width: "11px", height: "11px" },
936
938
  size: "sm",
937
939
  role: "status",
938
940
  className: "me-1",
939
- children: /* @__PURE__ */ s("span", { className: "visually-hidden", children: "Loading..." })
941
+ children: /* @__PURE__ */ a("span", { className: "visually-hidden", children: "Loading..." })
940
942
  }
941
943
  ) : "Clear"
942
944
  }
943
945
  ),
944
- (p("templateType")?.id !== "2" || (g?.id ?? "") !== "") && /* @__PURE__ */ s(
946
+ (c("templateType")?.id !== "2" || (f?.id ?? "") !== "") && /* @__PURE__ */ a(
945
947
  z,
946
948
  {
947
949
  type: "submit",
948
950
  variant: "primary",
949
951
  style: { width: "80px" },
950
- disabled: m || N || R || M,
951
- children: N || R ? /* @__PURE__ */ s(
952
- U,
952
+ disabled: m || _ || R || U,
953
+ children: _ || R ? /* @__PURE__ */ a(
954
+ B,
953
955
  {
954
956
  animation: "border",
955
957
  style: { width: "11px", height: "11px" },
956
958
  size: "sm",
957
959
  role: "status",
958
960
  className: "me-1",
959
- children: /* @__PURE__ */ s("span", { className: "visually-hidden", children: "Loading..." })
961
+ children: /* @__PURE__ */ a("span", { className: "visually-hidden", children: "Loading..." })
960
962
  }
961
- ) : g?.readonly ? "Save as" : "Save"
963
+ ) : f?.readonly ? "Save as" : "Save"
962
964
  }
963
965
  )
964
966
  ] })
965
967
  ] }) }) }) }) });
966
- }, Ue = ({ config: t }) => {
967
- const [r, i] = S(), [l, n] = S(!1);
968
- return /* @__PURE__ */ s(ye, { configs: t, children: /* @__PURE__ */ s(be, { children: /* @__PURE__ */ T("div", { className: "root-widget", children: [
969
- /* @__PURE__ */ s(
970
- je,
968
+ }, Ue = ({ config: n }) => {
969
+ const [r, s] = E(), [l, e] = E(!1);
970
+ return /* @__PURE__ */ a(ye, { configs: n, children: /* @__PURE__ */ a(be, { children: /* @__PURE__ */ v("div", { className: "root-widget", children: [
971
+ /* @__PURE__ */ a(
972
+ Re,
971
973
  {
972
- templateLoading: n,
974
+ templateLoading: e,
973
975
  onSelectItem: (o) => {
974
- i(o), window.StripoEditorApi && window.StripoEditorApi.actionsApi && window.StripoEditorApi.actionsApi.updateHtmlAndCss(
975
- o?.html ?? D,
976
+ s(o), window.StripoEditorApi && window.StripoEditorApi.actionsApi && window.StripoEditorApi.actionsApi.updateHtmlAndCss(
977
+ o?.html ?? L,
976
978
  o?.css ?? "",
977
979
  ""
978
980
  );
979
981
  },
980
982
  onReset: () => {
981
- n(!1), i(void 0), window.StripoEditorApi && window.StripoEditorApi.actionsApi && window.StripoEditorApi.actionsApi.updateHtmlAndCss(D, "", "");
983
+ e(!1), s(void 0), window.StripoEditorApi && window.StripoEditorApi.actionsApi && window.StripoEditorApi.actionsApi.updateHtmlAndCss(L, "", "");
982
984
  }
983
985
  }
984
986
  ),
985
- /* @__PURE__ */ s(
987
+ /* @__PURE__ */ a(
986
988
  xe,
987
989
  {
988
990
  templateHTML: {
989
991
  css: r?.css ?? "",
990
- html: r?.html ?? D
992
+ html: r?.html ?? L
991
993
  },
992
994
  loading: l,
993
995
  className: "col-span-5"
package/dist/enerex-template-editor.umd.js CHANGED
@@ -1,4 +1,4 @@
1
- (function(f,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):(f=typeof globalThis<"u"?globalThis:f||self,n(f.EnerexTemplateEditor={},f.jsxRuntime,f.React,f.reactQuery,f.axios,f.reactBootstrap,f.reactHookForm,f.Select$1))})(this,function(f,n,c,w,O,p,F,M){"use strict";const P=`<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
1
+ (function(f,r){typeof exports=="object"&&typeof module<"u"?r(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"],r):(f=typeof globalThis<"u"?globalThis:f||self,r(f.EnerexTemplateEditor={},f.jsxRuntime,f.React,f.reactQuery,f.axios,f.reactBootstrap,f.reactHookForm,f.Select$1))})(this,function(f,r,d,w,D,c,O,F){"use strict";const j=`<!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
- `,U=c.createContext(void 0),Q=({children:t,configs:s})=>{const[l,o]=c.useState(s.clientId),[r,e]=c.useState(s.apiKey),[i,a]=c.useState(s.enerexIdentifier),[u,v]=c.useState(s.userName),[b,x]=c.useState(s.projectId),C=g=>{e(g.apiKey),o(g.clientId),x(g.projectId),a(g.enerexIdentifier),v(g.userName)};return n.jsx(U.Provider,{value:{clientId:l,apiKey:r,setConfiguration:C,enerexIdentifier:i,projectId:b,userName:u},children:t})},T=()=>{const t=c.useContext(U);if(!t)throw new Error("widgetConfig must be used within a ConfigProvider");return t},H=(t="",s)=>({get:async(r,e)=>{try{const i=await O.get(`${t}${r}`,e??s);if(i.status===200)return i.data}catch(i){throw i}},post:async(r,e,i)=>{try{const a=await O.post(`${t}${r}`,e,i??s);if(a.status===200)return a.data}catch(a){throw a}}}),A={EDITOR_SCRIPT_URL:"https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js",EDITOR_PLUGIN_ID:"1afdc3161ec7409a8627a1c8561d45f5",EDITOR_SECRET_KEY:"54ba748ed7e94f2e929555783acb03da",API_BASE_URL:"https://dev-socket.enerex.com/common/api"},V=c.createContext({get:()=>{throw new Error("HttpClientContext.get not implemented")},post:()=>{throw new Error("HttpClientContext.post not implemented")}}),Z=({children:t})=>{const{clientId:s,apiKey:l}=T(),o={headers:{client_id:s,"x-api-key":l}},{get:r,post:e}=H(A.API_BASE_URL,o);return n.jsx(V.Provider,{value:{get:r,post:e},children:t})},R=({children:t})=>{const s=new w.QueryClient;return n.jsx(Z,{children:n.jsx(w.QueryClientProvider,{client:s,children:t})})},ee=t=>{const s=Array.from(new Set(t.map(o=>o.category))),l=[];return s.forEach(o=>{const r=t.filter(e=>e.category===o).map(e=>({label:e.label,value:e.value,hint:e.hint,hidden:e.hidden}));l.push({category:o,entries:r})}),l},N=()=>{const t=c.useContext(V);if(t)return t;throw new Error("useHttpClient must be used within a HttpClientProvider")},_={Template_list:"/Template/list/",Template:"/Template/GetTemplate/",MergeTags:"/Template/TemplateMergeTags/",ExcludeCategory:"/Template/GetExcludeCategories/",SaveTemplate:"/Template/save-update/",TemplateTypes:"/Template/TemplateTypes/"},te=()=>{const t=N(),{enerexIdentifier:s,projectId:l}=T();return w.useQuery({queryKey:["getTemplateTags"],queryFn:async r=>await t.get(`${_.MergeTags}${l}/${s}`)})},ne=()=>{const t=N(),{enerexIdentifier:s,projectId:l}=T();return w.useQuery({queryKey:["getExcludeCategory"],queryFn:async r=>await t.get(`${_.ExcludeCategory}${l}/${s}`)})},re=({templateHTML:t,className:s="",loading:l=!1})=>{const{post:o}=H(),{data:r}=te(),{data:e}=ne(),[i,a]=c.useState(t??{html:P,css:""}),{enerexIdentifier:u,projectId:v,userName:b}=T(),x="https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png",C="https://plugins.stripo.email/api/v1/auth";c.useEffect(()=>{if(r&&e&&!document.getElementById("UiEditorScript")){const y=document.createElement("script");y.id="UiEditorScript",y.type="module",y.src=A.EDITOR_SCRIPT_URL,y.onload=g,document.body.appendChild(y)}},[r,e]);const g=async()=>{window.UIEditor.initEditor(document.querySelector("#stripoEditorContainer"),{html:i.html,css:i.css,modulesExcludedCategories:e??[],forceRecreate:!0,metadata:{emailId:`${v}_${u}`,userId:"1",username:b,avatarUrl:x},locale:"en",onTokenRefreshRequest:async function(y){const m={pluginId:A.EDITOR_PLUGIN_ID,secretKey:A.EDITOR_SECRET_KEY,userId:"12",role:"user"},h=await o(C,m);h&&y(h.token)},codeEditorButtonSelector:"#codeEditor",undoButtonSelector:"#undoButton",redoButtonSelector:"#redoButton",mobileViewButtonSelector:"#mobileViewButton",desktopViewButtonSelector:"#desktopViewButton",mergeTags:ee(r??[])})};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(p.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"})]})})},K=({label:t,register:s,validation:l,required:o=!1,name:r,error:e,className:i="",...a})=>n.jsxs(p.Form.Group,{className:i+" mb-1",children:[t?n.jsxs(p.Form.Label,{className:"mb-3 d-block form-label",children:[t,o&&n.jsx("label",{className:"text-danger",children:"*"})]}):null,n.jsx(p.Form.Control,{name:r,type:"text",...a,isInvalid:!!(e&&e[r]),...s?s(r,{...l}):{},className:`react-select__control ${e&&e[r]&&"border border-danger"}`}),e&&e[r]?n.jsx(p.Form.Control.Feedback,{type:"invalid",children:e[r].message}):null]}),se=()=>{const t=N(),{enerexIdentifier:s,projectId:l}=T();return w.useQuery({queryKey:["getTemplatesList"],queryFn:async r=>await t.get(`${_.Template_list}${l}/${s}`)})},ie=()=>{const t=N(),{enerexIdentifier:s,projectId:l}=T();return w.useMutation({mutationKey:["getTemplate"],mutationFn:async({id:r})=>{if(r)return await t.get(`${_.Template}${s}/${r}/${l}`)}})},le=()=>{const t=N(),{enerexIdentifier:s,projectId:l}=T();return w.useQuery({queryKey:["getTemplateTypes"],queryFn:async r=>await t.get(`${_.TemplateTypes}${s}/${l}`)})};function oe(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var D={exports:{}};/*!
357
+ `,M=d.createContext(void 0),J=({children:n,configs:s})=>{const[l,o]=d.useState(s.clientId),[e,t]=d.useState(s.apiKey),[i,a]=d.useState(s.enerexIdentifier),[m,v]=d.useState(s.userName),[b,x]=d.useState(s.projectId),C=g=>{t(g.apiKey),o(g.clientId),x(g.projectId),a(g.enerexIdentifier),v(g.userName)};return r.jsx(M.Provider,{value:{clientId:l,apiKey:e,setConfiguration:C,enerexIdentifier:i,projectId:b,userName:m},children:n})},T=()=>{const n=d.useContext(M);if(!n)throw new Error("widgetConfig must be used within a ConfigProvider");return n},U=(n="",s)=>({get:async(e,t)=>{try{const i=await D.get(`${n}${e}`,t??s);if(i.status===200)return i.data}catch(i){throw i}},post:async(e,t,i)=>{try{const a=await D.post(`${n}${e}`,t,i??s);if(a.status===200)return a.data}catch(a){throw a}}}),q={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"},H=d.createContext({get:()=>{throw new Error("HttpClientContext.get not implemented")},post:()=>{throw new Error("HttpClientContext.post not implemented")}}),Q=({children:n})=>{const{clientId:s,apiKey:l}=T(),o={headers:{client_id:s,"x-api-key":l}},{get:e,post:t}=U(q.API_BASE_URL,o);return r.jsx(H.Provider,{value:{get:e,post:t},children:n})},Z=({children:n})=>{const s=new w.QueryClient;return r.jsx(Q,{children:r.jsx(w.QueryClientProvider,{client:s,children:n})})},R=n=>{const s=Array.from(new Set(n.map(o=>o.category))),l=[];return s.forEach(o=>{const e=n.filter(t=>t.category===o).map(t=>({label:t.label,value:t.value,hint:t.hint,hidden:t.hidden}));l.push({category:o,entries:e})}),l},I=()=>{const n=d.useContext(H);if(n)return n;throw new Error("useHttpClient must be used within a HttpClientProvider")},_={Template_list:"/Template/list/",Template:"/Template/GetTemplate/",MergeTags:"/Template/TemplateMergeTags/",ExcludeCategory:"/Template/GetExcludeCategories/",SaveTemplate:"/Template/save-update/",TemplateTypes:"/Template/TemplateTypes/"},ee=()=>{const n=I(),{enerexIdentifier:s,projectId:l}=T();return w.useQuery({queryKey:["getTemplateTags"],queryFn:async e=>await n.get(`${_.MergeTags}${l}/${s}`)})},te=()=>{const n=I(),{enerexIdentifier:s,projectId:l}=T();return w.useQuery({queryKey:["getExcludeCategory"],queryFn:async e=>await n.get(`${_.ExcludeCategory}${l}/${s}`)})},ne=({templateHTML:n,className:s="",loading:l=!1})=>{const{post:o}=U(),{data:e}=ee(),{data:t}=te(),[i,a]=d.useState(n??{html:j,css:""}),{enerexIdentifier:m,projectId:v,userName:b}=T(),x="https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png",C="https://plugins.stripo.email/api/v1/auth";d.useEffect(()=>{if(e&&t&&!document.getElementById("UiEditorScript")){const y=document.createElement("script");y.id="UiEditorScript",y.type="module",y.src=q.EDITOR_SCRIPT_URL,y.onload=g,document.body.appendChild(y)}},[e,t]);const g=async()=>{window.UIEditor.initEditor(document.querySelector("#stripoEditorContainer"),{html:i.html,css:i.css,modulesExcludedCategories:t??[],forceRecreate:!0,metadata:{emailId:`${v}_${m}`,userId:"1",username:b,avatarUrl:x},locale:"en",onTokenRefreshRequest:async function(y){const u={pluginId:q.EDITOR_PLUGIN_ID,secretKey:q.EDITOR_SECRET_KEY,userId:"12",role:"user"},h=await o(C,u);h&&y(h.token)},codeEditorButtonSelector:"#codeEditor",undoButtonSelector:"#undoButton",redoButtonSelector:"#redoButton",mobileViewButtonSelector:"#mobileViewButton",desktopViewButtonSelector:"#desktopViewButton",mergeTags:R(e??[])})};return r.jsx("div",{className:"position-relative",children:r.jsxs("div",{className:`editor-container ${s}`,children:[l&&r.jsx("div",{className:"loading-overlay",children:r.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1"})}),r.jsx("div",{id:"externalSystemContainer"}),r.jsx("div",{id:"stripoEditorContainer"})]})})},V=({label:n,register:s,validation:l,required:o=!1,name:e,error:t,className:i="",...a})=>r.jsxs(c.Form.Group,{className:i+" mb-1",children:[n?r.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[n,o&&r.jsx("label",{className:"text-danger",children:"*"})]}):null,r.jsx(c.Form.Control,{name:e,type:"text",...a,isInvalid:!!(t&&t[e]),...s?s(e,{...l}):{},className:`react-select__control ${t&&t[e]&&"border border-danger"}`}),t&&t[e]?r.jsx(c.Form.Control.Feedback,{type:"invalid",children:t[e].message}):null]}),re=()=>{const n=I(),{enerexIdentifier:s,projectId:l}=T();return w.useQuery({queryKey:["getTemplatesList"],queryFn:async e=>await n.get(`${_.Template_list}${l}/${s}`)})};function se(n){let s=[],l=n.filter(e=>e.id!=null),o=[];return l.forEach(e=>{e.parent_id!==0&&!o.includes(e.parent_id)&&o.push(e.parent_id)}),o.forEach(e=>{let t=l.filter(a=>a.parent_id===e).map(a=>({name:a.name,id:a.id})),i=l.find(a=>a.id===e)?.name;i&&s.push({label:i,options:t})}),l.forEach(e=>{e.parent_id===0&&!o.includes(e.id)&&s.push({name:e.name,id:e.id})}),s}const le=()=>{const n=I(),{enerexIdentifier:s,projectId:l}=T();return w.useMutation({mutationKey:["getTemplate"],mutationFn:async({id:e})=>{if(e)return await n.get(`${_.Template}${s}/${e}/${l}`)}})},ie=()=>{const n=I(),{enerexIdentifier:s,projectId:l}=T();return w.useQuery({queryKey:["getTemplateTypes"],queryFn:async e=>await n.get(`${_.TemplateTypes}${s}/${l}`)})};function oe(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}var L={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 z;function ae(){return z||(z=1,function(t){(function(){var s={}.hasOwnProperty;function l(){for(var e="",i=0;i<arguments.length;i++){var a=arguments[i];a&&(e=r(e,o(a)))}return e}function o(e){if(typeof e=="string"||typeof e=="number")return e;if(typeof e!="object")return"";if(Array.isArray(e))return l.apply(null,e);if(e.toString!==Object.prototype.toString&&!e.toString.toString().includes("[native code]"))return e.toString();var i="";for(var a in e)s.call(e,a)&&e[a]&&(i=r(i,a));return i}function r(e,i){return i?e?e+" "+i:e+i:e}t.exports?(l.default=l,t.exports=l):window.classNames=l})()}(D)),D.exports}var de=ae();const G=oe(de),ce=({name:t="",control:s,options:l,multiple:o=!1,placeholder:r,validation:e,labelKey:i="name",disabled:a,isInvalid:u,value:v,onChange:b,uncontrolled:x,menuPlacement:C="auto",closeOnSelect:g=!0})=>{const y={control:m=>({...m,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:m=>({...m,marginTop:0,width:"max-content",minWidth:"100%"}),menuPortal:m=>({...m,zIndex:9999}),multiValueRemove:m=>({...m,display:a?"none":"block"})};return x?n.jsx(M,{className:G({"is-invalid":u}),styles:y,classNamePrefix:"react-select",isMulti:o,options:l,onChange:b,placeholder:r,menuPortalTarget:document.body,value:v,getOptionLabel:typeof i=="string"?m=>m[i]:i,getOptionValue:m=>m.id,isDisabled:a,menuPlacement:C,closeMenuOnSelect:g}):n.jsx(F.Controller,{control:s,name:t,rules:e,render:({field:{onChange:m,value:h,onBlur:L}})=>n.jsx(M,{className:G({"is-invalid":u}),styles:y,classNamePrefix:"react-select",isMulti:o,options:l,onBlur:L,onChange:m,placeholder:r,menuPortalTarget:document.body,value:h,getOptionLabel:typeof i=="string"?S=>S[i]:i,getOptionValue:S=>S.id,isDisabled:a,menuPlacement:C,closeMenuOnSelect:g},h?JSON.stringify(h):"reset")})},W=({label:t,name:s,validation:l,control:o,error:r,...e})=>n.jsxs(p.Form.Group,{className:"mb-1",children:[t&&n.jsxs(p.Form.Label,{className:"mb-3 d-block form-label",children:[t," ",e.required&&n.jsx("span",{className:"text-danger",children:"*"})]}),n.jsx(ce,{control:o,options:e.options??[],validation:l,isInvalid:r&&!!r[s],name:s}),r&&r[s]?n.jsx(p.Form.Control.Feedback,{type:"invalid",children:r[s].message}):null]}),pe=()=>{const t=N();w.useQueryClient();const{enerexIdentifier:s,projectId:l}=T();return w.useMutation({mutationKey:["saveTemplate"],mutationFn:async r=>(r.enerexIdentifier=s??"",r.projectId=l??"",await t.post(`${_.SaveTemplate}`,r))})},B={id:"",name:"New (Blank)"},me=({onSelectItem:t,templateLoading:s,onReset:l})=>{const{register:o,handleSubmit:r,clearErrors:e,setValue:i,control:a,watch:u,reset:v,formState:{errors:b}}=F.useForm({defaultValues:{templateName:"",subject:"",templateType:void 0,template:B},mode:"onChange"}),{data:x,refetch:C,isLoading:g}=se(),[y,m]=c.useState([]),[h,L]=c.useState(),[S,Y]=c.useState(),{mutateAsync:fe,isPending:j}=ie(),{mutateAsync:ge,isPending:$}=pe(),{data:q,isLoading:X}=le(),[J,ye]=c.useState([]);c.useEffect(()=>{q&&ye(q.filter(d=>d.id!==void 0).map(d=>({id:`${d.id}`,name:d.name})))},[q]),c.useEffect(()=>{s(!!j)},[j]),c.useEffect(()=>{m(x??[])},[x]);const he=async d=>{if(L(d),d){if(i("templateName",d?.name),q&&q.find(I=>I.id===d.type)){const I=J.find(k=>k.id===`${d.type}`);I&&i("templateType",I)}e()}else i("templateName",""),i("subject","");const E=await fe({id:d?.id});Y(E||void 0)};c.useEffect(()=>{let d=y.find(E=>E.id===u("template")?.id);he(d)},[u("template")]),c.useEffect(()=>{S&&h?(t(S),i("subject",S.subject??"")):t(void 0)},[S,h,t]);const be=d=>{window.StripoEditorApi.actionsApi.getTemplateData(async E=>{let I=d.template.id,k="";h?.readonly&&(I="",k=d.template.id);const we={enerexIdentifier:"",projectId:"",templateId:I,templateType:d.templateType.id,name:d.templateName,html:E.html,css:E.css,subject:d.templateType.id==="2"?d?.subject??"":"",parent_id:k};await ge(we)&&(e(),v(),C())})};return n.jsx(p.Card,{className:"border border-0 text-start",children:n.jsx(p.Card.Body,{className:"pe-0 ps-2",children:n.jsx("form",{onSubmit:r(be),children:n.jsx("div",{className:"template-list-container gap-3",children:n.jsxs(p.Row,{children:[n.jsx(p.Col,{children:n.jsx(W,{label:"Type",control:a,error:b,options:J,required:!0,validation:{required:{value:!0,message:"Select a type"}},...o("templateType")})}),n.jsx(p.Col,{children:n.jsx(W,{label:"Template",control:a,error:b,options:[B,...y.filter(d=>(d.type?.toString()===u("templateType")?.id||d.type===null)&&u("templateType")?.id!=null).map(d=>({id:d.id,name:d.name}))],required:!1,...o("template")})}),n.jsx(p.Col,{children:n.jsx(K,{label:"Name",register:o,error:b,required:!0,name:"templateName",validation:{required:{value:!0,message:"Enter a name"}}})}),u("templateType")?.id==="2"&&n.jsx(p.Col,{children:n.jsx(K,{label:"Subject",register:o,error:b,required:!1,name:"subject"})}),n.jsxs(p.Col,{className:"d-flex align-items-end justify-content-end gap-2 mb-3",children:[n.jsx(p.Button,{style:{width:"70px"},variant:"primary",disabled:g||j||$||X,onClick:()=>{L(void 0),v(),l()},children:j||$?n.jsx(p.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!=="2"||(h?.id??"")!=="")&&n.jsx(p.Button,{type:"submit",variant:"primary",style:{width:"80px"},disabled:g||j||$||X,children:j||$?n.jsx(p.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:n.jsx("span",{className:"visually-hidden",children:"Loading..."})}):h?.readonly?"Save as":"Save"})]})]})})})})})},ue=({config:t})=>{const[s,l]=c.useState(),[o,r]=c.useState(!1),e=a=>{l(a),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(a?.html??P,a?.css??"","")},i=()=>{r(!1),l(void 0),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(P,"","")};return n.jsx(Q,{configs:t,children:n.jsx(R,{children:n.jsxs("div",{className:"root-widget",children:[n.jsx(me,{templateLoading:r,onSelectItem:e,onReset:i}),n.jsx(re,{templateHTML:{css:s?.css??"",html:s?.html??P},loading:o,className:"col-span-5"})]})})})};f.EditorWidget=ue,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})});
361
+ */var K;function ae(){return K||(K=1,function(n){(function(){var s={}.hasOwnProperty;function l(){for(var t="",i=0;i<arguments.length;i++){var a=arguments[i];a&&(t=e(t,o(a)))}return t}function o(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 i="";for(var a in t)s.call(t,a)&&t[a]&&(i=e(i,a));return i}function e(t,i){return i?t?t+" "+i:t+i:t}n.exports?(l.default=l,n.exports=l):window.classNames=l})()}(L)),L.exports}var de=ae();const z=oe(de),ce=({name:n="",control:s,options:l,multiple:o=!1,placeholder:e,validation:t,labelKey:i="name",disabled:a,isInvalid:m,value:v,onChange:b,uncontrolled:x,menuPlacement:C="auto",closeOnSelect:g=!0})=>{const y={control:u=>({...u,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:u=>({...u,marginTop:0,width:"max-content",minWidth:"100%"}),menuPortal:u=>({...u,zIndex:9999}),multiValueRemove:u=>({...u,display:a?"none":"block"})};return x?r.jsx(F,{className:z({"is-invalid":m}),styles:y,classNamePrefix:"react-select",isMulti:o,options:l,onChange:b,placeholder:e,menuPortalTarget:document.body,value:v,getOptionLabel:typeof i=="string"?u=>u[i]:i,getOptionValue:u=>u.id,isDisabled:a,menuPlacement:C,closeMenuOnSelect:g}):r.jsx(O.Controller,{control:s,name:n,rules:t,render:({field:{onChange:u,value:h,onBlur:P}})=>r.jsx(F,{className:z({"is-invalid":m}),styles:y,classNamePrefix:"react-select",isMulti:o,options:l,onBlur:P,onChange:u,placeholder:e,menuPortalTarget:document.body,value:h,getOptionLabel:typeof i=="string"?E=>E[i]:i,getOptionValue:E=>E.id,isDisabled:a,menuPlacement:C,closeMenuOnSelect:g},h?JSON.stringify(h):"reset")})},G=({label:n,name:s,validation:l,control:o,error:e,...t})=>r.jsxs(c.Form.Group,{className:"mb-1",children:[n&&r.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[n," ",t.required&&r.jsx("span",{className:"text-danger",children:"*"})]}),r.jsx(ce,{control:o,options:t.options??[],validation:l,isInvalid:e&&!!e[s],name:s}),e&&e[s]?r.jsx(c.Form.Control.Feedback,{type:"invalid",children:e[s].message}):null]}),pe=()=>{const n=I();w.useQueryClient();const{enerexIdentifier:s,projectId:l}=T();return w.useMutation({mutationKey:["saveTemplate"],mutationFn:async e=>(e.enerexIdentifier=s??"",e.projectId=l??"",await n.post(`${_.SaveTemplate}`,e))})},k={id:"",name:"New (Blank)"},me=({onSelectItem:n,templateLoading:s,onReset:l})=>{const{register:o,handleSubmit:e,clearErrors:t,setValue:i,control:a,watch:m,reset:v,formState:{errors:b}}=O.useForm({defaultValues:{templateName:"",subject:"",templateType:void 0,template:k},mode:"onChange"}),{data:x,refetch:C,isLoading:g}=re(),[y,u]=d.useState([]),[h,P]=d.useState(),[E,W]=d.useState(),{mutateAsync:fe,isPending:N}=le(),{mutateAsync:ge,isPending:A}=pe(),{data:$,isLoading:B}=ie(),[ye,he]=d.useState([]);d.useEffect(()=>{$&&he(se($))},[$]),d.useEffect(()=>{s(!!N)},[N]),d.useEffect(()=>{u(x??[])},[x]);const be=async p=>{P(p),p?(i("templateName",p?.name),t()):(i("templateName",""),i("subject",""));const S=await fe({id:p?.id});W(S||void 0)};d.useEffect(()=>{i("template",k)},[m("templateType")]),d.useEffect(()=>{let p=y.find(S=>S.id===m("template")?.id);be(p)},[m("template")]),d.useEffect(()=>{E&&h?(n(E),i("subject",E.subject??"")):n(void 0)},[E,h,n]);const we=p=>{window.StripoEditorApi.actionsApi.getTemplateData(async S=>{let Y=p.template.id,X="";h?.readonly&&(Y="",X=p.template.id);const Te={enerexIdentifier:"",projectId:"",templateId:Y,templateType:p.templateType.id,name:p.templateName,html:S.html,css:S.css,subject:p.templateType.id==="2"?p?.subject??"":"",parent_id:X};await ge(Te)&&(t(),v(),C())})};return r.jsx(c.Card,{className:"border border-0 text-start",children:r.jsx(c.Card.Body,{className:"pe-0 ps-2",children:r.jsx("form",{onSubmit:e(we),children:r.jsx("div",{className:"template-list-container gap-3",children:r.jsxs(c.Row,{children:[r.jsx(c.Col,{children:r.jsx(G,{label:"Type",control:a,error:b,options:ye,required:!0,validation:{required:{value:!0,message:"Select a type"}},...o("templateType")})}),r.jsx(c.Col,{children:r.jsx(G,{label:"Template",control:a,error:b,options:[k,...y.filter(p=>(p.type?.toString()===m("templateType")?.id||p.type===null)&&m("templateType")?.id!=null).map(p=>({id:p.id,name:p.name}))],required:!1,...o("template")})}),r.jsx(c.Col,{children:r.jsx(V,{label:"Name",register:o,error:b,required:!0,name:"templateName",validation:{required:{value:!0,message:"Enter a name"}}})}),m("templateType")?.id==="2"&&r.jsx(c.Col,{children:r.jsx(V,{label:"Subject",register:o,error:b,required:!1,name:"subject"})}),r.jsxs(c.Col,{className:"d-flex align-items-end justify-content-end gap-2 mb-3",children:[r.jsx(c.Button,{style:{width:"70px"},variant:"primary",disabled:g||N||A||B,onClick:()=>{P(void 0),v(),l()},children:N||A?r.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:r.jsx("span",{className:"visually-hidden",children:"Loading..."})}):"Clear"}),(m("templateType")?.id!=="2"||(h?.id??"")!=="")&&r.jsx(c.Button,{type:"submit",variant:"primary",style:{width:"80px"},disabled:g||N||A||B,children:N||A?r.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:r.jsx("span",{className:"visually-hidden",children:"Loading..."})}):h?.readonly?"Save as":"Save"})]})]})})})})})},ue=({config:n})=>{const[s,l]=d.useState(),[o,e]=d.useState(!1),t=a=>{l(a),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(a?.html??j,a?.css??"","")},i=()=>{e(!1),l(void 0),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(j,"","")};return r.jsx(J,{configs:n,children:r.jsx(Z,{children:r.jsxs("div",{className:"root-widget",children:[r.jsx(me,{templateLoading:e,onSelectItem:t,onReset:i}),r.jsx(ne,{templateHTML:{css:s?.css??"",html:s?.html??j},loading:o,className:"col-span-5"})]})})})};f.EditorWidget=ue,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})});
package/dist/types/component/form-input/select.d.ts CHANGED
@@ -6,10 +6,13 @@ export type HasId = {
6
6
  export type HasName = {
7
7
  name: string;
8
8
  };
9
+ export type HasGroup = {
10
+ group?: string;
11
+ };
9
12
  export type HasExternalId = {
10
13
  externalId: string;
11
14
  };
12
- export type BasicEntity = HasId & HasName;
15
+ export type BasicEntity = HasId & HasName & HasGroup;
13
16
  interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
14
17
  label?: string;
15
18
  name: string;
package/dist/types/queries/types.d.ts CHANGED
@@ -23,6 +23,7 @@ export type ITemplate = {
23
23
  export type ITemplateTypes = {
24
24
  id: number;
25
25
  name: string;
26
+ parent_id: number;
26
27
  };
27
28
  export type ISaveTemplate = {
28
29
  enerexIdentifier: string;
package/dist/types/utils/utility.d.ts CHANGED
@@ -1 +1,3 @@
1
+ import type { ITemplateTypes } from "../queries/types";
1
2
  export declare const generateFileName: (originalName: string, existingNames?: string[]) => string;
3
+ export declare function toReactSelectMixed(data: ITemplateTypes[]): any[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@enerex/template-studio",
3
- "version": "1.1.23",
3
+ "version": "1.1.25",
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",