@telia-ace/widget-conversation 1.1.1-rc.1 → 1.1.1-rc.2

package/{conversation-905bdeb3.js → conversation-6ba99c32.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),n=require("./index-1180f4a4.js"),u=require("react");require("react-dom");const L=require("./use-dispatch-7cf7db21.js"),_=(e,t)=>{const r=L.useComponentDescriptor(),o=n.useContainer(),[a,i]=u.useState(void 0),m=n.useIsMounted(),c=e||r.type||"";return u.useEffect(()=>{if(c){let y;return(t||o).getAsync("componentResolver").then(g=>{if(m.current){const d=g.getComponent(c);i(d)}y=g.registerResolver(c,d=>{m.current&&i(d)})}),()=>{y&&y()}}},[m,c,t,o]),a},V=()=>{const[e,t]=u.useState(!1);return u.useEffect(()=>{const r=()=>{t(!1)},o=a=>{a.keyCode===9&&t(!0)};return window.addEventListener("keydown",o),window.addEventListener("click",r),()=>{window.removeEventListener("keydown",o),window.removeEventListener("click",r)}},[]),e},Y=({className:e})=>{const[t,r]=u.useState(""),[o,a]=u.useState(!1),[i,m]=u.useState(0),[c,y]=u.useState(0),g=V(),d=L.useDispatch(),{inputPlaceholder:l="Type your message",inputHidden:f=!1,inputDisabled:$=!1,sendButtonLabel:w="Send message",inputMultiline:x=!0,secondaryAction:p}=n.useProperties(),[P,b]=n.useScroll(!0);u.useEffect(()=>{if(b.current){const{lineHeight:h,maxHeight:S}=getComputedStyle(b.current);if(h&&h.indexOf("px")>-1){const j=h.split("px"),q=parseInt(j[0],10);m(q);const U=S.split("px");y(parseInt(U[0],10))}}},[b.current]);const z=h=>{!h.shiftKey||!x?(h.preventDefault(),t&&t.length>0&&(d("user-submit",{text:t}),r(""),T(""))):t.length<1&&h.preventDefault()},F=h=>{p&&(h.preventDefault(),d("action",{actionKey:p.action,...p}))},W=h=>{if(x&&b.current){const S=b.current.scrollHeight;if(S>i){b.current.style.height="auto";let j=S;h.length<1&&(j=i),b.current.style.height=`${j}px`,j>=c?b.current.style.overflowY="scroll":b.current.style.overflowY="hidden"}}},T=h=>{W(h),r(h),h&&h.length>0&&d("user-typing",{textLength:h.length})};return f?null:s.jsxs(X,{grow:x,className:n.appendClassNames("humany-conversation-input",e),"data-has-focus":o,scrollableCss:P,isTabbing:g,children:[p&&s.jsx(Q,{disabled:$,onClick:F,title:p.label,"aria-label":p.label,children:s.jsx(n.SymbolBadge,{size:24,symbol:{type:"Svg",content:p.icon||"browse"}})}),x?s.jsx(G,{value:t,onChange:T,onEnter:z,disabled:$,"aria-label":l,placeholder:l,onFocusChange:a,type:"textarea",rows:1,ref:b}):s.jsx(J,{value:t,onChange:T,onEnter:z,disabled:$,"aria-label":l,placeholder:l,onFocusChange:a}),s.jsx(K,{disabled:$,onClick:z,title:w,"aria-label":w,children:s.jsx(Z,{size:22,symbol:{type:"Svg",content:"send"},hasContent:!!t&&!!t.length})})]})},G=n.newStyled(n.Input)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),i=require("@emotion/styled"),p=require("@emotion/react"),n=require("./index-a3c122bb.js"),h=require("react");require("react-dom");require("react-transition-group");const T=require("./use-dispatch-1d56ade2.js");require("react-router-dom");const Y=(e,t)=>{const r=T.useComponentDescriptor(),o=n.useContainer(),[a,l]=h.useState(void 0),u=n.useIsMounted(),d=e||r.type||"";return h.useEffect(()=>{if(d){let y;return(t||o).getAsync("componentResolver").then(b=>{if(u.current){const m=b.getComponent(d);l(m)}y=b.registerResolver(d,m=>{u.current&&l(m)})}),()=>{y&&y()}}},[u,d,t,o]),a},G=()=>{const[e,t]=h.useState(!1);return h.useEffect(()=>{const r=()=>{t(!1)},o=a=>{a.keyCode===9&&t(!0)};return window.addEventListener("keydown",o),window.addEventListener("click",r),()=>{window.removeEventListener("keydown",o),window.removeEventListener("click",r)}},[]),e},J=({className:e})=>{const[t,r]=h.useState(""),[o,a]=h.useState(!1),[l,u]=h.useState(0),[d,y]=h.useState(0),b=G(),m=T.useDispatch(),{inputPlaceholder:c="Type your message",inputHidden:v=!1,inputDisabled:w=!1,sendButtonLabel:S="Send message",inputMultiline:$=!0,secondaryAction:f}=n.useProperties(),[F,x]=n.useScroll(!0);h.useEffect(()=>{if(x.current){const{lineHeight:g,maxHeight:k}=getComputedStyle(x.current);if(g&&g.indexOf("px")>-1){const C=g.split("px"),_=parseInt(C[0],10);u(_);const V=k.split("px");y(parseInt(V[0],10))}}},[x.current]);const I=g=>{!g.shiftKey||!$?(g.preventDefault(),t&&t.length>0&&(m("user-submit",{text:t}),r(""),M(""))):t.length<1&&g.preventDefault()},W=g=>{f&&(g.preventDefault(),m("action",{actionKey:f.action,...f}))},U=g=>{if($&&x.current){const k=x.current.scrollHeight;if(k>l){x.current.style.height="auto";let C=k;g.length<1&&(C=l),x.current.style.height=`${C}px`,C>=d?x.current.style.overflowY="scroll":x.current.style.overflowY="hidden"}}},M=g=>{U(g),r(g),g&&g.length>0&&m("user-typing",{textLength:g.length})};return v?null:s.jsxs(ee,{grow:$,className:n.appendClassNames("humany-conversation-input",e),"data-has-focus":o,scrollableCss:F,isTabbing:b,children:[f&&s.jsx(Z,{disabled:w,onClick:W,title:f.label,"aria-label":f.label,children:s.jsx(n.SymbolBadge,{size:24,symbol:{type:"Svg",content:f.icon||"browse"}})}),$?s.jsx(Q,{value:t,onChange:M,onEnter:I,disabled:w,"aria-label":c,placeholder:c,onFocusChange:a,type:"textarea",rows:1,ref:x}):s.jsx(X,{value:t,onChange:M,onEnter:I,disabled:w,"aria-label":c,placeholder:c,onFocusChange:a}),s.jsx(D,{disabled:w,onClick:I,title:S,"aria-label":S,children:s.jsx(te,{size:22,symbol:{type:"Svg",content:"send"},hasContent:!!t&&!!t.length})})]})},Q=i(n.Input)`
   resize: none;
   flex: 1;
   flex-shrink: 1;
@@ -12,7 +12,7 @@
   border: none;
   transition: height 200ms linear;
   outline: none;
-`,J=n.newStyled(n.Input)`
+`,X=i(n.Input)`
   flex: 1;
   border: none;
   background-color: transparent;
@@ -26,7 +26,7 @@
     color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.textLight}};
     font-style: italic;
   }
-`,K=n.newStyled(n.Button)`
+`,D=i(n.Button)`
   flex: 0 0 50px;
   align-self: stretch;
   background-color: transparent;
@@ -38,14 +38,14 @@
   &:focus-visible {
     ${n.borderTabStyle};
   }
-`,Q=n.newStyled(K)`
+`,Z=i(D)`
   border-right: ${e=>e.theme.border};
   margin: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}} 0;
-`,X=n.newStyled.div`
-  ${e=>e.grow?n.css`
+`,ee=i.div`
+  ${e=>e.grow?p.css`
           min-height: 50px;
           max-height: 150px;
-        `:n.css`
+        `:p.css`
           height: 50px;
         `}
   flex: 0 0 auto;
@@ -57,13 +57,13 @@
   textarea {
     ${e=>!!e.scrollableCss&&e.scrollableCss}
   }
-`,Z=n.newStyled(({hasContent:e,...t})=>s.jsx(n.SymbolBadge,{...t}))`
+`,te=i(({hasContent:e,...t})=>s.jsx(n.SymbolBadge,{...t}))`
   line,
   path {
     stroke: ${e=>{var t;return e.hasContent?(t=e.theme.colors)==null?void 0:t.primary:"#a6a6a6"}};
     fill: ${e=>{var t;return e.hasContent?(t=e.theme.colors)==null?void 0:t.primary:"#a6a6a6"}};
   }
-`,ee=n.newStyled.div`
+`,se=i.div`
     width: ${e=>e.avatarSize||"32px"};
     height: ${e=>e.avatarSize||"32px"};
     border-radius: 50%;
@@ -98,7 +98,7 @@
             stroke: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
         }
     }
-`,te=n.keyframes`
+`,ne=p.keyframes`
   0% {
     opacity: 0;
   }
@@ -108,7 +108,7 @@
   100% {
     opacity: 0;
   }
-`,ne=n.newStyled.div`
+`,re=i.div`
     display: flex;
     justify-content: center;
     > div {
@@ -117,7 +117,7 @@
         border-radius: 50%;
         margin: 5px;
         background-color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
-        animation: ${te} 1s infinite;
+        animation: ${ne} 1s infinite;
     }
     > div:nth-of-type(2) {
         animation-delay: 100ms;
@@ -125,23 +125,23 @@
     > div:nth-of-type(3) {
         animation-delay: 200ms;
     }
-`,N=n.newStyled.div`
+`,H=i.div`
     grid-area: content;
     max-width: 100%;
     overflow: hidden;
-`,se=n.newStyled(n.Typography)`
+`,oe=i(n.Typography)`
     font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
     font-weight: normal;
     margin: 0;
-`,B=n.newStyled.div`
+`,R=i.div`
     display: flex;
     ${e=>e.left&&"justify-content: start;"};
     ${e=>e.center&&"justify-content: center;"};
     ${e=>e.right&&"justify-content: end;"};
-`,H=n.newStyled.div`
+`,A=i.div`
     ${e=>{var t;return e.padded&&`padding: ${(t=e.theme.sizes)==null?void 0:t.medium};`}}
-    ${e=>!e.user&&e.stacked&&re(e.stacked,e.theme)}
-    ${e=>e.user&&e.stacked&&oe(e.stacked,e.theme)}
+    ${e=>!e.user&&e.stacked&&ae(e.stacked,e.theme)}
+    ${e=>e.user&&e.stacked&&ie(e.stacked,e.theme)}
 
     display: inline-block;
     margin-top: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}};
@@ -154,11 +154,11 @@
     }
     max-width: 100%;
     ${e=>e.fullWidth&&"width: 100%;"}
-`,re=(e,t)=>{var o,a;const r=n.css`
+`,ae=(e,t)=>{var o,a;const r=p.css`
         background-color: ${(o=t.colors)==null?void 0:o.accent};
         color: ${(a=t.colors)==null?void 0:a.text};
         ${t.border&&`border: ${t.border};`};
-    `;return t.borderRadius?n.css`
+    `;return t.borderRadius?p.css`
         ${r}
 
         border-top-right-radius: ${t.borderRadius};
@@ -171,10 +171,10 @@
         ${e==="last"&&`
             border-bottom-left-radius: ${t.borderRadius};
         `}
-    `:r},oe=(e,t)=>{var o,a;const r=n.css`
+    `:r},ie=(e,t)=>{var o,a;const r=p.css`
         background-color: ${(o=t.colors)==null?void 0:o.primary};
         color: ${(a=t.colors)==null?void 0:a.accent};
-    `;return t.borderRadius?n.css`
+    `;return t.borderRadius?p.css`
         ${r}
 
         border-top-left-radius: ${t.borderRadius};
@@ -187,15 +187,15 @@
         ${e==="last"&&`
             border-bottom-right-radius: ${t.borderRadius};
         `}
-    `:r},C=n.newStyled.div`
+    `:r},L=i.div`
     margin-bottom: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}};
     &:last-child {
         margin-bottom: 0;
     }
-`,v=e=>{var t,r;return n.css`
+`,j=e=>{var t,r;return p.css`
     margin: ${(t=e.theme.sizes)==null?void 0:t.medium} 0;
     padding: 0 ${(r=e.theme.sizes)==null?void 0:r.medium};
-`},ae=n.newStyled(n.Form)`
+`},le=i(n.Form)`
     & button.humany-form-component-button {
         ${e=>{var t,r,o,a;return((t=e.theme.colors)==null?void 0:t.primary)&&((r=e.theme.colors)==null?void 0:r.accent)&&n.invertedHoverButton({active:!1,primaryColor:(o=e.theme.colors)==null?void 0:o.primary,secondaryColor:(a=e.theme.colors)==null?void 0:a.accent,theme:e.theme})}};
         display: block;
@@ -209,7 +209,7 @@
             margin-bottom: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}};
         }
     }
-`,ie=n.newStyled(n.Html)`
+`,ce=i(n.Html)`
     white-space: pre-wrap;
     a {
         color: ${e=>e.theme.colors.link};
@@ -217,14 +217,14 @@
             ${e=>{var t;return((t=e.theme.accessibility)==null?void 0:t.isTabbing)&&n.borderTabStyle}};
         }
     }
-`,le=n.newStyled(n.List)`
+`,de=i(n.List)`
     padding: 0;
     list-style: none;
     margin: 0 -${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}};
     > li {
         margin: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}};
     }
-`,ce=n.newStyled.button`
+`,me=i.button`
     ${e=>n.buttonCss(e)};
     display: block;
     background-color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.primary}};
@@ -234,7 +234,7 @@
         ${n.borderTabStyle}
         background-color: transparent;
     }
-`,A=u.forwardRef(({boxed:e,className:t,agentData:r},o)=>s.jsx(N,{ref:o,children:s.jsx(B,{left:e,center:!e,children:s.jsx(H,{padded:!!e,stacked:e?"first":void 0,children:s.jsxs(ne,{children:[s.jsx("div",{}),s.jsx("div",{}),s.jsx("div",{})]})})})})),de=n.newStyled.p`
+`,K=h.forwardRef(({boxed:e,className:t,agentData:r},o)=>s.jsx(H,{ref:o,children:s.jsx(R,{left:e,center:!e,children:s.jsx(A,{padded:!!e,stacked:e?"first":void 0,children:s.jsxs(re,{children:[s.jsx("div",{}),s.jsx("div",{}),s.jsx("div",{})]})})})})),ue=i.p`
     && {
         font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.small}};
         font-weight: 300;
@@ -243,28 +243,28 @@
     line-height: 1.5em;
     grid-area: info;
     color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
-`,E=e=>new Date(e).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"}),k=({className:e,name:t,timestamp:r})=>{if(!t&&!r)return null;let o="";return t?r?o=`${t}: ${E(r)}`:o=t:r&&(o=E(r)),s.jsx(de,{children:o})},O=({className:e,children:t,sender:r,timestamp:o})=>{const{avatar:a,name:i}=r,{avatarSize:m}=n.useProperties();return s.jsxs(me,{hasAvatar:!!a,className:n.appendClassNames(e,"humany-conversation-agent-message"),children:[a&&s.jsx(ee,{avatarSize:m,children:typeof a=="string"?s.jsx("img",{src:a}):s.jsx(n.SymbolBadge,{symbol:a})}),t,s.jsx(k,{name:i,timestamp:o})]})},me=n.newStyled.div`
+`,O=e=>new Date(e).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"}),z=({className:e,name:t,timestamp:r})=>{if(!t&&!r)return null;let o="";return t?r?o=`${t}: ${O(r)}`:o=t:r&&(o=O(r)),s.jsx(ue,{children:o})},q=({className:e,children:t,sender:r,timestamp:o})=>{const{avatar:a,name:l}=r,{avatarSize:u}=n.useProperties();return s.jsxs(he,{hasAvatar:!!a,className:n.appendClassNames(e,"humany-conversation-agent-message"),children:[a&&s.jsx(se,{avatarSize:u,children:typeof a=="string"?s.jsx("img",{src:a}):s.jsx(n.SymbolBadge,{symbol:a})}),t,s.jsx(z,{name:l,timestamp:o})]})},he=i.div`
   display: grid;
   margin-right: 10%;
   width: 90%;
-  ${e=>e.hasAvatar?n.css`
+  ${e=>e.hasAvatar?p.css`
           grid-template-columns: auto 1fr;
           grid-template-rows: 1fr auto;
           grid-template-areas:
             'avatar content'
             '. info';
-        `:n.css`
+        `:p.css`
           grid-template-columns: 1fr;
           grid-template-rows: 1fr auto;
           grid-template-areas:
             'content'
             'info';
         `};
-`,ue=u.forwardRef(({className:e,children:t,timestamp:r,discrete:o,fullWidth:a},i)=>s.jsx(he,{ref:i,className:n.appendClassNames(e,"humany-conversation-system-message"),fullWidth:a,children:o?s.jsxs(ye,{className:"humany-conversation-discrete-message",children:[t,s.jsx(k,{timestamp:r})]}):s.jsxs(s.Fragment,{children:[t,s.jsx(k,{timestamp:r})]})})),he=n.newStyled.div`
+`,ge=h.forwardRef(({className:e,children:t,timestamp:r,discrete:o,fullWidth:a},l)=>s.jsx(ye,{ref:l,className:n.appendClassNames(e,"humany-conversation-system-message"),fullWidth:a,children:o?s.jsxs(pe,{className:"humany-conversation-discrete-message",children:[t,s.jsx(z,{timestamp:r})]}):s.jsxs(s.Fragment,{children:[t,s.jsx(z,{timestamp:r})]})})),ye=i.div`
     ${e=>e.fullWidth&&"width: 100%"};
     padding: 0 ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.large}};
     overflow: auto;
-`,ye=n.newStyled.div`
+`,pe=i.div`
     text-align: center;
     word-wrap: break-word;
     font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.normal}};
@@ -272,13 +272,13 @@
     > p {
         margin: 0;
     }
-`,ge=({className:e,children:t,timestamp:r})=>{const{userLabel:o=""}=n.useProperties();return s.jsxs(pe,{className:n.appendClassNames(e,"humany-conversation-user-message"),children:[t,s.jsx(k,{name:o,timestamp:r})]})},pe=n.newStyled.div`
+`,be=({className:e,children:t,timestamp:r})=>{const{userLabel:o=""}=n.useProperties();return s.jsxs(fe,{className:n.appendClassNames(e,"humany-conversation-user-message"),children:[t,s.jsx(z,{name:o,timestamp:r})]})},fe=i.div`
     margin-left: 10%;
     width: 90%;
     display: flex;
     flex-direction: column;
     align-items: flex-end;
-`,R=e=>Array.isArray(e)?e:Object.keys(e).map(t=>({label:e[t],actionKey:t})),be=({header:e,actions:t,dispatch:r})=>s.jsx(fe,{className:"humany-conversation-button-list",header:e,items:R(t),renderItem:o=>s.jsx("li",{children:s.jsxs(xe,{onClick:()=>{r("action",o)},"aria-label":o.label,title:o.label,children:[s.jsx(n.SymbolBadge,{symbol:o.symbol}),o.label]})},o.actionKey)}),fe=n.newStyled(n.ItemList)`
+`,E=e=>Array.isArray(e)?e:Object.keys(e).map(t=>({label:e[t],actionKey:t})),xe=({header:e,actions:t,dispatch:r})=>s.jsx(ve,{className:"humany-conversation-button-list",header:e,items:E(t),renderItem:o=>s.jsx("li",{children:s.jsxs($e,{onClick:()=>{r("action",o)},"aria-label":o.label,title:o.label,children:[s.jsx(n.SymbolBadge,{symbol:o.symbol}),o.label]})},o.actionKey)}),ve=i(n.ItemList)`
     ${n.itemList}
     > ul {
         display: flex;
@@ -288,8 +288,8 @@
             margin: 0;
         }
     }
-    ${v}
-`,xe=n.newStyled(n.Button)`
+    ${j}
+`,$e=i(n.Button)`
     ${n.buttonCss};
 
     display: block;
@@ -308,22 +308,22 @@
     svg {
         margin-right: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.small}};
     }
-`,ve=({type:e,content:t={}})=>{const r=_(e);return!r||!e?null:s.jsx(u.Suspense,{fallback:null,children:s.jsx(r,{...t})})},$e=({body:e})=>s.jsx(we,{html:e}),we=n.newStyled(n.Html)`
+`,je=({type:e,content:t={}})=>{const r=Y(e);return!r||!e?null:s.jsx(h.Suspense,{fallback:null,children:s.jsx(r,{...t})})},we=({body:e})=>s.jsx(Se,{html:e}),Se=i(n.Html)`
     ${n.genericHtml}
     color: inherit;
     white-space: pre-wrap;
-    ${v}
+    ${j}
     a {
         color: ${e=>e.theme.colors.link};
         &:focus-visible {
             ${n.borderTabStyle};
         }
     }
-`,je=({header:e,actions:t,dispatch:r})=>s.jsx(Se,{className:"humany-conversation-item-list",header:e,items:R(t),renderItem:o=>{var a;return s.jsx("li",{children:s.jsxs(Ce,{children:[((a=o.symbol)==null?void 0:a.content)&&s.jsx("div",{className:"item-icon",children:s.jsx(n.SymbolBadge,{size:22,symbol:{type:o.symbol.type,content:o.symbol.content}})}),s.jsxs("div",{className:"item-body",children:[s.jsx(n.Button,{onClick:()=>{r("action",o)},"aria-label":o.label,title:o.label,children:o.label}),o.description&&s.jsx("p",{children:o.description})]})]})},o.actionKey)}}),Se=n.newStyled(n.ItemList)`
+`,Ce=({header:e,actions:t,dispatch:r})=>s.jsx(ke,{className:"humany-conversation-item-list",header:e,items:E(t),renderItem:o=>{var a;return s.jsx("li",{children:s.jsxs(Le,{children:[((a=o.symbol)==null?void 0:a.content)&&s.jsx("div",{className:"item-icon",children:s.jsx(n.SymbolBadge,{size:22,symbol:{type:o.symbol.type,content:o.symbol.content}})}),s.jsxs("div",{className:"item-body",children:[s.jsx(n.Button,{onClick:()=>{r("action",o)},"aria-label":o.label,title:o.label,children:o.label}),o.description&&s.jsx("p",{children:o.description})]})]})},o.actionKey)}}),ke=i(n.ItemList)`
     ${n.itemList}
 
     > .humany-paragraph {
-        ${v}
+        ${j}
         margin-bottom: 0;
 
         h1 {
@@ -331,7 +331,7 @@
         }
     }
 
-    ${e=>n.headingElement(e)("h1",n.css`
+    ${e=>n.headingElement(e)("h1",p.css`
                 white-space: normal;
             `)}
 
@@ -351,10 +351,10 @@
             border-bottom: none;
         }
     }
-`,Ce=n.newStyled.div`
+`,Le=i.div`
     display: flex;
     gap: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.medium}};
-    ${v}
+    ${j}
 
     .item-icon {
     }
@@ -388,11 +388,11 @@
             }
         }
     }
-`,ke=({header:e,actions:t,dispatch:r})=>s.jsx(Le,{className:"humany-conversation-link-list",header:e,items:R(t),renderItem:o=>s.jsx("li",{children:s.jsxs(ze,{help:o.actionKey==="help",onClick:()=>{r("action",o)},"aria-label":o.label,title:o.label,children:[o.label,o.actionKey==="help"&&s.jsx(n.SymbolBadge,{size:14,symbol:{type:"Svg",content:"caret-down"}})]})},o.actionKey)}),Le=n.newStyled(n.ItemList)`
+`,ze=({header:e,actions:t,dispatch:r})=>s.jsx(Te,{className:"humany-conversation-link-list",header:e,items:E(t),renderItem:o=>s.jsx("li",{children:s.jsxs(Ie,{help:o.actionKey==="help",onClick:()=>{r("action",o)},"aria-label":o.label,title:o.label,children:[o.label,o.actionKey==="help"&&s.jsx(n.SymbolBadge,{size:14,symbol:{type:"Svg",content:"caret-down"}})]})},o.actionKey)}),Te=i(n.ItemList)`
     ${n.itemList}
-    ${v}
+    ${j}
 
-    ${e=>n.headingElement(e)("h1",n.css`
+    ${e=>n.headingElement(e)("h1",p.css`
                 white-space: normal;
             `)}
 
@@ -404,7 +404,7 @@
             margin: 0;
         }
     }
-`,ze=n.newStyled(n.Button)`
+`,Ie=i(n.Button)`
     display: block;
     text-align: left;
     font-weight: 300;
@@ -413,7 +413,7 @@
     text-overflow: ellipsis;
     overflow: hidden;
 
-    ${e=>{var t,r;return e.help&&n.css`
+    ${e=>{var t,r;return e.help&&p.css`
             color: ${(t=e.theme.colors)==null?void 0:t.text};
             text-decoration: underline;
 
@@ -430,12 +430,12 @@
             text-decoration: underline;
         }
     }
-`,Te=()=>s.jsx(Ie,{className:"humany-conversation-separator"}),Ie=n.newStyled.div`
+`,Me=()=>s.jsx(Ne,{className:"humany-conversation-separator"}),Ne=i.div`
     ${e=>e.theme.border&&`border-bottom: ${e.theme.border};`}
     width: 100%;
-`,Me=({text:e})=>s.jsx(Ne,{className:"humany-conversation-text",variant:"span",children:e}),Ne=n.newStyled(n.Typography)`
-    ${v}
-`,Be=({header:e="Video call",acceptLabel:t="Accept",declineLabel:r="Decline",dispatch:o})=>{const a=u.useMemo(()=>[{label:t,actionKey:"accept-video-call",symbol:{type:"Svg",content:"video"}},{label:r,actionKey:"decline-video-call",symbol:{type:"Svg",content:"close"}}],[t,r]);return s.jsx(He,{className:"humany-conversation-video-request",header:e,items:a,renderItem:i=>{const m=i.actionKey==="accept-video-call"?"#70c48e":"#da5c85";return s.jsx("li",{children:s.jsx(Re,{onClick:()=>{o("action",i)},"aria-label":i.label,title:i.label,bgColor:m,children:s.jsx(n.SymbolBadge,{symbol:i.symbol,size:25})})},i.actionKey)}})},He=n.newStyled(n.ItemList)`
+`,Be=({text:e})=>s.jsx(He,{className:"humany-conversation-text",variant:"span",children:e}),He=i(n.Typography)`
+    ${j}
+`,Re=({header:e="Video call",acceptLabel:t="Accept",declineLabel:r="Decline",dispatch:o})=>{const a=h.useMemo(()=>[{label:t,actionKey:"accept-video-call",symbol:{type:"Svg",content:"video"}},{label:r,actionKey:"decline-video-call",symbol:{type:"Svg",content:"close"}}],[t,r]);return s.jsx(Ae,{className:"humany-conversation-video-request",header:e,items:a,renderItem:l=>{const u=l.actionKey==="accept-video-call"?"#70c48e":"#da5c85";return s.jsx("li",{children:s.jsx(Ee,{onClick:()=>{o("action",l)},"aria-label":l.label,title:l.label,bgColor:u,children:s.jsx(n.SymbolBadge,{symbol:l.symbol,size:25})})},l.actionKey)}})},Ae=i(n.ItemList)`
     ${e=>n.itemList(e)}
     > ul {
         display: flex;
@@ -445,8 +445,8 @@
             margin: 0;
         }
     }
-    ${e=>v(e)}
-`,Re=n.newStyled(n.Button)`
+    ${e=>j(e)}
+`,Ee=i(n.Button)`
     ${n.buttonCss};
 
     background-color: ${e=>e.bgColor};
@@ -480,13 +480,13 @@
             stroke: #fff;
         }
     }
-`,Ae=([e,t])=>({type:e,content:t}),Ee=({items:e,dispatch:t})=>s.jsx(Ke,{className:"humany-message-list",items:e.map(Ae),renderLi:!0,renderItem:r=>{switch(r.type){case n.ConversationMessageListItemType.Text:return s.jsx(Me,{text:r.content});case n.ConversationMessageListItemType.HTML:return s.jsx($e,{...r.content});case n.ConversationMessageListItemType.Separator:return s.jsx(Te,{...r.content});case n.ConversationMessageListItemType.ItemList:return s.jsx(je,{...r.content,dispatch:t});case n.ConversationMessageListItemType.LinkList:return s.jsx(ke,{...r.content,dispatch:t});case n.ConversationMessageListItemType.ButtonList:return s.jsx(be,{...r.content,dispatch:t});case n.ConversationMessageListItemType.VideoRequest:return s.jsx(Be,{...r.content,dispatch:t});default:return s.jsx(ve,{type:r.type,content:r.content})}}}),Ke=n.newStyled(n.List)`
+`,Ke=([e,t])=>({type:e,content:t}),Oe=({items:e,dispatch:t})=>s.jsx(De,{className:"humany-message-list",items:e.map(Ke),renderLi:!0,renderItem:r=>{switch(r.type){case n.ConversationMessageListItemType.Text:return s.jsx(Be,{text:r.content});case n.ConversationMessageListItemType.HTML:return s.jsx(we,{...r.content});case n.ConversationMessageListItemType.Separator:return s.jsx(Me,{...r.content});case n.ConversationMessageListItemType.ItemList:return s.jsx(Ce,{...r.content,dispatch:t});case n.ConversationMessageListItemType.LinkList:return s.jsx(ze,{...r.content,dispatch:t});case n.ConversationMessageListItemType.ButtonList:return s.jsx(xe,{...r.content,dispatch:t});case n.ConversationMessageListItemType.VideoRequest:return s.jsx(Re,{...r.content,dispatch:t});default:return s.jsx(je,{type:r.type,content:r.content})}}}),De=i(n.List)`
     ${n.list}
 
     > li {
         margin: 0;
     }
-`,Oe=u.forwardRef(({className:e,timestamp:t,sender:r,type:o,content:a},i)=>{const m=u.useCallback(d=>{let l="first";return a.length>1&&(l=d===0?"first":d+1===a.length?"last":"middle"),l},[a]),c=()=>s.jsx(s.Fragment,{children:a.map(d=>{const{key:l,body:f,title:$,form:w,actions:x}=d,p=!!f&&!$&&!w&&!x;return s.jsx(ue,{className:e,discrete:p,ref:i,timestamp:t,fullWidth:!!w||!!x,children:p&&f?s.jsx(n.Html,{html:f}):s.jsx(I,{isSystem:!0,content:d})},l)})}),y=()=>s.jsx(O,{sender:r,timestamp:t,className:e,children:s.jsx(N,{className:"humany-message-content-bundle",children:a.map((d,l)=>s.jsx(B,{className:"humany-message-container",left:!0,ref:i,children:s.jsx(I,{content:d,stacked:m(l)})},d.key))})}),g=()=>s.jsx(ge,{timestamp:t,className:e,children:s.jsx(N,{className:"humany-message-content-bundle",children:a.map((d,l)=>s.jsx(B,{className:"humany-message-container",right:!0,ref:i,children:s.jsx(I,{isUser:!0,content:d,stacked:m(l)})},d.key))})});switch(o){case n.ConversationMessageType.System:return c();case n.ConversationMessageType.Agent:return y();case n.ConversationMessageType.User:return g();default:return null}}),I=({content:e,isUser:t,isSystem:r,stacked:o})=>{const a=L.useDispatch(),{title:i,body:m,actions:c,form:y,items:g}=e;return g?s.jsx(H,{className:"humany-message-content",user:!!t,stacked:o,children:s.jsx(Ee,{items:g,dispatch:a})}):s.jsxs(H,{className:"humany-message-content",padded:!r,user:!!t,stacked:o,fullWidth:!!y||!!c,children:[i&&s.jsx(C,{children:s.jsx(se,{variant:"h2",children:i})}),m&&s.jsx(C,{children:s.jsx(ie,{html:m})}),y&&s.jsx(C,{children:s.jsx(ae,{...y,onChange:(l,f)=>{a("form",{data:f,formKey:y.schema.id,actionKey:l})}})}),c&&s.jsx(C,{children:s.jsx(le,{items:Object.keys(c).map(l=>({label:c[l],actionKey:l})),renderItem:l=>s.jsx("li",{children:s.jsx(ce,{onClick:()=>{a("action",l.actionKey)},children:l.label})},l.actionKey)})})]})},D=()=>{const e=u.useCallback(c=>{c&&setTimeout(()=>{c.scrollIntoView({block:"start",behavior:"smooth"})},250)},[]),[t,r]=n.useScroll(!0),{messages:o,loading:a,typingActors:i=[]}=n.useProperties(),m=()=>i&&i.length?i.map((c,y)=>s.jsx(M,{id:`typing_${c.name}`,children:s.jsx(O,{timestamp:Date.now(),sender:c,children:s.jsx(A,{boxed:!0,ref:e})})},`typing_${c.name}`)):null;return s.jsxs(s.Fragment,{children:[s.jsxs(De,{tabIndex:0,scrollableCss:t,ref:r,children:[o&&o.length?o.map((c,y)=>{const{type:g,timestamp:d,sender:l,content:f}=c;return s.jsx(M,{className:"humany-conversation-entry",tabIndex:-1,children:s.jsx(Oe,{...c,ref:e})},`${g}_${l==null?void 0:l.name}_${d}_${f[0].key}`)}):null,m(),a&&s.jsx(M,{children:s.jsx(A,{ref:e})})]}),s.jsx(Y,{})]})},De=n.newStyled.div`
+`,qe=h.forwardRef(({className:e,timestamp:t,sender:r,type:o,content:a},l)=>{const u=h.useCallback(m=>{let c="first";return a.length>1&&(c=m===0?"first":m+1===a.length?"last":"middle"),c},[a]),d=()=>s.jsx(s.Fragment,{children:a.map(m=>{const{key:c,body:v,title:w,form:S,actions:$}=m,f=!!v&&!w&&!S&&!$;return s.jsx(ge,{className:e,discrete:f,ref:l,timestamp:t,fullWidth:!!S||!!$,children:f&&v?s.jsx(n.Html,{html:v}):s.jsx(N,{isSystem:!0,content:m})},c)})}),y=()=>s.jsx(q,{sender:r,timestamp:t,className:e,children:s.jsx(H,{className:"humany-message-content-bundle",children:a.map((m,c)=>s.jsx(R,{className:"humany-message-container",left:!0,ref:l,children:s.jsx(N,{content:m,stacked:u(c)})},m.key))})}),b=()=>s.jsx(be,{timestamp:t,className:e,children:s.jsx(H,{className:"humany-message-content-bundle",children:a.map((m,c)=>s.jsx(R,{className:"humany-message-container",right:!0,ref:l,children:s.jsx(N,{isUser:!0,content:m,stacked:u(c)})},m.key))})});switch(o){case n.ConversationMessageType.System:return d();case n.ConversationMessageType.Agent:return y();case n.ConversationMessageType.User:return b();default:return null}}),N=({content:e,isUser:t,isSystem:r,stacked:o})=>{const a=T.useDispatch(),{title:l,body:u,actions:d,form:y,items:b}=e;return b?s.jsx(A,{className:"humany-message-content",user:!!t,stacked:o,children:s.jsx(Oe,{items:b,dispatch:a})}):s.jsxs(A,{className:"humany-message-content",padded:!r,user:!!t,stacked:o,fullWidth:!!y||!!d,children:[l&&s.jsx(L,{children:s.jsx(oe,{variant:"h2",children:l})}),u&&s.jsx(L,{children:s.jsx(ce,{html:u})}),y&&s.jsx(L,{children:s.jsx(le,{...y,onChange:(c,v)=>{a("form",{data:v,formKey:y.schema.id,actionKey:c})}})}),d&&s.jsx(L,{children:s.jsx(de,{items:Object.keys(d).map(c=>({label:d[c],actionKey:c})),renderItem:c=>s.jsx("li",{children:s.jsx(me,{onClick:()=>{a("action",c.actionKey)},children:c.label})},c.actionKey)})})]})},P=()=>{const e=h.useCallback(d=>{d&&setTimeout(()=>{d.scrollIntoView({block:"start",behavior:"smooth"})},250)},[]),[t,r]=n.useScroll(!0),{messages:o,loading:a,typingActors:l=[]}=n.useProperties(),u=()=>l&&l.length?l.map((d,y)=>s.jsx(B,{id:`typing_${d.name}`,children:s.jsx(q,{timestamp:Date.now(),sender:d,children:s.jsx(K,{boxed:!0,ref:e})})},`typing_${d.name}`)):null;return s.jsxs(s.Fragment,{children:[s.jsxs(Pe,{tabIndex:0,scrollableCss:t,ref:r,children:[o&&o.length?o.map((d,y)=>{const{type:b,timestamp:m,sender:c,content:v}=d;return s.jsx(B,{className:"humany-conversation-entry",tabIndex:-1,children:s.jsx(qe,{...d,ref:e})},`${b}_${c==null?void 0:c.name}_${m}_${v[0].key}`)}):null,u(),a&&s.jsx(B,{children:s.jsx(K,{ref:e})})]}),s.jsx(J,{})]})},Pe=i.div`
     display: flex;
     flex-direction: column;
     align-items: stretch;
@@ -496,7 +496,7 @@
     &:focus-visible {
         ${e=>n.borderTabStyle(e)};
     }
-`,M=n.newStyled.div`
+`,B=i.div`
     margin: 0;
     margin-bottom: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.medium}};
 
@@ -519,10 +519,10 @@
     h1 {
         font-weight: normal;
     }
-    ${e=>n.headingElement(e)("h1",n.css`
+    ${e=>n.headingElement(e)("h1",p.css`
                 font-weight: normal;
             `)}
-`,Pe=({dispatch:e})=>{const t=u.useRef(null);return u.useEffect(()=>{t.current&&t.current.parentNode&&e("overlay-mounted",t.current)},[t]),s.jsx(n.WidgetOverlayOutlet,{portalId:"humany-conversation-overlay-portal",className:"humany-conversation-overlay-outlet",ref:t})},Fe=({dispatch:e,header:t,buttonLabel:r})=>s.jsxs(We,{portalId:"humany-conversation-portal",className:"humany-conversation-outlet",children:[s.jsxs(qe,{className:"humany-conversation-outlet-head",children:[s.jsx(_e,{className:"humany-conversation-outlet-head-button","aria-label":r,title:r,onClick:()=>e("hide-overlay-conversation"),children:s.jsx(n.SymbolBadge,{symbol:{type:"Svg",content:"caret-down"},size:20})}),t&&s.jsx(Ue,{className:"humany-conversation-outlet-header",variant:"h1",children:t})]}),s.jsx(D,{})]}),We=n.newStyled(n.WidgetOverlayOutlet)`
+`,Fe=({dispatch:e})=>{const t=h.useRef(null);return h.useEffect(()=>{t.current&&t.current.parentNode&&e("overlay-mounted",t.current)},[t]),s.jsx(n.WidgetOverlayOutlet,{portalId:"humany-conversation-overlay-portal",className:"humany-conversation-overlay-outlet",ref:t})},We=({dispatch:e,header:t,buttonLabel:r})=>s.jsxs(Ue,{portalId:"humany-conversation-portal",className:"humany-conversation-outlet",children:[s.jsxs(_e,{className:"humany-conversation-outlet-head",children:[s.jsx(Ye,{className:"humany-conversation-outlet-head-button","aria-label":r,title:r,onClick:()=>e("hide-overlay-conversation"),children:s.jsx(n.SymbolBadge,{symbol:{type:"Svg",content:"caret-down"},size:20})}),t&&s.jsx(Ve,{className:"humany-conversation-outlet-header",variant:"h1",children:t})]}),s.jsx(P,{})]}),Ue=i(n.WidgetOverlayOutlet)`
   z-index: 11;
   top: auto;
   height: 65%;
@@ -531,7 +531,7 @@
   flex-direction: column;
   border-top-right-radius: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.large}};
   border-top-left-radius: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.large}};
-`,qe=n.newStyled.div`
+`,_e=i.div`
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -539,11 +539,11 @@
   gap: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}};
   padding: ${e=>{var t;return(t=e.theme.sizes)==null?void 0:t.normal}};
   ${e=>e.theme.border&&`border-bottom: ${e.theme.border};`}
-`,Ue=n.newStyled(n.Typography)`
+`,Ve=i(n.Typography)`
   font-size: ${e=>{var t;return(t=e.theme.fonts)==null?void 0:t.medium}};
   color: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
   margin: 0;
-`,_e=n.newStyled(n.Button)`
+`,Ye=i(n.Button)`
   display: flex;
   align-items: center;
   justify-content: center;
@@ -557,7 +557,7 @@
   svg line {
     stroke: ${e=>{var t;return(t=e.theme.colors)==null?void 0:t.text}};
   }
-`,Ve=({className:e,...t})=>{const{overlay:r,overlayConversationHeader:o,overlayConversationCloseLabel:a,conversationControllerId:i}=n.useProperties(),m=L.useDispatch();return s.jsxs(n.ConversationContext.Provider,{value:i?{id:i}:null,children:[s.jsx(Ye,{...t,className:n.appendClassNames(e,"humany-conversation-component"),children:s.jsx(D,{})}),r&&s.jsxs(s.Fragment,{children:[s.jsx(Pe,{dispatch:m}),r.conversation&&s.jsx(Fe,{dispatch:m,header:o,buttonLabel:a})]})]})},Ye=n.newStyled.div`
+`,Ge=({className:e,...t})=>{const{overlay:r,overlayConversationHeader:o,overlayConversationCloseLabel:a,conversationControllerId:l}=n.useProperties(),u=T.useDispatch();return s.jsxs(n.ConversationContext.Provider,{value:l?{id:l}:null,children:[s.jsx(Je,{...t,className:n.appendClassNames(e,"humany-conversation-component"),children:s.jsx(P,{})}),r&&s.jsxs(s.Fragment,{children:[s.jsx(Fe,{dispatch:u}),r.conversation&&s.jsx(We,{dispatch:u,header:o,buttonLabel:a})]})]})},Je=i.div`
     position: absolute;
     right: 0;
     left: 0;
@@ -566,4 +566,4 @@
     overflow: hidden;
     display: flex;
     flex-direction: column;
-`;exports.default=Ve;
+`;exports.default=Ge;