@enerex/template-studio 1.1.16 → 1.1.18

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,40 +1,11 @@
1
- import { jsx as s, jsxs as b } from "react/jsx-runtime";
2
- import $, { useContext as te, useState as x, useEffect as q } from "react";
3
- import { QueryClient as pe, QueryClientProvider as me, useQuery as j, useMutation as ne, useQueryClient as ue } from "@tanstack/react-query";
4
- import G from "axios";
5
- import { Spinner as U, Form as I, ListGroup as K, Popover as W, OverlayTrigger as ge, Card as Q, Button as Y, Row as fe, Col as X } from "react-bootstrap";
6
- import { Controller as ye, useForm as he } from "react-hook-form";
7
- import J from "react-select";
8
- const re = $.createContext(
9
- void 0
10
- ), be = ({
11
- children: t,
12
- configs: r
13
- }) => {
14
- const [i, a] = $.useState(r.clientId), [n, e] = $.useState(r.apiKey), [o, l] = $.useState(
15
- r.enerexIdentifier
16
- ), [p, m] = $.useState(r.projectId), u = (h) => {
17
- e(h.apiKey), a(h.clientId), m(h.projectId), l(h.enerexIdentifier);
18
- };
19
- return /* @__PURE__ */ s(
20
- re.Provider,
21
- {
22
- value: {
23
- clientId: i,
24
- apiKey: n,
25
- setConfiguration: u,
26
- enerexIdentifier: o,
27
- projectId: p
28
- },
29
- children: t
30
- }
31
- );
32
- }, w = () => {
33
- const t = te(re);
34
- if (!t)
35
- throw new Error("widgetConfig must be used within a ConfigProvider");
36
- return t;
37
- }, H = `<!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 w } from "react/jsx-runtime";
2
+ import I, { useContext as J, useState as E, useEffect as _ } from "react";
3
+ import { QueryClient as le, QueryClientProvider as de, useQuery as k, useMutation as Z, useQueryClient as ce } from "@tanstack/react-query";
4
+ import V from "axios";
5
+ import { Spinner as U, Form as S, Card as K, Row as pe, Col as q, Button as z } from "react-bootstrap";
6
+ import { Controller as me, useForm as ue } from "react-hook-form";
7
+ import G from "react-select";
8
+ const j = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
38
9
  <html\r
39
10
  dir="ltr"\r
40
11
  xmlns:o="urn:schemas-microsoft-com:office:office"\r
@@ -390,142 +361,172 @@ const re = $.createContext(
390
361
  </div>\r
391
362
  </body>\r
392
363
  </html>\r
393
- `, se = (t = "", r) => ({ get: async (n, e) => {
364
+ `, ee = I.createContext(
365
+ void 0
366
+ ), ge = ({
367
+ children: t,
368
+ configs: r
369
+ }) => {
370
+ const [s, o] = I.useState(r.clientId), [n, e] = I.useState(r.apiKey), [a, l] = I.useState(
371
+ r.enerexIdentifier
372
+ ), [u, y] = I.useState(r.userName), [f, h] = I.useState(r.projectId), b = (p) => {
373
+ e(p.apiKey), o(p.clientId), h(p.projectId), l(p.enerexIdentifier), y(p.userName);
374
+ };
375
+ return /* @__PURE__ */ i(
376
+ ee.Provider,
377
+ {
378
+ value: {
379
+ clientId: s,
380
+ apiKey: n,
381
+ setConfiguration: b,
382
+ enerexIdentifier: a,
383
+ projectId: f,
384
+ userName: u
385
+ },
386
+ children: t
387
+ }
388
+ );
389
+ }, v = () => {
390
+ const t = J(ee);
391
+ if (!t)
392
+ throw new Error("widgetConfig must be used within a ConfigProvider");
393
+ return t;
394
+ }, te = (t = "", r) => ({ get: async (n, e) => {
394
395
  try {
395
- const o = await G.get(
396
+ const a = await V.get(
396
397
  `${t}${n}`,
397
398
  e ?? r
398
399
  );
399
- if (o.status === 200)
400
- return o.data;
401
- } catch (o) {
402
- throw o;
400
+ if (a.status === 200)
401
+ return a.data;
402
+ } catch (a) {
403
+ throw a;
403
404
  }
404
- }, post: async (n, e, o) => {
405
+ }, post: async (n, e, a) => {
405
406
  try {
406
- const l = await G.post(
407
+ const l = await V.post(
407
408
  `${t}${n}`,
408
409
  e,
409
- o ?? r
410
+ a ?? r
410
411
  );
411
412
  if (l.status === 200)
412
413
  return l.data;
413
414
  } catch (l) {
414
415
  throw l;
415
416
  }
416
- } }), O = {
417
+ } }), D = {
417
418
  EDITOR_SCRIPT_URL: "https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js",
418
419
  EDITOR_PLUGIN_ID: "1afdc3161ec7409a8627a1c8561d45f5",
419
420
  EDITOR_SECRET_KEY: "54ba748ed7e94f2e929555783acb03da",
420
421
  API_BASE_URL: "https://dev-socket.enerex.com/common/api"
421
422
  //API_BASE_URL: "https://localhost:44338/api",
422
423
  // more env variables...
423
- }, ie = $.createContext({
424
+ }, ne = I.createContext({
424
425
  get: () => {
425
426
  throw new Error("HttpClientContext.get not implemented");
426
427
  },
427
428
  post: () => {
428
429
  throw new Error("HttpClientContext.post not implemented");
429
430
  }
430
- }), we = ({ children: t }) => {
431
- const { clientId: r, apiKey: i } = w(), a = {
431
+ }), fe = ({ children: t }) => {
432
+ const { clientId: r, apiKey: s } = v(), o = {
432
433
  headers: {
433
434
  client_id: r,
434
- "x-api-key": i
435
+ "x-api-key": s
435
436
  }
436
- }, { get: n, post: e } = se(O.API_BASE_URL, a);
437
- return /* @__PURE__ */ s(ie.Provider, { value: { get: n, post: e }, children: t });
438
- }, ve = ({ children: t }) => {
439
- const r = new pe();
440
- return /* @__PURE__ */ s(we, { children: /* @__PURE__ */ s(me, { client: r, children: t }) });
441
- }, Te = (t) => {
442
- const r = Array.from(new Set(t.map((a) => a.category))), i = [];
443
- return r.forEach((a) => {
444
- const n = t.filter((e) => e.category === a).map((e) => ({
437
+ }, { get: n, post: e } = te(D.API_BASE_URL, o);
438
+ return /* @__PURE__ */ i(ne.Provider, { value: { get: n, post: e }, children: t });
439
+ }, ye = ({ children: t }) => {
440
+ const r = new le();
441
+ return /* @__PURE__ */ i(fe, { children: /* @__PURE__ */ i(de, { client: r, children: t }) });
442
+ }, he = (t) => {
443
+ const r = Array.from(new Set(t.map((o) => o.category))), s = [];
444
+ return r.forEach((o) => {
445
+ const n = t.filter((e) => e.category === o).map((e) => ({
445
446
  label: e.label,
446
447
  value: e.value,
447
448
  hint: e.hint,
448
449
  hidden: e.hidden
449
450
  }));
450
- i.push({ category: a, entries: n });
451
- }), i;
452
- }, P = () => {
453
- const t = te(ie);
451
+ s.push({ category: o, entries: n });
452
+ }), s;
453
+ }, A = () => {
454
+ const t = J(ne);
454
455
  if (t)
455
456
  return t;
456
457
  throw new Error("useHttpClient must be used within a HttpClientProvider");
457
- }, A = {
458
+ }, P = {
458
459
  Template_list: "/Template/list/",
459
460
  Template: "/Template/GetTemplate/",
460
461
  MergeTags: "/Template/TemplateMergeTags/",
461
462
  ExcludeCategory: "/Template/GetExcludeCategories/",
462
463
  SaveTemplate: "/Template/save-update/",
463
464
  TemplateTypes: "/Template/TemplateTypes/"
464
- }, Ce = () => {
465
- const t = P(), { enerexIdentifier: r, projectId: i } = w();
466
- return j({
465
+ }, be = () => {
466
+ const t = A(), { enerexIdentifier: r, projectId: s } = v();
467
+ return k({
467
468
  queryKey: ["getTemplateTags"],
468
469
  queryFn: async (n) => await t.get(
469
- `${A.MergeTags}${i}/${r}`
470
+ `${P.MergeTags}${s}/${r}`
470
471
  )
471
472
  });
472
- }, xe = () => {
473
- const t = P(), { enerexIdentifier: r, projectId: i } = w();
474
- return j({
473
+ }, we = () => {
474
+ const t = A(), { enerexIdentifier: r, projectId: s } = v();
475
+ return k({
475
476
  queryKey: ["getExcludeCategory"],
476
477
  queryFn: async (n) => await t.get(
477
- `${A.ExcludeCategory}${i}/${r}`
478
+ `${P.ExcludeCategory}${s}/${r}`
478
479
  )
479
480
  });
480
- }, Ie = ({
481
+ }, ve = ({
481
482
  templateHTML: t,
482
483
  className: r = "",
483
- loading: i = !1
484
+ loading: s = !1
484
485
  }) => {
485
- const { post: a } = se(), { data: n } = Ce(), { data: e } = xe(), [o, l] = x(
486
- t ?? { html: H, css: "" }
487
- ), { enerexIdentifier: p, projectId: m } = w(), u = "https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png", h = "https://plugins.stripo.email/api/v1/auth";
488
- q(() => {
486
+ const { post: o } = te(), { data: n } = be(), { data: e } = we(), [a, l] = E(
487
+ t ?? { html: j, css: "" }
488
+ ), { enerexIdentifier: u, 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
+ _(() => {
489
490
  if (n && e && !document.getElementById("UiEditorScript")) {
490
- const g = document.createElement("script");
491
- g.id = "UiEditorScript", g.type = "module", g.src = O.EDITOR_SCRIPT_URL, g.onload = v, document.body.appendChild(g);
491
+ const m = document.createElement("script");
492
+ m.id = "UiEditorScript", m.type = "module", m.src = D.EDITOR_SCRIPT_URL, m.onload = p, document.body.appendChild(m);
492
493
  }
493
494
  }, [n, e]);
494
- const v = async () => {
495
+ const p = async () => {
495
496
  window.UIEditor.initEditor(
496
497
  document.querySelector("#stripoEditorContainer"),
497
498
  {
498
- html: o.html,
499
- css: o.css,
499
+ html: a.html,
500
+ css: a.css,
500
501
  modulesExcludedCategories: e ?? [],
501
502
  forceRecreate: !0,
502
503
  metadata: {
503
- emailId: `${m}_${p}`,
504
+ emailId: `${y}_${u}`,
504
505
  userId: "1",
505
- username: "Plugin Demo User",
506
- avatarUrl: u
506
+ username: f,
507
+ avatarUrl: h
507
508
  },
508
509
  locale: "en",
509
- onTokenRefreshRequest: async function(g) {
510
- const T = {
511
- pluginId: O.EDITOR_PLUGIN_ID,
512
- secretKey: O.EDITOR_SECRET_KEY,
510
+ onTokenRefreshRequest: async function(m) {
511
+ const c = {
512
+ pluginId: D.EDITOR_PLUGIN_ID,
513
+ secretKey: D.EDITOR_SECRET_KEY,
513
514
  userId: "12",
514
515
  role: "user"
515
- }, c = await a(h, T);
516
- c && g(c.token);
516
+ }, g = await o(b, c);
517
+ g && m(g.token);
517
518
  },
518
519
  codeEditorButtonSelector: "#codeEditor",
519
520
  undoButtonSelector: "#undoButton",
520
521
  redoButtonSelector: "#redoButton",
521
522
  mobileViewButtonSelector: "#mobileViewButton",
522
523
  desktopViewButtonSelector: "#desktopViewButton",
523
- mergeTags: Te(n ?? [])
524
+ mergeTags: he(n ?? [])
524
525
  }
525
526
  );
526
527
  };
527
- return /* @__PURE__ */ s("div", { className: "position-relative", children: /* @__PURE__ */ b("div", { className: `editor-container ${r}`, children: [
528
- i && /* @__PURE__ */ s("div", { className: "loading-overlay", children: /* @__PURE__ */ s(
528
+ return /* @__PURE__ */ i("div", { className: "position-relative", children: /* @__PURE__ */ w("div", { className: `editor-container ${r}`, children: [
529
+ s && /* @__PURE__ */ i("div", { className: "loading-overlay", children: /* @__PURE__ */ i(
529
530
  U,
530
531
  {
531
532
  animation: "border",
@@ -535,240 +536,135 @@ const re = $.createContext(
535
536
  className: "me-1"
536
537
  }
537
538
  ) }),
538
- /* @__PURE__ */ s("div", { id: "externalSystemContainer" }),
539
- /* @__PURE__ */ s("div", { id: "stripoEditorContainer" })
539
+ /* @__PURE__ */ i("div", { id: "externalSystemContainer" }),
540
+ /* @__PURE__ */ i("div", { id: "stripoEditorContainer" })
540
541
  ] }) });
541
- }, Ee = ({
542
+ }, Te = ({
542
543
  label: t,
543
544
  register: r,
544
- validation: i,
545
- required: a = !1,
545
+ validation: s,
546
+ required: o = !1,
546
547
  name: n,
547
548
  error: e,
548
- ...o
549
- }) => /* @__PURE__ */ b(I.Group, { className: "mb-1", children: [
550
- t ? /* @__PURE__ */ b(I.Label, { className: "mb-3 d-block form-label", children: [
549
+ ...a
550
+ }) => /* @__PURE__ */ w(S.Group, { className: "mb-1", children: [
551
+ t ? /* @__PURE__ */ w(S.Label, { className: "mb-3 d-block form-label", children: [
551
552
  t,
552
- a && /* @__PURE__ */ s("label", { className: "text-danger", children: "*" })
553
+ o && /* @__PURE__ */ i("label", { className: "text-danger", children: "*" })
553
554
  ] }) : null,
554
- /* @__PURE__ */ s(
555
- I.Control,
555
+ /* @__PURE__ */ i(
556
+ S.Control,
556
557
  {
557
558
  name: n,
558
559
  type: "text",
559
- ...o,
560
+ ...a,
560
561
  isInvalid: !!(e && e[n]),
561
562
  ...r ? r(n, {
562
- ...i
563
+ ...s
563
564
  }) : {},
564
565
  className: `form-control ${e && e[n] && "border border-danger"}`
565
566
  }
566
567
  ),
567
- e && e[n] ? /* @__PURE__ */ s(I.Control.Feedback, { type: "invalid", children: e[n].message }) : null
568
- ] });
569
- function Ne({
570
- items: t,
571
- renderItem: r,
572
- className: i = "",
573
- keyExtractor: a
574
- }) {
575
- return /* @__PURE__ */ s(K, { className: ` ${i}`, children: t.map((n, e) => /* @__PURE__ */ s(K.Item, { children: r(n, e) }, a ? a(n, e) : e)) });
576
- }
577
- const Se = (t) => /* @__PURE__ */ s("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 640 640", ...t, children: /* @__PURE__ */ s("path", { d: "M352 528L128 528C119.2 528 112 520.8 112 512L112 288C112 279.2 119.2 272 128 272L176 272L176 224L128 224C92.7 224 64 252.7 64 288L64 512C64 547.3 92.7 576 128 576L352 576C387.3 576 416 547.3 416 512L416 464L368 464L368 512C368 520.8 360.8 528 352 528zM288 368C279.2 368 272 360.8 272 352L272 128C272 119.2 279.2 112 288 112L512 112C520.8 112 528 119.2 528 128L528 352C528 360.8 520.8 368 512 368L288 368zM224 352C224 387.3 252.7 416 288 416L512 416C547.3 416 576 387.3 576 352L576 128C576 92.7 547.3 64 512 64L288 64C252.7 64 224 92.7 224 128L224 352z" }) }), Le = ({ children: t, title: r, placement: i }) => {
578
- const a = /* @__PURE__ */ s(W, { id: "popover-basic", className: "dark-popover", children: /* @__PURE__ */ s(W.Body, { className: "p-0 text-white", children: r }) });
579
- return /* @__PURE__ */ s(
580
- ge,
581
- {
582
- trigger: ["hover", "focus"],
583
- placement: i,
584
- overlay: a,
585
- containerPadding: 0,
586
- container: document.body,
587
- popperConfig: {
588
- modifiers: [
589
- {
590
- name: "flip",
591
- enabled: !1
592
- },
593
- {
594
- name: "preventOverflow",
595
- enabled: !0,
596
- options: { boundary: "window" }
597
- }
598
- ]
599
- },
600
- children: t
601
- }
602
- );
603
- }, _e = ({
604
- selected: t,
605
- group: r,
606
- value: i,
607
- label: a,
608
- onCopy: n,
609
- onSelect: e,
610
- subItem: o = !1
611
- }) => /* @__PURE__ */ b(
612
- "div",
613
- {
614
- className: "ps-1 py-1 d-flex position-relative",
615
- style: { alignItems: "center" },
616
- children: [
617
- /* @__PURE__ */ s(
618
- "input",
619
- {
620
- type: "radio",
621
- onChange: () => {
622
- e(i);
623
- },
624
- className: "me-2",
625
- checked: t,
626
- name: r
627
- }
628
- ),
629
- /* @__PURE__ */ s("p", { title: a, className: "mb-0 wraped-text", children: a }),
630
- !o && /* @__PURE__ */ s(Le, { title: "Copy", placement: "top", children: /* @__PURE__ */ s(
631
- "button",
632
- {
633
- className: "btn btn-link",
634
- type: "button",
635
- style: {
636
- padding: 0,
637
- marginLeft: "auto",
638
- position: "relative",
639
- minWidth: 32,
640
- flexShrink: 0
641
- },
642
- children: /* @__PURE__ */ s(
643
- Se,
644
- {
645
- onClick: () => n(i),
646
- height: 20,
647
- fill: "black"
648
- }
649
- )
650
- }
651
- ) })
652
- ]
653
- }
654
- ), $e = () => {
655
- const t = P(), { enerexIdentifier: r, projectId: i } = w();
656
- return j({
568
+ e && e[n] ? /* @__PURE__ */ i(S.Control.Feedback, { type: "invalid", children: e[n].message }) : null
569
+ ] }), xe = () => {
570
+ const t = A(), { enerexIdentifier: r, projectId: s } = v();
571
+ return k({
657
572
  queryKey: ["getTemplatesList"],
658
573
  queryFn: async (n) => await t.get(
659
- `${A.Template_list}${i}/${r}`
574
+ `${P.Template_list}${s}/${r}`
660
575
  )
661
576
  });
662
- }, Pe = (t, r = []) => {
663
- const i = /^(?:\(copy(?:-(\d+))?\)\s)?(.+)$/, a = t.match(i);
664
- if (!a) return `(copy) ${t}`;
665
- const n = a[2], e = new RegExp(
666
- `^\\(copy(?:-(\\d+))?\\) ${n.replace(
667
- /[.*+?^${}()|[\]\\]/g,
668
- "\\$&"
669
- )}$`
670
- );
671
- let o = 1;
672
- const l = r.filter((p) => e.test(p));
673
- return l.length === 0 ? `(copy) ${n}` : (l.forEach((p) => {
674
- const m = p.match(e);
675
- if (m && m[1]) {
676
- const u = parseInt(m[1], 10);
677
- !isNaN(u) && u >= o && (o = u + 1);
678
- } else
679
- o = Math.max(o, 2);
680
- }), `(copy-${o}) ${n}`);
681
- }, Ae = () => {
682
- const t = P(), { enerexIdentifier: r, projectId: i } = w();
683
- return ne({
577
+ }, Ce = () => {
578
+ const t = A(), { enerexIdentifier: r, projectId: s } = v();
579
+ return Z({
684
580
  mutationKey: ["getTemplate"],
685
581
  mutationFn: async ({ id: n }) => {
686
582
  if (n)
687
583
  return await t.get(
688
- `${A.Template}${r}/${n}/${i}`
584
+ `${P.Template}${r}/${n}/${s}`
689
585
  );
690
586
  }
691
587
  });
692
- }, Re = () => {
693
- const t = P(), { enerexIdentifier: r, projectId: i } = w();
694
- return j({
588
+ }, Ie = () => {
589
+ const t = A(), { enerexIdentifier: r, projectId: s } = v();
590
+ return k({
695
591
  queryKey: ["getTemplateTypes"],
696
592
  queryFn: async (n) => await t.get(
697
- `${A.TemplateTypes}${r}/${i}`
593
+ `${P.TemplateTypes}${r}/${s}`
698
594
  )
699
595
  });
700
596
  };
701
- function ke(t) {
597
+ function Ee(t) {
702
598
  return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
703
599
  }
704
- var M = { exports: {} };
600
+ var B = { exports: {} };
705
601
  /*!
706
602
  Copyright (c) 2018 Jed Watson.
707
603
  Licensed under the MIT License (MIT), see
708
604
  http://jedwatson.github.io/classnames
709
605
  */
710
- var Z;
711
- function qe() {
712
- return Z || (Z = 1, function(t) {
606
+ var Q;
607
+ function Se() {
608
+ return Q || (Q = 1, function(t) {
713
609
  (function() {
714
610
  var r = {}.hasOwnProperty;
715
- function i() {
716
- for (var e = "", o = 0; o < arguments.length; o++) {
717
- var l = arguments[o];
718
- l && (e = n(e, a(l)));
611
+ function s() {
612
+ for (var e = "", a = 0; a < arguments.length; a++) {
613
+ var l = arguments[a];
614
+ l && (e = n(e, o(l)));
719
615
  }
720
616
  return e;
721
617
  }
722
- function a(e) {
618
+ function o(e) {
723
619
  if (typeof e == "string" || typeof e == "number")
724
620
  return e;
725
621
  if (typeof e != "object")
726
622
  return "";
727
623
  if (Array.isArray(e))
728
- return i.apply(null, e);
624
+ return s.apply(null, e);
729
625
  if (e.toString !== Object.prototype.toString && !e.toString.toString().includes("[native code]"))
730
626
  return e.toString();
731
- var o = "";
627
+ var a = "";
732
628
  for (var l in e)
733
- r.call(e, l) && e[l] && (o = n(o, l));
734
- return o;
629
+ r.call(e, l) && e[l] && (a = n(a, l));
630
+ return a;
735
631
  }
736
- function n(e, o) {
737
- return o ? e ? e + " " + o : e + o : e;
632
+ function n(e, a) {
633
+ return a ? e ? e + " " + a : e + a : e;
738
634
  }
739
- t.exports ? (i.default = i, t.exports = i) : window.classNames = i;
635
+ t.exports ? (s.default = s, t.exports = s) : window.classNames = s;
740
636
  })();
741
- }(M)), M.exports;
637
+ }(B)), B.exports;
742
638
  }
743
- var De = qe();
744
- const ee = /* @__PURE__ */ ke(De), Oe = ({
639
+ var Ne = Se();
640
+ const W = /* @__PURE__ */ Ee(Ne), _e = ({
745
641
  name: t = "",
746
642
  control: r,
747
- options: i,
748
- multiple: a = !1,
643
+ options: s,
644
+ multiple: o = !1,
749
645
  placeholder: n,
750
646
  validation: e,
751
- labelKey: o = "name",
647
+ labelKey: a = "name",
752
648
  disabled: l,
753
- isInvalid: p,
754
- value: m,
755
- onChange: u,
649
+ isInvalid: u,
650
+ value: y,
651
+ onChange: f,
756
652
  uncontrolled: h,
757
- menuPlacement: v = "auto",
758
- closeOnSelect: g = !0
653
+ menuPlacement: b = "auto",
654
+ closeOnSelect: p = !0
759
655
  }) => {
760
- const T = {
656
+ const m = {
761
657
  control: (c) => ({
762
658
  ...c,
763
659
  minHeight: "33px",
764
660
  // state.isFocused can display different borderColor if you need it
765
- borderColor: p ? "var(--bs-form-invalid-border-color) !important" : "var(--ct-input-border-color)",
766
- 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",
661
+ borderColor: u ? "var(--bs-form-invalid-border-color) !important" : "var(--ct-input-border-color)",
662
+ 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",
767
663
  backgroundRepeat: "no-repeat",
768
664
  backgroundPosition: "right calc(0.375em + 0.225rem) center",
769
665
  backgroundSize: "calc(0.75em + 0.45rem) calc(0.75em + 0.45rem)",
770
666
  "&:hover": {
771
- borderColor: p ? "var(--bs-form-invalid-border-color)" : "var(--ct-input-border-color)"
667
+ borderColor: u ? "var(--bs-form-invalid-border-color)" : "var(--ct-input-border-color)"
772
668
  },
773
669
  "& .react-select__single-value": {
774
670
  color: "var(--ct-input-color) !important"
@@ -795,296 +691,301 @@ const ee = /* @__PURE__ */ ke(De), Oe = ({
795
691
  display: l ? "none" : "block"
796
692
  })
797
693
  };
798
- return h ? /* @__PURE__ */ s(
799
- J,
694
+ return h ? /* @__PURE__ */ i(
695
+ G,
800
696
  {
801
- className: ee({
802
- "is-invalid": p
697
+ className: W({
698
+ "is-invalid": u
803
699
  }),
804
- styles: T,
700
+ styles: m,
805
701
  classNamePrefix: "react-select",
806
- isMulti: a,
807
- options: i,
808
- onChange: u,
702
+ isMulti: o,
703
+ options: s,
704
+ onChange: f,
809
705
  placeholder: n,
810
706
  menuPortalTarget: document.body,
811
- value: m,
812
- getOptionLabel: typeof o == "string" ? (c) => c[o] : o,
707
+ value: y,
708
+ getOptionLabel: typeof a == "string" ? (c) => c[a] : a,
813
709
  getOptionValue: (c) => c.id,
814
710
  isDisabled: l,
815
- menuPlacement: v,
816
- closeMenuOnSelect: g
711
+ menuPlacement: b,
712
+ closeMenuOnSelect: p
817
713
  }
818
- ) : /* @__PURE__ */ s(
819
- ye,
714
+ ) : /* @__PURE__ */ i(
715
+ me,
820
716
  {
821
717
  control: r,
822
718
  name: t,
823
719
  rules: e,
824
- render: ({ field: { onChange: c, value: C, onBlur: R } }) => /* @__PURE__ */ s(
825
- J,
720
+ render: ({ field: { onChange: c, value: g, onBlur: L } }) => /* @__PURE__ */ i(
721
+ G,
826
722
  {
827
- className: ee({
828
- "is-invalid": p
723
+ className: W({
724
+ "is-invalid": u
829
725
  }),
830
- styles: T,
726
+ styles: m,
831
727
  classNamePrefix: "react-select",
832
- isMulti: a,
833
- options: i,
834
- onBlur: R,
728
+ isMulti: o,
729
+ options: s,
730
+ onBlur: L,
835
731
  onChange: c,
836
732
  placeholder: n,
837
733
  menuPortalTarget: document.body,
838
- value: C,
839
- getOptionLabel: typeof o == "string" ? (E) => E[o] : o,
840
- getOptionValue: (E) => E.id,
734
+ value: g,
735
+ getOptionLabel: typeof a == "string" ? (T) => T[a] : a,
736
+ getOptionValue: (T) => T.id,
841
737
  isDisabled: l,
842
- menuPlacement: v,
843
- closeMenuOnSelect: g
738
+ menuPlacement: b,
739
+ closeMenuOnSelect: p
844
740
  },
845
- C ? JSON.stringify(C) : "reset"
741
+ g ? JSON.stringify(g) : "reset"
846
742
  )
847
743
  }
848
744
  );
849
- }, je = ({
745
+ }, Y = ({
850
746
  label: t,
851
747
  name: r,
852
- validation: i,
853
- control: a,
748
+ validation: s,
749
+ control: o,
854
750
  error: n,
855
751
  ...e
856
- }) => /* @__PURE__ */ b(I.Group, { className: "mb-1", children: [
857
- t && /* @__PURE__ */ b(I.Label, { className: "mb-3 d-block form-label", children: [
752
+ }) => /* @__PURE__ */ w(S.Group, { className: "mb-1", children: [
753
+ t && /* @__PURE__ */ w(S.Label, { className: "mb-3 d-block form-label", children: [
858
754
  t,
859
755
  " ",
860
- e.required && /* @__PURE__ */ s("span", { className: "text-danger", children: "*" })
756
+ e.required && /* @__PURE__ */ i("span", { className: "text-danger", children: "*" })
861
757
  ] }),
862
- /* @__PURE__ */ s(
863
- Oe,
758
+ /* @__PURE__ */ i(
759
+ _e,
864
760
  {
865
- control: a,
761
+ control: o,
866
762
  options: e.options ?? [],
867
- validation: i,
763
+ validation: s,
868
764
  isInvalid: n && !!n[r],
869
765
  name: r
870
766
  }
871
767
  ),
872
- n && n[r] ? /* @__PURE__ */ s(I.Control.Feedback, { type: "invalid", children: n[r].message }) : null
873
- ] }), Be = () => {
874
- const t = P();
875
- ue();
876
- const { enerexIdentifier: r, projectId: i } = w();
877
- return ne({
768
+ n && n[r] ? /* @__PURE__ */ i(S.Control.Feedback, { type: "invalid", children: n[r].message }) : null
769
+ ] }), Ae = () => {
770
+ const t = A();
771
+ ce();
772
+ const { enerexIdentifier: r, projectId: s } = v();
773
+ return Z({
878
774
  mutationKey: ["saveTemplate"],
879
- mutationFn: async (n) => (n.enerexIdentifier = r ?? "", n.projectId = i ?? "", await t.post(
880
- `${A.SaveTemplate}`,
775
+ mutationFn: async (n) => (n.enerexIdentifier = r ?? "", n.projectId = s ?? "", await t.post(
776
+ `${P.SaveTemplate}`,
881
777
  n
882
778
  ))
883
779
  });
884
- }, Me = ({
780
+ }, X = { id: "", name: "New (Blank)" }, Pe = ({
885
781
  onSelectItem: t,
886
782
  templateLoading: r,
887
- onReset: i
783
+ onReset: s
888
784
  }) => {
889
785
  const {
890
- register: a,
786
+ register: o,
891
787
  handleSubmit: n,
892
788
  clearErrors: e,
893
- setValue: o,
789
+ setValue: a,
894
790
  control: l,
895
- reset: p,
896
- formState: { errors: m }
897
- } = he({
791
+ watch: u,
792
+ reset: y,
793
+ formState: { errors: f }
794
+ } = ue({
898
795
  defaultValues: {
899
796
  templateName: "",
900
- templateType: void 0
797
+ templateType: void 0,
798
+ template: X
901
799
  },
902
800
  mode: "onChange"
903
801
  }), {
904
- data: u,
905
- refetch: h,
906
- isLoading: v
907
- } = $e(), [g, T] = x([]), [c, C] = x(), [R, E] = x(), { mutateAsync: F, isPending: N } = Ae(), { mutateAsync: oe, isPending: D } = Be(), { data: k, isLoading: z } = Re(), [B, ae] = x([]);
908
- q(() => {
909
- k && ae(
910
- k.map((d) => ({
802
+ data: h,
803
+ refetch: b,
804
+ isLoading: p
805
+ } = xe(), [m, c] = E([]), [g, L] = E(), [T, H] = E(), { mutateAsync: re, isPending: N } = Ce(), { mutateAsync: se, isPending: R } = Ae(), { data: $, isLoading: M } = Ie(), [F, ie] = E([]);
806
+ _(() => {
807
+ $ && ie(
808
+ $.map((d) => ({
911
809
  id: `${d.id}`,
912
810
  name: d.name
913
811
  }))
914
812
  );
915
- }, [k]), q(() => {
813
+ }, [$]), _(() => {
916
814
  r(!!N);
917
- }, [N]), q(() => {
918
- T(u ?? []);
919
- }, [u]);
920
- const le = async (d, f) => {
921
- f && T((y) => {
922
- const S = [...y], L = { ...f };
923
- L.id = "", L.name = Pe(
924
- L.name,
925
- S.map((_) => _.name)
926
- ), S.splice(d + 1, 0, L), C(L), o("templateName", L.name);
927
- const V = B.find((_) => _.id === `${f.type}`);
928
- return V ? o("templateType", V) : o("templateType", void 0), e(), F({ id: f?.id }).then((_) => {
929
- _ && E(_);
930
- }), S;
931
- });
932
- }, ce = async (d) => {
933
- if (C(d), d) {
934
- if (o("templateName", d?.name), k && k.find((y) => y.id === d.type)) {
935
- const y = B.find((S) => S.id === `${d.type}`);
936
- y && o("templateType", y);
815
+ }, [N]), _(() => {
816
+ c(h ?? []);
817
+ }, [h]);
818
+ const ae = async (d) => {
819
+ if (L(d), d) {
820
+ if (a("templateName", d?.name), $ && $.find((C) => C.id === d.type)) {
821
+ const C = F.find((O) => O.id === `${d.type}`);
822
+ C && a("templateType", C);
937
823
  } else
938
- o("templateType", void 0);
824
+ a("templateType", void 0);
939
825
  e();
940
826
  }
941
- const f = await F({ id: d?.id });
942
- f && E(f);
827
+ const x = await re({ id: d?.id });
828
+ H(x || void 0);
943
829
  };
944
- q(() => {
945
- t(R && c ? R : void 0);
946
- }, [R, c, t]);
947
- const de = (d) => {
830
+ _(() => {
831
+ let d = m.find((x) => x.id === u("template")?.id);
832
+ ae(d);
833
+ }, [u("template")]), _(() => {
834
+ t(T && g ? T : void 0);
835
+ }, [T, g, t]);
836
+ const oe = (d) => {
948
837
  window.StripoEditorApi.actionsApi.getTemplateData(
949
- async (f) => {
950
- const y = {
838
+ async (x) => {
839
+ let C = d.template.id;
840
+ g?.projectId === 0 && (C = "");
841
+ const O = {
951
842
  enerexIdentifier: "",
952
843
  projectId: "",
953
- templateId: c?.id ?? "",
844
+ templateId: C,
954
845
  templateType: d.templateType.id,
955
846
  name: d.templateName,
956
- html: f.html,
957
- css: f.css
847
+ html: x.html,
848
+ css: x.css
958
849
  };
959
- await oe(y) && (e(), c?.id === "" && p(), h());
850
+ await se(O) && (e(), y(), b());
960
851
  }
961
852
  );
962
853
  };
963
- return /* @__PURE__ */ s(Q, { className: "border border-0 text-start", children: /* @__PURE__ */ s(Q.Body, { className: "pe-0 ps-2", children: /* @__PURE__ */ b("form", { onSubmit: n(de), children: [
964
- /* @__PURE__ */ s("label", { className: "mb-2", children: "Templates" }),
965
- /* @__PURE__ */ s("div", { className: "template-list-container mb-3", children: /* @__PURE__ */ s(
966
- Ne,
854
+ return /* @__PURE__ */ i(K, { className: "border border-0 text-start", children: /* @__PURE__ */ i(K.Body, { className: "pe-0 ps-2", children: /* @__PURE__ */ i("form", { onSubmit: n(oe), children: /* @__PURE__ */ i("div", { className: "template-list-container mb-3", children: /* @__PURE__ */ w(pe, { children: [
855
+ /* @__PURE__ */ i(q, { md: 3, children: /* @__PURE__ */ i(
856
+ Y,
967
857
  {
968
- items: g,
969
- renderItem: (d, f) => /* @__PURE__ */ s(
970
- _e,
971
- {
972
- selected: d === c,
973
- label: d.name,
974
- subItem: d.id === "",
975
- onCopy: (y) => le(f, y),
976
- onSelect: (y) => ce(y),
977
- value: d,
978
- group: "templates"
858
+ label: "Type",
859
+ control: l,
860
+ error: f,
861
+ options: F,
862
+ required: !0,
863
+ validation: {
864
+ required: {
865
+ value: !0,
866
+ message: "Template Type is required"
979
867
  }
980
- )
868
+ },
869
+ ...o("templateType")
981
870
  }
982
871
  ) }),
983
- /* @__PURE__ */ s(
984
- je,
872
+ /* @__PURE__ */ i(q, { md: 3, children: /* @__PURE__ */ i(
873
+ Y,
985
874
  {
986
- label: "Template Type",
875
+ label: "Template",
987
876
  control: l,
988
- error: m,
989
- options: B,
990
- required: !0,
991
- validation: {
992
- required: { value: !0, message: "Template Type is required" }
993
- },
994
- ...a("templateType")
877
+ error: f,
878
+ options: [
879
+ X,
880
+ ...m.map((d) => ({
881
+ id: d.id,
882
+ name: d.name
883
+ }))
884
+ ],
885
+ required: !1,
886
+ ...o("template")
995
887
  }
996
- ),
997
- /* @__PURE__ */ s(
998
- Ee,
888
+ ) }),
889
+ /* @__PURE__ */ i(q, { md: 3, children: /* @__PURE__ */ i(
890
+ Te,
999
891
  {
1000
- label: "Template Name",
1001
- register: a,
1002
- error: m,
892
+ label: "Name",
893
+ register: o,
894
+ error: f,
1003
895
  required: !0,
1004
896
  name: "templateName",
1005
897
  validation: {
1006
- required: { value: !0, message: "Template Name is required" }
898
+ required: {
899
+ value: !0,
900
+ message: "Template Name is required"
901
+ }
1007
902
  }
1008
903
  }
1009
- ),
1010
- /* @__PURE__ */ s("hr", {}),
1011
- /* @__PURE__ */ b("div", { className: "d-flex justify-content-between mt-3 ", children: [
1012
- /* @__PURE__ */ s(
1013
- Y,
1014
- {
1015
- style: { width: "70px" },
1016
- variant: "primary",
1017
- disabled: v || N || D || z,
1018
- onClick: () => {
1019
- C(void 0), p(), i();
1020
- },
1021
- children: N || D ? /* @__PURE__ */ s(
1022
- U,
904
+ ) }),
905
+ /* @__PURE__ */ w(
906
+ q,
907
+ {
908
+ md: 3,
909
+ className: "d-flex align-items-end justify-content-end gap-2 mb-3",
910
+ children: [
911
+ /* @__PURE__ */ i(
912
+ z,
1023
913
  {
1024
- animation: "border",
1025
- style: { width: "11px", height: "11px" },
1026
- size: "sm",
1027
- role: "status",
1028
- className: "me-1",
1029
- children: /* @__PURE__ */ s("span", { className: "visually-hidden", children: "Loading..." })
914
+ style: { width: "70px" },
915
+ variant: "primary",
916
+ disabled: p || N || R || M,
917
+ onClick: () => {
918
+ L(void 0), y(), s();
919
+ },
920
+ children: N || R ? /* @__PURE__ */ i(
921
+ U,
922
+ {
923
+ animation: "border",
924
+ style: { width: "11px", height: "11px" },
925
+ size: "sm",
926
+ role: "status",
927
+ className: "me-1",
928
+ children: /* @__PURE__ */ i("span", { className: "visually-hidden", children: "Loading..." })
929
+ }
930
+ ) : "Clear"
1030
931
  }
1031
- ) : "Clear"
1032
- }
1033
- ),
1034
- /* @__PURE__ */ s(
1035
- Y,
1036
- {
1037
- type: "submit",
1038
- variant: "primary",
1039
- style: { width: "80px" },
1040
- disabled: v || N || D || z,
1041
- children: N || D ? /* @__PURE__ */ s(
1042
- U,
932
+ ),
933
+ /* @__PURE__ */ i(
934
+ z,
1043
935
  {
1044
- animation: "border",
1045
- style: { width: "11px", height: "11px" },
1046
- size: "sm",
1047
- role: "status",
1048
- className: "me-1",
1049
- children: /* @__PURE__ */ s("span", { className: "visually-hidden", children: "Loading..." })
936
+ type: "submit",
937
+ variant: "primary",
938
+ style: { width: "80px" },
939
+ disabled: p || N || R || M,
940
+ children: N || R ? /* @__PURE__ */ i(
941
+ U,
942
+ {
943
+ animation: "border",
944
+ style: { width: "11px", height: "11px" },
945
+ size: "sm",
946
+ role: "status",
947
+ className: "me-1",
948
+ children: /* @__PURE__ */ i("span", { className: "visually-hidden", children: "Loading..." })
949
+ }
950
+ ) : (g?.id ?? "") === "" ? "Save" : (g?.projectId ?? "") === 0 ? "Save as" : "Save"
1050
951
  }
1051
- ) : (c?.id ?? "") === "" ? "Save" : "Update"
1052
- }
1053
- )
1054
- ] })
1055
- ] }) }) });
1056
- }, We = ({ config: t }) => {
1057
- const [r, i] = x(), [a, n] = x(!1);
1058
- return /* @__PURE__ */ s(be, { configs: t, children: /* @__PURE__ */ s(ve, { children: /* @__PURE__ */ s("div", { className: "root-widget", children: /* @__PURE__ */ b(fe, { children: [
1059
- /* @__PURE__ */ s(X, { md: 3, lg: 2, className: "p-0", children: /* @__PURE__ */ s(
1060
- Me,
952
+ )
953
+ ]
954
+ }
955
+ )
956
+ ] }) }) }) }) });
957
+ }, Be = ({ config: t }) => {
958
+ const [r, s] = E(), [o, n] = E(!1);
959
+ return /* @__PURE__ */ i(ge, { configs: t, children: /* @__PURE__ */ i(ye, { children: /* @__PURE__ */ w("div", { className: "root-widget", children: [
960
+ /* @__PURE__ */ i(
961
+ Pe,
1061
962
  {
1062
963
  templateLoading: n,
1063
964
  onSelectItem: (l) => {
1064
- i(l), window.StripoEditorApi && window.StripoEditorApi.actionsApi && l && window.StripoEditorApi.actionsApi.updateHtmlAndCss(
1065
- l?.html ?? "",
965
+ s(l), window.StripoEditorApi && window.StripoEditorApi.actionsApi && window.StripoEditorApi.actionsApi.updateHtmlAndCss(
966
+ l?.html ?? j,
1066
967
  l?.css ?? "",
1067
968
  ""
1068
969
  );
1069
970
  },
1070
971
  onReset: () => {
1071
- n(!1), i(void 0), window.StripoEditorApi && window.StripoEditorApi.actionsApi && window.StripoEditorApi.actionsApi.updateHtmlAndCss(H, "", "");
972
+ n(!1), s(void 0), window.StripoEditorApi && window.StripoEditorApi.actionsApi && window.StripoEditorApi.actionsApi.updateHtmlAndCss(j, "", "");
1072
973
  }
1073
974
  }
1074
- ) }),
1075
- /* @__PURE__ */ s(X, { md: 9, lg: 10, children: /* @__PURE__ */ s(
1076
- Ie,
975
+ ),
976
+ /* @__PURE__ */ i(
977
+ ve,
1077
978
  {
1078
979
  templateHTML: {
1079
980
  css: r?.css ?? "",
1080
- html: r?.html ?? H
981
+ html: r?.html ?? j
1081
982
  },
1082
- loading: a,
983
+ loading: o,
1083
984
  className: "col-span-5"
1084
985
  }
1085
- ) })
1086
- ] }) }) }) });
986
+ )
987
+ ] }) }) });
1087
988
  };
1088
989
  export {
1089
- We as EditorWidget
990
+ Be as EditorWidget
1090
991
  };
@@ -1,4 +1,4 @@
1
- (function(u,t){typeof exports=="object"&&typeof module<"u"?t(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"],t):(u=typeof globalThis<"u"?globalThis:u||self,t(u.EnerexTemplateEditor={},u.jsxRuntime,u.React,u.reactQuery,u.axios,u.reactBootstrap,u.reactHookForm,u.Select$1))})(this,function(u,t,p,T,U,c,H,z){"use strict";const G=p.createContext(void 0),Q=({children:n,configs:s})=>{const[i,l]=p.useState(s.clientId),[r,e]=p.useState(s.apiKey),[o,a]=p.useState(s.enerexIdentifier),[f,g]=p.useState(s.projectId),y=v=>{e(v.apiKey),l(v.clientId),g(v.projectId),a(v.enerexIdentifier)};return t.jsx(G.Provider,{value:{clientId:i,apiKey:r,setConfiguration:y,enerexIdentifier:o,projectId:f},children:n})},C=()=>{const n=p.useContext(G);if(!n)throw new Error("widgetConfig must be used within a ConfigProvider");return n},O=`<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
1
+ (function(u,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):(u=typeof globalThis<"u"?globalThis:u||self,n(u.EnerexTemplateEditor={},u.jsxRuntime,u.React,u.reactQuery,u.axios,u.reactBootstrap,u.reactHookForm,u.Select$1))})(this,function(u,n,d,b,O,c,F,M){"use strict";const A=`<!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
- `,V=(n="",s)=>({get:async(r,e)=>{try{const o=await U.get(`${n}${r}`,e??s);if(o.status===200)return o.data}catch(o){throw o}},post:async(r,e,o)=>{try{const a=await U.post(`${n}${r}`,e,o??s);if(a.status===200)return a.data}catch(a){throw a}}}),j={EDITOR_SCRIPT_URL:"https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js",EDITOR_PLUGIN_ID:"1afdc3161ec7409a8627a1c8561d45f5",EDITOR_SECRET_KEY:"54ba748ed7e94f2e929555783acb03da",API_BASE_URL:"https://dev-socket.enerex.com/common/api"},K=p.createContext({get:()=>{throw new Error("HttpClientContext.get not implemented")},post:()=>{throw new Error("HttpClientContext.post not implemented")}}),Z=({children:n})=>{const{clientId:s,apiKey:i}=C(),l={headers:{client_id:s,"x-api-key":i}},{get:r,post:e}=V(j.API_BASE_URL,l);return t.jsx(K.Provider,{value:{get:r,post:e},children:n})},R=({children:n})=>{const s=new T.QueryClient;return t.jsx(Z,{children:t.jsx(T.QueryClientProvider,{client:s,children:n})})},ee=n=>{const s=Array.from(new Set(n.map(l=>l.category))),i=[];return s.forEach(l=>{const r=n.filter(e=>e.category===l).map(e=>({label:e.label,value:e.value,hint:e.hint,hidden:e.hidden}));i.push({category:l,entries:r})}),i},S=()=>{const n=p.useContext(K);if(n)return n;throw new Error("useHttpClient must be used within a HttpClientProvider")},N={Template_list:"/Template/list/",Template:"/Template/GetTemplate/",MergeTags:"/Template/TemplateMergeTags/",ExcludeCategory:"/Template/GetExcludeCategories/",SaveTemplate:"/Template/save-update/",TemplateTypes:"/Template/TemplateTypes/"},te=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getTemplateTags"],queryFn:async r=>await n.get(`${N.MergeTags}${i}/${s}`)})},ne=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getExcludeCategory"],queryFn:async r=>await n.get(`${N.ExcludeCategory}${i}/${s}`)})},re=({templateHTML:n,className:s="",loading:i=!1})=>{const{post:l}=V(),{data:r}=te(),{data:e}=ne(),[o,a]=p.useState(n??{html:O,css:""}),{enerexIdentifier:f,projectId:g}=C(),y="https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png",v="https://plugins.stripo.email/api/v1/auth";p.useEffect(()=>{if(r&&e&&!document.getElementById("UiEditorScript")){const h=document.createElement("script");h.id="UiEditorScript",h.type="module",h.src=j.EDITOR_SCRIPT_URL,h.onload=x,document.body.appendChild(h)}},[r,e]);const x=async()=>{window.UIEditor.initEditor(document.querySelector("#stripoEditorContainer"),{html:o.html,css:o.css,modulesExcludedCategories:e??[],forceRecreate:!0,metadata:{emailId:`${g}_${f}`,userId:"1",username:"Plugin Demo User",avatarUrl:y},locale:"en",onTokenRefreshRequest:async function(h){const I={pluginId:j.EDITOR_PLUGIN_ID,secretKey:j.EDITOR_SECRET_KEY,userId:"12",role:"user"},d=await l(v,I);d&&h(d.token)},codeEditorButtonSelector:"#codeEditor",undoButtonSelector:"#undoButton",redoButtonSelector:"#redoButton",mobileViewButtonSelector:"#mobileViewButton",desktopViewButtonSelector:"#desktopViewButton",mergeTags:ee(r??[])})};return t.jsx("div",{className:"position-relative",children:t.jsxs("div",{className:`editor-container ${s}`,children:[i&&t.jsx("div",{className:"loading-overlay",children:t.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1"})}),t.jsx("div",{id:"externalSystemContainer"}),t.jsx("div",{id:"stripoEditorContainer"})]})})},se=({label:n,register:s,validation:i,required:l=!1,name:r,error:e,...o})=>t.jsxs(c.Form.Group,{className:"mb-1",children:[n?t.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[n,l&&t.jsx("label",{className:"text-danger",children:"*"})]}):null,t.jsx(c.Form.Control,{name:r,type:"text",...o,isInvalid:!!(e&&e[r]),...s?s(r,{...i}):{},className:`form-control ${e&&e[r]&&"border border-danger"}`}),e&&e[r]?t.jsx(c.Form.Control.Feedback,{type:"invalid",children:e[r].message}):null]});function oe({items:n,renderItem:s,className:i="",keyExtractor:l}){return t.jsx(c.ListGroup,{className:` ${i}`,children:n.map((r,e)=>t.jsx(c.ListGroup.Item,{children:s(r,e)},l?l(r,e):e))})}const ie=n=>t.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 640 640",...n,children:t.jsx("path",{d:"M352 528L128 528C119.2 528 112 520.8 112 512L112 288C112 279.2 119.2 272 128 272L176 272L176 224L128 224C92.7 224 64 252.7 64 288L64 512C64 547.3 92.7 576 128 576L352 576C387.3 576 416 547.3 416 512L416 464L368 464L368 512C368 520.8 360.8 528 352 528zM288 368C279.2 368 272 360.8 272 352L272 128C272 119.2 279.2 112 288 112L512 112C520.8 112 528 119.2 528 128L528 352C528 360.8 520.8 368 512 368L288 368zM224 352C224 387.3 252.7 416 288 416L512 416C547.3 416 576 387.3 576 352L576 128C576 92.7 547.3 64 512 64L288 64C252.7 64 224 92.7 224 128L224 352z"})}),le=({children:n,title:s,placement:i})=>{const l=t.jsx(c.Popover,{id:"popover-basic",className:"dark-popover",children:t.jsx(c.Popover.Body,{className:"p-0 text-white",children:s})});return t.jsx(c.OverlayTrigger,{trigger:["hover","focus"],placement:i,overlay:l,containerPadding:0,container:document.body,popperConfig:{modifiers:[{name:"flip",enabled:!1},{name:"preventOverflow",enabled:!0,options:{boundary:"window"}}]},children:n})},ae=({selected:n,group:s,value:i,label:l,onCopy:r,onSelect:e,subItem:o=!1})=>t.jsxs("div",{className:"ps-1 py-1 d-flex position-relative",style:{alignItems:"center"},children:[t.jsx("input",{type:"radio",onChange:()=>{e(i)},className:"me-2",checked:n,name:s}),t.jsx("p",{title:l,className:"mb-0 wraped-text",children:l}),!o&&t.jsx(le,{title:"Copy",placement:"top",children:t.jsx("button",{className:"btn btn-link",type:"button",style:{padding:0,marginLeft:"auto",position:"relative",minWidth:32,flexShrink:0},children:t.jsx(ie,{onClick:()=>r(i),height:20,fill:"black"})})})]}),de=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getTemplatesList"],queryFn:async r=>await n.get(`${N.Template_list}${i}/${s}`)})},ce=(n,s=[])=>{const i=/^(?:\(copy(?:-(\d+))?\)\s)?(.+)$/,l=n.match(i);if(!l)return`(copy) ${n}`;const r=l[2],e=new RegExp(`^\\(copy(?:-(\\d+))?\\) ${r.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}$`);let o=1;const a=s.filter(f=>e.test(f));return a.length===0?`(copy) ${r}`:(a.forEach(f=>{const g=f.match(e);if(g&&g[1]){const y=parseInt(g[1],10);!isNaN(y)&&y>=o&&(o=y+1)}else o=Math.max(o,2)}),`(copy-${o}) ${r}`)},pe=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useMutation({mutationKey:["getTemplate"],mutationFn:async({id:r})=>{if(r)return await n.get(`${N.Template}${s}/${r}/${i}`)}})},me=()=>{const n=S(),{enerexIdentifier:s,projectId:i}=C();return T.useQuery({queryKey:["getTemplateTypes"],queryFn:async r=>await n.get(`${N.TemplateTypes}${s}/${i}`)})};function fe(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}var M={exports:{}};/*!
357
+ `,U=d.createContext(void 0),J=({children:t,configs:s})=>{const[i,o]=d.useState(s.clientId),[r,e]=d.useState(s.apiKey),[l,a]=d.useState(s.enerexIdentifier),[y,v]=d.useState(s.userName),[w,x]=d.useState(s.projectId),C=f=>{e(f.apiKey),o(f.clientId),x(f.projectId),a(f.enerexIdentifier),v(f.userName)};return n.jsx(U.Provider,{value:{clientId:i,apiKey:r,setConfiguration:C,enerexIdentifier:l,projectId:w,userName:y},children:t})},T=()=>{const t=d.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 l=await O.get(`${t}${r}`,e??s);if(l.status===200)return l.data}catch(l){throw l}},post:async(r,e,l)=>{try{const a=await O.post(`${t}${r}`,e,l??s);if(a.status===200)return a.data}catch(a){throw a}}}),j={EDITOR_SCRIPT_URL:"https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js",EDITOR_PLUGIN_ID:"1afdc3161ec7409a8627a1c8561d45f5",EDITOR_SECRET_KEY:"54ba748ed7e94f2e929555783acb03da",API_BASE_URL:"https://dev-socket.enerex.com/common/api"},V=d.createContext({get:()=>{throw new Error("HttpClientContext.get not implemented")},post:()=>{throw new Error("HttpClientContext.post not implemented")}}),Q=({children:t})=>{const{clientId:s,apiKey:i}=T(),o={headers:{client_id:s,"x-api-key":i}},{get:r,post:e}=H(j.API_BASE_URL,o);return n.jsx(V.Provider,{value:{get:r,post:e},children:t})},Z=({children:t})=>{const s=new b.QueryClient;return n.jsx(Q,{children:n.jsx(b.QueryClientProvider,{client:s,children:t})})},R=t=>{const s=Array.from(new Set(t.map(o=>o.category))),i=[];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}));i.push({category:o,entries:r})}),i},N=()=>{const t=d.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/"},ee=()=>{const t=N(),{enerexIdentifier:s,projectId:i}=T();return b.useQuery({queryKey:["getTemplateTags"],queryFn:async r=>await t.get(`${_.MergeTags}${i}/${s}`)})},te=()=>{const t=N(),{enerexIdentifier:s,projectId:i}=T();return b.useQuery({queryKey:["getExcludeCategory"],queryFn:async r=>await t.get(`${_.ExcludeCategory}${i}/${s}`)})},ne=({templateHTML:t,className:s="",loading:i=!1})=>{const{post:o}=H(),{data:r}=ee(),{data:e}=te(),[l,a]=d.useState(t??{html:A,css:""}),{enerexIdentifier:y,projectId:v,userName:w}=T(),x="https://plugin.stripocdn.email/content/guids/CABINET_eab4e7d5a4603ac03f4120652a3a5a540f0c79c688514939f095f67433ed4a67/images/photo256.png",C="https://plugins.stripo.email/api/v1/auth";d.useEffect(()=>{if(r&&e&&!document.getElementById("UiEditorScript")){const g=document.createElement("script");g.id="UiEditorScript",g.type="module",g.src=j.EDITOR_SCRIPT_URL,g.onload=f,document.body.appendChild(g)}},[r,e]);const f=async()=>{window.UIEditor.initEditor(document.querySelector("#stripoEditorContainer"),{html:l.html,css:l.css,modulesExcludedCategories:e??[],forceRecreate:!0,metadata:{emailId:`${v}_${y}`,userId:"1",username:w,avatarUrl:x},locale:"en",onTokenRefreshRequest:async function(g){const m={pluginId:j.EDITOR_PLUGIN_ID,secretKey:j.EDITOR_SECRET_KEY,userId:"12",role:"user"},h=await o(C,m);h&&g(h.token)},codeEditorButtonSelector:"#codeEditor",undoButtonSelector:"#undoButton",redoButtonSelector:"#redoButton",mobileViewButtonSelector:"#mobileViewButton",desktopViewButtonSelector:"#desktopViewButton",mergeTags:R(r??[])})};return n.jsx("div",{className:"position-relative",children:n.jsxs("div",{className:`editor-container ${s}`,children:[i&&n.jsx("div",{className:"loading-overlay",children:n.jsx(c.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"})]})})},re=({label:t,register:s,validation:i,required:o=!1,name:r,error:e,...l})=>n.jsxs(c.Form.Group,{className:"mb-1",children:[t?n.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[t,o&&n.jsx("label",{className:"text-danger",children:"*"})]}):null,n.jsx(c.Form.Control,{name:r,type:"text",...l,isInvalid:!!(e&&e[r]),...s?s(r,{...i}):{},className:`form-control ${e&&e[r]&&"border border-danger"}`}),e&&e[r]?n.jsx(c.Form.Control.Feedback,{type:"invalid",children:e[r].message}):null]}),se=()=>{const t=N(),{enerexIdentifier:s,projectId:i}=T();return b.useQuery({queryKey:["getTemplatesList"],queryFn:async r=>await t.get(`${_.Template_list}${i}/${s}`)})},ie=()=>{const t=N(),{enerexIdentifier:s,projectId:i}=T();return b.useMutation({mutationKey:["getTemplate"],mutationFn:async({id:r})=>{if(r)return await t.get(`${_.Template}${s}/${r}/${i}`)}})},le=()=>{const t=N(),{enerexIdentifier:s,projectId:i}=T();return b.useQuery({queryKey:["getTemplateTypes"],queryFn:async r=>await t.get(`${_.TemplateTypes}${s}/${i}`)})};function oe(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var k={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 W;function ue(){return W||(W=1,function(n){(function(){var s={}.hasOwnProperty;function i(){for(var e="",o=0;o<arguments.length;o++){var a=arguments[o];a&&(e=r(e,l(a)))}return e}function l(e){if(typeof e=="string"||typeof e=="number")return e;if(typeof e!="object")return"";if(Array.isArray(e))return i.apply(null,e);if(e.toString!==Object.prototype.toString&&!e.toString.toString().includes("[native code]"))return e.toString();var o="";for(var a in e)s.call(e,a)&&e[a]&&(o=r(o,a));return o}function r(e,o){return o?e?e+" "+o:e+o:e}n.exports?(i.default=i,n.exports=i):window.classNames=i})()}(M)),M.exports}var ge=ue();const Y=fe(ge),ye=({name:n="",control:s,options:i,multiple:l=!1,placeholder:r,validation:e,labelKey:o="name",disabled:a,isInvalid:f,value:g,onChange:y,uncontrolled:v,menuPlacement:x="auto",closeOnSelect:h=!0})=>{const I={control:d=>({...d,minHeight:"33px",borderColor:f?"var(--bs-form-invalid-border-color) !important":"var(--ct-input-border-color)",backgroundImage:f?'url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 12%27 width=%2712%27 height=%2712%27 fill=%27none%27 stroke=%27%23fa5c7c%27%3e%3ccircle cx=%276%27 cy=%276%27 r=%274.5%27/%3e%3cpath stroke-linejoin=%27round%27 d=%27M5.8 3.6h.4L6 6.5z%27/%3e%3ccircle cx=%276%27 cy=%278.2%27 r=%27.6%27 fill=%27%23fa5c7c%27 stroke=%27none%27/%3e%3c/svg%3e")':"none",backgroundRepeat:"no-repeat",backgroundPosition:"right calc(0.375em + 0.225rem) center",backgroundSize:"calc(0.75em + 0.45rem) calc(0.75em + 0.45rem)","&:hover":{borderColor:f?"var(--bs-form-invalid-border-color)":"var(--ct-input-border-color)"},"& .react-select__single-value":{color:"var(--ct-input-color) !important"},"& .react-select__placeholder":{color:"var(--ct-input-placeholder-color) !important"},"& .react-select__indicators":{display:"none"}}),menu:d=>({...d,marginTop:0,width:"max-content",minWidth:"100%"}),menuPortal:d=>({...d,zIndex:9999}),multiValueRemove:d=>({...d,display:a?"none":"block"})};return v?t.jsx(z,{className:Y({"is-invalid":f}),styles:I,classNamePrefix:"react-select",isMulti:l,options:i,onChange:y,placeholder:r,menuPortalTarget:document.body,value:g,getOptionLabel:typeof o=="string"?d=>d[o]:o,getOptionValue:d=>d.id,isDisabled:a,menuPlacement:x,closeMenuOnSelect:h}):t.jsx(H.Controller,{control:s,name:n,rules:e,render:({field:{onChange:d,value:E,onBlur:A}})=>t.jsx(z,{className:Y({"is-invalid":f}),styles:I,classNamePrefix:"react-select",isMulti:l,options:i,onBlur:A,onChange:d,placeholder:r,menuPortalTarget:document.body,value:E,getOptionLabel:typeof o=="string"?L=>L[o]:o,getOptionValue:L=>L.id,isDisabled:a,menuPlacement:x,closeMenuOnSelect:h},E?JSON.stringify(E):"reset")})},he=({label:n,name:s,validation:i,control:l,error:r,...e})=>t.jsxs(c.Form.Group,{className:"mb-1",children:[n&&t.jsxs(c.Form.Label,{className:"mb-3 d-block form-label",children:[n," ",e.required&&t.jsx("span",{className:"text-danger",children:"*"})]}),t.jsx(ye,{control:l,options:e.options??[],validation:i,isInvalid:r&&!!r[s],name:s}),r&&r[s]?t.jsx(c.Form.Control.Feedback,{type:"invalid",children:r[s].message}):null]}),be=()=>{const n=S();T.useQueryClient();const{enerexIdentifier:s,projectId:i}=C();return T.useMutation({mutationKey:["saveTemplate"],mutationFn:async r=>(r.enerexIdentifier=s??"",r.projectId=i??"",await n.post(`${N.SaveTemplate}`,r))})},we=({onSelectItem:n,templateLoading:s,onReset:i})=>{const{register:l,handleSubmit:r,clearErrors:e,setValue:o,control:a,reset:f,formState:{errors:g}}=H.useForm({defaultValues:{templateName:"",templateType:void 0},mode:"onChange"}),{data:y,refetch:v,isLoading:x}=de(),[h,I]=p.useState([]),[d,E]=p.useState(),[A,L]=p.useState(),{mutateAsync:B,isPending:P}=pe(),{mutateAsync:Te,isPending:D}=be(),{data:k,isLoading:X}=me(),[F,Ce]=p.useState([]);p.useEffect(()=>{k&&Ce(k.map(m=>({id:`${m.id}`,name:m.name})))},[k]),p.useEffect(()=>{s(!!P)},[P]),p.useEffect(()=>{I(y??[])},[y]);const xe=async(m,b)=>{b&&I(w=>{const _=[...w],$={...b};$.id="",$.name=ce($.name,_.map(q=>q.name)),_.splice(m+1,0,$),E($),o("templateName",$.name);const J=F.find(q=>q.id===`${b.type}`);return J?o("templateType",J):o("templateType",void 0),e(),B({id:b?.id}).then(q=>{q&&L(q)}),_})},Ie=async m=>{if(E(m),m){if(o("templateName",m?.name),k&&k.find(w=>w.id===m.type)){const w=F.find(_=>_.id===`${m.type}`);w&&o("templateType",w)}else o("templateType",void 0);e()}const b=await B({id:m?.id});b&&L(b)};p.useEffect(()=>{n(A&&d?A:void 0)},[A,d,n]);const Ee=m=>{window.StripoEditorApi.actionsApi.getTemplateData(async b=>{const w={enerexIdentifier:"",projectId:"",templateId:d?.id??"",templateType:m.templateType.id,name:m.templateName,html:b.html,css:b.css};await Te(w)&&(e(),d?.id===""&&f(),v())})};return t.jsx(c.Card,{className:"border border-0 text-start",children:t.jsx(c.Card.Body,{className:"pe-0 ps-2",children:t.jsxs("form",{onSubmit:r(Ee),children:[t.jsx("label",{className:"mb-2",children:"Templates"}),t.jsx("div",{className:"template-list-container mb-3",children:t.jsx(oe,{items:h,renderItem:(m,b)=>t.jsx(ae,{selected:m===d,label:m.name,subItem:m.id==="",onCopy:w=>xe(b,w),onSelect:w=>Ie(w),value:m,group:"templates"})})}),t.jsx(he,{label:"Template Type",control:a,error:g,options:F,required:!0,validation:{required:{value:!0,message:"Template Type is required"}},...l("templateType")}),t.jsx(se,{label:"Template Name",register:l,error:g,required:!0,name:"templateName",validation:{required:{value:!0,message:"Template Name is required"}}}),t.jsx("hr",{}),t.jsxs("div",{className:"d-flex justify-content-between mt-3 ",children:[t.jsx(c.Button,{style:{width:"70px"},variant:"primary",disabled:x||P||D||X,onClick:()=>{E(void 0),f(),i()},children:P||D?t.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:t.jsx("span",{className:"visually-hidden",children:"Loading..."})}):"Clear"}),t.jsx(c.Button,{type:"submit",variant:"primary",style:{width:"80px"},disabled:x||P||D||X,children:P||D?t.jsx(c.Spinner,{animation:"border",style:{width:"11px",height:"11px"},size:"sm",role:"status",className:"me-1",children:t.jsx("span",{className:"visually-hidden",children:"Loading..."})}):(d?.id??"")===""?"Save":"Update"})]})]})})})},ve=({config:n})=>{const[s,i]=p.useState(),[l,r]=p.useState(!1),e=a=>{i(a),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&a&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(a?.html??"",a?.css??"","")},o=()=>{r(!1),i(void 0),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(O,"","")};return t.jsx(Q,{configs:n,children:t.jsx(R,{children:t.jsx("div",{className:"root-widget",children:t.jsxs(c.Row,{children:[t.jsx(c.Col,{md:3,lg:2,className:"p-0",children:t.jsx(we,{templateLoading:r,onSelectItem:e,onReset:o})}),t.jsx(c.Col,{md:9,lg:10,children:t.jsx(re,{templateHTML:{css:s?.css??"",html:s?.html??O},loading:l,className:"col-span-5"})})]})})})})};u.EditorWidget=ve,Object.defineProperty(u,Symbol.toStringTag,{value:"Module"})});
361
+ */var K;function ae(){return K||(K=1,function(t){(function(){var s={}.hasOwnProperty;function i(){for(var e="",l=0;l<arguments.length;l++){var a=arguments[l];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 i.apply(null,e);if(e.toString!==Object.prototype.toString&&!e.toString.toString().includes("[native code]"))return e.toString();var l="";for(var a in e)s.call(e,a)&&e[a]&&(l=r(l,a));return l}function r(e,l){return l?e?e+" "+l:e+l:e}t.exports?(i.default=i,t.exports=i):window.classNames=i})()}(k)),k.exports}var de=ae();const z=oe(de),ce=({name:t="",control:s,options:i,multiple:o=!1,placeholder:r,validation:e,labelKey:l="name",disabled:a,isInvalid:y,value:v,onChange:w,uncontrolled:x,menuPlacement:C="auto",closeOnSelect:f=!0})=>{const g={control:m=>({...m,minHeight:"33px",borderColor:y?"var(--bs-form-invalid-border-color) !important":"var(--ct-input-border-color)",backgroundImage:y?'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:y?"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:z({"is-invalid":y}),styles:g,classNamePrefix:"react-select",isMulti:o,options:i,onChange:w,placeholder:r,menuPortalTarget:document.body,value:v,getOptionLabel:typeof l=="string"?m=>m[l]:l,getOptionValue:m=>m.id,isDisabled:a,menuPlacement:C,closeMenuOnSelect:f}):n.jsx(F.Controller,{control:s,name:t,rules:e,render:({field:{onChange:m,value:h,onBlur:L}})=>n.jsx(M,{className:z({"is-invalid":y}),styles:g,classNamePrefix:"react-select",isMulti:o,options:i,onBlur:L,onChange:m,placeholder:r,menuPortalTarget:document.body,value:h,getOptionLabel:typeof l=="string"?S=>S[l]:l,getOptionValue:S=>S.id,isDisabled:a,menuPlacement:C,closeMenuOnSelect:f},h?JSON.stringify(h):"reset")})},G=({label:t,name:s,validation:i,control:o,error:r,...e})=>n.jsxs(c.Form.Group,{className:"mb-1",children:[t&&n.jsxs(c.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:i,isInvalid:r&&!!r[s],name:s}),r&&r[s]?n.jsx(c.Form.Control.Feedback,{type:"invalid",children:r[s].message}):null]}),pe=()=>{const t=N();b.useQueryClient();const{enerexIdentifier:s,projectId:i}=T();return b.useMutation({mutationKey:["saveTemplate"],mutationFn:async r=>(r.enerexIdentifier=s??"",r.projectId=i??"",await t.post(`${_.SaveTemplate}`,r))})},W={id:"",name:"New (Blank)"},me=({onSelectItem:t,templateLoading:s,onReset:i})=>{const{register:o,handleSubmit:r,clearErrors:e,setValue:l,control:a,watch:y,reset:v,formState:{errors:w}}=F.useForm({defaultValues:{templateName:"",templateType:void 0,template:W},mode:"onChange"}),{data:x,refetch:C,isLoading:f}=se(),[g,m]=d.useState([]),[h,L]=d.useState(),[S,B]=d.useState(),{mutateAsync:fe,isPending:q}=ie(),{mutateAsync:ge,isPending:$}=pe(),{data:P,isLoading:Y}=le(),[X,ye]=d.useState([]);d.useEffect(()=>{P&&ye(P.map(p=>({id:`${p.id}`,name:p.name})))},[P]),d.useEffect(()=>{s(!!q)},[q]),d.useEffect(()=>{m(x??[])},[x]);const he=async p=>{if(L(p),p){if(l("templateName",p?.name),P&&P.find(I=>I.id===p.type)){const I=X.find(D=>D.id===`${p.type}`);I&&l("templateType",I)}else l("templateType",void 0);e()}const E=await fe({id:p?.id});B(E||void 0)};d.useEffect(()=>{let p=g.find(E=>E.id===y("template")?.id);he(p)},[y("template")]),d.useEffect(()=>{t(S&&h?S:void 0)},[S,h,t]);const be=p=>{window.StripoEditorApi.actionsApi.getTemplateData(async E=>{let I=p.template.id;h?.projectId===0&&(I="");const D={enerexIdentifier:"",projectId:"",templateId:I,templateType:p.templateType.id,name:p.templateName,html:E.html,css:E.css};await ge(D)&&(e(),v(),C())})};return n.jsx(c.Card,{className:"border border-0 text-start",children:n.jsx(c.Card.Body,{className:"pe-0 ps-2",children:n.jsx("form",{onSubmit:r(be),children:n.jsx("div",{className:"template-list-container mb-3",children:n.jsxs(c.Row,{children:[n.jsx(c.Col,{md:3,children:n.jsx(G,{label:"Type",control:a,error:w,options:X,required:!0,validation:{required:{value:!0,message:"Template Type is required"}},...o("templateType")})}),n.jsx(c.Col,{md:3,children:n.jsx(G,{label:"Template",control:a,error:w,options:[W,...g.map(p=>({id:p.id,name:p.name}))],required:!1,...o("template")})}),n.jsx(c.Col,{md:3,children:n.jsx(re,{label:"Name",register:o,error:w,required:!0,name:"templateName",validation:{required:{value:!0,message:"Template Name is required"}}})}),n.jsxs(c.Col,{md:3,className:"d-flex align-items-end justify-content-end gap-2 mb-3",children:[n.jsx(c.Button,{style:{width:"70px"},variant:"primary",disabled:f||q||$||Y,onClick:()=>{L(void 0),v(),i()},children:q||$?n.jsx(c.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"}),n.jsx(c.Button,{type:"submit",variant:"primary",style:{width:"80px"},disabled:f||q||$||Y,children:q||$?n.jsx(c.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?.id??"")===""?"Save":(h?.projectId??"")===0?"Save as":"Save"})]})]})})})})})},ue=({config:t})=>{const[s,i]=d.useState(),[o,r]=d.useState(!1),e=a=>{i(a),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(a?.html??A,a?.css??"","")},l=()=>{r(!1),i(void 0),window.StripoEditorApi&&window.StripoEditorApi.actionsApi&&window.StripoEditorApi.actionsApi.updateHtmlAndCss(A,"","")};return n.jsx(J,{configs:t,children:n.jsx(Z,{children:n.jsxs("div",{className:"root-widget",children:[n.jsx(me,{templateLoading:r,onSelectItem:e,onReset:l}),n.jsx(ne,{templateHTML:{css:s?.css??"",html:s?.html??A},loading:o,className:"col-span-5"})]})})})};u.EditorWidget=ue,Object.defineProperty(u,Symbol.toStringTag,{value:"Module"})});
@@ -8,6 +8,7 @@ export interface IConfigSettings {
8
8
  apiKey: string;
9
9
  enerexIdentifier?: string;
10
10
  projectId?: string;
11
+ userName: string;
11
12
  }
12
13
  interface ConfigProvidersProp extends SingleChildProp {
13
14
  configs: IConfigSettings;
@@ -6,6 +6,7 @@ export type ITemplatesList = {
6
6
  id: string;
7
7
  name: string;
8
8
  type: number;
9
+ projectId: number;
9
10
  };
10
11
  export type ITemplate = {
11
12
  templateID: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@enerex/template-studio",
3
- "version": "1.1.16",
3
+ "version": "1.1.18",
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",