@telia-ace/widget-conversation 1.3.0-rc.9 → 1.3.0

package/components/conversation/plugin.d.ts

@@ -35,6 +35,7 @@ export type ConversationComponentProperties = {
     typingActors: any[];
     conversationControllerId?: string;
     sendButtonLabel: string;
+    avatarLabel?: string;
     secondaryAction?: {
         icon?: string;
         action: string;

package/{conversation-d6ec6d94.mjs → conversation-43344a01.mjs}

@@ -1,36 +1,36 @@
 import { jsx as n, jsxs as h, Fragment as N } from "react/jsx-runtime";
 import i from "@emotion/styled";
-import { Input as se, borderTabStyle as b, Button as I, SymbolBadge as k, useIsTabbing as ae, useDispatch as G, useProperties as S, useScroll as ie, useContainer as A, Typography as J, invertedHoverButton as xe, Html as Q, List as le, buttonCss as B, ItemList as K, itemList as D, Link as ke, useComponent as we, genericHtml as Se, headingElement as Z, usePrevious as Ce, list as ze, WidgetOverlayOutlet as ce, ConversationContext as Le } from "@telia-ace/widget-ui";
+import { Input as se, borderTabStyle as b, Button as A, SymbolBadge as k, useIsTabbing as ae, useDispatch as G, useProperties as S, useScroll as ie, useContainer as I, Typography as J, invertedHoverButton as xe, Html as Q, List as le, buttonCss as B, ItemList as K, itemList as D, Link as ke, useComponent as we, genericHtml as Se, headingElement as Z, usePrevious as Ce, list as Le, WidgetOverlayOutlet as ce, ConversationContext as ze } from "@telia-ace/widget-ui";
 import { appendClassNames as H, htmlParentContains as Ne } from "@telia-ace/widget-utilities";
 import { css as x, keyframes as Me } from "@emotion/react";
-import de, { useState as q, useEffect as j, forwardRef as ee, useContext as Ie, Suspense as Ae, useRef as me, useMemo as He, useCallback as ue } from "react";
+import de, { useState as q, useEffect as j, forwardRef as ee, useContext as Ae, Suspense as Ie, useRef as me, useMemo as He, useCallback as ue } from "react";
 import { FormComponent as Te } from "@telia-ace/widget-forms";
 import { ConversationMessageListItemType as w, ConversationMessageType as U } from "./index.mjs";
 import "@telia-ace/widget-core";
 import "@telia-ace/widget-services";
 import "@telia-ace/widget-plugins";
 const Oe = ({ className: t }) => {
-  const [e, r] = q(""), [s, a] = q(0), [o, d] = q(0), u = ae(), l = G(), {
+  const [e, o] = q(""), [s, a] = q(0), [r, d] = q(0), u = ae(), l = G(), {
     inputPlaceholder: m = "Type your message",
     inputHidden: y = !1,
     inputDisabled: c = !1,
     sendButtonLabel: g = "Send message",
     inputMultiline: p = !0,
     secondaryAction: $
-  } = S(), [z, v] = ie(!0), O = A();
+  } = S(), [L, v] = ie(!0), O = I();
   j(() => {
     if (v.current) {
-      const { lineHeight: f, maxHeight: L } = getComputedStyle(v.current);
+      const { lineHeight: f, maxHeight: z } = getComputedStyle(v.current);
       if (f && f.indexOf("px") > -1) {
         const T = f.split("px"), $e = parseInt(T[0], 10);
         a($e);
-        const ve = L.split("px");
+        const ve = z.split("px");
         d(parseInt(ve[0], 10));
       }
     }
   }, [v.current]);
   const P = (f) => {
-    !f.shiftKey || !p ? (f.preventDefault(), e && e.length > 0 && (l("user-submit", { text: e }), r(""), W(""))) : e.length < 1 && f.preventDefault();
+    !f.shiftKey || !p ? (f.preventDefault(), e && e.length > 0 && (l("user-submit", { text: e }), o(""), W(""))) : e.length < 1 && f.preventDefault();
   }, pe = (f) => {
     if (!$)
       return;
@@ -38,26 +38,26 @@ const Oe = ({ className: t }) => {
       actionKey: $.action,
       ...$
     });
-    const { events: L } = O.get("$widget");
-    L.dispatch("tracking:secondary-clicked", {});
+    const { events: z } = O.get("$widget");
+    z.dispatch("tracking:secondary-clicked", {});
   }, be = (f) => {
     if (p && v.current) {
-      const L = v.current.scrollHeight;
-      if (L > s) {
+      const z = v.current.scrollHeight;
+      if (z > s) {
         v.current.style.height = "auto";
-        let T = L;
-        f.length < 1 && (T = s), v.current.style.height = `${T}px`, T >= o ? v.current.style.overflowY = "scroll" : v.current.style.overflowY = "hidden";
+        let T = z;
+        f.length < 1 && (T = s), v.current.style.height = `${T}px`, T >= r ? v.current.style.overflowY = "scroll" : v.current.style.overflowY = "hidden";
       }
     }
   }, W = (f) => {
-    be(f), r(f), f && f.length > 0 && l("user-typing", { textLength: f.length });
+    be(f), o(f), f && f.length > 0 && l("user-typing", { textLength: f.length });
   };
   return y ? null : /* @__PURE__ */ h(
     Ke,
     {
       grow: p,
       className: H("humany-conversation-input", t),
-      scrollableCss: z,
+      scrollableCss: L,
       isTabbing: u,
       children: [
         $ && /* @__PURE__ */ n(
@@ -172,7 +172,7 @@ const Oe = ({ className: t }) => {
 }};
     font-style: italic;
   }
-`, he = i(I)`
+`, he = i(A)`
   flex: 0 0 50px;
   align-self: stretch;
   background-color: transparent;
@@ -343,13 +343,13 @@ const Oe = ({ className: t }) => {
   ${(t) => t.fullWidth && "width: 100%;"}
 `, Ue = (t, e) => {
   var s, a;
-  const r = x`
+  const o = x`
     background-color: ${(s = e.colors) == null ? void 0 : s.accent};
     color: ${(a = e.colors) == null ? void 0 : a.text};
     ${e.border && `border: ${e.border};`};
   `;
   return e.borderRadius ? x`
-    ${r}
+    ${o}
 
     border-top-right-radius: ${e.borderRadius};
     border-bottom-right-radius: ${e.borderRadius};
@@ -361,15 +361,15 @@ const Oe = ({ className: t }) => {
     ${t === "last" && `
             border-bottom-left-radius: ${e.borderRadius};
         `}
-  ` : r;
+  ` : o;
 }, Ve = (t, e) => {
   var s, a;
-  const r = x`
+  const o = x`
     background-color: ${(s = e.colors) == null ? void 0 : s.primary};
     color: ${(a = e.colors) == null ? void 0 : a.accent};
   `;
   return e.borderRadius ? x`
-    ${r}
+    ${o}
 
     border-top-left-radius: ${e.borderRadius};
     border-bottom-left-radius: ${e.borderRadius};
@@ -381,7 +381,7 @@ const Oe = ({ className: t }) => {
     ${t === "last" && `
             border-bottom-right-radius: ${e.borderRadius};
         `}
-  ` : r;
+  ` : o;
 }, E = i.div`
   margin-bottom: ${(t) => {
   var e;
@@ -391,16 +391,16 @@ const Oe = ({ className: t }) => {
     margin-bottom: 0;
   }
 `, C = (t) => {
-  var e, r;
+  var e, o;
   return x`
   margin: ${(e = t.theme.sizes) == null ? void 0 : e.medium} 0;
-  padding: 0 ${(r = t.theme.sizes) == null ? void 0 : r.medium};
+  padding: 0 ${(o = t.theme.sizes) == null ? void 0 : o.medium};
 `;
 }, _e = i(Te)`
   & button.humany-form-component-button {
     ${(t) => {
-  var e, r, s, a;
-  return ((e = t.theme.colors) == null ? void 0 : e.primary) && ((r = t.theme.colors) == null ? void 0 : r.accent) && xe({
+  var e, o, s, a;
+  return ((e = t.theme.colors) == null ? void 0 : e.primary) && ((o = t.theme.colors) == null ? void 0 : o.accent) && xe({
     active: !1,
     primaryColor: (s = t.theme.colors) == null ? void 0 : s.primary,
     secondaryColor: (a = t.theme.colors) == null ? void 0 : a.accent,
@@ -462,7 +462,7 @@ const Oe = ({ className: t }) => {
     background-color: transparent;
   }
 `, ne = ee(
-  ({ boxed: t, className: e, agentData: r }, s) => /* @__PURE__ */ n(F, { ref: s, children: /* @__PURE__ */ n(Y, { left: t, center: !t, children: /* @__PURE__ */ n(
+  ({ boxed: t, className: e, agentData: o }, s) => /* @__PURE__ */ n(F, { ref: s, children: /* @__PURE__ */ n(Y, { left: t, center: !t, children: /* @__PURE__ */ n(
     X,
     {
       padded: !!t,
@@ -489,27 +489,27 @@ const Oe = ({ className: t }) => {
   var e;
   return (e = t.theme.colors) == null ? void 0 : e.text;
 }};
-`, oe = (t, e) => new Date(t).toLocaleTimeString(e || [], {
+`, re = (t, e) => new Date(t).toLocaleTimeString(e || [], {
   hour: "numeric",
   minute: "2-digit"
 }), M = ({
   className: t,
   name: e,
-  timestamp: r,
+  timestamp: o,
   ariaHidden: s = !1
 }) => {
-  const a = Ie(ge);
-  if (!e && !r)
+  const a = Ae(ge);
+  if (!e && !o)
     return null;
-  let o = "";
-  return e ? r ? o = `${e}: ${oe(r, a)}` : o = e : r && (o = oe(r, a)), /* @__PURE__ */ n(Ge, { "aria-hidden": s, children: o });
+  let r = "";
+  return e ? o ? r = `${e}: ${re(o, a)}` : r = e : o && (r = re(o, a)), /* @__PURE__ */ n(Ge, { "aria-hidden": s, children: r });
 }, fe = ({
   className: t,
   children: e,
-  sender: r,
+  sender: o,
   timestamp: s
 }) => {
-  const { avatar: a, name: o } = r, { avatarSize: d } = S();
+  const { avatar: a, name: r } = o, { avatarSize: d, avatarLabel: u = "Avatar" } = S();
   return /* @__PURE__ */ h(
     Je,
     {
@@ -521,13 +521,13 @@ const Oe = ({ className: t }) => {
       children: [
         a && /* @__PURE__ */ n(je, { className: "humany-agent-avatar", avatarSize: d, children: typeof a == "string" ? (
           // eslint-disable-next-line jsx-a11y/alt-text
-          /* @__PURE__ */ n("img", { src: a })
+          /* @__PURE__ */ n("img", { src: a, alt: u })
         ) : /* @__PURE__ */ n(k, { symbol: a }) }),
         e,
         /* @__PURE__ */ n(
           M,
           {
-            name: o,
+            name: r,
             timestamp: s,
             ariaHidden: !0
           }
@@ -553,10 +553,10 @@ const Oe = ({ className: t }) => {
             'info';
         `};
 `, Qe = ee(
-  ({ className: t, children: e, timestamp: r, discrete: s, fullWidth: a }, o) => /* @__PURE__ */ n(
+  ({ className: t, children: e, timestamp: o, discrete: s, fullWidth: a }, r) => /* @__PURE__ */ n(
     Ze,
     {
-      ref: o,
+      ref: r,
       className: H(
         t,
         "humany-conversation-system-message"
@@ -564,10 +564,10 @@ const Oe = ({ className: t }) => {
       fullWidth: a,
       children: s ? /* @__PURE__ */ h(et, { className: "humany-conversation-discrete-message", children: [
         e,
-        /* @__PURE__ */ n(M, { timestamp: r })
+        /* @__PURE__ */ n(M, { timestamp: o })
       ] }) : /* @__PURE__ */ h(N, { children: [
         e,
-        /* @__PURE__ */ n(M, { timestamp: r })
+        /* @__PURE__ */ n(M, { timestamp: o })
       ] })
     }
   )
@@ -592,7 +592,7 @@ const Oe = ({ className: t }) => {
   > p {
     margin: 0;
   }
-`, tt = ({ className: t, children: e, timestamp: r }) => {
+`, tt = ({ className: t, children: e, timestamp: o }) => {
   const { userLabel: s = "" } = S();
   return /* @__PURE__ */ h(
     nt,
@@ -607,7 +607,7 @@ const Oe = ({ className: t }) => {
           M,
           {
             name: s,
-            timestamp: r,
+            timestamp: o,
             ariaHidden: !0
           }
         )
@@ -623,47 +623,47 @@ const Oe = ({ className: t }) => {
 `, te = (t) => Array.isArray(t) ? t : Object.keys(t).map((e) => ({
   label: t[e],
   actionKey: e
-})), ot = ({ header: t, actions: e, dispatch: r }) => {
-  const s = A(), { events: a } = s.get("$widget");
+})), rt = ({ header: t, actions: e, dispatch: o }) => {
+  const s = I(), { events: a } = s.get("$widget");
   return /* @__PURE__ */ n(
-    rt,
+    ot,
     {
       className: "humany-conversation-button-list",
       header: t,
       items: te(e),
-      renderItem: (o) => {
+      renderItem: (r) => {
         var u;
-        const d = !!((u = o == null ? void 0 : o.data) != null && u.href);
+        const d = !!((u = r == null ? void 0 : r.data) != null && u.href);
         return /* @__PURE__ */ n("li", { children: d ? /* @__PURE__ */ h(
           st,
           {
-            href: o.data.href,
-            target: o.data.target,
-            "aria-label": o.label,
-            title: o.label,
+            href: r.data.href,
+            target: r.data.target,
+            "aria-label": r.label,
+            title: r.label,
             children: [
-              /* @__PURE__ */ n(k, { symbol: o.symbol }),
-              o.label
+              /* @__PURE__ */ n(k, { symbol: r.symbol }),
+              r.label
             ]
           }
         ) : /* @__PURE__ */ h(
           at,
           {
             onClick: () => {
-              r("action", o), a.dispatch("tracking:button-list-item-clicked", o);
+              o("action", r), a.dispatch("tracking:button-list-item-clicked", r);
             },
-            "aria-label": o.label,
-            title: o.label,
+            "aria-label": r.label,
+            title: r.label,
             children: [
-              /* @__PURE__ */ n(k, { symbol: o.symbol }),
-              o.label
+              /* @__PURE__ */ n(k, { symbol: r.symbol }),
+              r.label
             ]
           }
-        ) }, o.actionKey);
+        ) }, r.actionKey);
       }
     }
   );
-}, rt = i(K)`
+}, ot = i(K)`
   ${D}
   > ul {
     display: flex;
@@ -705,7 +705,7 @@ const Oe = ({ className: t }) => {
   return (e = t.theme.sizes) == null ? void 0 : e.small;
 }};
   }
-`, at = i(I)`
+`, at = i(A)`
   ${B};
 
   display: block;
@@ -734,8 +734,8 @@ const Oe = ({ className: t }) => {
 }};
   }
 `, it = ({ type: t, content: e = {} }) => {
-  const r = we(t);
-  return !r || !t ? null : /* @__PURE__ */ n(Ae, { fallback: null, children: /* @__PURE__ */ n(r, { ...e }) });
+  const o = we(t);
+  return !o || !t ? null : /* @__PURE__ */ n(Ie, { fallback: null, children: /* @__PURE__ */ n(o, { ...e }) });
 }, lt = ({ body: t }) => /* @__PURE__ */ n(ct, { className: "humany-html", html: t }), ct = i(Q)`
   ${Se}
   color: inherit;
@@ -750,7 +750,7 @@ const Oe = ({ className: t }) => {
   p {
     word-break: auto-phrase;
   }
-`, dt = ({ header: t, actions: e, dispatch: r }) => /* @__PURE__ */ n(
+`, dt = ({ header: t, actions: e, dispatch: o }) => /* @__PURE__ */ n(
   mt,
   {
     className: "humany-conversation-item-list",
@@ -771,10 +771,10 @@ const Oe = ({ className: t }) => {
         ) }),
         /* @__PURE__ */ h("div", { className: "item-body", children: [
           /* @__PURE__ */ n(
-            I,
+            A,
             {
               onClick: () => {
-                r("action", s);
+                o("action", s);
               },
               "aria-label": s.label,
               title: s.label,
@@ -873,8 +873,8 @@ const Oe = ({ className: t }) => {
       }
     }
   }
-`, ht = ({ header: t, actions: e, dispatch: r }) => {
-  const s = Ce(e), a = me(), o = ae(), d = A(), { events: u } = d.get("$widget");
+`, ht = ({ header: t, actions: e, dispatch: o }) => {
+  const s = Ce(e), a = me(), r = ae(), d = I(), { events: u } = d.get("$widget");
   return j(() => {
     if (s && Array.isArray(e) && Array.isArray(s) && s.length < e.length && a.current) {
       const l = a.current.querySelectorAll(
@@ -894,8 +894,8 @@ const Oe = ({ className: t }) => {
             if (p.addedNodes) {
               const $ = Array.from(
                 p.addedNodes
-              ).find((z) => z.tagName === "BUTTON");
-              $ && Ne(a.current, document.activeElement) && (o && $.focus(), g.disconnect());
+              ).find((L) => L.tagName === "BUTTON");
+              $ && Ne(a.current, document.activeElement) && (r && $.focus(), g.disconnect());
             }
           });
         }).observe(m, {
@@ -919,7 +919,7 @@ const Oe = ({ className: t }) => {
         {
           help: l.actionKey === "help",
           onClick: () => {
-            r("action", l), u.dispatch("tracking:link-list-item-clicked", l);
+            o("action", l), u.dispatch("tracking:link-list-item-clicked", l);
           },
           "aria-label": l.label,
           title: l.label,
@@ -962,7 +962,7 @@ const Oe = ({ className: t }) => {
       margin: 0;
     }
   }
-`, ft = i(I)`
+`, ft = i(A)`
   display: block;
   text-align: left;
   font-weight: 300;
@@ -975,14 +975,14 @@ const Oe = ({ className: t }) => {
   overflow: hidden;
 
   ${(t) => {
-  var e, r;
+  var e, o;
   return t.help && x`
       color: ${(e = t.theme.colors) == null ? void 0 : e.text};
       text-decoration: underline;
 
       i,
       svg {
-        margin-left: ${(r = t.theme.sizes) == null ? void 0 : r.small};
+        margin-left: ${(o = t.theme.sizes) == null ? void 0 : o.small};
       }
     `;
 }}
@@ -1005,7 +1005,7 @@ const Oe = ({ className: t }) => {
 `, vt = ({
   header: t = "Video call",
   acceptLabel: e = "Accept",
-  declineLabel: r = "Decline",
+  declineLabel: o = "Decline",
   dispatch: s
 }) => {
   const a = He(() => [
@@ -1018,34 +1018,34 @@ const Oe = ({ className: t }) => {
       }
     },
     {
-      label: r,
+      label: o,
       actionKey: "decline-video-call",
       symbol: {
         type: "Svg",
         content: "close"
       }
     }
-  ], [e, r]);
+  ], [e, o]);
   return /* @__PURE__ */ n(
     xt,
     {
       className: "humany-conversation-video-request",
       header: t,
       items: a,
-      renderItem: (o) => {
-        const d = o.actionKey === "accept-video-call" ? "#70c48e" : "#da5c85";
+      renderItem: (r) => {
+        const d = r.actionKey === "accept-video-call" ? "#70c48e" : "#da5c85";
         return /* @__PURE__ */ n("li", { children: /* @__PURE__ */ n(
           kt,
           {
             onClick: () => {
-              s("action", o);
+              s("action", r);
             },
-            "aria-label": o.label,
-            title: o.label,
+            "aria-label": r.label,
+            title: r.label,
             bgColor: d,
-            children: /* @__PURE__ */ n(k, { symbol: o.symbol, size: 25 })
+            children: /* @__PURE__ */ n(k, { symbol: r.symbol, size: 25 })
           }
-        ) }, o.actionKey);
+        ) }, r.actionKey);
       }
     }
   );
@@ -1063,7 +1063,7 @@ const Oe = ({ className: t }) => {
     }
   }
   ${(t) => C(t)}
-`, kt = i(I)`
+`, kt = i(A)`
   ${B};
 
   background-color: ${(t) => t.bgColor};
@@ -1104,54 +1104,54 @@ const Oe = ({ className: t }) => {
     }
   }
 `, R = ([t, e]) => ({ type: t, content: e }), wt = ({ items: t, dispatch: e }) => {
-  const r = t.map(R).filter((o) => o.type.includes("ace-knowledge")).map((o) => "humany-" + o.type.toString());
-  return !!t.map(R).filter((o) => {
-    const d = o == null ? void 0 : o.content, u = d == null ? void 0 : d.actions;
+  const o = t.map(R).filter((r) => r.type.includes("ace-knowledge")).map((r) => "humany-" + r.type.toString());
+  return !!t.map(R).filter((r) => {
+    const d = r == null ? void 0 : r.content, u = d == null ? void 0 : d.actions;
     return !!(u != null && u.filter((l) => l.actionKey === "contact").length);
-  }).length && r.push("humany-secondary-action-list"), !!t.map(R).filter((o) => {
+  }).length && o.push("humany-secondary-action-list"), !!t.map(R).filter((r) => {
     var u;
-    const d = o == null ? void 0 : o.content;
+    const d = r == null ? void 0 : r.content;
     return !!((u = d == null ? void 0 : d.tags) != null && u.includes("category"));
-  }).length && r.push("humany-category-list"), /* @__PURE__ */ n(
+  }).length && o.push("humany-category-list"), /* @__PURE__ */ n(
     St,
     {
       role: "none",
       className: H(
         "humany-message-list",
-        r.join(" ")
+        o.join(" ")
       ),
       items: t.map(R),
       renderLi: !0,
-      renderItem: (o) => {
-        switch (o.type) {
+      renderItem: (r) => {
+        switch (r.type) {
           case w.Text:
-            return /* @__PURE__ */ n(bt, { text: o.content });
+            return /* @__PURE__ */ n(bt, { text: r.content });
           case w.HTML:
-            return /* @__PURE__ */ n(lt, { ...o.content });
+            return /* @__PURE__ */ n(lt, { ...r.content });
           case w.Separator:
-            return /* @__PURE__ */ n(yt, { ...o.content });
+            return /* @__PURE__ */ n(yt, { ...r.content });
           case w.ItemList:
-            return /* @__PURE__ */ n(dt, { ...o.content, dispatch: e });
+            return /* @__PURE__ */ n(dt, { ...r.content, dispatch: e });
           case w.LinkList:
-            return /* @__PURE__ */ n(ht, { ...o.content, dispatch: e });
+            return /* @__PURE__ */ n(ht, { ...r.content, dispatch: e });
           case w.ButtonList:
-            return /* @__PURE__ */ n(ot, { ...o.content, dispatch: e });
+            return /* @__PURE__ */ n(rt, { ...r.content, dispatch: e });
           case w.VideoRequest:
-            return /* @__PURE__ */ n(vt, { ...o.content, dispatch: e });
+            return /* @__PURE__ */ n(vt, { ...r.content, dispatch: e });
           default:
-            return /* @__PURE__ */ n(it, { type: o.type, content: o.content });
+            return /* @__PURE__ */ n(it, { type: r.type, content: r.content });
         }
       }
     }
   );
 }, St = i(le)`
-  ${ze}
+  ${Le}
 
   > li {
     margin: 0;
   }
 `, Ct = ee(
-  ({ className: t, timestamp: e, sender: r, type: s, content: a }, o) => {
+  ({ className: t, timestamp: e, sender: o, type: s, content: a }, r) => {
     const d = ue(
       (c) => {
         let g = "first";
@@ -1159,25 +1159,25 @@ const Oe = ({ className: t }) => {
       },
       [a]
     ), { userLabel: u = "" } = S(), l = () => /* @__PURE__ */ n(N, { children: a.map((c) => {
-      const { key: g, body: p, title: $, form: z, actions: v } = c, O = !!p && !$ && !z && !v;
+      const { key: g, body: p, title: $, form: L, actions: v } = c, O = !!p && !$ && !L && !v;
       return /* @__PURE__ */ n(
         Qe,
         {
           className: t,
           discrete: O,
-          ref: o,
+          ref: r,
           timestamp: e,
-          fullWidth: !!z || !!v,
+          fullWidth: !!L || !!v,
           children: O && p ? /* @__PURE__ */ n(Q, { html: p }) : /* @__PURE__ */ n(V, { isSystem: !0, content: c })
         },
         g
       );
     }) }), m = () => /* @__PURE__ */ h(N, { children: [
-      /* @__PURE__ */ n(re, { className: "humany-sr-only", children: /* @__PURE__ */ n(M, { name: r == null ? void 0 : r.name, timestamp: e }) }),
+      /* @__PURE__ */ n(oe, { className: "humany-sr-only", children: /* @__PURE__ */ n(M, { name: o == null ? void 0 : o.name, timestamp: e }) }),
       /* @__PURE__ */ n(
         fe,
         {
-          sender: r,
+          sender: o,
           timestamp: e,
           className: t,
           children: /* @__PURE__ */ n(F, { className: "humany-message-content-bundle", children: a.map((c, g) => /* @__PURE__ */ n(
@@ -1185,7 +1185,7 @@ const Oe = ({ className: t }) => {
             {
               className: "humany-message-container",
               left: !0,
-              ref: o,
+              ref: r,
               children: /* @__PURE__ */ n(
                 V,
                 {
@@ -1199,13 +1199,13 @@ const Oe = ({ className: t }) => {
         }
       )
     ] }), y = () => /* @__PURE__ */ h(N, { children: [
-      /* @__PURE__ */ n(re, { className: "humany-sr-only", children: /* @__PURE__ */ n(M, { name: u, timestamp: e }) }),
+      /* @__PURE__ */ n(oe, { className: "humany-sr-only", children: /* @__PURE__ */ n(M, { name: u, timestamp: e }) }),
       /* @__PURE__ */ n(tt, { timestamp: e, className: t, children: /* @__PURE__ */ n(F, { className: "humany-message-content-bundle", children: a.map((c, g) => /* @__PURE__ */ n(
         Y,
         {
           className: "humany-message-container",
           right: !0,
-          ref: o,
+          ref: r,
           children: /* @__PURE__ */ n(
             V,
             {
@@ -1232,10 +1232,10 @@ const Oe = ({ className: t }) => {
 ), V = ({
   content: t,
   isUser: e,
-  isSystem: r,
+  isSystem: o,
   stacked: s
 }) => {
-  const a = G(), { title: o, body: d, actions: u, form: l, items: m } = t;
+  const a = G(), { title: r, body: d, actions: u, form: l, items: m } = t;
   return m ? /* @__PURE__ */ n(
     X,
     {
@@ -1248,12 +1248,12 @@ const Oe = ({ className: t }) => {
     X,
     {
       className: "humany-message-content",
-      padded: !r,
+      padded: !o,
       user: !!e,
       stacked: s,
       fullWidth: !!l || !!u,
       children: [
-        o && /* @__PURE__ */ n(E, { children: /* @__PURE__ */ n(qe, { variant: "h2", children: o }) }),
+        r && /* @__PURE__ */ n(E, { children: /* @__PURE__ */ n(qe, { variant: "h2", children: r }) }),
         d && /* @__PURE__ */ n(E, { children: /* @__PURE__ */ n(Fe, { html: d }) }),
         l && /* @__PURE__ */ n(E, { children: /* @__PURE__ */ n(
           _e,
@@ -1286,7 +1286,7 @@ const Oe = ({ className: t }) => {
       ]
     }
   );
-}, re = i.div`
+}, oe = i.div`
   position: absolute !important;
   height: 1px;
   width: 1px;
@@ -1295,8 +1295,8 @@ const Oe = ({ className: t }) => {
   clip: rect(1px, 1px, 1px, 1px);
   left: -10000000px;
   top: auto;
-`, zt = () => {
-  const { skipToLatestMessageLabel: t = "Skip to latest message" } = S(), e = A(), r = () => {
+`, Lt = () => {
+  const { skipToLatestMessageLabel: t = "Skip to latest message" } = S(), e = I(), o = () => {
     const s = e.get("widgetDOMElement");
     if (s) {
       const a = s.querySelectorAll(
@@ -1306,17 +1306,17 @@ const Oe = ({ className: t }) => {
     }
   };
   return /* @__PURE__ */ n(
-    Lt,
+    zt,
     {
       className: "humany-skip-to-latest-message",
       onKeyDown: (s) => {
-        (s.key === "Enter" || s.keyCode === 13) && r();
+        (s.key === "Enter" || s.keyCode === 13) && o();
       },
-      onClick: r,
+      onClick: o,
       children: t
     }
   );
-}, Lt = i.button`
+}, zt = i.button`
   position: absolute;
   bottom: 60px;
   text-align: center;
@@ -1337,16 +1337,16 @@ const Oe = ({ className: t }) => {
     ${b};
   }
 `, ye = () => {
-  const t = A(), e = ue((m) => {
+  const t = I(), e = ue((m) => {
     m && setTimeout(() => {
       m.scrollIntoView({
         block: "start",
         behavior: "smooth"
       });
     }, 250);
-  }, []), [r, s] = ie(!0), {
+  }, []), [o, s] = ie(!0), {
     messages: a,
-    loading: o,
+    loading: r,
     typingActors: d = []
   } = S(), u = () => d && d.length ? d.map((m, y) => /* @__PURE__ */ n(
     _,
@@ -1371,7 +1371,7 @@ const Oe = ({ className: t }) => {
       y.length && y.length > l.current && (l.current = y.length, y[y.length - 1].focus());
     }
   }), /* @__PURE__ */ h(N, { children: [
-    /* @__PURE__ */ h(Nt, { tabIndex: 0, scrollableCss: r, ref: s, children: [
+    /* @__PURE__ */ h(Nt, { tabIndex: 0, scrollableCss: o, ref: s, children: [
       a && a.length ? a.map((m, y) => {
         const { type: c, timestamp: g, sender: p, content: $ } = m;
         return /* @__PURE__ */ n(
@@ -1385,10 +1385,10 @@ const Oe = ({ className: t }) => {
         );
       }) : null,
       u(),
-      o && /* @__PURE__ */ n(_, { children: /* @__PURE__ */ n(ne, { ref: e }) })
+      r && /* @__PURE__ */ n(_, { children: /* @__PURE__ */ n(ne, { ref: e }) })
     ] }),
     /* @__PURE__ */ n(Oe, {}),
-    /* @__PURE__ */ n(zt, {})
+    /* @__PURE__ */ n(Lt, {})
   ] });
 }, Nt = i.div`
   display: flex;
@@ -1461,12 +1461,12 @@ const Oe = ({ className: t }) => {
       ref: e
     }
   );
-}, It = ({
+}, At = ({
   dispatch: t,
   header: e,
-  buttonLabel: r
+  buttonLabel: o
 }) => /* @__PURE__ */ h(
-  At,
+  It,
   {
     portalId: "humany-conversation-portal",
     className: "humany-conversation-outlet",
@@ -1476,8 +1476,8 @@ const Oe = ({ className: t }) => {
           Ot,
           {
             className: "humany-conversation-outlet-head-button",
-            "aria-label": r,
-            title: r,
+            "aria-label": o,
+            title: o,
             onClick: () => t("hide-overlay-conversation"),
             children: /* @__PURE__ */ n(
               k,
@@ -1503,7 +1503,7 @@ const Oe = ({ className: t }) => {
       /* @__PURE__ */ n(ye, {})
     ]
   }
-), At = i(ce)`
+), It = i(ce)`
   z-index: 11;
   top: auto;
   height: 65%;
@@ -1542,7 +1542,7 @@ const Oe = ({ className: t }) => {
   return (e = t.theme.colors) == null ? void 0 : e.text;
 }};
   margin: 0;
-`, Ot = i(I)`
+`, Ot = i(A)`
   display: flex;
   align-items: center;
   justify-content: center;
@@ -1567,15 +1567,15 @@ const Oe = ({ className: t }) => {
   }
 `, Ft = ({ className: t, ...e }) => {
   const {
-    overlay: r,
+    overlay: o,
     overlayConversationHeader: s,
     overlayConversationCloseLabel: a,
-    conversationControllerId: o
-  } = S(), d = G(), l = A().get("$settings");
+    conversationControllerId: r
+  } = S(), d = G(), l = I().get("$settings");
   return /* @__PURE__ */ n(
-    Le.Provider,
+    ze.Provider,
     {
-      value: o ? { id: o } : null,
+      value: r ? { id: r } : null,
       children: /* @__PURE__ */ h(ge.Provider, { value: l == null ? void 0 : l.language, children: [
         /* @__PURE__ */ n(
           Et,
@@ -1589,10 +1589,10 @@ const Oe = ({ className: t }) => {
             children: /* @__PURE__ */ n(ye, {})
           }
         ),
-        r && /* @__PURE__ */ h(N, { children: [
+        o && /* @__PURE__ */ h(N, { children: [
           /* @__PURE__ */ n(Mt, { dispatch: d }),
-          r.conversation && /* @__PURE__ */ n(
-            It,
+          o.conversation && /* @__PURE__ */ n(
+            At,
             {
               dispatch: d,
               header: s,

package/{conversation-083be7f1.js → conversation-dae76c70.js}

@@ -247,7 +247,7 @@
   line-height: 1.5em;
   grid-area: info;
   color: ${t=>{var e;return(e=t.theme.colors)==null?void 0:e.text}};
-`,q=(t,e)=>new Date(t).toLocaleTimeString(e||[],{hour:"numeric",minute:"2-digit"}),L=({className:t,name:e,timestamp:o,ariaHidden:a=!1})=>{const i=g.useContext(W);if(!e&&!o)return null;let r="";return e?o?r=`${e}: ${q(o,i)}`:r=e:o&&(r=q(o,i)),s.jsx(ge,{"aria-hidden":a,children:r})},U=({className:t,children:e,sender:o,timestamp:a})=>{const{avatar:i,name:r}=o,{avatarSize:u}=n.useProperties();return s.jsxs(ye,{hasAvatar:!!i,className:S.appendClassNames(t,"humany-conversation-agent-message"),children:[i&&s.jsx(re,{className:"humany-agent-avatar",avatarSize:u,children:typeof i=="string"?s.jsx("img",{src:i}):s.jsx(n.SymbolBadge,{symbol:i})}),e,s.jsx(L,{name:r,timestamp:a,ariaHidden:!0})]})},ye=l.div`
+`,q=(t,e)=>new Date(t).toLocaleTimeString(e||[],{hour:"numeric",minute:"2-digit"}),L=({className:t,name:e,timestamp:o,ariaHidden:a=!1})=>{const i=g.useContext(W);if(!e&&!o)return null;let r="";return e?o?r=`${e}: ${q(o,i)}`:r=e:o&&(r=q(o,i)),s.jsx(ge,{"aria-hidden":a,children:r})},U=({className:t,children:e,sender:o,timestamp:a})=>{const{avatar:i,name:r}=o,{avatarSize:u,avatarLabel:h="Avatar"}=n.useProperties();return s.jsxs(ye,{hasAvatar:!!i,className:S.appendClassNames(t,"humany-conversation-agent-message"),children:[i&&s.jsx(re,{className:"humany-agent-avatar",avatarSize:u,children:typeof i=="string"?s.jsx("img",{src:i,alt:h}):s.jsx(n.SymbolBadge,{symbol:i})}),e,s.jsx(L,{name:r,timestamp:a,ariaHidden:!0})]})},ye=l.div`
   display: grid;
   margin-right: 10%;
   width: 90%;

package/index.js

@@ -1,3 +1,3 @@
 "use strict";var _=Object.defineProperty;var q=(o,e,t)=>e in o?_(o,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[e]=t;var h=(o,e,t)=>(q(o,typeof e!="symbol"?e+"":e,t),t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const D=require("@telia-ace/widget-core"),p=require("@telia-ace/widget-services"),E=require("@telia-ace/widget-utilities"),L=require("@telia-ace/widget-forms"),M=require("@telia-ace/widget-plugins"),N=require("@telia-ace/widget-ui"),z=require("react");class U{constructor(e){h(this,"cache",new Map);h(this,"subscriptions",[]);this.controller=e;const{events:t}=e.container.get("$widget"),s=t.subscribe("data-client:fetched",(r,n)=>{n.type==="contact-method"&&this.cache.set(n.response.id,n.response)});this.subscriptions.push(s)}getConversationLogs(){return this.controller.messages.reduce((t,s)=>{const r=k(s),{key:n,content:a,type:i,sender:c,timestamp:d}=r.content,u=this.parseEntry(a,i,c,d);return u&&t.push(u),t},[])}parseEntry(e,t,s,r){const n=d=>{let u=[],l=[],m;if(Array.isArray(d)){const[g,f]=d;m=f}else m=d;return this.createMessageContent(m).length&&(l=[...l,this.createMessageContent(m)]),u=[...u,...this.createMessageOptions(m)],{messagesAsList:l,options:u}};let a=[],i=[];if(Array.isArray(e.items)){const{items:d}=e;d.forEach(u=>{const l=n(u);a=[...a,...l.options],i=[...i,...l.messagesAsList]})}else{const d=n(e);a=[...a,...d.options],i=[...i,...d.messagesAsList]}return{options:a,message:i.length?i.join(`
 `):void 0,source:this.createMessageSource(t),alias:this.createAlias(t,s),timestamp:r}}createMessageSource(e){return e}createAlias(e,t){return e===y.System?"system":(t==null?void 0:t.name)||"Me"}handleContactMethod(e){if(!this.cache.has(e))return;const t=this.cache.get(e);let s="";return s=this.appendText(s,`${t.clientName}:`),s=this.appendText(s,t.title),t.description&&(s=this.appendText(s,t.title)),s}getDetails(e,t=!0){if(!e)return"";const{header:s,title:r,label:n,description:a,text:i,html:c,body:d,contactMethodId:u}=e;let l="";if(u){const m=this.handleContactMethod(u.toString());m&&(l=this.appendText(l,m,t))}return s&&(l=this.appendText(l,s,t)),r&&(l=this.appendText(l,r,t)),a&&(l=this.appendText(l,a,t)),i&&(l=this.appendText(l,i,t)),n&&(l=this.appendText(l,n,t)),c&&(l=this.appendText(l,c,t)),d&&typeof d=="string"&&(l=this.appendText(l,d,t)),l}createMessageContent(e){let t="";return t=this.getDetails(e),t}createMessageOptions(e){let t=[],s=[];return Array.isArray(e==null?void 0:e.actions)?s=e.actions:typeof(e==null?void 0:e.actions)=="object"&&(s=Object.entries(e.actions).map(([r,n])=>({actionKey:r,label:n}))),s.length&&(t=s.map(r=>this.getDetails(r,!1))),t}appendText(e,t,s=!0){return s&&e.length?`${e}
-${t}`:e.length?`${e} ${t}`:t}dispose(){this.subscriptions.forEach(e=>{e()})}}class P{constructor(e,t){h(this,"id");h(this,"name");h(this,"avatar");h(this,"print",(e,t,s=null)=>{var i,c,d;const r={name:this.name,avatar:this.avatar,id:this.id},n=k(e,t);s=s??n.timestamp;const a=(c=(i=this.provider)==null?void 0:i.controller)==null?void 0:c.container.get("$widget");return(d=a==null?void 0:a.events)==null||d.dispatch("tracking:conversation-message",{sender:"agent"}),this.provider.createEntry(n.key,n.content,y.Agent,r,s)});h(this,"typing",()=>this.provider.setTypingState({name:this.name,avatar:this.avatar}));this.provider=e,this.id=t.id||E.uuid(),this.name=t.name,this.avatar=t.avatar}update(e){var r;const{name:t,avatar:s}=e;s===null?this.avatar=void 0:s&&(this.avatar=s),t===null?this.name=void 0:t&&(this.name=t),(r=this.provider.controller)==null||r.events.dispatch("conversation:agent-updated",{agent:this})}}class A{constructor(e,t,s){h(this,"subscriptions",[]);h(this,"options");h(this,"user");this.name=e,this.container=t,this.controller=s,this.user=s==null?void 0:s.user,this.options={silent:!1}}static create(e,t,s){return new A(e,t,s)}createAgent(e={}){var t;if(this.controller){const s=this.controller.getAgentById(e.id),r=s?new P(this,{...s,...e}):new P(this,e);return s||(t=this.controller)==null||t.events.dispatch("conversation:agent-created",{agent:r}),r}}print(e){var t;return(t=this.controller)==null?void 0:t.print(e)}setTypingState(e,t){var s;return(s=this.controller)==null?void 0:s.setTypingState(e,t)}loading(){return this.controller?this.controller.loader():()=>()=>{}}createEntry(e,t,s,r,n){var a;return(a=this.controller)==null?void 0:a.createEntry(e,t,s,r,n)}dispose(){var e;process.env.NODE_ENV!=="production"&&console.log(`conversation-provider: dispose (${this.name})`),(e=this.controller)==null||e.disposeProvider(this),this.controller=null,this.subscriptions.forEach(t=>t())}isRehydrated(){var e;return((e=this.controller)==null?void 0:e.isRehydrated())||Promise.resolve(!1)}getHistory(){var e;return((e=this.controller)==null?void 0:e.getHistory())||[]}complete(){var e;(e=this.controller)==null||e.onCompleteProvider()}setOptions(e={silent:!1}){this.options=e}onUnreadMessage(e){var t;if(this.controller){const s=(t=this.controller)==null?void 0:t.onUnreadMessage(e);return this.subscriptions.push(s),()=>{s()}}}onMounted(e){var t;if(this.controller){const s=(t=this.controller)==null?void 0:t.events.subscribe("conversation:component-mount-changed",e);return this.subscriptions.push(s),e({},this.controller.getComponentMountedState()),()=>{s()}}}}const O=o=>`conversation-${o}`;class K{constructor(){h(this,"_locking",Promise.resolve());h(this,"_locks",0)}isLocked(){return this._locks>0}lock(){this._locks+=1;let e;const t=new Promise(r=>e=()=>{this._locks-=1,r()}),s=this._locking.then(()=>e);return this._locking=this._locking.then(()=>t),s}}class Q{constructor(e,t,s){h(this,"sessionStorageKey");h(this,"locker",new K);h(this,"initialStoredAgents",[]);this.container=e,this.conversation=t,this.enabled=s,this.sessionStorageKey=O(t.id),t.onStarted(async()=>{if(t.messages.length>0)return;const{agents:r}=await this.read(),n=[];r&&r.forEach(i=>{const c=t.providerIndex(i.providerName),d=c>-1?t.registeredProviders[c]:t.createProvider(i.providerName),u=new P(d,{name:i.name,avatar:i.avatar,id:i.id});n.push(u)});const{messages:a}=await this.read();a.forEach(i=>{switch(i.type){case"agent":{const c=n.find(d=>{var u;return d.id===((u=i.sender)==null?void 0:u.id)});c&&c.print(i.content.items||i.content,{key:i.key},i.timestamp);return}case"user":{t.user.print(i.content.items||i.content,{key:i.key},i.timestamp);return}case"system":default:t.print(i.content.items||i.content,i.timestamp)}})}),t.onMessageCreated(async(r,n)=>{this.write(n.message,"messages")}),t.events.subscribe("conversation:agent-created",async(r,n)=>{const a={id:n.agent.id,name:n.agent.name,avatar:n.agent.avatar,providerName:n.agent.provider.name};await this.write(a,"agents")}),t.events.subscribe("conversation:agent-updated",async(r,n)=>{const{agents:a}=await this.read();await this.write([...a.map(i=>i.id===n.agent.id?{...i,name:n.agent.name,avatar:n.agent.avatar}:i)],"agents","update")})}setInitialData(e){this.initialStoredAgents=e.agents}async isRehydrated(){const{messages:e}=await this.read();return e.length>0}getStoredAgent(e){if(this.enabled)return this.initialStoredAgents.find(t=>t.id===e)}async write(e,t,s="add"){if(!this.enabled)return;const r=await this.locker.lock();return p.createStorageWriter(this.container,this.sessionStorageKey,p.StorageCategory.Necessary).then(async n=>{if(s==="add"){const a=await this.read();if(t==="messages"&&a.messages.findIndex(c=>c.key===e.key)>-1){r();return}const i={...a};return t==="messages"?i.messages=[...i.messages,e]:t==="agents"&&(i.agents=[...i.agents,e]),n({...a,...i}).then(()=>{r()})}if(s==="update"&&t==="agents"){const a=await this.read();return n({...a,agents:e}).then(()=>{r()})}return n(e).then(()=>{r()})})}async read(){return p.readStorage(this.container,this.sessionStorageKey).then(e=>e||{messages:[],agents:[]})}}class j{constructor(e){h(this,"print",(e,t,s=null)=>{var a,i;const r=k(e,t);return s=s??r.timestamp,(i=((a=this.controller)==null?void 0:a.container.get("$widget")).events)==null||i.dispatch("tracking:conversation-message",{sender:"user"}),this.controller.createEntry(r.key,r.content,y.User,void 0,s)});this.controller=e}}const x=async(o,e,t)=>{const s=await o.getAsync("conversation"),r=await o.getAsync("components"),n=s.controllers.find(a=>a.conversation.id===e);if(n){const a=[...n.conversation.providers];a.forEach(c=>{n.conversation.setProviderOptions(c,{silent:!0})}),n.conversation.queueProviders(a),n.conversation.setProviders([t]);const i=r.components().ofType("conversation");r.write({key:"setConversationProvider",attributes:{properties:{providers:[t]}},target:i,provider:"localStorage"})}};class ${constructor(e){this.writer=e}update(e){const t=this.getNormalizedSettings(e);this.writer(t)}remove(){this.writer(null)}getNormalizedSettings(e){return typeof e=="string"?{body:e}:e.length>-1&&typeof e=="object"?{items:e}:e}}var y=(o=>(o.User="user",o.Agent="agent",o.System="system",o))(y||{});const k=(o,e)=>{let t,s=(e==null?void 0:e.key)||E.uuid(),r=Date.now();if(Array.isArray(o)&&o.length>-1)typeof o[0]=="string"?t={items:[o]}:t={items:o};else if(typeof o=="string")t={body:o};else if(o=o||{},o.type)t={...o};else{if(t={body:o.body,actions:o.actions,title:o.title},o.key&&(s=o.key),o.timestamp&&(r=o.timestamp),typeof o.form=="function"){const n=L.FormBuilder.create(s);o.form(n);const a=n.get();t.form=a}o.timestamp===null&&(r=null)}return{content:t,key:s,timestamp:r}},W=(o,e)=>{if(!e)return;const t=JSON.stringify(e),s=o.findIndex(r=>t===JSON.stringify(r));if(s>-1)return o.splice(s,1)};class H{constructor(e,t,s){h(this,"formHandlers",{});h(this,"user",new j(this));h(this,"events");h(this,"providers",[]);h(this,"active",!1);h(this,"queuedProviders",[]);h(this,"registeredProviders",[]);h(this,"loaders",0);h(this,"componentMounted",!1);h(this,"store");h(this,"messages",[]);h(this,"typingActors",[]);h(this,"conversationHistory");h(this,"print",(e,t=null)=>{const s=k(e);t=t??s.timestamp;const r=this.container.get("$widget");return r==null||r.events.dispatch("tracking:conversation-message",{sender:"system"}),this.createEntry(s.key,s.content,"system",void 0,t)});this.container=e,this.id=t;const r=e.get("$widget");this.events=r.events.createChild(this),this.store=new Q(e,this,s.rehydrate),this.conversationHistory=new U(this)}setInitialStorage(e){this.store.setInitialData(e)}setProviders(e){const t=[],s=[];this.providers.reduce((r,n)=>(e.indexOf(n)===-1&&r.push(n),r),[]).forEach(r=>{const n=this.providers.indexOf(r);n>-1&&(t.push(r),this.providers.splice(n,1))}),e.forEach(r=>{this.providers.indexOf(r)===-1&&(s.push(r),this.providers.push(r))}),(s.length||t.length)&&this.events.dispatch("conversation:providers-changed",{added:s,removed:t})}createProvider(e){const t=this.providerIndex(e);if(t>-1)return this.registeredProviders[t];const s=A.create(e,this.container,this);return this.registeredProviders.push(s),s}providerIndex(e){return this.registeredProviders.findIndex(t=>t.name===e)}getAgentById(e){if(e)return this.store.getStoredAgent(e)}dispose(){this.conversationHistory.dispose(),this.registeredProviders.forEach(e=>e.dispose()),this.messages=[],this.events.dispatch("conversation:controller-disposed",this),this.active=!1}onDispose(e){return this.events.subscribe("conversation:controller-disposed",e)}onStarted(e){return this.events.subscribe("conversation:started",e)}onMessageCreated(e){return this.events.subscribe("conversation:message-created",e)}isRehydrated(){return this.store.isRehydrated()}disposeProvider(e){const t=this.providerIndex(e.name);t>-1&&this.registeredProviders.splice(t,1),this.events.dispatch("conversation:providers-changed",{removed:[e.name]}),this.registeredProviders.length||this.dispose()}onProvidersChange(e){return this.events.subscribe("conversation:providers-changed",e)}setComponentMountedState(e){this.componentMounted!==e&&(this.componentMounted=e,e&&(this.events.dispatch("conversation:unread-message",!1),this.events.dispatch("conversation:started",!0),this.active=!0),this.events.dispatch("conversation:component-mount-changed",e))}setProviderOptions(e,t){const s=this.providerIndex(e);s>-1&&this.registeredProviders[s].setOptions(t)}changeProvider(e){this.registeredProviders.find(s=>s.name===e)&&x(this.container,this.id,e)}queueProviders(e){this.queuedProviders=e}onCompleteProvider(){const e=this.queuedProviders.pop();e&&x(this.container,this.id,e)}getComponentMountedState(){return this.componentMounted}onUnreadMessage(e){return this.events.subscribe("conversation:unread-message",e)}createEntry(e,t,s,r,n){const a={key:e,content:t,type:s,sender:r||null,timestamp:n||n===null?n:Date.now()};this.messages.push(a),a.type==="agent"&&W(this.typingActors,r);const i=new $(c=>{if(c!==null){const{timestamp:d=void 0,...u}=c;a.content=u,d&&(a.timestamp=d)}else{const d=this.messages.indexOf(a);a.content=null,d>-1&&this.messages.splice(d,1)}this.events.dispatch("conversation:message-updated",{message:a}),this.update()});return this.events.dispatch("conversation:message-created",{message:a}),this.update(),this.componentMounted||this.events.dispatch("conversation:unread-message",!0),i}update(){this.events.dispatch("conversation:updated",{messages:this.messages,loading:this.loaders>0,typingActors:this.typingActors})}getMessageStream(){return{messages:this.messages,loading:this.loaders>0,typingActors:this.typingActors}}setTypingState(e,t){return this.typingActors.indexOf(e)===-1&&(this.typingActors.push(e),this.update()),()=>{W(this.typingActors,e),this.update()}}loader(){this.loaders=this.loaders+1;let e=!1;return this.loaders===1&&this.update(),()=>{e||(e=!0,this.loaders=this.loaders-1,this.loaders===0&&this.update())}}submitForm(e,t){this.formHandlers[e]={...this.formHandlers[e],submit:t}}validateForm(e,t){this.formHandlers[e]={...this.formHandlers[e],validate:t}}getHistory(){return this.conversationHistory.getConversationLogs()}}const F=(o,e)=>{const t=o.split("_contact");return e.widgets.get(t[0])},I=o=>{const e=o.get("$widget"),{name:t,implementation:s}=o.get("$widget"),r=t.indexOf("_contact")>-1?F(t,s):e,{data:n}=o.get("$settings"),{trigger:a}=r.container.get("$settings"),i=`${t.replace("_contact-method","").replace("_contact","")}_contact-method`,c=s.widgets.get(i);return c&&!a?{chatWidget:c,mainWidget:r,data:n}:{mainWidget:r,data:n}},G=o=>{const{chatWidget:e}=I(o);return!!e},R=(o,e,t)=>{const{mainWidget:s,data:r,chatWidget:n}=I(o);return n?n.state==="activated"?n.invoke("open").then(()=>{n.container.getAsync("conversation").then(a=>{a.navigateToConversationIfActive(e.id).then(()=>M.closeAllModals(o))})}):n.activate().then(()=>{const{trigger:a}=n.container.get("$settings");return a.action="hide",n.invoke("setSettings",()=>({data:r,trigger:a,activate:!0})).then(()=>n.container.getAsync("components").then(i=>{const c=i.components().ofType("contact-method");i.write({key:"setContactMethodId",attributes:{properties:{id:e.id,guideId:e.guideId}},target:c,provider:"localStorage"});const d=i.components().ofType("conversation");i.write({key:"setConversationProvider",attributes:{properties:{providers:[e.clientName]}},target:d,provider:"localStorage"})}))}).then(()=>n.invoke("attach",{key:"contact-method",triggerDOMElement:t,withRenderState:"open"})).then(()=>(p.createStorageWriter(n.container,"activeStickyWidget",p.StorageCategory.Necessary,{medium:p.StorageMedium.Local,scope:p.StorageScope.Implementation}).then(a=>a(n.name)),n.container.getAsync("conversation").then(a=>{a.setConversationEndedBehavior(S.Deactivate)}).then(()=>M.closeAllModals(o)).then(()=>!1))):(s.container.getAsync("conversation").then(a=>a.navigateToConversationIfActive(e.id).then(()=>a.setConversationEndedBehavior(S.Navigate))),!n)},J=(o,e,t="conversation")=>{const{mainWidget:s,chatWidget:r}=I(o);return r?r.container.getAsync("router").then(n=>{n.navigate(t,{id:e.id})}):s.container.getAsync("conversation").then(n=>{var a;(a=n.setConversationEndedBehavior(S.Navigate))==null||a.then(()=>{s.container.getAsync("router").then(i=>{s.container.getAsync("components").then(c=>{const d=c.components().ofType("conversation");c.write({key:"setConversationProvider",attributes:{properties:{providers:[e.clientName]}},target:d,provider:"localStorage"})}).then(()=>{i.navigate(t,{id:e.id})})})})})},b="conversations";var S=(o=>(o.Deactivate="deactivate",o.Navigate="navigate",o.None="none",o))(S||{});class w{constructor(e,t){h(this,"events");h(this,"controllers",[]);h(this,"providers",[]);h(this,"disposeProviders",{});h(this,"subscriptions",[]);h(this,"storageWriter",null);h(this,"router",null);h(this,"buttonQuery",null);h(this,"sessionInfo",null);this.container=e,this.components=t;const s=e.get("$widget");this.events=s.events.createChild(this)}initialize(){p.createStorageWriter(this.container,b,p.StorageCategory.Necessary,{medium:p.StorageMedium.Local}).then(e=>this.storageWriter=e),p.readStorage(this.container,b,p.StorageMedium.Local).then(e=>{this.buttonQuery=this.components.components().ofType("conversation-return-button"),e&&(this.sessionInfo=e,e.id&&e.route&&this.writeToComponents({active:!0,alert:{show:!1}}))}),this.container.getAsync("router").then(e=>this.router=e),this.events.subscribe("conversation:ended",(e,t)=>{var s,r,n;switch((s=this.sessionInfo)==null?void 0:s.conversationEndedBehavior){case"deactivate":this.container.get("$widget").deactivate();break;case"navigate":const i=(r=this.router)==null?void 0:r.getInitialRoute();i&&((n=this.router)==null||n.navigate(i.name));break}this.writeToComponents({active:!1}),this.sessionInfo=null,this.storageWriter&&this.storageWriter()})}addSubscription(e){this.subscriptions.push(e)}static getInstance(e,t="conversation"){return E.lock(e)(()=>e.getAsync(t).then(s=>{let r=s;return r||D.ComponentPlatform.getInstance(e).then(n=>(r=new w(e,n),r.initialize(),e.registerAsync(t,()=>r),r))}))}navigateToConversationIfActive(e){return p.readStorage(this.container,b,p.StorageMedium.Local).then(t=>{var s;if(t&&t.id===e&&t.route){const{name:r,params:n}=t.route;(s=this.router)==null||s.navigate(r,n)}})}setConversationEndedBehavior(e){return p.readStorage(this.container,b,p.StorageMedium.Local).then(t=>{let s=t;return s?s.conversationEndedBehavior=e:s={conversationEndedBehavior:e},this.sessionInfo=s,this.storageWriter&&this.storageWriter(this.sessionInfo)||Promise.resolve()})}async createController(e,t){const s=O(e),{agents:r}=await p.readStorage(this.container,s)||{agents:[]},n=this.controllers.findIndex(i=>i.conversation.id===e);let a;return n>-1?a=this.controllers[n].conversation:a=new H(this.container,e,t),a.setInitialStorage({agents:r||[]}),a}registerProvider(e,t){const s={name:e,handler:t};this.providers.push(s),this.controllers.filter(r=>r.conversation.providers.indexOf(e)>-1).forEach(r=>{this.invokeHandler(s,r)})}registerController(e,t){const s=this.controllers.findIndex(n=>n.conversation.id===e.id);let r;if(s<0){r={conversation:e,component:t},this.controllers.push(r);const n=a=>{a&&this.providers.filter(i=>a.indexOf(i.name)>-1).forEach(i=>{this.invokeHandler(i,r)})};return this.subscriptions.push(e.onDispose((a,i)=>{const c=this.controllers.findIndex(d=>d.conversation===i);c>-1&&this.controllers.splice(c,1),this.components.components().ofType("conversation-return-button").select().writeProperties({active:!1}),this.events.dispatch("conversation:ended",{},{bubbles:!0})})),this.subscriptions.push(e.onProvidersChange((a,i)=>{const{added:c,removed:d=[]}=i;d.forEach(u=>{(this.disposeProviders[u]||[]).forEach(l=>{l()})}),n(c)})),this.subscriptions.push(e.onStarted((a,i)=>{var d,u;const c={id:e.id,route:(d=this.router)==null?void 0:d.getRouteData(),conversationEndedBehavior:(u=this.sessionInfo)==null?void 0:u.conversationEndedBehavior};this.sessionInfo=c,this.storageWriter&&this.storageWriter(c),this.writeToComponents({active:i})})),this.subscriptions.push(e.onUnreadMessage((a,i)=>{this.events.dispatch("conversation:unread-message",i),this.writeToComponents({alert:{show:i}})})),n(e.providers),!0}return r=this.controllers[s],!1}writeToComponents(e,t="conversationReturnButtonState"){this.buttonQuery&&this.components.write({key:"conversationReturnButtonState",attributes:{properties:e},target:this.buttonQuery,provider:"localStorage"})}invokeHandler(e,t){const s=e.handler(t.conversation.createProvider(e.name),t.component);s&&(this.disposeProviders[e.name]||(this.disposeProviders[e.name]=[]),this.disposeProviders[e.name].push(s))}getComponentRoute(){return p.readStorage(this.container,b,p.StorageMedium.Local).then(e=>e==null?void 0:e.route)}dispose(){Object.keys(this.disposeProviders).forEach(e=>{this.disposeProviders[e].forEach(t=>{t()})}),this.subscriptions.forEach(e=>{e()}),this.controllers=[],this.providers=[]}static async handleContactMethodClick(e,t,s,r){if(G(t)){e.preventDefault();let n=document.getElementById("humany-dynamic-anchor");n||(n=document.createElement("a"),n.setAttribute("href","#"),n.id="humany-dynamic-anchor",document.body.appendChild(n)),R(t,s,n)}R(t,s)}static async handleContactMethodSubmit(e,t){var s,r;return(r=(s=t==null?void 0:t.body.form.meta)==null?void 0:s.conversation)!=null&&r.id?x(e,t.body.form.meta.conversation.id,t.clientName):J(e,t)}}const V=(o,e)=>o.reduce((t,s,r)=>{var a,i;const n={...s,content:[{...s.content,key:s.key}]};if(t.length>0&&s.type!==y.System){const c=t[t.length-1];if((!e&&e!==0||Math.abs(c.timestamp-s.timestamp)<e)&&((a=c.sender)==null?void 0:a.name)===((i=s.sender)==null?void 0:i.name)&&c.type===s.type)return c.timestamp=s.timestamp,c.content.push({...s.content,key:s.key}),t}return t.push(n),t},[]),Y=o=>Promise.all([w.getInstance(o),o.getAsync("router")]).then(([e,t])=>N.createReactComponent(o,"conversation",Promise.resolve().then(()=>require("./conversation-083be7f1.js")),async s=>{const{rehydrate:r=!1}=s.properties(),a=t.getRouteData().params.id||s.node.name||"component",i=await e.createController(a,{rehydrate:r}),c=e.registerController(i,s),d=3*60*1e3,u=v=>{const{providers:g=[]}=v;if(g){const f=Array.isArray(g)?g:[g];return i.setProviders(f),f}};u(s.properties(u)),i.setComponentMountedState(!0);const l=v=>{const{loading:g,typingActors:f,messages:C}=v;s.writeProperties({loading:g,typingActors:f,messages:V(C,d)})};l(i.getMessageStream()),c&&(s.writeProperties({conversationControllerId:i.id}),s.actions.create("user-submit",(v,g)=>{if(g){const{preventDefault:f,validationPromise:C}=g;if(f){C&&C().then(T=>{T&&i.user.print(T)});return}}i.user.print(v.text)}),s.actions.create("user-typing",(v,g)=>{}),s.actions.create("form",(v,g)=>{}),s.actions.create("action",(v,g)=>{}),s.actions.create("overlay-mounted",(v,g)=>{}),s.actions.create("show-overlay",(v,g)=>{s.writeProperties({overlay:{conversation:!1,secondary:!1}})}),s.actions.create("hide-overlay",(v,g)=>{s.writeProperties({overlay:null})}),s.actions.create("show-overlay-conversation",(v,g)=>{s.writeProperties({overlay:{conversation:!0,secondary:!1}})}),s.actions.create("hide-overlay-conversation",(v,g)=>{s.writeProperties({overlay:{conversation:!1,secondary:!1}})}));const m=i.events.subscribe("conversation:updated",(v,g)=>{l(g)});return()=>{i.setComponentMountedState(!1),m(),i.active||l({messages:[],typingActors:[],loading:!1})}},{reuseController:!0})),X=o=>Promise.all([D.ComponentPlatform.getInstance(o),w.getInstance(o),o.getAsync("router")]).then(([e,t,s])=>N.createReactComponent(o,"conversation-return-button",Promise.resolve().then(()=>require("./return-button-f1f43984.js")),r=>{r.actions.create("toggle",(n={})=>{var a;(a=t.getComponentRoute())==null||a.then(i=>{i&&s.navigate(i.name,i.params)})})}));var B=(o=>(o.LinkList="link-list",o.Separator="separator",o.ButtonList="button-list",o.ItemList="item-list",o.Text="text",o.HTML="html",o.VideoRequest="video-request",o))(B||{});const Z=(o,e,t)=>o.getAsync("componentResolver").then(async s=>{(await w.getInstance(o)).addSubscription(s.registerComponent(e,z.lazy(()=>t)))});exports.Agent=P;exports.ConversationComponent=Y;exports.ConversationController=H;exports.ConversationEndedBehavior=S;exports.ConversationEntry=$;exports.ConversationMessageListItemType=B;exports.ConversationMessageType=y;exports.ConversationPlatform=w;exports.ConversationProvider=A;exports.ConversationReturnButtonComponent=X;exports.registerCustomMessageComponent=Z;
+${t}`:e.length?`${e} ${t}`:t}dispose(){this.subscriptions.forEach(e=>{e()})}}class P{constructor(e,t){h(this,"id");h(this,"name");h(this,"avatar");h(this,"print",(e,t,s=null)=>{var i,c,d;const r={name:this.name,avatar:this.avatar,id:this.id},n=k(e,t);s=s??n.timestamp;const a=(c=(i=this.provider)==null?void 0:i.controller)==null?void 0:c.container.get("$widget");return(d=a==null?void 0:a.events)==null||d.dispatch("tracking:conversation-message",{sender:"agent"}),this.provider.createEntry(n.key,n.content,y.Agent,r,s)});h(this,"typing",()=>this.provider.setTypingState({name:this.name,avatar:this.avatar}));this.provider=e,this.id=t.id||E.uuid(),this.name=t.name,this.avatar=t.avatar}update(e){var r;const{name:t,avatar:s}=e;s===null?this.avatar=void 0:s&&(this.avatar=s),t===null?this.name=void 0:t&&(this.name=t),(r=this.provider.controller)==null||r.events.dispatch("conversation:agent-updated",{agent:this})}}class A{constructor(e,t,s){h(this,"subscriptions",[]);h(this,"options");h(this,"user");this.name=e,this.container=t,this.controller=s,this.user=s==null?void 0:s.user,this.options={silent:!1}}static create(e,t,s){return new A(e,t,s)}createAgent(e={}){var t;if(this.controller){const s=this.controller.getAgentById(e.id),r=s?new P(this,{...s,...e}):new P(this,e);return s||(t=this.controller)==null||t.events.dispatch("conversation:agent-created",{agent:r}),r}}print(e){var t;return(t=this.controller)==null?void 0:t.print(e)}setTypingState(e,t){var s;return(s=this.controller)==null?void 0:s.setTypingState(e,t)}loading(){return this.controller?this.controller.loader():()=>()=>{}}createEntry(e,t,s,r,n){var a;return(a=this.controller)==null?void 0:a.createEntry(e,t,s,r,n)}dispose(){var e;process.env.NODE_ENV!=="production"&&console.log(`conversation-provider: dispose (${this.name})`),(e=this.controller)==null||e.disposeProvider(this),this.controller=null,this.subscriptions.forEach(t=>t())}isRehydrated(){var e;return((e=this.controller)==null?void 0:e.isRehydrated())||Promise.resolve(!1)}getHistory(){var e;return((e=this.controller)==null?void 0:e.getHistory())||[]}complete(){var e;(e=this.controller)==null||e.onCompleteProvider()}setOptions(e={silent:!1}){this.options=e}onUnreadMessage(e){var t;if(this.controller){const s=(t=this.controller)==null?void 0:t.onUnreadMessage(e);return this.subscriptions.push(s),()=>{s()}}}onMounted(e){var t;if(this.controller){const s=(t=this.controller)==null?void 0:t.events.subscribe("conversation:component-mount-changed",e);return this.subscriptions.push(s),e({},this.controller.getComponentMountedState()),()=>{s()}}}}const O=o=>`conversation-${o}`;class K{constructor(){h(this,"_locking",Promise.resolve());h(this,"_locks",0)}isLocked(){return this._locks>0}lock(){this._locks+=1;let e;const t=new Promise(r=>e=()=>{this._locks-=1,r()}),s=this._locking.then(()=>e);return this._locking=this._locking.then(()=>t),s}}class Q{constructor(e,t,s){h(this,"sessionStorageKey");h(this,"locker",new K);h(this,"initialStoredAgents",[]);this.container=e,this.conversation=t,this.enabled=s,this.sessionStorageKey=O(t.id),t.onStarted(async()=>{if(t.messages.length>0)return;const{agents:r}=await this.read(),n=[];r&&r.forEach(i=>{const c=t.providerIndex(i.providerName),d=c>-1?t.registeredProviders[c]:t.createProvider(i.providerName),u=new P(d,{name:i.name,avatar:i.avatar,id:i.id});n.push(u)});const{messages:a}=await this.read();a.forEach(i=>{switch(i.type){case"agent":{const c=n.find(d=>{var u;return d.id===((u=i.sender)==null?void 0:u.id)});c&&c.print(i.content.items||i.content,{key:i.key},i.timestamp);return}case"user":{t.user.print(i.content.items||i.content,{key:i.key},i.timestamp);return}case"system":default:t.print(i.content.items||i.content,i.timestamp)}})}),t.onMessageCreated(async(r,n)=>{this.write(n.message,"messages")}),t.events.subscribe("conversation:agent-created",async(r,n)=>{const a={id:n.agent.id,name:n.agent.name,avatar:n.agent.avatar,providerName:n.agent.provider.name};await this.write(a,"agents")}),t.events.subscribe("conversation:agent-updated",async(r,n)=>{const{agents:a}=await this.read();await this.write([...a.map(i=>i.id===n.agent.id?{...i,name:n.agent.name,avatar:n.agent.avatar}:i)],"agents","update")})}setInitialData(e){this.initialStoredAgents=e.agents}async isRehydrated(){const{messages:e}=await this.read();return e.length>0}getStoredAgent(e){if(this.enabled)return this.initialStoredAgents.find(t=>t.id===e)}async write(e,t,s="add"){if(!this.enabled)return;const r=await this.locker.lock();return p.createStorageWriter(this.container,this.sessionStorageKey,p.StorageCategory.Necessary).then(async n=>{if(s==="add"){const a=await this.read();if(t==="messages"&&a.messages.findIndex(c=>c.key===e.key)>-1){r();return}const i={...a};return t==="messages"?i.messages=[...i.messages,e]:t==="agents"&&(i.agents=[...i.agents,e]),n({...a,...i}).then(()=>{r()})}if(s==="update"&&t==="agents"){const a=await this.read();return n({...a,agents:e}).then(()=>{r()})}return n(e).then(()=>{r()})})}async read(){return p.readStorage(this.container,this.sessionStorageKey).then(e=>e||{messages:[],agents:[]})}}class j{constructor(e){h(this,"print",(e,t,s=null)=>{var a,i;const r=k(e,t);return s=s??r.timestamp,(i=((a=this.controller)==null?void 0:a.container.get("$widget")).events)==null||i.dispatch("tracking:conversation-message",{sender:"user"}),this.controller.createEntry(r.key,r.content,y.User,void 0,s)});this.controller=e}}const x=async(o,e,t)=>{const s=await o.getAsync("conversation"),r=await o.getAsync("components"),n=s.controllers.find(a=>a.conversation.id===e);if(n){const a=[...n.conversation.providers];a.forEach(c=>{n.conversation.setProviderOptions(c,{silent:!0})}),n.conversation.queueProviders(a),n.conversation.setProviders([t]);const i=r.components().ofType("conversation");r.write({key:"setConversationProvider",attributes:{properties:{providers:[t]}},target:i,provider:"localStorage"})}};class ${constructor(e){this.writer=e}update(e){const t=this.getNormalizedSettings(e);this.writer(t)}remove(){this.writer(null)}getNormalizedSettings(e){return typeof e=="string"?{body:e}:e.length>-1&&typeof e=="object"?{items:e}:e}}var y=(o=>(o.User="user",o.Agent="agent",o.System="system",o))(y||{});const k=(o,e)=>{let t,s=(e==null?void 0:e.key)||E.uuid(),r=Date.now();if(Array.isArray(o)&&o.length>-1)typeof o[0]=="string"?t={items:[o]}:t={items:o};else if(typeof o=="string")t={body:o};else if(o=o||{},o.type)t={...o};else{if(t={body:o.body,actions:o.actions,title:o.title},o.key&&(s=o.key),o.timestamp&&(r=o.timestamp),typeof o.form=="function"){const n=L.FormBuilder.create(s);o.form(n);const a=n.get();t.form=a}o.timestamp===null&&(r=null)}return{content:t,key:s,timestamp:r}},W=(o,e)=>{if(!e)return;const t=JSON.stringify(e),s=o.findIndex(r=>t===JSON.stringify(r));if(s>-1)return o.splice(s,1)};class H{constructor(e,t,s){h(this,"formHandlers",{});h(this,"user",new j(this));h(this,"events");h(this,"providers",[]);h(this,"active",!1);h(this,"queuedProviders",[]);h(this,"registeredProviders",[]);h(this,"loaders",0);h(this,"componentMounted",!1);h(this,"store");h(this,"messages",[]);h(this,"typingActors",[]);h(this,"conversationHistory");h(this,"print",(e,t=null)=>{const s=k(e);t=t??s.timestamp;const r=this.container.get("$widget");return r==null||r.events.dispatch("tracking:conversation-message",{sender:"system"}),this.createEntry(s.key,s.content,"system",void 0,t)});this.container=e,this.id=t;const r=e.get("$widget");this.events=r.events.createChild(this),this.store=new Q(e,this,s.rehydrate),this.conversationHistory=new U(this)}setInitialStorage(e){this.store.setInitialData(e)}setProviders(e){const t=[],s=[];this.providers.reduce((r,n)=>(e.indexOf(n)===-1&&r.push(n),r),[]).forEach(r=>{const n=this.providers.indexOf(r);n>-1&&(t.push(r),this.providers.splice(n,1))}),e.forEach(r=>{this.providers.indexOf(r)===-1&&(s.push(r),this.providers.push(r))}),(s.length||t.length)&&this.events.dispatch("conversation:providers-changed",{added:s,removed:t})}createProvider(e){const t=this.providerIndex(e);if(t>-1)return this.registeredProviders[t];const s=A.create(e,this.container,this);return this.registeredProviders.push(s),s}providerIndex(e){return this.registeredProviders.findIndex(t=>t.name===e)}getAgentById(e){if(e)return this.store.getStoredAgent(e)}dispose(){this.conversationHistory.dispose(),this.registeredProviders.forEach(e=>e.dispose()),this.messages=[],this.events.dispatch("conversation:controller-disposed",this),this.active=!1}onDispose(e){return this.events.subscribe("conversation:controller-disposed",e)}onStarted(e){return this.events.subscribe("conversation:started",e)}onMessageCreated(e){return this.events.subscribe("conversation:message-created",e)}isRehydrated(){return this.store.isRehydrated()}disposeProvider(e){const t=this.providerIndex(e.name);t>-1&&this.registeredProviders.splice(t,1),this.events.dispatch("conversation:providers-changed",{removed:[e.name]}),this.registeredProviders.length||this.dispose()}onProvidersChange(e){return this.events.subscribe("conversation:providers-changed",e)}setComponentMountedState(e){this.componentMounted!==e&&(this.componentMounted=e,e&&(this.events.dispatch("conversation:unread-message",!1),this.events.dispatch("conversation:started",!0),this.active=!0),this.events.dispatch("conversation:component-mount-changed",e))}setProviderOptions(e,t){const s=this.providerIndex(e);s>-1&&this.registeredProviders[s].setOptions(t)}changeProvider(e){this.registeredProviders.find(s=>s.name===e)&&x(this.container,this.id,e)}queueProviders(e){this.queuedProviders=e}onCompleteProvider(){const e=this.queuedProviders.pop();e&&x(this.container,this.id,e)}getComponentMountedState(){return this.componentMounted}onUnreadMessage(e){return this.events.subscribe("conversation:unread-message",e)}createEntry(e,t,s,r,n){const a={key:e,content:t,type:s,sender:r||null,timestamp:n||n===null?n:Date.now()};this.messages.push(a),a.type==="agent"&&W(this.typingActors,r);const i=new $(c=>{if(c!==null){const{timestamp:d=void 0,...u}=c;a.content=u,d&&(a.timestamp=d)}else{const d=this.messages.indexOf(a);a.content=null,d>-1&&this.messages.splice(d,1)}this.events.dispatch("conversation:message-updated",{message:a}),this.update()});return this.events.dispatch("conversation:message-created",{message:a}),this.update(),this.componentMounted||this.events.dispatch("conversation:unread-message",!0),i}update(){this.events.dispatch("conversation:updated",{messages:this.messages,loading:this.loaders>0,typingActors:this.typingActors})}getMessageStream(){return{messages:this.messages,loading:this.loaders>0,typingActors:this.typingActors}}setTypingState(e,t){return this.typingActors.indexOf(e)===-1&&(this.typingActors.push(e),this.update()),()=>{W(this.typingActors,e),this.update()}}loader(){this.loaders=this.loaders+1;let e=!1;return this.loaders===1&&this.update(),()=>{e||(e=!0,this.loaders=this.loaders-1,this.loaders===0&&this.update())}}submitForm(e,t){this.formHandlers[e]={...this.formHandlers[e],submit:t}}validateForm(e,t){this.formHandlers[e]={...this.formHandlers[e],validate:t}}getHistory(){return this.conversationHistory.getConversationLogs()}}const F=(o,e)=>{const t=o.split("_contact");return e.widgets.get(t[0])},I=o=>{const e=o.get("$widget"),{name:t,implementation:s}=o.get("$widget"),r=t.indexOf("_contact")>-1?F(t,s):e,{data:n}=o.get("$settings"),{trigger:a}=r.container.get("$settings"),i=`${t.replace("_contact-method","").replace("_contact","")}_contact-method`,c=s.widgets.get(i);return c&&!a?{chatWidget:c,mainWidget:r,data:n}:{mainWidget:r,data:n}},G=o=>{const{chatWidget:e}=I(o);return!!e},R=(o,e,t)=>{const{mainWidget:s,data:r,chatWidget:n}=I(o);return n?n.state==="activated"?n.invoke("open").then(()=>{n.container.getAsync("conversation").then(a=>{a.navigateToConversationIfActive(e.id).then(()=>M.closeAllModals(o))})}):n.activate().then(()=>{const{trigger:a}=n.container.get("$settings");return a.action="hide",n.invoke("setSettings",()=>({data:r,trigger:a,activate:!0})).then(()=>n.container.getAsync("components").then(i=>{const c=i.components().ofType("contact-method");i.write({key:"setContactMethodId",attributes:{properties:{id:e.id,guideId:e.guideId}},target:c,provider:"localStorage"});const d=i.components().ofType("conversation");i.write({key:"setConversationProvider",attributes:{properties:{providers:[e.clientName]}},target:d,provider:"localStorage"})}))}).then(()=>n.invoke("attach",{key:"contact-method",triggerDOMElement:t,withRenderState:"open"})).then(()=>(p.createStorageWriter(n.container,"activeStickyWidget",p.StorageCategory.Necessary,{medium:p.StorageMedium.Local,scope:p.StorageScope.Implementation}).then(a=>a(n.name)),n.container.getAsync("conversation").then(a=>{a.setConversationEndedBehavior(S.Deactivate)}).then(()=>M.closeAllModals(o)).then(()=>!1))):(s.container.getAsync("conversation").then(a=>a.navigateToConversationIfActive(e.id).then(()=>a.setConversationEndedBehavior(S.Navigate))),!n)},J=(o,e,t="conversation")=>{const{mainWidget:s,chatWidget:r}=I(o);return r?r.container.getAsync("router").then(n=>{n.navigate(t,{id:e.id})}):s.container.getAsync("conversation").then(n=>{var a;(a=n.setConversationEndedBehavior(S.Navigate))==null||a.then(()=>{s.container.getAsync("router").then(i=>{s.container.getAsync("components").then(c=>{const d=c.components().ofType("conversation");c.write({key:"setConversationProvider",attributes:{properties:{providers:[e.clientName]}},target:d,provider:"localStorage"})}).then(()=>{i.navigate(t,{id:e.id})})})})})},b="conversations";var S=(o=>(o.Deactivate="deactivate",o.Navigate="navigate",o.None="none",o))(S||{});class w{constructor(e,t){h(this,"events");h(this,"controllers",[]);h(this,"providers",[]);h(this,"disposeProviders",{});h(this,"subscriptions",[]);h(this,"storageWriter",null);h(this,"router",null);h(this,"buttonQuery",null);h(this,"sessionInfo",null);this.container=e,this.components=t;const s=e.get("$widget");this.events=s.events.createChild(this)}initialize(){p.createStorageWriter(this.container,b,p.StorageCategory.Necessary,{medium:p.StorageMedium.Local}).then(e=>this.storageWriter=e),p.readStorage(this.container,b,p.StorageMedium.Local).then(e=>{this.buttonQuery=this.components.components().ofType("conversation-return-button"),e&&(this.sessionInfo=e,e.id&&e.route&&this.writeToComponents({active:!0,alert:{show:!1}}))}),this.container.getAsync("router").then(e=>this.router=e),this.events.subscribe("conversation:ended",(e,t)=>{var s,r,n;switch((s=this.sessionInfo)==null?void 0:s.conversationEndedBehavior){case"deactivate":this.container.get("$widget").deactivate();break;case"navigate":const i=(r=this.router)==null?void 0:r.getInitialRoute();i&&((n=this.router)==null||n.navigate(i.name));break}this.writeToComponents({active:!1}),this.sessionInfo=null,this.storageWriter&&this.storageWriter()})}addSubscription(e){this.subscriptions.push(e)}static getInstance(e,t="conversation"){return E.lock(e)(()=>e.getAsync(t).then(s=>{let r=s;return r||D.ComponentPlatform.getInstance(e).then(n=>(r=new w(e,n),r.initialize(),e.registerAsync(t,()=>r),r))}))}navigateToConversationIfActive(e){return p.readStorage(this.container,b,p.StorageMedium.Local).then(t=>{var s;if(t&&t.id===e&&t.route){const{name:r,params:n}=t.route;(s=this.router)==null||s.navigate(r,n)}})}setConversationEndedBehavior(e){return p.readStorage(this.container,b,p.StorageMedium.Local).then(t=>{let s=t;return s?s.conversationEndedBehavior=e:s={conversationEndedBehavior:e},this.sessionInfo=s,this.storageWriter&&this.storageWriter(this.sessionInfo)||Promise.resolve()})}async createController(e,t){const s=O(e),{agents:r}=await p.readStorage(this.container,s)||{agents:[]},n=this.controllers.findIndex(i=>i.conversation.id===e);let a;return n>-1?a=this.controllers[n].conversation:a=new H(this.container,e,t),a.setInitialStorage({agents:r||[]}),a}registerProvider(e,t){const s={name:e,handler:t};this.providers.push(s),this.controllers.filter(r=>r.conversation.providers.indexOf(e)>-1).forEach(r=>{this.invokeHandler(s,r)})}registerController(e,t){const s=this.controllers.findIndex(n=>n.conversation.id===e.id);let r;if(s<0){r={conversation:e,component:t},this.controllers.push(r);const n=a=>{a&&this.providers.filter(i=>a.indexOf(i.name)>-1).forEach(i=>{this.invokeHandler(i,r)})};return this.subscriptions.push(e.onDispose((a,i)=>{const c=this.controllers.findIndex(d=>d.conversation===i);c>-1&&this.controllers.splice(c,1),this.components.components().ofType("conversation-return-button").select().writeProperties({active:!1}),this.events.dispatch("conversation:ended",{},{bubbles:!0})})),this.subscriptions.push(e.onProvidersChange((a,i)=>{const{added:c,removed:d=[]}=i;d.forEach(u=>{(this.disposeProviders[u]||[]).forEach(l=>{l()})}),n(c)})),this.subscriptions.push(e.onStarted((a,i)=>{var d,u;const c={id:e.id,route:(d=this.router)==null?void 0:d.getRouteData(),conversationEndedBehavior:(u=this.sessionInfo)==null?void 0:u.conversationEndedBehavior};this.sessionInfo=c,this.storageWriter&&this.storageWriter(c),this.writeToComponents({active:i})})),this.subscriptions.push(e.onUnreadMessage((a,i)=>{this.events.dispatch("conversation:unread-message",i),this.writeToComponents({alert:{show:i}})})),n(e.providers),!0}return r=this.controllers[s],!1}writeToComponents(e,t="conversationReturnButtonState"){this.buttonQuery&&this.components.write({key:"conversationReturnButtonState",attributes:{properties:e},target:this.buttonQuery,provider:"localStorage"})}invokeHandler(e,t){const s=e.handler(t.conversation.createProvider(e.name),t.component);s&&(this.disposeProviders[e.name]||(this.disposeProviders[e.name]=[]),this.disposeProviders[e.name].push(s))}getComponentRoute(){return p.readStorage(this.container,b,p.StorageMedium.Local).then(e=>e==null?void 0:e.route)}dispose(){Object.keys(this.disposeProviders).forEach(e=>{this.disposeProviders[e].forEach(t=>{t()})}),this.subscriptions.forEach(e=>{e()}),this.controllers=[],this.providers=[]}static async handleContactMethodClick(e,t,s,r){if(G(t)){e.preventDefault();let n=document.getElementById("humany-dynamic-anchor");n||(n=document.createElement("a"),n.setAttribute("href","#"),n.id="humany-dynamic-anchor",document.body.appendChild(n)),R(t,s,n)}R(t,s)}static async handleContactMethodSubmit(e,t){var s,r;return(r=(s=t==null?void 0:t.body.form.meta)==null?void 0:s.conversation)!=null&&r.id?x(e,t.body.form.meta.conversation.id,t.clientName):J(e,t)}}const V=(o,e)=>o.reduce((t,s,r)=>{var a,i;const n={...s,content:[{...s.content,key:s.key}]};if(t.length>0&&s.type!==y.System){const c=t[t.length-1];if((!e&&e!==0||Math.abs(c.timestamp-s.timestamp)<e)&&((a=c.sender)==null?void 0:a.name)===((i=s.sender)==null?void 0:i.name)&&c.type===s.type)return c.timestamp=s.timestamp,c.content.push({...s.content,key:s.key}),t}return t.push(n),t},[]),Y=o=>Promise.all([w.getInstance(o),o.getAsync("router")]).then(([e,t])=>N.createReactComponent(o,"conversation",Promise.resolve().then(()=>require("./conversation-dae76c70.js")),async s=>{const{rehydrate:r=!1}=s.properties(),a=t.getRouteData().params.id||s.node.name||"component",i=await e.createController(a,{rehydrate:r}),c=e.registerController(i,s),d=3*60*1e3,u=v=>{const{providers:g=[]}=v;if(g){const f=Array.isArray(g)?g:[g];return i.setProviders(f),f}};u(s.properties(u)),i.setComponentMountedState(!0);const l=v=>{const{loading:g,typingActors:f,messages:C}=v;s.writeProperties({loading:g,typingActors:f,messages:V(C,d)})};l(i.getMessageStream()),c&&(s.writeProperties({conversationControllerId:i.id}),s.actions.create("user-submit",(v,g)=>{if(g){const{preventDefault:f,validationPromise:C}=g;if(f){C&&C().then(T=>{T&&i.user.print(T)});return}}i.user.print(v.text)}),s.actions.create("user-typing",(v,g)=>{}),s.actions.create("form",(v,g)=>{}),s.actions.create("action",(v,g)=>{}),s.actions.create("overlay-mounted",(v,g)=>{}),s.actions.create("show-overlay",(v,g)=>{s.writeProperties({overlay:{conversation:!1,secondary:!1}})}),s.actions.create("hide-overlay",(v,g)=>{s.writeProperties({overlay:null})}),s.actions.create("show-overlay-conversation",(v,g)=>{s.writeProperties({overlay:{conversation:!0,secondary:!1}})}),s.actions.create("hide-overlay-conversation",(v,g)=>{s.writeProperties({overlay:{conversation:!1,secondary:!1}})}));const m=i.events.subscribe("conversation:updated",(v,g)=>{l(g)});return()=>{i.setComponentMountedState(!1),m(),i.active||l({messages:[],typingActors:[],loading:!1})}},{reuseController:!0})),X=o=>Promise.all([D.ComponentPlatform.getInstance(o),w.getInstance(o),o.getAsync("router")]).then(([e,t,s])=>N.createReactComponent(o,"conversation-return-button",Promise.resolve().then(()=>require("./return-button-f1f43984.js")),r=>{r.actions.create("toggle",(n={})=>{var a;(a=t.getComponentRoute())==null||a.then(i=>{i&&s.navigate(i.name,i.params)})})}));var B=(o=>(o.LinkList="link-list",o.Separator="separator",o.ButtonList="button-list",o.ItemList="item-list",o.Text="text",o.HTML="html",o.VideoRequest="video-request",o))(B||{});const Z=(o,e,t)=>o.getAsync("componentResolver").then(async s=>{(await w.getInstance(o)).addSubscription(s.registerComponent(e,z.lazy(()=>t)))});exports.Agent=P;exports.ConversationComponent=Y;exports.ConversationController=H;exports.ConversationEndedBehavior=S;exports.ConversationEntry=$;exports.ConversationMessageListItemType=B;exports.ConversationMessageType=y;exports.ConversationPlatform=w;exports.ConversationProvider=A;exports.ConversationReturnButtonComponent=X;exports.registerCustomMessageComponent=Z;

package/index.mjs

@@ -953,7 +953,7 @@ const ee = (o, e) => o.reduce((t, s, r) => {
 ]).then(([e, t]) => H(
   o,
   "conversation",
-  import("./conversation-d6ec6d94.mjs"),
+  import("./conversation-43344a01.mjs"),
   async (s) => {
     const { rehydrate: r = !1 } = s.properties(), a = t.getRouteData().params.id || s.node.name || "component", i = await e.createController(a, {
       rehydrate: r

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@telia-ace/widget-conversation",
-  "version": "1.3.0-rc.9",
+  "version": "1.3.0",
   "main": "./index.js",
   "types": "./index.d.ts",
   "exports": {
@@ -10,13 +10,13 @@
     }
   },
   "dependencies": {
-    "@telia-ace/widget-core": "^1.3.0-rc.9",
-    "@telia-ace/widget-forms": "^1.3.0-rc.9",
-    "@telia-ace/widget-plugins": "^1.3.0-rc.9",
-    "@telia-ace/widget-routing": "^1.3.0-rc.9",
-    "@telia-ace/widget-services": "^1.3.0-rc.9",
-    "@telia-ace/widget-ui": "^1.3.0-rc.9",
-    "@telia-ace/widget-utilities": "^1.3.0-rc.9",
+    "@telia-ace/widget-core": "^1.3.0",
+    "@telia-ace/widget-forms": "^1.3.0",
+    "@telia-ace/widget-plugins": "^1.3.0",
+    "@telia-ace/widget-routing": "^1.3.0",
+    "@telia-ace/widget-services": "^1.3.0",
+    "@telia-ace/widget-ui": "^1.3.0",
+    "@telia-ace/widget-utilities": "^1.3.0",
     "@webprovisions/platform": "^1.1.4"
   },
   "peerDependencies": {