@telia-ace/widget-conversation 1.1.5 → 1.1.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/agent.d.ts +3 -0
- package/{conversation-8fab4c79.mjs → conversation-8295aeca.mjs} +429 -422
- package/{conversation-56aaee96.js → conversation-a202d402.js} +76 -76
- package/conversation-controller.d.ts +2 -1
- package/index.js +3 -3
- package/index.mjs +241 -224
- package/package.json +8 -8
- package/user.d.ts +3 -0
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),l=require("@emotion/styled"),n=require("@telia-ace/widget-ui"),L=require("@telia-ace/widget-utilities"),p=require("@emotion/react"),y=require("react"),G=require("@telia-ace/widget-forms"),j=require("./index.js");require("@telia-ace/widget-core");require("@telia-ace/widget-services");require("@telia-ace/widget-plugins");const J=({className:t})=>{const[e,r]=y.useState(""),[o,a]=y.useState(0),[i,u]=y.useState(0),m=n.useIsTabbing(),d=n.useDispatch(),{inputPlaceholder:b="Type your message",inputHidden:$=!1,inputDisabled:c=!1,sendButtonLabel:h="Send message",inputMultiline:v=!0,secondaryAction:x}=n.useProperties(),[S,f]=n.useScroll(!0),T=n.useContainer();y.useEffect(()=>{if(f.current){const{lineHeight:g,maxHeight:w}=getComputedStyle(f.current);if(g&&g.indexOf("px")>-1){const z=g.split("px"),Y=parseInt(z[0],10);a(Y);const X=w.split("px");u(parseInt(X[0],10))}}},[f.current]);const M=g=>{!g.shiftKey||!v?(g.preventDefault(),e&&e.length>0&&(d("user-submit",{text:e}),r(""),I(""))):e.length<1&&g.preventDefault()},V=g=>{if(!x)return;g.preventDefault(),d("action",{actionKey:x.action,...x});const{events:w}=T.get("$widget");w.dispatch("tracking:secondary-clicked",{})},_=g=>{if(v&&f.current){const w=f.current.scrollHeight;if(w>o){f.current.style.height="auto";let z=w;g.length<1&&(z=o),f.current.style.height=`${z}px`,z>=i?f.current.style.overflowY="scroll":f.current.style.overflowY="hidden"}}},I=g=>{_(g),r(g),g&&g.length>0&&d("user-typing",{textLength:g.length})};return $?null:s.jsxs(te,{grow:v,className:L.appendClassNames("humany-conversation-input",t),scrollableCss:S,isTabbing:m,children:[x&&s.jsx(ee,{disabled:c,onClick:V,title:x.label,"aria-label":x.label,children:s.jsx(n.SymbolBadge,{size:24,symbol:{type:"Svg",content:x.icon||"browse"}})}),v?s.jsx(Q,{value:e,onChange:I,onEnter:M,disabled:c,"aria-label":b,placeholder:b,type:"textarea",rows:1,ref:f}):s.jsx(Z,{value:e,onChange:I,onEnter:M,disabled:c,"aria-label":b,placeholder:b}),s.jsx(P,{disabled:!1,onClick:M,title:h,"aria-label":h,children:s.jsx(se,{size:22,symbol:{type:"Svg",content:"send"},hasContent:!!e&&!!e.length})})]})},Q=l(n.Input)`
|
|
2
2
|
resize: none;
|
|
3
3
|
flex: 1;
|
|
4
4
|
flex-shrink: 1;
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
${n.borderTabStyle};
|
|
17
17
|
outline-offset: 12px;
|
|
18
18
|
}
|
|
19
|
-
`,
|
|
19
|
+
`,Z=l(n.Input)`
|
|
20
20
|
flex: 1;
|
|
21
21
|
border: none;
|
|
22
22
|
background-color: transparent;
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
color: ${t=>{var e;return(e=t.theme.colors)==null?void 0:e.textLight}};
|
|
31
31
|
font-style: italic;
|
|
32
32
|
}
|
|
33
|
-
`,
|
|
33
|
+
`,P=l(n.Button)`
|
|
34
34
|
flex: 0 0 50px;
|
|
35
35
|
align-self: stretch;
|
|
36
36
|
background-color: transparent;
|
|
@@ -42,14 +42,14 @@
|
|
|
42
42
|
&:focus-visible {
|
|
43
43
|
${n.borderTabStyle};
|
|
44
44
|
}
|
|
45
|
-
`,
|
|
45
|
+
`,ee=l(P)`
|
|
46
46
|
border-right: ${t=>t.theme.border};
|
|
47
47
|
margin: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.normal}} 0;
|
|
48
|
-
`,
|
|
49
|
-
${t=>t.grow?
|
|
48
|
+
`,te=l.div`
|
|
49
|
+
${t=>t.grow?p.css`
|
|
50
50
|
min-height: 50px;
|
|
51
51
|
max-height: 150px;
|
|
52
|
-
`:
|
|
52
|
+
`:p.css`
|
|
53
53
|
height: 50px;
|
|
54
54
|
`}
|
|
55
55
|
flex: 0 0 auto;
|
|
@@ -61,13 +61,13 @@
|
|
|
61
61
|
textarea {
|
|
62
62
|
${t=>!!t.scrollableCss&&t.scrollableCss}
|
|
63
63
|
}
|
|
64
|
-
`,
|
|
64
|
+
`,se=l(({hasContent:t,...e})=>s.jsx(n.SymbolBadge,{...e}))`
|
|
65
65
|
line,
|
|
66
66
|
path {
|
|
67
67
|
stroke: ${t=>{var e;return t.hasContent?(e=t.theme.colors)==null?void 0:e.primary:"#a6a6a6"}};
|
|
68
68
|
fill: ${t=>{var e;return t.hasContent?(e=t.theme.colors)==null?void 0:e.primary:"#a6a6a6"}};
|
|
69
69
|
}
|
|
70
|
-
`,
|
|
70
|
+
`,ne=l.div`
|
|
71
71
|
width: ${t=>t.avatarSize||"32px"};
|
|
72
72
|
height: ${t=>t.avatarSize||"32px"};
|
|
73
73
|
border-radius: 50%;
|
|
@@ -102,7 +102,7 @@
|
|
|
102
102
|
stroke: ${t=>{var e;return(e=t.theme.colors)==null?void 0:e.text}};
|
|
103
103
|
}
|
|
104
104
|
}
|
|
105
|
-
`,
|
|
105
|
+
`,re=p.keyframes`
|
|
106
106
|
0% {
|
|
107
107
|
opacity: 0;
|
|
108
108
|
}
|
|
@@ -112,7 +112,7 @@
|
|
|
112
112
|
100% {
|
|
113
113
|
opacity: 0;
|
|
114
114
|
}
|
|
115
|
-
`,
|
|
115
|
+
`,oe=l.div`
|
|
116
116
|
display: flex;
|
|
117
117
|
justify-content: center;
|
|
118
118
|
> div {
|
|
@@ -121,7 +121,7 @@
|
|
|
121
121
|
border-radius: 50%;
|
|
122
122
|
margin: 5px;
|
|
123
123
|
background-color: ${t=>{var e;return(e=t.theme.colors)==null?void 0:e.text}};
|
|
124
|
-
animation: ${
|
|
124
|
+
animation: ${re} 1s infinite;
|
|
125
125
|
}
|
|
126
126
|
> div:nth-of-type(2) {
|
|
127
127
|
animation-delay: 100ms;
|
|
@@ -129,23 +129,23 @@
|
|
|
129
129
|
> div:nth-of-type(3) {
|
|
130
130
|
animation-delay: 200ms;
|
|
131
131
|
}
|
|
132
|
-
`,
|
|
132
|
+
`,A=l.div`
|
|
133
133
|
grid-area: content;
|
|
134
134
|
max-width: 100%;
|
|
135
135
|
overflow: hidden;
|
|
136
|
-
`,
|
|
136
|
+
`,ae=l(n.Typography)`
|
|
137
137
|
font-size: ${t=>{var e;return(e=t.theme.fonts)==null?void 0:e.normal}};
|
|
138
138
|
font-weight: normal;
|
|
139
139
|
margin: 0;
|
|
140
|
-
`,
|
|
140
|
+
`,O=l.div`
|
|
141
141
|
display: flex;
|
|
142
142
|
${t=>t.left&&"justify-content: start;"};
|
|
143
143
|
${t=>t.center&&"justify-content: center;"};
|
|
144
144
|
${t=>t.right&&"justify-content: end;"};
|
|
145
|
-
`,
|
|
145
|
+
`,R=l.div`
|
|
146
146
|
${t=>{var e;return t.padded&&`padding: ${(e=t.theme.sizes)==null?void 0:e.medium};`}}
|
|
147
|
-
${t=>!t.user&&t.stacked&&
|
|
148
|
-
${t=>t.user&&t.stacked&&
|
|
147
|
+
${t=>!t.user&&t.stacked&&ie(t.stacked,t.theme)}
|
|
148
|
+
${t=>t.user&&t.stacked&&le(t.stacked,t.theme)}
|
|
149
149
|
|
|
150
150
|
display: inline-block;
|
|
151
151
|
margin-top: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.normal}};
|
|
@@ -158,12 +158,12 @@
|
|
|
158
158
|
}
|
|
159
159
|
max-width: 100%;
|
|
160
160
|
${t=>t.fullWidth&&"width: 100%;"}
|
|
161
|
-
`,
|
|
162
|
-
background-color: ${(
|
|
161
|
+
`,ie=(t,e)=>{var o,a;const r=p.css`
|
|
162
|
+
background-color: ${(o=e.colors)==null?void 0:o.accent};
|
|
163
163
|
color: ${(a=e.colors)==null?void 0:a.text};
|
|
164
164
|
${e.border&&`border: ${e.border};`};
|
|
165
|
-
`;return e.borderRadius?
|
|
166
|
-
${
|
|
165
|
+
`;return e.borderRadius?p.css`
|
|
166
|
+
${r}
|
|
167
167
|
|
|
168
168
|
border-top-right-radius: ${e.borderRadius};
|
|
169
169
|
border-bottom-right-radius: ${e.borderRadius};
|
|
@@ -175,11 +175,11 @@
|
|
|
175
175
|
${t==="last"&&`
|
|
176
176
|
border-bottom-left-radius: ${e.borderRadius};
|
|
177
177
|
`}
|
|
178
|
-
`:
|
|
179
|
-
background-color: ${(
|
|
178
|
+
`:r},le=(t,e)=>{var o,a;const r=p.css`
|
|
179
|
+
background-color: ${(o=e.colors)==null?void 0:o.primary};
|
|
180
180
|
color: ${(a=e.colors)==null?void 0:a.accent};
|
|
181
|
-
`;return e.borderRadius?
|
|
182
|
-
${
|
|
181
|
+
`;return e.borderRadius?p.css`
|
|
182
|
+
${r}
|
|
183
183
|
|
|
184
184
|
border-top-left-radius: ${e.borderRadius};
|
|
185
185
|
border-bottom-left-radius: ${e.borderRadius};
|
|
@@ -191,17 +191,17 @@
|
|
|
191
191
|
${t==="last"&&`
|
|
192
192
|
border-bottom-right-radius: ${e.borderRadius};
|
|
193
193
|
`}
|
|
194
|
-
`:
|
|
194
|
+
`:r},N=l.div`
|
|
195
195
|
margin-bottom: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.normal}};
|
|
196
196
|
&:last-child {
|
|
197
197
|
margin-bottom: 0;
|
|
198
198
|
}
|
|
199
|
-
`,
|
|
199
|
+
`,k=t=>{var e,r;return p.css`
|
|
200
200
|
margin: ${(e=t.theme.sizes)==null?void 0:e.medium} 0;
|
|
201
|
-
padding: 0 ${(
|
|
202
|
-
`},
|
|
201
|
+
padding: 0 ${(r=t.theme.sizes)==null?void 0:r.medium};
|
|
202
|
+
`},ce=l(G.FormComponent)`
|
|
203
203
|
& button.humany-form-component-button {
|
|
204
|
-
${t=>{var e,o,
|
|
204
|
+
${t=>{var e,r,o,a;return((e=t.theme.colors)==null?void 0:e.primary)&&((r=t.theme.colors)==null?void 0:r.accent)&&n.invertedHoverButton({active:!1,primaryColor:(o=t.theme.colors)==null?void 0:o.primary,secondaryColor:(a=t.theme.colors)==null?void 0:a.accent,theme:t.theme})}};
|
|
205
205
|
display: block;
|
|
206
206
|
width: 100%;
|
|
207
207
|
margin-bottom: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.normal}};
|
|
@@ -213,7 +213,7 @@
|
|
|
213
213
|
margin-bottom: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.normal}};
|
|
214
214
|
}
|
|
215
215
|
}
|
|
216
|
-
`,
|
|
216
|
+
`,de=l(n.Html)`
|
|
217
217
|
white-space: pre-wrap;
|
|
218
218
|
a {
|
|
219
219
|
color: ${t=>t.theme.colors.link};
|
|
@@ -221,14 +221,14 @@
|
|
|
221
221
|
${t=>{var e;return((e=t.theme.accessibility)==null?void 0:e.isTabbing)&&n.borderTabStyle}};
|
|
222
222
|
}
|
|
223
223
|
}
|
|
224
|
-
`,
|
|
224
|
+
`,me=l(n.List)`
|
|
225
225
|
padding: 0;
|
|
226
226
|
list-style: none;
|
|
227
227
|
margin: 0 -${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.normal}};
|
|
228
228
|
> li {
|
|
229
229
|
margin: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.normal}};
|
|
230
230
|
}
|
|
231
|
-
`,
|
|
231
|
+
`,ue=l.button`
|
|
232
232
|
${t=>n.buttonCss(t)};
|
|
233
233
|
display: block;
|
|
234
234
|
background-color: ${t=>{var e;return(e=t.theme.colors)==null?void 0:e.primary}};
|
|
@@ -238,7 +238,7 @@
|
|
|
238
238
|
${n.borderTabStyle}
|
|
239
239
|
background-color: transparent;
|
|
240
240
|
}
|
|
241
|
-
`,
|
|
241
|
+
`,D=y.forwardRef(({boxed:t,className:e,agentData:r},o)=>s.jsx(A,{ref:o,children:s.jsx(O,{left:t,center:!t,children:s.jsx(R,{padded:!!t,stacked:t?"first":void 0,children:s.jsxs(oe,{children:[s.jsx("div",{}),s.jsx("div",{}),s.jsx("div",{})]})})})})),F=y.createContext(null),he=l.p`
|
|
242
242
|
&& {
|
|
243
243
|
font-size: ${t=>{var e;return(e=t.theme.fonts)==null?void 0:e.small}};
|
|
244
244
|
font-weight: 300;
|
|
@@ -247,28 +247,28 @@
|
|
|
247
247
|
line-height: 1.5em;
|
|
248
248
|
grid-area: info;
|
|
249
249
|
color: ${t=>{var e;return(e=t.theme.colors)==null?void 0:e.text}};
|
|
250
|
-
`,
|
|
250
|
+
`,K=(t,e)=>new Date(t).toLocaleTimeString(e||[],{hour:"numeric",minute:"2-digit"}),C=({className:t,name:e,timestamp:r,ariaHidden:o=!1})=>{const a=y.useContext(F);if(!e&&!r)return null;let i="";return e?r?i=`${e}: ${K(r,a)}`:i=e:r&&(i=K(r,a)),s.jsx(he,{"aria-hidden":o,children:i})},W=({className:t,children:e,sender:r,timestamp:o})=>{const{avatar:a,name:i}=r,{avatarSize:u}=n.useProperties();return s.jsxs(ge,{hasAvatar:!!a,className:L.appendClassNames(t,"humany-conversation-agent-message"),children:[a&&s.jsx(ne,{avatarSize:u,children:typeof a=="string"?s.jsx("img",{src:a}):s.jsx(n.SymbolBadge,{symbol:a})}),e,s.jsx(C,{name:i,timestamp:o,ariaHidden:!0})]})},ge=l.div`
|
|
251
251
|
display: grid;
|
|
252
252
|
margin-right: 10%;
|
|
253
253
|
width: 90%;
|
|
254
|
-
${t=>t.hasAvatar?
|
|
254
|
+
${t=>t.hasAvatar?p.css`
|
|
255
255
|
grid-template-columns: auto 1fr;
|
|
256
256
|
grid-template-rows: 1fr auto;
|
|
257
257
|
grid-template-areas:
|
|
258
258
|
'avatar content'
|
|
259
259
|
'. info';
|
|
260
|
-
`:
|
|
260
|
+
`:p.css`
|
|
261
261
|
grid-template-columns: 1fr;
|
|
262
262
|
grid-template-rows: 1fr auto;
|
|
263
263
|
grid-template-areas:
|
|
264
264
|
'content'
|
|
265
265
|
'info';
|
|
266
266
|
`};
|
|
267
|
-
`,
|
|
267
|
+
`,ye=y.forwardRef(({className:t,children:e,timestamp:r,discrete:o,fullWidth:a},i)=>s.jsx(be,{ref:i,className:L.appendClassNames(t,"humany-conversation-system-message"),fullWidth:a,children:o?s.jsxs(pe,{className:"humany-conversation-discrete-message",children:[e,s.jsx(C,{timestamp:r})]}):s.jsxs(s.Fragment,{children:[e,s.jsx(C,{timestamp:r})]})})),be=l.div`
|
|
268
268
|
${t=>t.fullWidth&&"width: 100%"};
|
|
269
269
|
padding: 0 ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.large}};
|
|
270
270
|
overflow: auto;
|
|
271
|
-
`,
|
|
271
|
+
`,pe=l.div`
|
|
272
272
|
text-align: center;
|
|
273
273
|
word-wrap: break-word;
|
|
274
274
|
font-size: ${t=>{var e;return(e=t.theme.fonts)==null?void 0:e.normal}};
|
|
@@ -276,13 +276,13 @@
|
|
|
276
276
|
> p {
|
|
277
277
|
margin: 0;
|
|
278
278
|
}
|
|
279
|
-
`,
|
|
279
|
+
`,fe=({className:t,children:e,timestamp:r})=>{const{userLabel:o=""}=n.useProperties();return s.jsxs(xe,{className:L.appendClassNames(t,"humany-conversation-user-message"),children:[e,s.jsx(C,{name:o,timestamp:r,ariaHidden:!0})]})},xe=l.div`
|
|
280
280
|
margin-left: 10%;
|
|
281
281
|
width: 90%;
|
|
282
282
|
display: flex;
|
|
283
283
|
flex-direction: column;
|
|
284
284
|
align-items: flex-end;
|
|
285
|
-
`,
|
|
285
|
+
`,E=t=>Array.isArray(t)?t:Object.keys(t).map(e=>({label:t[e],actionKey:e})),ve=({header:t,actions:e,dispatch:r})=>{const o=n.useContainer(),{events:a}=o.get("$widget");return s.jsx($e,{className:"humany-conversation-button-list",header:t,items:E(e),renderItem:i=>{var m;const u=!!((m=i==null?void 0:i.data)!=null&&m.href);return s.jsx("li",{children:u?s.jsxs(je,{onClick:()=>{r("action",i),a.dispatch("tracking:button-list-item-clicked",i)},href:i.data.href,target:i.data.target,"aria-label":i.label,title:i.label,children:[s.jsx(n.SymbolBadge,{symbol:i.symbol}),i.label]}):s.jsxs(ke,{onClick:()=>{r("action",i),a.dispatch("tracking:button-list-item-clicked",i)},"aria-label":i.label,title:i.label,children:[s.jsx(n.SymbolBadge,{symbol:i.symbol}),i.label]})},i.actionKey)}})},$e=l(n.ItemList)`
|
|
286
286
|
${n.itemList}
|
|
287
287
|
> ul {
|
|
288
288
|
display: flex;
|
|
@@ -292,8 +292,8 @@
|
|
|
292
292
|
margin: 0;
|
|
293
293
|
}
|
|
294
294
|
}
|
|
295
|
-
${
|
|
296
|
-
|
|
295
|
+
${k}
|
|
296
|
+
`,je=l(n.Link)`
|
|
297
297
|
${n.buttonCss};
|
|
298
298
|
|
|
299
299
|
display: block;
|
|
@@ -312,7 +312,7 @@
|
|
|
312
312
|
svg {
|
|
313
313
|
margin-right: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.small}};
|
|
314
314
|
}
|
|
315
|
-
`,
|
|
315
|
+
`,ke=l(n.Button)`
|
|
316
316
|
${n.buttonCss};
|
|
317
317
|
|
|
318
318
|
display: block;
|
|
@@ -331,22 +331,22 @@
|
|
|
331
331
|
svg {
|
|
332
332
|
margin-right: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.small}};
|
|
333
333
|
}
|
|
334
|
-
`,Se=({type:t,content:e={}})=>{const
|
|
334
|
+
`,Se=({type:t,content:e={}})=>{const r=n.useComponent(t);return!r||!t?null:s.jsx(y.Suspense,{fallback:null,children:s.jsx(r,{...e})})},we=({body:t})=>s.jsx(Ce,{html:t}),Ce=l(n.Html)`
|
|
335
335
|
${n.genericHtml}
|
|
336
336
|
color: inherit;
|
|
337
337
|
white-space: pre-wrap;
|
|
338
|
-
${
|
|
338
|
+
${k}
|
|
339
339
|
a {
|
|
340
340
|
color: ${t=>t.theme.colors.link};
|
|
341
341
|
&:focus-visible {
|
|
342
342
|
${n.borderTabStyle};
|
|
343
343
|
}
|
|
344
344
|
}
|
|
345
|
-
`,
|
|
345
|
+
`,Le=({header:t,actions:e,dispatch:r})=>s.jsx(ze,{className:"humany-conversation-item-list",header:t,items:E(e),renderItem:o=>{var a;return s.jsx("li",{children:s.jsxs(Te,{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)}}),ze=l(n.ItemList)`
|
|
346
346
|
${n.itemList}
|
|
347
347
|
|
|
348
348
|
> .humany-paragraph {
|
|
349
|
-
${
|
|
349
|
+
${k}
|
|
350
350
|
margin-bottom: 0;
|
|
351
351
|
|
|
352
352
|
h1 {
|
|
@@ -354,7 +354,7 @@
|
|
|
354
354
|
}
|
|
355
355
|
}
|
|
356
356
|
|
|
357
|
-
${t=>n.headingElement(t)("h1",
|
|
357
|
+
${t=>n.headingElement(t)("h1",p.css`
|
|
358
358
|
white-space: normal;
|
|
359
359
|
`)}
|
|
360
360
|
|
|
@@ -374,10 +374,10 @@
|
|
|
374
374
|
border-bottom: none;
|
|
375
375
|
}
|
|
376
376
|
}
|
|
377
|
-
`,
|
|
377
|
+
`,Te=l.div`
|
|
378
378
|
display: flex;
|
|
379
379
|
gap: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.medium}};
|
|
380
|
-
${
|
|
380
|
+
${k}
|
|
381
381
|
|
|
382
382
|
.item-icon {
|
|
383
383
|
}
|
|
@@ -411,11 +411,11 @@
|
|
|
411
411
|
}
|
|
412
412
|
}
|
|
413
413
|
}
|
|
414
|
-
`,
|
|
414
|
+
`,Ne=({header:t,actions:e,dispatch:r})=>{const o=n.usePrevious(e),a=y.useRef(),i=n.useIsTabbing(),u=n.useContainer(),{events:m}=u.get("$widget");return y.useEffect(()=>{if(o&&Array.isArray(e)&&Array.isArray(o)&&o.length<e.length&&a.current){const d=a.current.querySelectorAll(".humany-conversation-link-list > ul > li"),b=d[o.length];if(d.length===e.length&&o.length){const $=d[o.length-1];if($){const c=$.querySelector(".humany-button");c&&c.focus()}}else b&&new MutationObserver((c,h)=>{c.forEach(v=>{if(v.addedNodes){const x=Array.from(v.addedNodes).find(S=>S.tagName==="BUTTON");x&&L.htmlParentContains(a.current,document.activeElement)&&(i&&x.focus(),h.disconnect())}})}).observe(b,{attributes:!1,characterData:!1,childList:!0,subtree:!0,attributeOldValue:!1,characterDataOldValue:!1})}}),s.jsx(Me,{ref:a,className:"humany-conversation-link-list",header:t,items:E(e),renderItem:d=>s.jsx("li",{children:s.jsxs(Ie,{help:d.actionKey==="help",onClick:()=>{r("action",d),m.dispatch("tracking:link-list-item-clicked",d)},"aria-label":d.label,title:d.label,children:[d.label,d.actionKey==="help"&&s.jsx(n.SymbolBadge,{size:14,symbol:{type:"Svg",content:"caret-down"}})]})},d.actionKey)})},Me=l(n.ItemList)`
|
|
415
415
|
${n.itemList}
|
|
416
|
-
${
|
|
416
|
+
${k}
|
|
417
417
|
|
|
418
|
-
${t=>n.headingElement(t)("h1",
|
|
418
|
+
${t=>n.headingElement(t)("h1",p.css`
|
|
419
419
|
white-space: normal;
|
|
420
420
|
`)}
|
|
421
421
|
|
|
@@ -427,7 +427,7 @@
|
|
|
427
427
|
margin: 0;
|
|
428
428
|
}
|
|
429
429
|
}
|
|
430
|
-
`,
|
|
430
|
+
`,Ie=l(n.Button)`
|
|
431
431
|
display: block;
|
|
432
432
|
text-align: left;
|
|
433
433
|
font-weight: 300;
|
|
@@ -436,13 +436,13 @@
|
|
|
436
436
|
text-overflow: ellipsis;
|
|
437
437
|
overflow: hidden;
|
|
438
438
|
|
|
439
|
-
${t=>{var e,
|
|
439
|
+
${t=>{var e,r;return t.help&&p.css`
|
|
440
440
|
color: ${(e=t.theme.colors)==null?void 0:e.text};
|
|
441
441
|
text-decoration: underline;
|
|
442
442
|
|
|
443
443
|
i,
|
|
444
444
|
svg {
|
|
445
|
-
margin-left: ${(
|
|
445
|
+
margin-left: ${(r=t.theme.sizes)==null?void 0:r.small};
|
|
446
446
|
}
|
|
447
447
|
`}}
|
|
448
448
|
|
|
@@ -453,12 +453,12 @@
|
|
|
453
453
|
text-decoration: underline;
|
|
454
454
|
}
|
|
455
455
|
}
|
|
456
|
-
`,
|
|
456
|
+
`,Be=()=>s.jsx(He,{className:"humany-conversation-separator"}),He=l.div`
|
|
457
457
|
${t=>t.theme.border&&`border-bottom: ${t.theme.border};`}
|
|
458
458
|
width: 100%;
|
|
459
|
-
`,
|
|
460
|
-
${
|
|
461
|
-
`,
|
|
459
|
+
`,Ae=({text:t})=>s.jsx(Oe,{className:"humany-conversation-text",variant:"span",children:t}),Oe=l(n.Typography)`
|
|
460
|
+
${k}
|
|
461
|
+
`,Re=({header:t="Video call",acceptLabel:e="Accept",declineLabel:r="Decline",dispatch:o})=>{const a=y.useMemo(()=>[{label:e,actionKey:"accept-video-call",symbol:{type:"Svg",content:"video"}},{label:r,actionKey:"decline-video-call",symbol:{type:"Svg",content:"close"}}],[e,r]);return s.jsx(Ee,{className:"humany-conversation-video-request",header:t,items:a,renderItem:i=>{const u=i.actionKey==="accept-video-call"?"#70c48e":"#da5c85";return s.jsx("li",{children:s.jsx(De,{onClick:()=>{o("action",i)},"aria-label":i.label,title:i.label,bgColor:u,children:s.jsx(n.SymbolBadge,{symbol:i.symbol,size:25})})},i.actionKey)}})},Ee=l(n.ItemList)`
|
|
462
462
|
${t=>n.itemList(t)}
|
|
463
463
|
> ul {
|
|
464
464
|
display: flex;
|
|
@@ -468,8 +468,8 @@
|
|
|
468
468
|
margin: 0;
|
|
469
469
|
}
|
|
470
470
|
}
|
|
471
|
-
${t=>
|
|
472
|
-
`,
|
|
471
|
+
${t=>k(t)}
|
|
472
|
+
`,De=l(n.Button)`
|
|
473
473
|
${n.buttonCss};
|
|
474
474
|
|
|
475
475
|
background-color: ${t=>t.bgColor};
|
|
@@ -503,13 +503,13 @@
|
|
|
503
503
|
stroke: #fff;
|
|
504
504
|
}
|
|
505
505
|
}
|
|
506
|
-
`,
|
|
506
|
+
`,Ke=([t,e])=>({type:t,content:e}),qe=({items:t,dispatch:e})=>s.jsx(Pe,{role:"none",className:"humany-message-list",items:t.map(Ke),renderLi:!0,renderItem:r=>{switch(r.type){case j.ConversationMessageListItemType.Text:return s.jsx(Ae,{text:r.content});case j.ConversationMessageListItemType.HTML:return s.jsx(we,{...r.content});case j.ConversationMessageListItemType.Separator:return s.jsx(Be,{...r.content});case j.ConversationMessageListItemType.ItemList:return s.jsx(Le,{...r.content,dispatch:e});case j.ConversationMessageListItemType.LinkList:return s.jsx(Ne,{...r.content,dispatch:e});case j.ConversationMessageListItemType.ButtonList:return s.jsx(ve,{...r.content,dispatch:e});case j.ConversationMessageListItemType.VideoRequest:return s.jsx(Re,{...r.content,dispatch:e});default:return s.jsx(Se,{type:r.type,content:r.content})}}}),Pe=l(n.List)`
|
|
507
507
|
${n.list}
|
|
508
508
|
|
|
509
509
|
> li {
|
|
510
510
|
margin: 0;
|
|
511
511
|
}
|
|
512
|
-
`,
|
|
512
|
+
`,Fe=y.forwardRef(({className:t,timestamp:e,sender:r,type:o,content:a},i)=>{const u=y.useCallback(c=>{let h="first";return a.length>1&&(h=c===0?"first":c+1===a.length?"last":"middle"),h},[a]),{userLabel:m=""}=n.useProperties(),d=()=>s.jsx(s.Fragment,{children:a.map(c=>{const{key:h,body:v,title:x,form:S,actions:f}=c,T=!!v&&!x&&!S&&!f;return s.jsx(ye,{className:t,discrete:T,ref:i,timestamp:e,fullWidth:!!S||!!f,children:T&&v?s.jsx(n.Html,{html:v}):s.jsx(B,{isSystem:!0,content:c})},h)})}),b=()=>s.jsxs(s.Fragment,{children:[s.jsx(q,{className:"humany-sr-only",children:s.jsx(C,{name:r==null?void 0:r.name,timestamp:e})}),s.jsx(W,{sender:r,timestamp:e,className:t,children:s.jsx(A,{className:"humany-message-content-bundle",children:a.map((c,h)=>s.jsx(O,{className:"humany-message-container",left:!0,ref:i,children:s.jsx(B,{content:c,stacked:u(h)})},c.key))})})]}),$=()=>s.jsxs(s.Fragment,{children:[s.jsx(q,{className:"humany-sr-only",children:s.jsx(C,{name:m,timestamp:e})}),s.jsx(fe,{timestamp:e,className:t,children:s.jsx(A,{className:"humany-message-content-bundle",children:a.map((c,h)=>s.jsx(O,{className:"humany-message-container",right:!0,ref:i,children:s.jsx(B,{isUser:!0,content:c,stacked:u(h)})},c.key))})})]});switch(o){case j.ConversationMessageType.System:return d();case j.ConversationMessageType.Agent:return b();case j.ConversationMessageType.User:return $();default:return null}}),B=({content:t,isUser:e,isSystem:r,stacked:o})=>{const a=n.useDispatch(),{title:i,body:u,actions:m,form:d,items:b}=t;return b?s.jsx(R,{className:"humany-message-content",user:!!e,stacked:o,children:s.jsx(qe,{items:b,dispatch:a})}):s.jsxs(R,{className:"humany-message-content",padded:!r,user:!!e,stacked:o,fullWidth:!!d||!!m,children:[i&&s.jsx(N,{children:s.jsx(ae,{variant:"h2",children:i})}),u&&s.jsx(N,{children:s.jsx(de,{html:u})}),d&&s.jsx(N,{children:s.jsx(ce,{...d,onChange:(c,h)=>{a("form",{data:h,formKey:d.schema.id,actionKey:c})}})}),m&&s.jsx(N,{children:s.jsx(me,{items:Object.keys(m).map(c=>({label:m[c],actionKey:c})),renderItem:c=>s.jsx("li",{children:s.jsx(ue,{onClick:()=>{a("action",c.actionKey)},children:c.label})},c.actionKey)})})]})},q=l.div`
|
|
513
513
|
position: absolute !important;
|
|
514
514
|
height: 1px;
|
|
515
515
|
width: 1px;
|
|
@@ -518,7 +518,7 @@
|
|
|
518
518
|
clip: rect(1px, 1px, 1px, 1px);
|
|
519
519
|
left: -10000000px;
|
|
520
520
|
top: auto;
|
|
521
|
-
`,
|
|
521
|
+
`,We=()=>{const{skipToLatestMessageLabel:t="Skip to latest message"}=n.useProperties(),e=n.useContainer(),r=()=>{const o=e.get("widgetDOMElement");if(o){const a=o.querySelectorAll(".humany-conversation-entry");a.length&&a[a.length-1].focus()}};return s.jsx(Ue,{className:"humany-skip-to-latest-message",onKeyDown:o=>{(o.key==="Enter"||o.keyCode===13)&&r()},onClick:r,children:t})},Ue=l.button`
|
|
522
522
|
position: absolute;
|
|
523
523
|
bottom: 60px;
|
|
524
524
|
text-align: center;
|
|
@@ -532,7 +532,7 @@
|
|
|
532
532
|
transform: translateX(-50%);
|
|
533
533
|
${n.borderTabStyle};
|
|
534
534
|
}
|
|
535
|
-
`,
|
|
535
|
+
`,U=()=>{const t=y.useCallback(m=>{m&&setTimeout(()=>{m.scrollIntoView({block:"start",behavior:"smooth"})},250)},[]),[e,r]=n.useScroll(!0),{messages:o,loading:a,typingActors:i=[]}=n.useProperties(),u=()=>i&&i.length?i.map((m,d)=>s.jsx(H,{id:`typing_${m.name}`,children:s.jsx(W,{timestamp:Date.now(),sender:m,children:s.jsx(D,{boxed:!0,ref:t})})},`typing_${m.name}`)):null;return s.jsxs(s.Fragment,{children:[s.jsxs(Ve,{tabIndex:0,scrollableCss:e,ref:r,children:[o&&o.length?o.map((m,d)=>{const{type:b,timestamp:$,sender:c,content:h}=m;return s.jsx(H,{className:"humany-conversation-entry",tabIndex:-1,children:s.jsx(Fe,{...m,ref:t})},`${b}_${c==null?void 0:c.name}_${$}_${h[0].key}`)}):null,u(),a&&s.jsx(H,{children:s.jsx(D,{ref:t})})]}),s.jsx(J,{}),s.jsx(We,{})]})},Ve=l.div`
|
|
536
536
|
display: flex;
|
|
537
537
|
flex-direction: column;
|
|
538
538
|
align-items: stretch;
|
|
@@ -542,7 +542,7 @@
|
|
|
542
542
|
&:focus-visible {
|
|
543
543
|
${t=>n.borderTabStyle(t)};
|
|
544
544
|
}
|
|
545
|
-
`,
|
|
545
|
+
`,H=l.div`
|
|
546
546
|
margin: 0;
|
|
547
547
|
margin-bottom: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.medium}};
|
|
548
548
|
|
|
@@ -570,10 +570,10 @@
|
|
|
570
570
|
${n.borderTabStyle}
|
|
571
571
|
border-radius: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.small}};
|
|
572
572
|
}
|
|
573
|
-
${t=>n.headingElement(t)("h1",
|
|
573
|
+
${t=>n.headingElement(t)("h1",p.css`
|
|
574
574
|
font-weight: normal;
|
|
575
575
|
`)}
|
|
576
|
-
`,
|
|
576
|
+
`,_e=({dispatch:t})=>{const e=y.useRef(null);return y.useEffect(()=>{e.current&&e.current.parentNode&&t("overlay-mounted",e.current)},[e]),s.jsx(n.WidgetOverlayOutlet,{portalId:"humany-conversation-overlay-portal",className:"humany-conversation-overlay-outlet",ref:e})},Ye=({dispatch:t,header:e,buttonLabel:r})=>s.jsxs(Xe,{portalId:"humany-conversation-portal",className:"humany-conversation-outlet",children:[s.jsxs(Ge,{className:"humany-conversation-outlet-head",children:[s.jsx(Qe,{className:"humany-conversation-outlet-head-button","aria-label":r,title:r,onClick:()=>t("hide-overlay-conversation"),children:s.jsx(n.SymbolBadge,{symbol:{type:"Svg",content:"caret-down"},size:20})}),e&&s.jsx(Je,{className:"humany-conversation-outlet-header",variant:"h1",children:e})]}),s.jsx(U,{})]}),Xe=l(n.WidgetOverlayOutlet)`
|
|
577
577
|
z-index: 11;
|
|
578
578
|
top: auto;
|
|
579
579
|
height: 65%;
|
|
@@ -582,7 +582,7 @@
|
|
|
582
582
|
flex-direction: column;
|
|
583
583
|
border-top-right-radius: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.large}};
|
|
584
584
|
border-top-left-radius: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.large}};
|
|
585
|
-
`,
|
|
585
|
+
`,Ge=l.div`
|
|
586
586
|
display: flex;
|
|
587
587
|
flex-direction: column;
|
|
588
588
|
justify-content: center;
|
|
@@ -590,11 +590,11 @@
|
|
|
590
590
|
gap: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.normal}};
|
|
591
591
|
padding: ${t=>{var e;return(e=t.theme.sizes)==null?void 0:e.normal}};
|
|
592
592
|
${t=>t.theme.border&&`border-bottom: ${t.theme.border};`}
|
|
593
|
-
`,
|
|
593
|
+
`,Je=l(n.Typography)`
|
|
594
594
|
font-size: ${t=>{var e;return(e=t.theme.fonts)==null?void 0:e.medium}};
|
|
595
595
|
color: ${t=>{var e;return(e=t.theme.colors)==null?void 0:e.text}};
|
|
596
596
|
margin: 0;
|
|
597
|
-
`,
|
|
597
|
+
`,Qe=l(n.Button)`
|
|
598
598
|
display: flex;
|
|
599
599
|
align-items: center;
|
|
600
600
|
justify-content: center;
|
|
@@ -608,7 +608,7 @@
|
|
|
608
608
|
svg line {
|
|
609
609
|
stroke: ${t=>{var e;return(e=t.theme.colors)==null?void 0:e.text}};
|
|
610
610
|
}
|
|
611
|
-
`,
|
|
611
|
+
`,Ze=({className:t,...e})=>{const{overlay:r,overlayConversationHeader:o,overlayConversationCloseLabel:a,conversationControllerId:i}=n.useProperties(),u=n.useDispatch(),d=n.useContainer().get("$settings");return s.jsx(n.ConversationContext.Provider,{value:i?{id:i}:null,children:s.jsxs(F.Provider,{value:d==null?void 0:d.language,children:[s.jsx(et,{"aria-live":"assertive",...e,className:L.appendClassNames(t,"humany-conversation-component"),children:s.jsx(U,{})}),r&&s.jsxs(s.Fragment,{children:[s.jsx(_e,{dispatch:u}),r.conversation&&s.jsx(Ye,{dispatch:u,header:o,buttonLabel:a})]})]})})},et=l.div`
|
|
612
612
|
position: absolute;
|
|
613
613
|
right: 0;
|
|
614
614
|
left: 0;
|
|
@@ -617,4 +617,4 @@
|
|
|
617
617
|
overflow: hidden;
|
|
618
618
|
display: flex;
|
|
619
619
|
flex-direction: column;
|
|
620
|
-
`;exports.default=
|
|
620
|
+
`;exports.default=Ze;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Container, EventListener, EventManager } from '@webprovisions/platform';
|
|
1
|
+
import { Container, EventListener, EventManager, Widget } from '@webprovisions/platform';
|
|
2
2
|
import { AgentSettings } from './agent';
|
|
3
3
|
import { ConversationProvider } from './conversation-provider';
|
|
4
4
|
import { ConversationMessageContent, ConversationMessageSender, ConversationMessageSettings, ConversationMessageUpdateSettings, ConverstationMessageItem, NormalizedMessageSettings } from './types';
|
|
@@ -56,6 +56,7 @@ export declare class ConversationController {
|
|
|
56
56
|
* Represents the current end user.
|
|
57
57
|
*/
|
|
58
58
|
user: User;
|
|
59
|
+
widget: Widget;
|
|
59
60
|
events: EventManager;
|
|
60
61
|
providers: string[];
|
|
61
62
|
active: boolean;
|