npm - @telia-ace/widget-conversation - Versions diffs - 1.0.21 → 1.0.22 - Mend

@telia-ace/widget-conversation 1.0.21 → 1.0.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/README.md +105 -22
package/dist/components/conversation/ui/loader.d.ts +1 -1
package/dist/conversation.js +34 -55
package/dist/conversation.js.map +1 -1
package/package.json +9 -8

package/README.md CHANGED Viewed

@@ -58,32 +58,34 @@ const agent = conversation.createAgent({
 ## Writing to the conversation
+***`print()` accepts an array, which is considered best practice when writing to the conversation. The previous way of posting an object is still currently be supported, but is considered to be deprecated.**
 ### Posting, updating and removing content
-When managing content in the conversation you'll first need to create an `Agent`-object and then use its `print()` function. There are serveral types of entries in order to accommedate different types of content.
+When managing content in the conversation you'll first need to create an `Agent`-object and then use its `print()` function. There are serveral types of entries in order to accommodate different types of content.
-The `print(content: object)` function let's you return a `ConversationEntry` message that can be used to update and/or remove the content from the conversation.
+The `print(items: ConversationMessageItem[])` function let's you return a `ConversationEntry` message that can be used to update and/or remove the content from the conversation.
 ##### Example of simple text message
 ```ts
 // print user message
-conversation.user.print('Lorem ipsum');
+conversation.user.print([['text', 'Lorem ipsum']]);
 // print agent message
 const agent = conversation.createAgent();
-agent.print('Lorem ipsum');
+agent.print([['text', 'Lorem ipsum']]);
 ```
 ##### Example of updating or removing content
 ```ts
 const agent = conversation.createAgent();
-const entry = agent.print('Hello world!');
+const entry = agent.print([['text', 'Hello world!']]);
-entry.update({
+entry.update([
     // ...
-});
+]);
 entry.remove();
 ```
@@ -92,24 +94,55 @@ entry.remove();
 You can post an entry into the conversation with actions. You can specify a title, body and available actions. This is only supported for the `Agent` and will be displayed as a system message.
-| Name      | Type     | Description                                                   |
-| --------- | -------- | ------------------------------------------------------------- |
-| `title`   | `string` | Title for the entry.                                          |
-| `body`    | `string` | Body content for the entry. Supports HTML.                    |
-| `actions` | `object` | Key-value-pairs representing available actions for the entry. |
+This can be either in the form of a "ButtonList" or an "LinkList" as demostrated below.
+| Name      | Type     | Description                                  |
+| --------- | -------- | -------------------------------------------- |
+| `header`  | `string` | Header for the entry.                        |
+| `actions` | `array`  | Array of of available actions for the entry. |
 ##### Example of a list of actions
 ```ts
-agent.print({
-    title: 'Download invoices',
-    body: 'Click an invoice below to download a copy.',
-    actions: {
-        invoice_190201: 'Invoice 190201',
-        invoice_190301: 'Invoice 190301',
-        invoice_190401: 'Invoice 190401',
-    },
-});
+// example of button list
+agent.print([
+    [
+        'button-list',
+        {
+            header: 'Download invoices',
+            actions: [
+                {
+                    actionKey: 'invoice_190201',
+                    label: 'Invoice 190201',
+                },
+                {
+                    actionKey: 'invoice_190301',
+                    label: 'Invoice 190301',
+                },
+            ],
+        },
+    ],
+]);
+// here we use a link list instead, but with the same actions
+agent.print([
+    [
+        'link-list',
+        {
+            header: 'Download invoices',
+            actions: [
+                {
+                    actionKey: 'invoice_190201',
+                    label: 'Invoice 190201',
+                },
+                {
+                    actionKey: 'invoice_190301',
+                    label: 'Invoice 190301',
+                },
+            ],
+        },
+    ],
+]);
 ```
 ### Entry with a form
@@ -152,6 +185,56 @@ agent.print({
 });
 ```
+### Entry with a video call
+Use the `video-request` item type to create an entry representing an incoming video call. This entry can also have a form attached, which uses the `FormBuilder`-method and is handled by the `conversation.form` event. It is only supported for an `Agent` and will be displayed as a system message.
+| Name           | Type     | Description                                     |
+| -------------- | -------- | ----------------------------------------------- |
+| `header`       | `string` | Header for the entry.                           |
+| `acceptLabel`  | `string` | Label to be shown for the "accept call button"  |
+| `declineLabel` | `string` | Label to be shown for the "decline call button" |
+##### Example of an entry for an incoming video call
+```ts
+agent.print([
+    [
+        'video-request',
+        {
+            header: 'Video call',
+            accept: 'Accept',
+            decline: 'Decline',
+        },
+    ],
+]);
+```
+When the user presses one of these buttons to accept or decline the call, an action will be dispatched with actionKey `accept-video-call` or `decline-video-call`, depending on which button was clicked.
+Listening to these actions can be done as following:
+```ts
+component.actions.watch('conversation.action', (input, next) => {
+    if (input.actionKey === 'accept-video-call') {
+        // this will render an overlay over the widget,
+        // and prepare the widget for displaying the actual call
+        component.actions.dispatch('show-overlay', {});
+    } else if (input.actionKey === 'decline-video-call') {
+        // ...
+    }
+    return next(input);
+});
+```
+Use an overlay over the conversation to render your video call. The `show-overlay`-action, as described above, accomplishes this. After the overlay is rendered and ready it will dispatch another event: `overlay-mounted`. Use the HTML element this generates to render your video call.
+```ts
+component.actions.watch('overlay-mounted', (overlayElem, next) => {
+    // the overlayElem here may be used to render the ongoing call
+});
+```
 ### The loading and typing indicators
 When you need to fetch data from external resource you should use the `loading()` function on the `ConversationProvider` to inform the user that something is about to happen. Even in cases when the response is available immediately it gives a better user experience to present a loading indicator for a short while.
@@ -181,7 +264,7 @@ System message in the conversation are sent by using the `print` method on the `
 #### Example
 ```ts
-conversation.print('Hello world!');
+conversation.print([['text', 'Hello world!']]);
 ```
 ## Reading from the conversation

package/dist/components/conversation/ui/loader.d.ts CHANGED Viewed

@@ -4,5 +4,5 @@ declare type Props = {
     className?: string;
     agentData?: ConversationMessageSender;
 };
-declare const ConversationLoader: React.FC<Props>;
+declare const ConversationLoader: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
 export default ConversationLoader;

package/dist/conversation.js CHANGED Viewed

@@ -29,9 +29,9 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-import { Input, Button, borderTabStyle, SymbolBadge, useDispatch, useProperties, useScroll, Typography, invertedHoverButton, List, buttonCss, Html as Html$1, genericHtml, Lightbox, ItemList, itemList, useComponent, list, headingElement, usePrevious, useTransitionEnd, WidgetOverlayOutlet } from "@telia-ace/widget-ui";
+import { Input, Button, borderTabStyle, SymbolBadge, useDispatch, useProperties, useScroll, Typography, invertedHoverButton, List, buttonCss, Html as Html$1, genericHtml, ItemList, itemList, useComponent, list, headingElement, WidgetOverlayOutlet } from "@telia-ace/widget-ui";
 import { appendClassNames, uuid } from "@telia-ace/widget-utilities";
-import React, { useState, useEffect, Suspense, useMemo, useCallback, useRef } from "react";
+import React, { useState, useEffect, forwardRef, Suspense, useMemo, useCallback, useRef } from "react";
 import styled, { css, keyframes } from "styled-components";
 import { FormComponent } from "@telia-ace/widget-forms";
 import { ConversationMessageListItemType, ConversationMessageType } from "./index.js";
@@ -334,6 +334,10 @@ const LoaderAnimation = keyframes`
 const Loader = styled.div`
     display: flex;
     justify-content: center;
+    padding: 0 0 ${(p) => {
+  var _a;
+  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
+}};
     > div {
         height: 10px;
         width: 10px;
@@ -355,6 +359,7 @@ const Loader = styled.div`
 const ContentBundle = styled.div`
     grid-area: content;
     max-width: 100%;
+    overflow: hidden;
 `;
 const MessageTitle = styled(Typography)`
     font-size: ${(p) => {
@@ -544,21 +549,14 @@ const StyledActionButton = styled.button`
 }}
     }
 `;
-const ConversationLoader = ({ className, agentData }) => {
-  return /* @__PURE__ */ React.createElement(ContentBundle, null, /* @__PURE__ */ React.createElement(MessageContainer, null, /* @__PURE__ */ React.createElement(MessageContent, null, /* @__PURE__ */ React.createElement(Loader, null, /* @__PURE__ */ React.createElement("div", null), /* @__PURE__ */ React.createElement("div", null), /* @__PURE__ */ React.createElement("div", null)))));
-};
-const imageLightboxRenderer = (attrs) => /* @__PURE__ */ React.createElement(Lightbox, {
-  attrs
+const ConversationLoader = forwardRef(({ className, agentData }, ref) => {
+  return /* @__PURE__ */ React.createElement(ContentBundle, {
+    ref
+  }, /* @__PURE__ */ React.createElement(MessageContainer, null, /* @__PURE__ */ React.createElement(MessageContent, null, /* @__PURE__ */ React.createElement(Loader, null, /* @__PURE__ */ React.createElement("div", null), /* @__PURE__ */ React.createElement("div", null), /* @__PURE__ */ React.createElement("div", null)))));
 });
-const htmlParseInstructions = {
-  transform: {
-    img: imageLightboxRenderer
-  }
-};
 const Html = ({ body }) => {
   return /* @__PURE__ */ React.createElement(StyledHtml, {
-    html: body,
-    htmlParseInstruction: htmlParseInstructions
+    html: body
   });
 };
 const StyledHtml = styled(Html$1)`
@@ -835,6 +833,9 @@ const StyledLinkButton = styled(Button)`
   var _a;
   return (_a = p.theme.colors) == null ? void 0 : _a.primary;
 }};
+    max-width: 100%;
+    text-overflow: ellipsis;
+    overflow: hidden;
     ${(p) => {
   var _a, _b;
@@ -1149,56 +1150,31 @@ const Message = ({ content, isUser, stacked }) => {
   }));
 };
 const ConversationContent = () => {
-  const lastEntry = useRef(document.createElement("div"));
+  const lastEntry = useRef(null);
   const [scrollableCss, viewElem] = useScroll(true);
   const { messages, loading, typingActors } = useProperties();
-  const [canSmooth, setCanSmooth] = useState(false);
-  const previousMessages = usePrevious(messages);
-  const previousTypingActors = usePrevious(typingActors);
-  const scrollView = useCallback((lastEntry2, smooth = true) => {
-    if (lastEntry2 !== null && lastEntry2.current !== null) {
-      if (messages && messages.length === 1) {
-        lastEntry2.current.focus();
-      }
-      if (lastEntry2.current.id.indexOf("typing_") !== -1 && viewElem.current.scrollTopMax - viewElem.current.scrollTop > lastEntry2.current.clientHeight + 100) {
-        return;
-      }
-      setTimeout(() => {
-        if (lastEntry2.current) {
-          lastEntry2.current.scrollIntoView({
-            block: "end",
-            behavior: smooth ? "smooth" : "auto"
-          });
-        }
-      }, 150);
+  const scrollView = useCallback(() => {
+    if (lastEntry.current) {
+      lastEntry.current.scrollIntoView({
+        block: "end",
+        behavior: "smooth"
+      });
     }
   }, [lastEntry]);
   useEffect(() => {
-    if (canSmooth) {
-      const messageCountChanged = messages.length !== (previousMessages == null ? void 0 : previousMessages.length);
-      const typingActorCountChanged = typingActors.length !== (previousTypingActors == null ? void 0 : previousTypingActors.length);
-      const messageContentCountChanged = messages.reduce((changed, message, index) => {
-        var _a;
-        if (((_a = previousMessages == null ? void 0 : previousMessages[index]) == null ? void 0 : _a.content.length) !== message.content.length) {
-          return true;
-        }
-        return changed;
-      }, false);
-      if (messageCountChanged || messageContentCountChanged || typingActorCountChanged) {
-        scrollView(lastEntry);
-      }
-    }
+    const handler = setTimeout(scrollView, 250);
+    return () => clearTimeout(handler);
   }, [messages, typingActors]);
-  useTransitionEnd(() => {
-    setCanSmooth(true);
-    scrollView(lastEntry, false);
-  });
+  const isLoadingOrTyping = useMemo(() => {
+    return !!typingActors.length || loading;
+  }, [typingActors, loading]);
   const renderTypingActors = () => {
     if (typingActors && typingActors.length) {
       return typingActors.map((actor, index) => {
+        const isLast = index === typingActors.length - 1;
         return /* @__PURE__ */ React.createElement(MessageEntry, {
           id: `typing_${actor.name}`,
-          ref: typingActors.length ? lastEntry : null,
+          ref: loading ? null : isLast ? lastEntry : null,
           key: `typing_${actor.name}`
         }, /* @__PURE__ */ React.createElement(AgentMessage, {
           timestamp: Date.now(),
@@ -1214,13 +1190,16 @@ const ConversationContent = () => {
     ref: viewElem
   }, messages && messages.length ? messages.map((message, index) => {
     const { type, timestamp, sender, content } = message;
+    const isLast = index === messages.length - 1;
     return /* @__PURE__ */ React.createElement(MessageEntry, {
       className: "humany-conversation-entry",
       tabIndex: -1,
       key: `${type}_${sender == null ? void 0 : sender.name}_${timestamp}_${content[0].key}`,
-      ref: index + 1 < messages.length ? null : typingActors.length ? null : lastEntry
+      ref: isLoadingOrTyping ? null : isLast ? lastEntry : null
     }, /* @__PURE__ */ React.createElement(ConversationMessage, __spreadValues({}, message)));
-  }) : null, renderTypingActors(), loading && /* @__PURE__ */ React.createElement(MessageEntry, null, /* @__PURE__ */ React.createElement(ConversationLoader, null))), /* @__PURE__ */ React.createElement(ConversationInput, null));
+  }) : null, renderTypingActors(), loading && /* @__PURE__ */ React.createElement(MessageEntry, null, /* @__PURE__ */ React.createElement(ConversationLoader, {
+    ref: lastEntry
+  }))), /* @__PURE__ */ React.createElement(ConversationInput, null));
 };
 const Scrollable = styled.div`
     display: flex;

package/dist/conversation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"conversation.js","sources":["../src/components/conversation/ui/input.tsx","../src/components/conversation/ui/styles.tsx","../src/components/conversation/ui/loader.tsx","../src/components/conversation/ui/message-list-items/html.tsx","../src/components/conversation/ui/message-types/timestamp.tsx","../src/components/conversation/ui/message-types/agent.tsx","../src/components/conversation/ui/message-types/system.tsx","../src/components/conversation/ui/message-types/user.tsx","../src/utils/map-actions.ts","../src/components/conversation/ui/message-list-items/button-list.tsx","../src/components/conversation/ui/message-list-items/custom.tsx","../src/components/conversation/ui/message-list-items/link-list.tsx","../src/components/conversation/ui/message-list-items/separator.tsx","../src/components/conversation/ui/message-list-items/text.tsx","../src/components/conversation/ui/message-list-items/video-request.tsx","../src/components/conversation/ui/message-types/message-list.tsx","../src/components/conversation/ui/message.tsx","../src/components/conversation/ui/content.tsx","../src/components/conversation/ui/overlay-outlets.tsx","../src/components/conversation/conversation.tsx"],"sourcesContent":["import {\r\n borderTabStyle,\r\n Button,\r\n Input,\r\n SymbolBadge,\r\n useDispatch,\r\n useProperties,\r\n useScroll,\r\n} from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React, { useEffect, useState } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { ConversationComponentProperties } from '../plugin';\r\n\r\ntype Props = {\r\n className?: string;\r\n};\r\n\r\nconst ConversationInput: React.FC<Props> = ({ className }) => {\r\n const [inputText, setInputText] = useState('');\r\n const [inputFocus, setInputFocus] = useState(false);\r\n const [calculatedLineHeight, setCalculatedLineHeight] = useState(0);\r\n const [textareaMaxHeight, setTextareaMaxHeight] = useState(0);\r\n const dispatch = useDispatch();\r\n const {\r\n inputPlaceholder = 'Type your message',\r\n inputHidden = false,\r\n inputDisabled = false,\r\n sendButtonLabel = 'Send message',\r\n inputMultiline: multiline = true,\r\n secondaryAction,\r\n } = useProperties<ConversationComponentProperties>();\r\n const [scrollableCss, inputRef] = useScroll(true);\r\n\r\n useEffect(() => {\r\n if (inputRef.current) {\r\n const { lineHeight, maxHeight } = getComputedStyle(inputRef.current);\r\n if (lineHeight && lineHeight.indexOf('px') > -1) {\r\n const lineHeightNumber = lineHeight.split('px');\r\n const calcLH = parseInt(lineHeightNumber[0], 10);\r\n setCalculatedLineHeight(calcLH);\r\n const maxHeightNumber = maxHeight.split('px');\r\n setTextareaMaxHeight(parseInt(maxHeightNumber[0], 10));\r\n }\r\n }\r\n }, [inputRef.current]);\r\n\r\n const submit = (e: any) => {\r\n if (!e.shiftKey \|\| !multiline) {\r\n e.preventDefault();\r\n if (inputText && inputText.length > 0) {\r\n dispatch('user-submit', { text: inputText });\r\n setInputText('');\r\n onChange('');\r\n }\r\n } else if (inputText.length < 1) {\r\n e.preventDefault();\r\n }\r\n };\r\n\r\n const onSecondaryActionButtonClick = (e: any) => {\r\n if (!secondaryAction) {\r\n return;\r\n }\r\n e.preventDefault();\r\n dispatch('action', {\r\n actionKey: secondaryAction.action,\r\n ...secondaryAction,\r\n });\r\n };\r\n\r\n const calculateHeight = (value: string) => {\r\n if (multiline && inputRef.current) {\r\n const scrollHeight = inputRef.current.scrollHeight;\r\n if (scrollHeight > calculatedLineHeight) {\r\n inputRef.current.style.height = 'auto';\r\n let areaHeight = scrollHeight;\r\n if (value.length < 1) {\r\n areaHeight = calculatedLineHeight;\r\n }\r\n inputRef.current.style.height = `${areaHeight}px`;\r\n\r\n if (areaHeight >= textareaMaxHeight) {\r\n inputRef.current.style.overflowY = 'scroll';\r\n } else {\r\n inputRef.current.style.overflowY = 'hidden';\r\n }\r\n }\r\n }\r\n };\r\n\r\n const onChange = (value: string) => {\r\n calculateHeight(value);\r\n setInputText(value);\r\n if (value && value.length > 0) {\r\n dispatch('user-typing', { textLength: value.length });\r\n }\r\n };\r\n\r\n if (inputHidden) {\r\n return null;\r\n }\r\n\r\n return (\r\n <Wrapper\r\n grow={multiline}\r\n className={appendClassNames('humany-conversation-input', className)}\r\n data-has-focus={inputFocus}\r\n scrollableCss={scrollableCss}\r\n >\r\n {secondaryAction && (\r\n <SecondaryActionButton\r\n disabled={inputDisabled}\r\n onClick={onSecondaryActionButtonClick}\r\n title={secondaryAction.label}\r\n aria-label={secondaryAction.label}\r\n >\r\n <SymbolBadge\r\n size={24}\r\n symbol={{ type: 'Svg', content: secondaryAction.icon \|\| 'browse' }}\r\n />\r\n </SecondaryActionButton>\r\n )}\r\n {multiline ? (\r\n <StyledTextArea\r\n value={inputText}\r\n onChange={onChange}\r\n onEnter={submit}\r\n disabled={inputDisabled}\r\n aria-label={inputPlaceholder}\r\n placeholder={inputPlaceholder}\r\n onFocusChange={setInputFocus}\r\n type={'textarea'}\r\n rows={1}\r\n ref={inputRef}\r\n />\r\n ) : (\r\n <StyledInput\r\n value={inputText}\r\n onChange={onChange}\r\n onEnter={submit}\r\n disabled={inputDisabled}\r\n aria-label={inputPlaceholder}\r\n placeholder={inputPlaceholder}\r\n onFocusChange={setInputFocus}\r\n />\r\n )}\r\n <StyledButton\r\n disabled={inputDisabled}\r\n onClick={submit}\r\n title={sendButtonLabel}\r\n aria-label={sendButtonLabel}\r\n >\r\n <SendSymbol\r\n size={22}\r\n symbol={{ type: 'Svg', content: 'send' }}\r\n hasContent={inputText && inputText.length}\r\n />\r\n </StyledButton>\r\n </Wrapper>\r\n );\r\n};\r\n\r\nconst StyledTextArea = styled(Input)<any>`\r\n resize: none;\r\n flex: 1;\r\n flex-shrink: 1;\r\n min-height: 1.2em;\r\n max-height: 148px;\r\n line-height: 1.2em;\r\n height: 1.2em;\r\n padding: 0;\r\n margin: calc(${(p) => p.theme.sizes?.small} * 2);\r\n font-size: ${(p) => p.theme.fonts?.normal};\r\n border: none;\r\n transition: height 200ms linear;\r\n outline: none;\r\n`;\r\n\r\nconst StyledInput = styled(Input)<any>`\r\n flex: 1;\r\n border: none;\r\n background-color: transparent;\r\n font-weight: 300;\r\n font-size: ${(p) => p.theme.fonts?.normal};\r\n line-height: 1.2em;\r\n outline: none;\r\n padding-left: ${(p) => p.theme.sizes?.large};\r\n color: ${(p) => p.theme.colors?.text};\r\n &::placeholder {\r\n color: ${(p) => p.theme.colors?.textLight};\r\n font-style: italic;\r\n }\r\n`;\r\n\r\nconst StyledButton = styled(Button)<any>`\r\n flex: 0 0 50px;\r\n align-self: stretch;\r\n background-color: transparent;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border: none;\r\n color: #a6a6a6;\r\n &:focus {\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n }\r\n`;\r\n\r\nconst SecondaryActionButton = styled(StyledButton)`\r\n border-right: ${(p) => p.theme.border};\r\n margin: ${(p) => p.theme.sizes?.normal} 0;\r\n`;\r\n\r\nconst Wrapper = styled.div<{ 'data-has-focus': boolean } & any>`\r\n ${(p) =>\r\n p.grow\r\n ? css`\r\n min-height: 50px;\r\n max-height: 150px;\r\n `\r\n : css`\r\n height: 50px;\r\n `}\r\n flex: 0 0 auto;\r\n display: flex;\r\n align-items: center;\r\n background-color: ${(p) => p.theme.colors?.accent};\r\n border-top: ${(p) => p.theme.inputBorder};\r\n ${(p) =>\r\n p['data-has-focus'] &&\r\n css`\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n `}\r\n ${StyledTextArea} {\r\n ${(p) => !!p.scrollableCss && p.scrollableCss}\r\n }\r\n`;\r\n\r\nconst SendSymbol = styled(({ hasContent, ...other }) => <SymbolBadge {...other} />)`\r\n line,\r\n path {\r\n stroke: ${(p) => (p.hasContent ? p.theme.colors?.primary : '#a6a6a6')};\r\n fill: ${(p) => (p.hasContent ? p.theme.colors?.primary : '#a6a6a6')};\r\n }\r\n`;\r\n\r\nexport default ConversationInput;\r\n","import { FormComponent } from '@telia-ace/widget-forms';\r\nimport {\r\n borderTabStyle,\r\n buttonCss,\r\n invertedHoverButton,\r\n List,\r\n Typography,\r\n} from '@telia-ace/widget-ui';\r\nimport styled, { css, keyframes } from 'styled-components';\r\n\r\nexport const Avatar = styled.div<any>`\r\n width: ${(p) => p.avatarSize \|\| '32px'};\r\n height: ${(p) => p.avatarSize \|\| '32px'};\r\n border-radius: 50%;\r\n background-color: ${(p) => p.theme.colors?.accent};\r\n border: ${(p) => p.theme.border};\r\n grid-area: avatar;\r\n align-self: flex-end;\r\n justify-self: center;\r\n overflow: hidden;\r\n margin-right: ${(p) => p.theme.sizes?.normal};\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n color: ${(p) => p.theme.colors?.text};\r\n\r\n > img {\r\n height: 100%;\r\n width: 100%;\r\n object-fit: cover;\r\n }\r\n\r\n > svg {\r\n width: 90%;\r\n height: 90%;\r\n padding: 10%;\r\n color: ${(p) => p.theme.colors?.text};\r\n\r\n line,\r\n path,\r\n circle,\r\n fill {\r\n stroke: ${(p) => p.theme.colors?.text};\r\n }\r\n }\r\n`;\r\n\r\nexport const LoaderAnimation = keyframes`\r\n 0% {\r\n opacity: 0;\r\n }\r\n 75% {\r\n opacity: 1;\r\n }\r\n 100% {\r\n opacity: 0;\r\n }\r\n`;\r\n\r\nexport const Loader = styled.div`\r\n display: flex;\r\n justify-content: center;\r\n > div {\r\n height: 10px;\r\n width: 10px;\r\n border-radius: 50%;\r\n margin: 5px;\r\n background-color: ${(p) => p.theme.colors?.text};\r\n animation: ${LoaderAnimation} 1s infinite;\r\n }\r\n > div:nth-child(2) {\r\n animation-delay: 100ms;\r\n }\r\n > div:nth-child(3) {\r\n animation-delay: 200ms;\r\n }\r\n`;\r\n\r\nexport const ContentBundle = styled.div`\r\n grid-area: content;\r\n max-width: 100%;\r\n`;\r\n\r\nexport const MessageTitle = styled(Typography)`\r\n font-size: ${(p) => p.theme.fonts?.normal};\r\n font-weight: normal;\r\n margin: 0;\r\n`;\r\n\r\nexport const MessageContainer = styled.div<{ user?: boolean }>`\r\n display: flex;\r\n justify-content: ${(p) => (p.user ? 'end' : 'start')};\r\n`;\r\n\r\nexport type Stacked = 'first' \| 'last' \| 'middle';\r\n\r\nexport const MessageContent = styled.div<{\r\n user?: boolean;\r\n fullWidth?: boolean;\r\n stacked?: Stacked;\r\n}>`\r\n ${(p) => !p.user && p.stacked && nonUserMessageStyling(p.stacked, p.theme)}\r\n ${(p) => p.user && p.stacked && userMessageStyling(p.stacked, p.theme)}\r\n\r\n display: inline-block;\r\n margin-top: ${(p) => p.theme.sizes?.normal};\r\n && > * {\r\n overflow-wrap: break-word;\r\n word-wrap: break-word;\r\n word-break: break-all;\r\n word-break: break-word;\r\n hyphens: auto;\r\n }\r\n max-width: 100%;\r\n ${(p) => p.fullWidth && 'width: 100%;'}\r\n`;\r\n\r\nconst nonUserMessageStyling = (stacked: Stacked, theme: any) => {\r\n const colors = css`\r\n background-color: ${theme.colors?.accent};\r\n color: ${theme.colors?.text};\r\n ${theme.border && `border: ${theme.border};`};\r\n `;\r\n\r\n if (!theme.borderRadius) {\r\n return colors;\r\n }\r\n\r\n return css`\r\n ${colors}\r\n\r\n border-top-right-radius: ${theme.borderRadius};\r\n border-bottom-right-radius: ${theme.borderRadius};\r\n\r\n ${stacked === 'first' &&\r\n `\r\n border-top-left-radius: ${theme.borderRadius};\r\n `}\r\n\r\n ${stacked === 'last' &&\r\n `\r\n border-bottom-left-radius: ${theme.borderRadius};\r\n `}\r\n `;\r\n};\r\n\r\nconst userMessageStyling = (stacked: Stacked, theme: any) => {\r\n const colors = css`\r\n background-color: ${theme.colors?.primary};\r\n color: ${theme.colors?.accent};\r\n `;\r\n\r\n if (!theme.borderRadius) {\r\n return colors;\r\n }\r\n\r\n return css`\r\n ${colors}\r\n\r\n border-top-left-radius: ${theme.borderRadius};\r\n border-bottom-left-radius: ${theme.borderRadius};\r\n\r\n ${stacked === 'first' &&\r\n `\r\n border-top-right-radius: ${theme.borderRadius};\r\n `}\r\n\r\n ${stacked === 'last' &&\r\n `\r\n border-bottom-right-radius: ${theme.borderRadius};\r\n `}\r\n `;\r\n};\r\n\r\nexport const MessageContentPart = styled.div`\r\n margin-bottom: ${(p) => p.theme.sizes?.normal};\r\n &:last-child {\r\n margin-bottom: 0;\r\n }\r\n`;\r\n\r\nexport const messageContentPadding = css`\r\n margin: ${(p) => p.theme.sizes?.normal} 0;\r\n padding: 0 ${(p) => p.theme.sizes?.normal};\r\n`;\r\n\r\nexport const StyledForm = styled(FormComponent)`\r\n margin: ${(p) => p.theme.sizes?.medium} 0;\r\n padding: 0 ${(p) => p.theme.sizes?.medium};\r\n & button.humany-form-component-button {\r\n ${(p) =>\r\n invertedHoverButton({\r\n active: false,\r\n primaryColor: p.theme.colors?.primary,\r\n secondaryColor: p.theme.colors?.accent,\r\n })};\r\n display: block;\r\n width: 100%;\r\n margin-bottom: ${(p) => p.theme.sizes?.normal};\r\n }\r\n & button.humany-form-component-submit {\r\n width: 100%;\r\n margin: 0;\r\n :not(:last-child) {\r\n margin-bottom: ${(p) => p.theme.sizes?.normal};\r\n }\r\n }\r\n`;\r\n\r\nexport const StyledActionList = styled(List)`\r\n padding: 0;\r\n list-style: none;\r\n button {\r\n font-size: inherit;\r\n }\r\n margin: ${(p) => p.theme.sizes?.medium} 0;\r\n padding: 0 ${(p) => p.theme.sizes?.medium};\r\n display: flex;\r\n gap: ${(p) => p.theme.sizes?.normal};\r\n`;\r\n\r\nexport const StyledActionButton = styled.button`\r\n ${buttonCss};\r\n display: block;\r\n background-color: ${(p) => p.theme.colors?.primary};\r\n width: 100%;\r\n color: #fff;\r\n margin: ${(p) => p.theme.sizes?.medium} 0;\r\n padding: 0 ${(p) => p.theme.sizes?.medium};\r\n font-family: Lato;\r\n font-size: ${(p) => p.theme.fonts?.huge};\r\n font-weight: 300;\r\n &:focus {\r\n ${(p) =>\r\n p.theme.accessibility?.isTabbing &&\r\n css`\r\n ${borderTabStyle}\r\n background-color: transparent;\r\n `}\r\n }\r\n`;\r\n","import React from 'react';\r\nimport { ConversationMessageSender } from '../../../types';\r\nimport { ContentBundle, Loader, MessageContainer, MessageContent } from './styles';\r\n\r\ntype Props = {\r\n className?: string;\r\n agentData?: ConversationMessageSender;\r\n};\r\n\r\nconst ConversationLoader: React.FC<Props> = ({ className, agentData }) => {\r\n return (\r\n <ContentBundle>\r\n <MessageContainer>\r\n <MessageContent>\r\n <Loader>\r\n <div />\r\n <div />\r\n <div />\r\n </Loader>\r\n </MessageContent>\r\n </MessageContainer>\r\n </ContentBundle>\r\n );\r\n};\r\n\r\nexport default ConversationLoader;\r\n","import { borderTabStyle, genericHtml, Html as UiHtml, Lightbox } from '@telia-ace/widget-ui';\r\nimport React, { FC } from 'react';\r\nimport styled from 'styled-components';\r\nimport { HtmlProperties } from '../../../../types';\r\nimport { messageContentPadding } from '../styles';\r\n\r\nconst imageLightboxRenderer = (\r\n attrs: React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLImageElement>, HTMLImageElement>\r\n) => <Lightbox attrs={attrs} />;\r\n\r\nconst htmlParseInstructions = {\r\n transform: {\r\n img: imageLightboxRenderer,\r\n },\r\n};\r\n\r\ntype Props = HtmlProperties;\r\n\r\nexport const Html: FC<Props> = ({ body }) => {\r\n return <StyledHtml html={body} htmlParseInstruction={htmlParseInstructions} />;\r\n};\r\n\r\nconst StyledHtml = styled(UiHtml)<any>`\r\n ${genericHtml}\r\n color: inherit;\r\n white-space: pre-wrap;\r\n ${messageContentPadding}\r\n a {\r\n color: ${(p) => p.theme.colors.link};\r\n &:focus {\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n }\r\n }\r\n`;\r\n","import React from 'react';\r\nimport styled from 'styled-components';\r\n\r\ntype Props = {\r\n className?: string;\r\n name?: string;\r\n timestamp?: number \| null;\r\n};\r\n\r\nconst StyledTimestamp = styled.p`\r\n && {\r\n font-size: ${(p) => p.theme.fonts?.small};\r\n font-weight: 300;\r\n }\r\n padding-top: ${(p) => p.theme.sizes?.small};\r\n margin: 0;\r\n line-height: 1.5em;\r\n grid-area: info;\r\n color: ${(p) => p.theme.colors?.text};\r\n`;\r\n\r\nconst getTimestamp = (raw: number) => {\r\n return new Date(raw).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });\r\n};\r\n\r\nconst Timestamp: React.FC<Props> = ({ className, name, timestamp }) => {\r\n if (!name && !timestamp) {\r\n return null;\r\n }\r\n\r\n let output = '';\r\n if (name) {\r\n if (timestamp) {\r\n output = `${name}: ${getTimestamp(timestamp)}`;\r\n } else {\r\n output = name;\r\n }\r\n } else if (timestamp) {\r\n output = getTimestamp(timestamp);\r\n }\r\n\r\n return <StyledTimestamp>{output}</StyledTimestamp>;\r\n};\r\n\r\nexport default Timestamp;\r\n","import { SymbolBadge, useProperties } from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { ConversationMessageSender } from '../../../../types';\r\nimport { ConversationComponentProperties } from '../../plugin';\r\nimport { Avatar } from '../styles';\r\nimport Timestamp from './timestamp';\r\n\r\ntype Props = {\r\n className?: string;\r\n children: any;\r\n sender: ConversationMessageSender;\r\n timestamp: number \| null;\r\n};\r\n\r\nconst AgentMessage: React.FC<Props> = ({ className, children, sender, timestamp }) => {\r\n const { avatar, name } = sender;\r\n const { avatarSize } = useProperties<ConversationComponentProperties>();\r\n\r\n return (\r\n <StyledAgentMessage\r\n hasAvatar={!!avatar}\r\n className={appendClassNames(className, 'humany-conversation-agent-message')}\r\n >\r\n {avatar && (\r\n <Avatar avatarSize={avatarSize}>\r\n {typeof avatar === 'string' ? (\r\n <img src={avatar} />\r\n ) : (\r\n <SymbolBadge symbol={avatar} />\r\n )}\r\n </Avatar>\r\n )}\r\n {children}\r\n <Timestamp name={name} timestamp={timestamp}></Timestamp>\r\n </StyledAgentMessage>\r\n );\r\n};\r\n\r\nexport const StyledAgentMessage = styled.div<any>`\r\n display: grid;\r\n margin-right: 10%;\r\n width: 90%;\r\n ${(p) =>\r\n p.hasAvatar\r\n ? css`\r\n grid-template-columns: auto 1fr;\r\n grid-template-rows: 1fr auto;\r\n grid-template-areas:\r\n 'avatar content'\r\n '. info';\r\n `\r\n : css`\r\n grid-template-columns: 1fr;\r\n grid-template-rows: 1fr auto;\r\n grid-template-areas:\r\n 'content'\r\n 'info';\r\n `};\r\n`;\r\n\r\nexport default AgentMessage;\r\n","import { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled from 'styled-components';\r\nimport Timestamp from './timestamp';\r\n\r\nexport type Props = {\r\n className?: string;\r\n timestamp: number;\r\n discrete?: boolean;\r\n fullWidth?: boolean;\r\n children: any;\r\n};\r\n\r\nconst SystemMessage: React.FC<Props> = ({\r\n className,\r\n children,\r\n timestamp,\r\n discrete,\r\n fullWidth,\r\n}) => {\r\n return (\r\n <StyledSystemMessage\r\n className={appendClassNames(className, 'humany-conversation-system-message')}\r\n fullWidth={fullWidth}\r\n >\r\n {discrete ? (\r\n <Discrete className=\"humany-conversation-discrete-message\">\r\n {children}\r\n <Timestamp timestamp={timestamp}></Timestamp>\r\n </Discrete>\r\n ) : (\r\n <>\r\n {children}\r\n <Timestamp timestamp={timestamp}></Timestamp>\r\n </>\r\n )}\r\n </StyledSystemMessage>\r\n );\r\n};\r\n\r\nexport const StyledSystemMessage = styled.div<any>`\r\n ${(p) => p.fullWidth && 'width: 100%'};\r\n padding: 0 ${(p) => p.theme.sizes?.large};\r\n overflow: auto;\r\n`;\r\n\r\nexport const Discrete = styled.div`\r\n text-align: center;\r\n word-wrap: break-word;\r\n font-size: ${(p) => p.theme.fonts?.normal};\r\n color: ${(p) => p.theme.colors?.text};\r\n > p {\r\n margin: 0;\r\n }\r\n`;\r\n\r\nexport default SystemMessage;\r\n","import { useProperties } from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled from 'styled-components';\r\nimport { ConversationComponentProperties } from '../../plugin';\r\nimport Timestamp from './timestamp';\r\n\r\nexport type Props = {\r\n className?: string;\r\n timestamp: number;\r\n children: any;\r\n};\r\n\r\nconst UserMessage: React.FC<Props> = ({ className, children, timestamp }) => {\r\n const { userLabel = '' } = useProperties<ConversationComponentProperties>();\r\n return (\r\n <StyledUserMessage\r\n className={appendClassNames(className, 'humany-conversation-user-message')}\r\n >\r\n {children}\r\n <Timestamp name={userLabel} timestamp={timestamp}></Timestamp>\r\n </StyledUserMessage>\r\n );\r\n};\r\n\r\nconst StyledUserMessage = styled.div`\r\n margin-left: 10%;\r\n width: 90%;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-end;\r\n`;\r\n\r\nexport default UserMessage;\r\n","export const mapActions = (actions: any) =>\r\n Array.isArray(actions)\r\n ? actions\r\n : Object.keys(actions).map((i) => {\r\n return {\r\n label: actions[i],\r\n actionKey: i,\r\n };\r\n });\r\n","import {\r\n borderTabStyle,\r\n Button,\r\n buttonCss,\r\n DispatchAction,\r\n ItemList,\r\n itemList,\r\n SymbolBadge,\r\n} from '@telia-ace/widget-ui';\r\nimport React, { FC } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { ButtonListProperties } from '../../../../types';\r\nimport { mapActions } from '../../../../utils/map-actions';\r\nimport { messageContentPadding } from '../styles';\r\n\r\ntype Props = { dispatch: DispatchAction } & ButtonListProperties;\r\n\r\nexport const ButtonList: FC<Props> = ({ header, actions, dispatch }) => {\r\n return (\r\n <StyledButtonList\r\n header={header}\r\n items={mapActions(actions)}\r\n renderItem={(item: any) => {\r\n return (\r\n <li key={item.actionKey}>\r\n <StyledButtonListButton\r\n onClick={() => {\r\n dispatch('action', item);\r\n }}\r\n aria-label={item.label}\r\n title={item.label}\r\n >\r\n <SymbolBadge symbol={item.symbol} />\r\n {item.label}\r\n </StyledButtonListButton>\r\n </li>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\n\r\nconst StyledButtonList = styled(ItemList)`\r\n ${itemList}\r\n > ul {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: ${(p) => p.theme.sizes?.normal};\r\n > li {\r\n margin: 0;\r\n }\r\n }\r\n ${messageContentPadding}\r\n`;\r\n\r\nconst StyledButtonListButton = styled(Button)`\r\n ${buttonCss};\r\n\r\n display: block;\r\n padding: ${(p) => p.theme.sizes?.normal};\r\n background-color: ${(p) => p.theme.colors?.primary};\r\n width: 100%;\r\n color: #ffffff;\r\n &:focus {\r\n ${(p) =>\r\n p.theme.accessibility?.isTabbing &&\r\n css`\r\n ${borderTabStyle}\r\n background-color: transparent;\r\n `}\r\n }\r\n\r\n i,\r\n svg {\r\n margin-right: ${(p) => p.theme.sizes?.small};\r\n }\r\n`;\r\n","import { useComponent } from '@telia-ace/widget-ui';\r\nimport React, { Suspense } from 'react';\r\n\r\ntype Props = {\r\n type: string;\r\n content?: { [key: string]: any };\r\n};\r\nexport const Custom: React.FC<Props> = ({ type, content = {} }) => {\r\n const Component = useComponent(type);\r\n\r\n if (!Component \|\| !type) {\r\n return null;\r\n }\r\n return (\r\n <Suspense fallback={null}>\r\n <Component {...content} />\r\n </Suspense>\r\n );\r\n};\r\n","import {\r\n borderTabStyle,\r\n Button,\r\n DispatchAction,\r\n itemList,\r\n ItemList,\r\n SymbolBadge,\r\n} from '@telia-ace/widget-ui';\r\nimport React, { FC } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { LinkListProperties } from '../../../../types';\r\nimport { mapActions } from '../../../../utils/map-actions';\r\nimport { messageContentPadding } from '../styles';\r\n\r\ntype Props = { dispatch: DispatchAction } & LinkListProperties;\r\n\r\nexport const LinkList: FC<Props> = ({ header, actions, dispatch }) => {\r\n return (\r\n <StyledLinkList\r\n header={header}\r\n items={mapActions(actions)}\r\n renderItem={(item: any) => {\r\n return (\r\n <li key={item.actionKey}>\r\n <StyledLinkButton\r\n help={item.actionKey === 'help'}\r\n onClick={() => {\r\n dispatch('action', item);\r\n }}\r\n aria-label={item.label}\r\n title={item.label}\r\n >\r\n {item.label}\r\n {item.actionKey === 'help' && (\r\n <SymbolBadge\r\n size={14}\r\n symbol={{\r\n type: 'Svg',\r\n content: 'caret-down',\r\n }}\r\n />\r\n )}\r\n </StyledLinkButton>\r\n </li>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nconst StyledLinkList = styled(ItemList)`\r\n ${itemList}\r\n ${messageContentPadding}\r\n > ul {\r\n display: flex;\r\n flex-direction: column;\r\n gap: ${(p) => p.theme.sizes?.normal};\r\n > li {\r\n margin: 0;\r\n }\r\n }\r\n`;\r\n\r\nconst StyledLinkButton = styled(Button)<{ help: boolean }>`\r\n display: block;\r\n text-align: left;\r\n font-weight: 300;\r\n color: ${(p) => p.theme.colors?.primary};\r\n\r\n ${(p) =>\r\n p.help &&\r\n css`\r\n color: ${p.theme.colors?.text};\r\n text-decoration: underline;\r\n\r\n i,\r\n svg {\r\n margin-left: ${p.theme.sizes?.small};\r\n }\r\n `}\r\n\r\n &:focus {\r\n ${(p) =>\r\n p.theme.accessibility?.isTabbing &&\r\n css`\r\n ${borderTabStyle}\r\n span {\r\n color: ${p.theme.colors?.primary};\r\n text-decoration: underline;\r\n }\r\n `};\r\n }\r\n`;\r\n","import React, { FC } from 'react';\r\nimport styled from 'styled-components';\r\n\r\nexport const Separator: FC = () => {\r\n return <StyledSeparator />;\r\n};\r\n\r\nconst StyledSeparator = styled.div`\r\n ${(p) => p.theme.border && `border-bottom: ${p.theme.border};`}\r\n width: 100%;\r\n`;\r\n","import { Typography } from '@telia-ace/widget-ui';\r\nimport React, { FC } from 'react';\r\nimport styled from 'styled-components';\r\nimport { messageContentPadding } from '../styles';\r\n\r\ntype Props = { text: string };\r\n\r\nexport const Text: FC<Props> = ({ text }) => {\r\n return <StyledTypography variant=\"span\">{text}</StyledTypography>;\r\n};\r\n\r\nconst StyledTypography = styled(Typography)`\r\n ${messageContentPadding}\r\n`;\r\n","import {\r\n borderTabStyle,\r\n Button,\r\n buttonCss,\r\n DispatchAction,\r\n ItemList,\r\n itemList,\r\n SymbolBadge,\r\n} from '@telia-ace/widget-ui';\r\nimport React, { FC, useMemo } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { VideoRequestProperties } from '../../../../types';\r\nimport { messageContentPadding } from '../styles';\r\n\r\ntype Props = { dispatch: DispatchAction } & VideoRequestProperties;\r\n\r\nexport const VideoRequest: FC<Props> = ({\r\n header = 'Video call',\r\n acceptLabel = 'Accept',\r\n declineLabel = 'Decline',\r\n dispatch,\r\n}) => {\r\n const actions = useMemo(() => {\r\n return [\r\n {\r\n label: acceptLabel,\r\n actionKey: 'accept-video-call',\r\n symbol: {\r\n type: 'Svg',\r\n content: 'video',\r\n },\r\n },\r\n {\r\n label: declineLabel,\r\n actionKey: 'decline-video-call',\r\n symbol: {\r\n type: 'Svg',\r\n content: 'close',\r\n },\r\n },\r\n ];\r\n }, [acceptLabel, declineLabel]);\r\n return (\r\n <StyledItemList\r\n header={header}\r\n items={actions}\r\n renderItem={(item: any) => {\r\n const bgColor = item.actionKey === 'accept-video-call' ? '#70c48e' : '#da5c85';\r\n return (\r\n <li key={item.actionKey}>\r\n <StyledButton\r\n onClick={() => {\r\n dispatch('action', item);\r\n }}\r\n aria-label={item.label}\r\n title={item.label}\r\n bgColor={bgColor}\r\n >\r\n <SymbolBadge symbol={item.symbol} size={25} />\r\n </StyledButton>\r\n </li>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\n\r\nconst StyledItemList = styled(ItemList)`\r\n ${itemList}\r\n > ul {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: ${(p) => p.theme.sizes?.normal};\r\n > li {\r\n margin: 0;\r\n }\r\n }\r\n ${messageContentPadding}\r\n`;\r\n\r\nconst StyledButton = styled(Button)<{ bgColor: string }>`\r\n ${buttonCss};\r\n\r\n background-color: ${(p) => p.bgColor};\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n color: #ffffff;\r\n width: 46px;\r\n height: 46px;\r\n border-radius: 100%;\r\n\r\n &:focus {\r\n ${(p) =>\r\n p.theme.accessibility?.isTabbing &&\r\n css`\r\n ${borderTabStyle}\r\n background-color: transparent;\r\n\r\n i,\r\n svg {\r\n color: ${(p) => p.theme.colors?.primary};\r\n\r\n path {\r\n stroke: ${(p) => p.theme.colors?.primary};\r\n }\r\n }\r\n `}\r\n }\r\n\r\n i,\r\n svg {\r\n color: #fff;\r\n\r\n path {\r\n stroke: #fff;\r\n }\r\n }\r\n`;\r\n","import React, { FC } from 'react';\r\n\r\nimport { DispatchAction, List, list } from '@telia-ace/widget-ui';\r\nimport { uuid } from '@telia-ace/widget-utilities';\r\nimport styled from 'styled-components';\r\nimport { ConversationMessageListItemType, ConverstationMessageItem } from '../../../../types';\r\nimport { ButtonList } from '../message-list-items/button-list';\r\nimport { Custom } from '../message-list-items/custom';\r\nimport { Html } from '../message-list-items/html';\r\nimport { LinkList } from '../message-list-items/link-list';\r\nimport { Separator } from '../message-list-items/separator';\r\nimport { Text } from '../message-list-items/text';\r\nimport { VideoRequest } from '../message-list-items/video-request';\r\n\r\ntype Props = {\r\n items: ConverstationMessageItem<any>[];\r\n dispatch: DispatchAction;\r\n};\r\n\r\nconst mapItem = ([type, content]: ConverstationMessageItem<any>) => {\r\n return { type, content, id: uuid() };\r\n};\r\n\r\nexport const MessageList: FC<Props> = ({ items, dispatch }) => {\r\n return (\r\n <StyledList\r\n items={items.map(mapItem)}\r\n renderLi\r\n renderItem={(item: any) => {\r\n switch (item.type) {\r\n case ConversationMessageListItemType.Text: {\r\n return <Text text={item.content} />;\r\n }\r\n case ConversationMessageListItemType.HTML: {\r\n return <Html {...item.content} />;\r\n }\r\n case ConversationMessageListItemType.Separator: {\r\n return <Separator {...item.content} />;\r\n }\r\n case ConversationMessageListItemType.LinkList: {\r\n return <LinkList {...item.content} dispatch={dispatch} />;\r\n }\r\n case ConversationMessageListItemType.ButtonList: {\r\n return <ButtonList {...item.content} dispatch={dispatch} />;\r\n }\r\n case ConversationMessageListItemType.VideoRequest: {\r\n return <VideoRequest {...item.content} dispatch={dispatch} />;\r\n }\r\n default: {\r\n return <Custom type={item.type} content={item.content} />;\r\n }\r\n }\r\n }}\r\n />\r\n );\r\n};\r\n\r\nconst StyledList = styled(List)<any>`\r\n ${list}\r\n\r\n > li {\r\n margin: 0;\r\n }\r\n`;\r\n","import { useDispatch } from '@telia-ace/widget-ui';\r\nimport { uuid } from '@telia-ace/widget-utilities';\r\nimport React, { useCallback } from 'react';\r\nimport { ConversationMessageType } from '../../../conversation-controller';\r\nimport { ConversationMessageContent } from '../../../types';\r\nimport { BundledConversationMessage } from '../plugin';\r\nimport { Html } from './message-list-items/html';\r\nimport { AgentMessage, SystemMessage, UserMessage } from './message-types';\r\nimport { MessageList } from './message-types/message-list';\r\nimport {\r\n ContentBundle,\r\n MessageContainer,\r\n MessageContent,\r\n MessageContentPart,\r\n MessageTitle,\r\n Stacked,\r\n StyledActionButton,\r\n StyledActionList,\r\n StyledForm,\r\n} from './styles';\r\n\r\ntype Props = {\r\n className?: string;\r\n} & BundledConversationMessage;\r\n\r\nexport const ConversationMessage: React.FC<Props> = ({\r\n className,\r\n timestamp,\r\n sender,\r\n type,\r\n content,\r\n}) => {\r\n const getMessageStackPosition = useCallback(\r\n (index: number): Stacked => {\r\n let messageOrder: Stacked = 'first';\r\n if (content.length > 1) {\r\n messageOrder =\r\n index === 0 ? 'first' : index + 1 === content.length ? 'last' : 'middle';\r\n }\r\n return messageOrder;\r\n },\r\n [content]\r\n );\r\n\r\n const createSystemMessage = () => {\r\n return (\r\n <>\r\n {content.map((item) => {\r\n const { key, body, title, form, actions } = item;\r\n const discrete = !!body && !title && !form && !actions;\r\n return (\r\n <SystemMessage\r\n className={className}\r\n key={key}\r\n discrete={discrete}\r\n timestamp={timestamp}\r\n fullWidth={!!form \|\| !!actions}\r\n >\r\n {discrete && body ? (\r\n <Html body={body} />\r\n ) : (\r\n <Message content={item} isUser={false} />\r\n )}\r\n </SystemMessage>\r\n );\r\n })}\r\n </>\r\n );\r\n };\r\n\r\n const createAgentMessage = () => {\r\n return (\r\n <AgentMessage sender={sender} timestamp={timestamp} className={className}>\r\n <ContentBundle>\r\n {content.map((item, index) => {\r\n return (\r\n <MessageContainer key={item.key}>\r\n <Message\r\n content={item}\r\n isUser={false}\r\n stacked={getMessageStackPosition(index)}\r\n />\r\n </MessageContainer>\r\n );\r\n })}\r\n </ContentBundle>\r\n </AgentMessage>\r\n );\r\n };\r\n\r\n const createUserMessage = () => {\r\n return (\r\n <UserMessage timestamp={timestamp} className={className}>\r\n <ContentBundle>\r\n {content.map((item, index) => {\r\n return (\r\n <MessageContainer user key={item.key}>\r\n <Message\r\n content={item}\r\n isUser={true}\r\n stacked={getMessageStackPosition(index)}\r\n />\r\n </MessageContainer>\r\n );\r\n })}\r\n </ContentBundle>\r\n </UserMessage>\r\n );\r\n };\r\n\r\n switch (type) {\r\n case ConversationMessageType.System:\r\n return createSystemMessage();\r\n case ConversationMessageType.Agent:\r\n return createAgentMessage();\r\n case ConversationMessageType.User:\r\n return createUserMessage();\r\n default:\r\n return null;\r\n }\r\n};\r\n\r\ntype MessageContentProps = {\r\n className?: string;\r\n content: ConversationMessageContent;\r\n isUser: boolean;\r\n stacked?: Stacked;\r\n CustomComponent?: any;\r\n};\r\n\r\nconst Message: React.FC<MessageContentProps> = ({ content, isUser, stacked }) => {\r\n const dispatch = useDispatch();\r\n const { title, body, actions, form, items } = content;\r\n\r\n return (\r\n <MessageContent user={isUser} stacked={stacked} fullWidth={!!form \|\| !!actions}>\r\n {title && (\r\n <MessageContentPart>\r\n <MessageTitle variant=\"h2\">{title}</MessageTitle>\r\n </MessageContentPart>\r\n )}\r\n {body && (\r\n <MessageContentPart>\r\n <Html body={body} />\r\n </MessageContentPart>\r\n )}\r\n {form && (\r\n <MessageContentPart>\r\n <StyledForm\r\n {...form}\r\n onChange={(key: string, data: any) => {\r\n dispatch('form', {\r\n data,\r\n formKey: form.schema.id,\r\n actionKey: key,\r\n });\r\n }}\r\n />\r\n </MessageContentPart>\r\n )}\r\n {actions && (\r\n <MessageContentPart>\r\n <StyledActionList\r\n items={Object.keys(actions).map((i: any) => {\r\n return { label: actions[i], actionKey: i };\r\n })}\r\n renderItem={(item: any) => {\r\n return (\r\n <li key={item.actionKey}>\r\n <StyledActionButton\r\n onClick={() => {\r\n dispatch('action', item.actionKey);\r\n }}\r\n >\r\n {item.label}\r\n </StyledActionButton>\r\n </li>\r\n );\r\n }}\r\n />\r\n </MessageContentPart>\r\n )}\r\n {items && <MessageList key={uuid()} items={items} dispatch={dispatch} />}\r\n </MessageContent>\r\n );\r\n};\r\n","import {\r\n borderTabStyle,\r\n headingElement,\r\n usePrevious,\r\n useProperties,\r\n useScroll,\r\n useTransitionEnd,\r\n} from '@telia-ace/widget-ui';\r\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { ConversationMessageSender } from '../../../types';\r\nimport { BundledConversationMessage, ConversationComponentProperties } from '../plugin';\r\nimport ConversationInput from './input';\r\nimport ConversationLoader from './loader';\r\nimport { ConversationMessage } from './message';\r\nimport { AgentMessage } from './message-types';\r\n\r\nexport const ConversationContent: React.FC = () => {\r\n const lastEntry = useRef(document.createElement('div'));\r\n const [scrollableCss, viewElem] = useScroll(true);\r\n const { messages, loading, typingActors } = useProperties<ConversationComponentProperties>();\r\n const [canSmooth, setCanSmooth] = useState(false);\r\n const previousMessages = usePrevious(messages);\r\n const previousTypingActors = usePrevious(typingActors);\r\n const scrollView = useCallback(\r\n (lastEntry: any, smooth = true) => {\r\n if (lastEntry !== null && lastEntry.current !== null) {\r\n if (messages && messages.length === 1) {\r\n lastEntry.current.focus();\r\n }\r\n /*\r\n Don't scroll on typing state if the user has scrolled up a bit.\r\n */\r\n if (\r\n lastEntry.current.id.indexOf('typing_') !== -1 &&\r\n viewElem.current.scrollTopMax - viewElem.current.scrollTop >\r\n lastEntry.current.clientHeight + 100\r\n ) {\r\n return;\r\n }\r\n setTimeout(() => {\r\n if (lastEntry.current) {\r\n lastEntry.current.scrollIntoView({\r\n block: 'end',\r\n behavior: smooth ? 'smooth' : 'auto',\r\n });\r\n }\r\n }, 150);\r\n }\r\n },\r\n [lastEntry]\r\n );\r\n\r\n useEffect(() => {\r\n if (canSmooth) {\r\n const messageCountChanged = messages.length !== previousMessages?.length;\r\n const typingActorCountChanged = typingActors.length !== previousTypingActors?.length;\r\n const messageContentCountChanged = messages.reduce<boolean>(\r\n (changed, message, index) => {\r\n if (previousMessages?.[index]?.content.length !== message.content.length) {\r\n return true;\r\n }\r\n return changed;\r\n },\r\n false\r\n );\r\n // only scroll to the last message if there is\r\n // any new content\r\n if (messageCountChanged \|\| messageContentCountChanged \|\| typingActorCountChanged) {\r\n scrollView(lastEntry);\r\n }\r\n }\r\n }, [messages, typingActors]);\r\n\r\n useTransitionEnd(() => {\r\n setCanSmooth(true);\r\n scrollView(lastEntry, false);\r\n });\r\n\r\n const renderTypingActors = () => {\r\n if (typingActors && typingActors.length) {\r\n return typingActors.map((actor: ConversationMessageSender, index) => {\r\n return (\r\n <MessageEntry\r\n id={`typing_${actor.name}`}\r\n ref={typingActors.length ? lastEntry : null}\r\n key={`typing_${actor.name}`}\r\n >\r\n <AgentMessage timestamp={Date.now()} sender={actor}>\r\n <ConversationLoader></ConversationLoader>\r\n </AgentMessage>\r\n </MessageEntry>\r\n );\r\n });\r\n }\r\n return null;\r\n };\r\n\r\n return (\r\n <>\r\n <Scrollable tabIndex={0} scrollableCss={scrollableCss} ref={viewElem}>\r\n {messages && messages.length\r\n ? messages.map((message: BundledConversationMessage, index: any) => {\r\n const { type, timestamp, sender, content } = message;\r\n return (\r\n <MessageEntry\r\n className={'humany-conversation-entry'}\r\n tabIndex={-1}\r\n key={`${type}_${sender?.name}_${timestamp}_${content[0].key}`}\r\n ref={\r\n index + 1 < messages.length\r\n ? null\r\n : typingActors.length\r\n ? null\r\n : lastEntry\r\n }\r\n >\r\n <ConversationMessage {...message} />\r\n </MessageEntry>\r\n );\r\n })\r\n : null}\r\n {renderTypingActors()}\r\n {loading && (\r\n <MessageEntry>\r\n <ConversationLoader />\r\n </MessageEntry>\r\n )}\r\n </Scrollable>\r\n <ConversationInput />\r\n </>\r\n );\r\n};\r\n\r\nconst Scrollable = styled.div<{ scrolling: boolean } & any>`\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\r\n flex: 0 1 100%;\r\n padding: 0 ${(p) => p.theme.sizes?.normal};\r\n ${(p) => !!p.scrollableCss && p.scrollableCss};\r\n &:focus {\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n }\r\n`;\r\n\r\nconst MessageEntry = styled.div`\r\n margin: 0;\r\n margin-bottom: ${(p) => p.theme.sizes?.medium};\r\n\r\n &:first-of-type {\r\n margin-top: ${(p) => p.theme.sizes?.medium};\r\n }\r\n\r\n &:last-of-type {\r\n padding-bottom: ${(p) => p.theme.sizes?.medium};\r\n }\r\n\r\n & span,\r\n p,\r\n a,\r\n div {\r\n font-weight: 300;\r\n }\r\n\r\n & b,\r\n h1 {\r\n font-weight: normal;\r\n }\r\n\r\n ${headingElement(\r\n 'h1',\r\n css`\r\n font-weight: normal;\r\n `\r\n )}\r\n`;\r\n","import {\r\n borderTabStyle,\r\n Button,\r\n DispatchAction,\r\n SymbolBadge,\r\n Typography,\r\n WidgetOverlayOutlet,\r\n} from '@telia-ace/widget-ui';\r\nimport React, { FC, useEffect, useRef } from 'react';\r\nimport styled from 'styled-components';\r\nimport { ConversationContent } from './content';\r\n\r\ntype OverlayOutletProps = {\r\n dispatch: DispatchAction;\r\n};\r\n\r\nexport const OverlayOutlet: FC<OverlayOutletProps> = ({ dispatch }) => {\r\n const wrapperRef = useRef<HTMLDivElement>(null);\r\n\r\n useEffect(() => {\r\n if (wrapperRef.current && wrapperRef.current.parentNode) {\r\n dispatch('overlay-mounted', wrapperRef.current);\r\n }\r\n }, [wrapperRef]);\r\n\r\n return (\r\n <WidgetOverlayOutlet\r\n portalId=\"humany-conversation-overlay-portal\"\r\n className=\"humany-conversation-overlay-outlet\"\r\n ref={wrapperRef}\r\n />\r\n );\r\n};\r\n\r\ntype ConversationOverlayProps = {\r\n dispatch: DispatchAction;\r\n header?: string;\r\n buttonLabel?: string;\r\n};\r\n\r\nexport const ConversationOverlayOutlet: FC<ConversationOverlayProps> = ({\r\n dispatch,\r\n header,\r\n buttonLabel,\r\n}) => {\r\n return (\r\n <StyledWidgetOverlayOutlet\r\n portalId=\"humany-conversation-portal\"\r\n className=\"humany-conversation-outlet\"\r\n >\r\n <ConversationOverlayHead className=\"humany-conversation-outlet-head\">\r\n <ConversationOverlayHeadButton\r\n className=\"humany-conversation-outlet-head-button\"\r\n aria-label={buttonLabel}\r\n title={buttonLabel}\r\n onClick={() => dispatch('hide-overlay-conversation')}\r\n >\r\n <SymbolBadge\r\n symbol={{\r\n type: 'Svg',\r\n content: 'caret-down',\r\n }}\r\n size={20}\r\n />\r\n </ConversationOverlayHeadButton>\r\n {header && (\r\n <ConversationOverlayHeader\r\n className=\"humany-conversation-outlet-header\"\r\n variant=\"h1\"\r\n >\r\n {header}\r\n </ConversationOverlayHeader>\r\n )}\r\n </ConversationOverlayHead>\r\n <ConversationContent />\r\n </StyledWidgetOverlayOutlet>\r\n );\r\n};\r\n\r\nconst StyledWidgetOverlayOutlet = styled(WidgetOverlayOutlet)`\r\n z-index: 11;\r\n top: auto;\r\n height: 65%;\r\n background-color: #ffffff;\r\n display: flex;\r\n flex-direction: column;\r\n border-top-right-radius: ${(p) => p.theme.sizes?.large};\r\n border-top-left-radius: ${(p) => p.theme.sizes?.large};\r\n`;\r\n\r\nconst ConversationOverlayHead = styled.div`\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n gap: ${(p) => p.theme.sizes?.normal};\r\n padding: ${(p) => p.theme.sizes?.normal};\r\n ${(p) => p.theme.border && `border-bottom: ${p.theme.border};`}\r\n`;\r\n\r\nconst ConversationOverlayHeader = styled(Typography)`\r\n font-size: ${(p) => p.theme.fonts?.medium};\r\n color: ${(p) => p.theme.colors?.text};\r\n margin: 0;\r\n`;\r\n\r\nconst ConversationOverlayHeadButton = styled(Button)`\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: ${(p) => p.theme.sizes?.small} ${(p) => p.theme.sizes?.medium};\r\n ${(p) => p.theme.borderRadius && `border-radius: ${p.theme.borderRadius};`}\r\n\r\n &:focus {\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n }\r\n\r\n svg line {\r\n stroke: ${(p) => p.theme.colors?.text};\r\n }\r\n`;\r\n","import { useDispatch, useProperties } from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled from 'styled-components';\r\nimport { ConversationComponentProperties } from './plugin';\r\nimport { ConversationContent } from './ui/content';\r\nimport {\r\n ConversationOverlayOutlet,\r\n OverlayOutlet\r\n} from './ui/overlay-outlets';\r\n\r\ntype Props = {\r\n className: string;\r\n};\r\n\r\nconst Conversation: React.FC<Props> = ({ className }) => {\r\n const { \r\n overlay, \r\n overlayConversationHeader, \r\n overlayConversationCloseLabel,\r\n } = useProperties<ConversationComponentProperties>();\r\n const dispatch = useDispatch();\r\n return (\r\n <>\r\n <Wrapper className={appendClassNames(className, 'humany-conversation-component')}>\r\n <ConversationContent />\r\n </Wrapper>\r\n {overlay && (\r\n <>\r\n <OverlayOutlet dispatch={dispatch} />\r\n {overlay.conversation && (\r\n <ConversationOverlayOutlet\r\n dispatch={dispatch}\r\n header={overlayConversationHeader}\r\n buttonLabel={overlayConversationCloseLabel}\r\n />\r\n )}\r\n </>\r\n )}\r\n </>\r\n );\r\n};\r\n\r\nconst Wrapper = styled.div`\r\n position: absolute;\r\n right: 0;\r\n left: 0;\r\n bottom: 0;\r\n top: 0;\r\n overflow: hidden;\r\n display: flex;\r\n flex-direction: column;\r\n`;\r\n\r\nexport default Conversation;\r\n"],"names":["Wrapper","StyledButton","UiHtml"],"mappings":"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"}
1	+ {"version":3,"file":"conversation.js","sources":["../src/components/conversation/ui/input.tsx","../src/components/conversation/ui/styles.tsx","../src/components/conversation/ui/loader.tsx","../src/components/conversation/ui/message-list-items/html.tsx","../src/components/conversation/ui/message-types/timestamp.tsx","../src/components/conversation/ui/message-types/agent.tsx","../src/components/conversation/ui/message-types/system.tsx","../src/components/conversation/ui/message-types/user.tsx","../src/utils/map-actions.ts","../src/components/conversation/ui/message-list-items/button-list.tsx","../src/components/conversation/ui/message-list-items/custom.tsx","../src/components/conversation/ui/message-list-items/link-list.tsx","../src/components/conversation/ui/message-list-items/separator.tsx","../src/components/conversation/ui/message-list-items/text.tsx","../src/components/conversation/ui/message-list-items/video-request.tsx","../src/components/conversation/ui/message-types/message-list.tsx","../src/components/conversation/ui/message.tsx","../src/components/conversation/ui/content.tsx","../src/components/conversation/ui/overlay-outlets.tsx","../src/components/conversation/conversation.tsx"],"sourcesContent":["import {\r\n borderTabStyle,\r\n Button,\r\n Input,\r\n SymbolBadge,\r\n useDispatch,\r\n useProperties,\r\n useScroll,\r\n} from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React, { useEffect, useState } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { ConversationComponentProperties } from '../plugin';\r\n\r\ntype Props = {\r\n className?: string;\r\n};\r\n\r\nconst ConversationInput: React.FC<Props> = ({ className }) => {\r\n const [inputText, setInputText] = useState('');\r\n const [inputFocus, setInputFocus] = useState(false);\r\n const [calculatedLineHeight, setCalculatedLineHeight] = useState(0);\r\n const [textareaMaxHeight, setTextareaMaxHeight] = useState(0);\r\n const dispatch = useDispatch();\r\n const {\r\n inputPlaceholder = 'Type your message',\r\n inputHidden = false,\r\n inputDisabled = false,\r\n sendButtonLabel = 'Send message',\r\n inputMultiline: multiline = true,\r\n secondaryAction,\r\n } = useProperties<ConversationComponentProperties>();\r\n const [scrollableCss, inputRef] = useScroll(true);\r\n\r\n useEffect(() => {\r\n if (inputRef.current) {\r\n const { lineHeight, maxHeight } = getComputedStyle(inputRef.current);\r\n if (lineHeight && lineHeight.indexOf('px') > -1) {\r\n const lineHeightNumber = lineHeight.split('px');\r\n const calcLH = parseInt(lineHeightNumber[0], 10);\r\n setCalculatedLineHeight(calcLH);\r\n const maxHeightNumber = maxHeight.split('px');\r\n setTextareaMaxHeight(parseInt(maxHeightNumber[0], 10));\r\n }\r\n }\r\n }, [inputRef.current]);\r\n\r\n const submit = (e: any) => {\r\n if (!e.shiftKey \|\| !multiline) {\r\n e.preventDefault();\r\n if (inputText && inputText.length > 0) {\r\n dispatch('user-submit', { text: inputText });\r\n setInputText('');\r\n onChange('');\r\n }\r\n } else if (inputText.length < 1) {\r\n e.preventDefault();\r\n }\r\n };\r\n\r\n const onSecondaryActionButtonClick = (e: any) => {\r\n if (!secondaryAction) {\r\n return;\r\n }\r\n e.preventDefault();\r\n dispatch('action', {\r\n actionKey: secondaryAction.action,\r\n ...secondaryAction,\r\n });\r\n };\r\n\r\n const calculateHeight = (value: string) => {\r\n if (multiline && inputRef.current) {\r\n const scrollHeight = inputRef.current.scrollHeight;\r\n if (scrollHeight > calculatedLineHeight) {\r\n inputRef.current.style.height = 'auto';\r\n let areaHeight = scrollHeight;\r\n if (value.length < 1) {\r\n areaHeight = calculatedLineHeight;\r\n }\r\n inputRef.current.style.height = `${areaHeight}px`;\r\n\r\n if (areaHeight >= textareaMaxHeight) {\r\n inputRef.current.style.overflowY = 'scroll';\r\n } else {\r\n inputRef.current.style.overflowY = 'hidden';\r\n }\r\n }\r\n }\r\n };\r\n\r\n const onChange = (value: string) => {\r\n calculateHeight(value);\r\n setInputText(value);\r\n if (value && value.length > 0) {\r\n dispatch('user-typing', { textLength: value.length });\r\n }\r\n };\r\n\r\n if (inputHidden) {\r\n return null;\r\n }\r\n\r\n return (\r\n <Wrapper\r\n grow={multiline}\r\n className={appendClassNames('humany-conversation-input', className)}\r\n data-has-focus={inputFocus}\r\n scrollableCss={scrollableCss}\r\n >\r\n {secondaryAction && (\r\n <SecondaryActionButton\r\n disabled={inputDisabled}\r\n onClick={onSecondaryActionButtonClick}\r\n title={secondaryAction.label}\r\n aria-label={secondaryAction.label}\r\n >\r\n <SymbolBadge\r\n size={24}\r\n symbol={{ type: 'Svg', content: secondaryAction.icon \|\| 'browse' }}\r\n />\r\n </SecondaryActionButton>\r\n )}\r\n {multiline ? (\r\n <StyledTextArea\r\n value={inputText}\r\n onChange={onChange}\r\n onEnter={submit}\r\n disabled={inputDisabled}\r\n aria-label={inputPlaceholder}\r\n placeholder={inputPlaceholder}\r\n onFocusChange={setInputFocus}\r\n type={'textarea'}\r\n rows={1}\r\n ref={inputRef}\r\n />\r\n ) : (\r\n <StyledInput\r\n value={inputText}\r\n onChange={onChange}\r\n onEnter={submit}\r\n disabled={inputDisabled}\r\n aria-label={inputPlaceholder}\r\n placeholder={inputPlaceholder}\r\n onFocusChange={setInputFocus}\r\n />\r\n )}\r\n <StyledButton\r\n disabled={inputDisabled}\r\n onClick={submit}\r\n title={sendButtonLabel}\r\n aria-label={sendButtonLabel}\r\n >\r\n <SendSymbol\r\n size={22}\r\n symbol={{ type: 'Svg', content: 'send' }}\r\n hasContent={inputText && inputText.length}\r\n />\r\n </StyledButton>\r\n </Wrapper>\r\n );\r\n};\r\n\r\nconst StyledTextArea = styled(Input)<any>`\r\n resize: none;\r\n flex: 1;\r\n flex-shrink: 1;\r\n min-height: 1.2em;\r\n max-height: 148px;\r\n line-height: 1.2em;\r\n height: 1.2em;\r\n padding: 0;\r\n margin: calc(${(p) => p.theme.sizes?.small} * 2);\r\n font-size: ${(p) => p.theme.fonts?.normal};\r\n border: none;\r\n transition: height 200ms linear;\r\n outline: none;\r\n`;\r\n\r\nconst StyledInput = styled(Input)<any>`\r\n flex: 1;\r\n border: none;\r\n background-color: transparent;\r\n font-weight: 300;\r\n font-size: ${(p) => p.theme.fonts?.normal};\r\n line-height: 1.2em;\r\n outline: none;\r\n padding-left: ${(p) => p.theme.sizes?.large};\r\n color: ${(p) => p.theme.colors?.text};\r\n &::placeholder {\r\n color: ${(p) => p.theme.colors?.textLight};\r\n font-style: italic;\r\n }\r\n`;\r\n\r\nconst StyledButton = styled(Button)<any>`\r\n flex: 0 0 50px;\r\n align-self: stretch;\r\n background-color: transparent;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border: none;\r\n color: #a6a6a6;\r\n &:focus {\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n }\r\n`;\r\n\r\nconst SecondaryActionButton = styled(StyledButton)`\r\n border-right: ${(p) => p.theme.border};\r\n margin: ${(p) => p.theme.sizes?.normal} 0;\r\n`;\r\n\r\nconst Wrapper = styled.div<{ 'data-has-focus': boolean } & any>`\r\n ${(p) =>\r\n p.grow\r\n ? css`\r\n min-height: 50px;\r\n max-height: 150px;\r\n `\r\n : css`\r\n height: 50px;\r\n `}\r\n flex: 0 0 auto;\r\n display: flex;\r\n align-items: center;\r\n background-color: ${(p) => p.theme.colors?.accent};\r\n border-top: ${(p) => p.theme.inputBorder};\r\n ${(p) =>\r\n p['data-has-focus'] &&\r\n css`\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n `}\r\n ${StyledTextArea} {\r\n ${(p) => !!p.scrollableCss && p.scrollableCss}\r\n }\r\n`;\r\n\r\nconst SendSymbol = styled(({ hasContent, ...other }) => <SymbolBadge {...other} />)`\r\n line,\r\n path {\r\n stroke: ${(p) => (p.hasContent ? p.theme.colors?.primary : '#a6a6a6')};\r\n fill: ${(p) => (p.hasContent ? p.theme.colors?.primary : '#a6a6a6')};\r\n }\r\n`;\r\n\r\nexport default ConversationInput;\r\n","import { FormComponent } from '@telia-ace/widget-forms';\r\nimport {\r\n borderTabStyle,\r\n buttonCss,\r\n invertedHoverButton,\r\n List,\r\n Typography,\r\n} from '@telia-ace/widget-ui';\r\nimport styled, { css, keyframes } from 'styled-components';\r\n\r\nexport const Avatar = styled.div<any>`\r\n width: ${(p) => p.avatarSize \|\| '32px'};\r\n height: ${(p) => p.avatarSize \|\| '32px'};\r\n border-radius: 50%;\r\n background-color: ${(p) => p.theme.colors?.accent};\r\n border: ${(p) => p.theme.border};\r\n grid-area: avatar;\r\n align-self: flex-end;\r\n justify-self: center;\r\n overflow: hidden;\r\n margin-right: ${(p) => p.theme.sizes?.normal};\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n color: ${(p) => p.theme.colors?.text};\r\n\r\n > img {\r\n height: 100%;\r\n width: 100%;\r\n object-fit: cover;\r\n }\r\n\r\n > svg {\r\n width: 90%;\r\n height: 90%;\r\n padding: 10%;\r\n color: ${(p) => p.theme.colors?.text};\r\n\r\n line,\r\n path,\r\n circle,\r\n fill {\r\n stroke: ${(p) => p.theme.colors?.text};\r\n }\r\n }\r\n`;\r\n\r\nexport const LoaderAnimation = keyframes`\r\n 0% {\r\n opacity: 0;\r\n }\r\n 75% {\r\n opacity: 1;\r\n }\r\n 100% {\r\n opacity: 0;\r\n }\r\n`;\r\n\r\nexport const Loader = styled.div`\r\n display: flex;\r\n justify-content: center;\r\n padding: 0 0 ${(p) => p.theme.sizes?.normal};\r\n > div {\r\n height: 10px;\r\n width: 10px;\r\n border-radius: 50%;\r\n margin: 5px;\r\n background-color: ${(p) => p.theme.colors?.text};\r\n animation: ${LoaderAnimation} 1s infinite;\r\n }\r\n > div:nth-child(2) {\r\n animation-delay: 100ms;\r\n }\r\n > div:nth-child(3) {\r\n animation-delay: 200ms;\r\n }\r\n`;\r\n\r\nexport const ContentBundle = styled.div`\r\n grid-area: content;\r\n max-width: 100%;\r\n overflow: hidden;\r\n`;\r\n\r\nexport const MessageTitle = styled(Typography)`\r\n font-size: ${(p) => p.theme.fonts?.normal};\r\n font-weight: normal;\r\n margin: 0;\r\n`;\r\n\r\nexport const MessageContainer = styled.div<{ user?: boolean }>`\r\n display: flex;\r\n justify-content: ${(p) => (p.user ? 'end' : 'start')};\r\n`;\r\n\r\nexport type Stacked = 'first' \| 'last' \| 'middle';\r\n\r\nexport const MessageContent = styled.div<{\r\n user?: boolean;\r\n fullWidth?: boolean;\r\n stacked?: Stacked;\r\n}>`\r\n ${(p) => !p.user && p.stacked && nonUserMessageStyling(p.stacked, p.theme)}\r\n ${(p) => p.user && p.stacked && userMessageStyling(p.stacked, p.theme)}\r\n\r\n display: inline-block;\r\n margin-top: ${(p) => p.theme.sizes?.normal};\r\n && > * {\r\n overflow-wrap: break-word;\r\n word-wrap: break-word;\r\n word-break: break-all;\r\n word-break: break-word;\r\n hyphens: auto;\r\n }\r\n max-width: 100%;\r\n ${(p) => p.fullWidth && 'width: 100%;'}\r\n`;\r\n\r\nconst nonUserMessageStyling = (stacked: Stacked, theme: any) => {\r\n const colors = css`\r\n background-color: ${theme.colors?.accent};\r\n color: ${theme.colors?.text};\r\n ${theme.border && `border: ${theme.border};`};\r\n `;\r\n\r\n if (!theme.borderRadius) {\r\n return colors;\r\n }\r\n\r\n return css`\r\n ${colors}\r\n\r\n border-top-right-radius: ${theme.borderRadius};\r\n border-bottom-right-radius: ${theme.borderRadius};\r\n\r\n ${stacked === 'first' &&\r\n `\r\n border-top-left-radius: ${theme.borderRadius};\r\n `}\r\n\r\n ${stacked === 'last' &&\r\n `\r\n border-bottom-left-radius: ${theme.borderRadius};\r\n `}\r\n `;\r\n};\r\n\r\nconst userMessageStyling = (stacked: Stacked, theme: any) => {\r\n const colors = css`\r\n background-color: ${theme.colors?.primary};\r\n color: ${theme.colors?.accent};\r\n `;\r\n\r\n if (!theme.borderRadius) {\r\n return colors;\r\n }\r\n\r\n return css`\r\n ${colors}\r\n\r\n border-top-left-radius: ${theme.borderRadius};\r\n border-bottom-left-radius: ${theme.borderRadius};\r\n\r\n ${stacked === 'first' &&\r\n `\r\n border-top-right-radius: ${theme.borderRadius};\r\n `}\r\n\r\n ${stacked === 'last' &&\r\n `\r\n border-bottom-right-radius: ${theme.borderRadius};\r\n `}\r\n `;\r\n};\r\n\r\nexport const MessageContentPart = styled.div`\r\n margin-bottom: ${(p) => p.theme.sizes?.normal};\r\n &:last-child {\r\n margin-bottom: 0;\r\n }\r\n`;\r\n\r\nexport const messageContentPadding = css`\r\n margin: ${(p) => p.theme.sizes?.normal} 0;\r\n padding: 0 ${(p) => p.theme.sizes?.normal};\r\n`;\r\n\r\nexport const StyledForm = styled(FormComponent)`\r\n margin: ${(p) => p.theme.sizes?.medium} 0;\r\n padding: 0 ${(p) => p.theme.sizes?.medium};\r\n & button.humany-form-component-button {\r\n ${(p) =>\r\n invertedHoverButton({\r\n active: false,\r\n primaryColor: p.theme.colors?.primary,\r\n secondaryColor: p.theme.colors?.accent,\r\n })};\r\n display: block;\r\n width: 100%;\r\n margin-bottom: ${(p) => p.theme.sizes?.normal};\r\n }\r\n & button.humany-form-component-submit {\r\n width: 100%;\r\n margin: 0;\r\n :not(:last-child) {\r\n margin-bottom: ${(p) => p.theme.sizes?.normal};\r\n }\r\n }\r\n`;\r\n\r\nexport const StyledActionList = styled(List)`\r\n padding: 0;\r\n list-style: none;\r\n button {\r\n font-size: inherit;\r\n }\r\n margin: ${(p) => p.theme.sizes?.medium} 0;\r\n padding: 0 ${(p) => p.theme.sizes?.medium};\r\n display: flex;\r\n gap: ${(p) => p.theme.sizes?.normal};\r\n`;\r\n\r\nexport const StyledActionButton = styled.button`\r\n ${buttonCss};\r\n display: block;\r\n background-color: ${(p) => p.theme.colors?.primary};\r\n width: 100%;\r\n color: #fff;\r\n margin: ${(p) => p.theme.sizes?.medium} 0;\r\n padding: 0 ${(p) => p.theme.sizes?.medium};\r\n font-family: Lato;\r\n font-size: ${(p) => p.theme.fonts?.huge};\r\n font-weight: 300;\r\n &:focus {\r\n ${(p) =>\r\n p.theme.accessibility?.isTabbing &&\r\n css`\r\n ${borderTabStyle}\r\n background-color: transparent;\r\n `}\r\n }\r\n`;\r\n","import React, { forwardRef } from 'react';\r\nimport { ConversationMessageSender } from '../../../types';\r\nimport { ContentBundle, Loader, MessageContainer, MessageContent } from './styles';\r\n\r\ntype Props = {\r\n className?: string;\r\n agentData?: ConversationMessageSender;\r\n};\r\n\r\nconst ConversationLoader = forwardRef<HTMLDivElement, Props>(({ className, agentData }, ref) => {\r\n return (\r\n <ContentBundle ref={ref}>\r\n <MessageContainer>\r\n <MessageContent>\r\n <Loader>\r\n <div />\r\n <div />\r\n <div />\r\n </Loader>\r\n </MessageContent>\r\n </MessageContainer>\r\n </ContentBundle>\r\n );\r\n});\r\n\r\nexport default ConversationLoader;\r\n","import { borderTabStyle, genericHtml, Html as UiHtml } from '@telia-ace/widget-ui';\r\nimport React, { FC } from 'react';\r\nimport styled from 'styled-components';\r\nimport { HtmlProperties } from '../../../../types';\r\nimport { messageContentPadding } from '../styles';\r\n\r\ntype Props = HtmlProperties;\r\n\r\nexport const Html: FC<Props> = ({ body }) => {\r\n return <StyledHtml html={body} />;\r\n};\r\n\r\nconst StyledHtml = styled(UiHtml)<any>`\r\n ${genericHtml}\r\n color: inherit;\r\n white-space: pre-wrap;\r\n ${messageContentPadding}\r\n a {\r\n color: ${(p) => p.theme.colors.link};\r\n &:focus {\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n }\r\n }\r\n`;\r\n","import React from 'react';\r\nimport styled from 'styled-components';\r\n\r\ntype Props = {\r\n className?: string;\r\n name?: string;\r\n timestamp?: number \| null;\r\n};\r\n\r\nconst StyledTimestamp = styled.p`\r\n && {\r\n font-size: ${(p) => p.theme.fonts?.small};\r\n font-weight: 300;\r\n }\r\n padding-top: ${(p) => p.theme.sizes?.small};\r\n margin: 0;\r\n line-height: 1.5em;\r\n grid-area: info;\r\n color: ${(p) => p.theme.colors?.text};\r\n`;\r\n\r\nconst getTimestamp = (raw: number) => {\r\n return new Date(raw).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });\r\n};\r\n\r\nconst Timestamp: React.FC<Props> = ({ className, name, timestamp }) => {\r\n if (!name && !timestamp) {\r\n return null;\r\n }\r\n\r\n let output = '';\r\n if (name) {\r\n if (timestamp) {\r\n output = `${name}: ${getTimestamp(timestamp)}`;\r\n } else {\r\n output = name;\r\n }\r\n } else if (timestamp) {\r\n output = getTimestamp(timestamp);\r\n }\r\n\r\n return <StyledTimestamp>{output}</StyledTimestamp>;\r\n};\r\n\r\nexport default Timestamp;\r\n","import { SymbolBadge, useProperties } from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { ConversationMessageSender } from '../../../../types';\r\nimport { ConversationComponentProperties } from '../../plugin';\r\nimport { Avatar } from '../styles';\r\nimport Timestamp from './timestamp';\r\n\r\ntype Props = {\r\n className?: string;\r\n children: any;\r\n sender: ConversationMessageSender;\r\n timestamp: number \| null;\r\n};\r\n\r\nconst AgentMessage: React.FC<Props> = ({ className, children, sender, timestamp }) => {\r\n const { avatar, name } = sender;\r\n const { avatarSize } = useProperties<ConversationComponentProperties>();\r\n\r\n return (\r\n <StyledAgentMessage\r\n hasAvatar={!!avatar}\r\n className={appendClassNames(className, 'humany-conversation-agent-message')}\r\n >\r\n {avatar && (\r\n <Avatar avatarSize={avatarSize}>\r\n {typeof avatar === 'string' ? (\r\n <img src={avatar} />\r\n ) : (\r\n <SymbolBadge symbol={avatar} />\r\n )}\r\n </Avatar>\r\n )}\r\n {children}\r\n <Timestamp name={name} timestamp={timestamp}></Timestamp>\r\n </StyledAgentMessage>\r\n );\r\n};\r\n\r\nexport const StyledAgentMessage = styled.div<any>`\r\n display: grid;\r\n margin-right: 10%;\r\n width: 90%;\r\n ${(p) =>\r\n p.hasAvatar\r\n ? css`\r\n grid-template-columns: auto 1fr;\r\n grid-template-rows: 1fr auto;\r\n grid-template-areas:\r\n 'avatar content'\r\n '. info';\r\n `\r\n : css`\r\n grid-template-columns: 1fr;\r\n grid-template-rows: 1fr auto;\r\n grid-template-areas:\r\n 'content'\r\n 'info';\r\n `};\r\n`;\r\n\r\nexport default AgentMessage;\r\n","import { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled from 'styled-components';\r\nimport Timestamp from './timestamp';\r\n\r\nexport type Props = {\r\n className?: string;\r\n timestamp: number;\r\n discrete?: boolean;\r\n fullWidth?: boolean;\r\n children: any;\r\n};\r\n\r\nconst SystemMessage: React.FC<Props> = ({\r\n className,\r\n children,\r\n timestamp,\r\n discrete,\r\n fullWidth,\r\n}) => {\r\n return (\r\n <StyledSystemMessage\r\n className={appendClassNames(className, 'humany-conversation-system-message')}\r\n fullWidth={fullWidth}\r\n >\r\n {discrete ? (\r\n <Discrete className=\"humany-conversation-discrete-message\">\r\n {children}\r\n <Timestamp timestamp={timestamp}></Timestamp>\r\n </Discrete>\r\n ) : (\r\n <>\r\n {children}\r\n <Timestamp timestamp={timestamp}></Timestamp>\r\n </>\r\n )}\r\n </StyledSystemMessage>\r\n );\r\n};\r\n\r\nexport const StyledSystemMessage = styled.div<any>`\r\n ${(p) => p.fullWidth && 'width: 100%'};\r\n padding: 0 ${(p) => p.theme.sizes?.large};\r\n overflow: auto;\r\n`;\r\n\r\nexport const Discrete = styled.div`\r\n text-align: center;\r\n word-wrap: break-word;\r\n font-size: ${(p) => p.theme.fonts?.normal};\r\n color: ${(p) => p.theme.colors?.text};\r\n > p {\r\n margin: 0;\r\n }\r\n`;\r\n\r\nexport default SystemMessage;\r\n","import { useProperties } from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled from 'styled-components';\r\nimport { ConversationComponentProperties } from '../../plugin';\r\nimport Timestamp from './timestamp';\r\n\r\nexport type Props = {\r\n className?: string;\r\n timestamp: number;\r\n children: any;\r\n};\r\n\r\nconst UserMessage: React.FC<Props> = ({ className, children, timestamp }) => {\r\n const { userLabel = '' } = useProperties<ConversationComponentProperties>();\r\n return (\r\n <StyledUserMessage\r\n className={appendClassNames(className, 'humany-conversation-user-message')}\r\n >\r\n {children}\r\n <Timestamp name={userLabel} timestamp={timestamp}></Timestamp>\r\n </StyledUserMessage>\r\n );\r\n};\r\n\r\nconst StyledUserMessage = styled.div`\r\n margin-left: 10%;\r\n width: 90%;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-end;\r\n`;\r\n\r\nexport default UserMessage;\r\n","export const mapActions = (actions: any) =>\r\n Array.isArray(actions)\r\n ? actions\r\n : Object.keys(actions).map((i) => {\r\n return {\r\n label: actions[i],\r\n actionKey: i,\r\n };\r\n });\r\n","import {\r\n borderTabStyle,\r\n Button,\r\n buttonCss,\r\n DispatchAction,\r\n ItemList,\r\n itemList,\r\n SymbolBadge,\r\n} from '@telia-ace/widget-ui';\r\nimport React, { FC } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { ButtonListProperties } from '../../../../types';\r\nimport { mapActions } from '../../../../utils/map-actions';\r\nimport { messageContentPadding } from '../styles';\r\n\r\ntype Props = { dispatch: DispatchAction } & ButtonListProperties;\r\n\r\nexport const ButtonList: FC<Props> = ({ header, actions, dispatch }) => {\r\n return (\r\n <StyledButtonList\r\n header={header}\r\n items={mapActions(actions)}\r\n renderItem={(item: any) => {\r\n return (\r\n <li key={item.actionKey}>\r\n <StyledButtonListButton\r\n onClick={() => {\r\n dispatch('action', item);\r\n }}\r\n aria-label={item.label}\r\n title={item.label}\r\n >\r\n <SymbolBadge symbol={item.symbol} />\r\n {item.label}\r\n </StyledButtonListButton>\r\n </li>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\n\r\nconst StyledButtonList = styled(ItemList)`\r\n ${itemList}\r\n > ul {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: ${(p) => p.theme.sizes?.normal};\r\n > li {\r\n margin: 0;\r\n }\r\n }\r\n ${messageContentPadding}\r\n`;\r\n\r\nconst StyledButtonListButton = styled(Button)`\r\n ${buttonCss};\r\n\r\n display: block;\r\n padding: ${(p) => p.theme.sizes?.normal};\r\n background-color: ${(p) => p.theme.colors?.primary};\r\n width: 100%;\r\n color: #ffffff;\r\n &:focus {\r\n ${(p) =>\r\n p.theme.accessibility?.isTabbing &&\r\n css`\r\n ${borderTabStyle}\r\n background-color: transparent;\r\n `}\r\n }\r\n\r\n i,\r\n svg {\r\n margin-right: ${(p) => p.theme.sizes?.small};\r\n }\r\n`;\r\n","import { useComponent } from '@telia-ace/widget-ui';\r\nimport React, { Suspense } from 'react';\r\n\r\ntype Props = {\r\n type: string;\r\n content?: { [key: string]: any };\r\n};\r\nexport const Custom: React.FC<Props> = ({ type, content = {} }) => {\r\n const Component = useComponent(type);\r\n\r\n if (!Component \|\| !type) {\r\n return null;\r\n }\r\n return (\r\n <Suspense fallback={null}>\r\n <Component {...content} />\r\n </Suspense>\r\n );\r\n};\r\n","import {\r\n borderTabStyle,\r\n Button,\r\n DispatchAction,\r\n itemList,\r\n ItemList,\r\n SymbolBadge,\r\n} from '@telia-ace/widget-ui';\r\nimport React, { FC } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { LinkListProperties } from '../../../../types';\r\nimport { mapActions } from '../../../../utils/map-actions';\r\nimport { messageContentPadding } from '../styles';\r\n\r\ntype Props = { dispatch: DispatchAction } & LinkListProperties;\r\n\r\nexport const LinkList: FC<Props> = ({ header, actions, dispatch }) => {\r\n return (\r\n <StyledLinkList\r\n header={header}\r\n items={mapActions(actions)}\r\n renderItem={(item: any) => {\r\n return (\r\n <li key={item.actionKey}>\r\n <StyledLinkButton\r\n help={item.actionKey === 'help'}\r\n onClick={() => {\r\n dispatch('action', item);\r\n }}\r\n aria-label={item.label}\r\n title={item.label}\r\n >\r\n {item.label}\r\n {item.actionKey === 'help' && (\r\n <SymbolBadge\r\n size={14}\r\n symbol={{\r\n type: 'Svg',\r\n content: 'caret-down',\r\n }}\r\n />\r\n )}\r\n </StyledLinkButton>\r\n </li>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nconst StyledLinkList = styled(ItemList)`\r\n ${itemList}\r\n ${messageContentPadding}\r\n > ul {\r\n display: flex;\r\n flex-direction: column;\r\n gap: ${(p) => p.theme.sizes?.normal};\r\n > li {\r\n margin: 0;\r\n }\r\n }\r\n`;\r\n\r\nconst StyledLinkButton = styled(Button)<{ help: boolean }>`\r\n display: block;\r\n text-align: left;\r\n font-weight: 300;\r\n color: ${(p) => p.theme.colors?.primary};\r\n max-width: 100%;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n\r\n ${(p) =>\r\n p.help &&\r\n css`\r\n color: ${p.theme.colors?.text};\r\n text-decoration: underline;\r\n\r\n i,\r\n svg {\r\n margin-left: ${p.theme.sizes?.small};\r\n }\r\n `}\r\n\r\n &:focus {\r\n ${(p) =>\r\n p.theme.accessibility?.isTabbing &&\r\n css`\r\n ${borderTabStyle}\r\n span {\r\n color: ${p.theme.colors?.primary};\r\n text-decoration: underline;\r\n }\r\n `};\r\n }\r\n`;\r\n","import React, { FC } from 'react';\r\nimport styled from 'styled-components';\r\n\r\nexport const Separator: FC = () => {\r\n return <StyledSeparator />;\r\n};\r\n\r\nconst StyledSeparator = styled.div`\r\n ${(p) => p.theme.border && `border-bottom: ${p.theme.border};`}\r\n width: 100%;\r\n`;\r\n","import { Typography } from '@telia-ace/widget-ui';\r\nimport React, { FC } from 'react';\r\nimport styled from 'styled-components';\r\nimport { messageContentPadding } from '../styles';\r\n\r\ntype Props = { text: string };\r\n\r\nexport const Text: FC<Props> = ({ text }) => {\r\n return <StyledTypography variant=\"span\">{text}</StyledTypography>;\r\n};\r\n\r\nconst StyledTypography = styled(Typography)`\r\n ${messageContentPadding}\r\n`;\r\n","import {\r\n borderTabStyle,\r\n Button,\r\n buttonCss,\r\n DispatchAction,\r\n ItemList,\r\n itemList,\r\n SymbolBadge,\r\n} from '@telia-ace/widget-ui';\r\nimport React, { FC, useMemo } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { VideoRequestProperties } from '../../../../types';\r\nimport { messageContentPadding } from '../styles';\r\n\r\ntype Props = { dispatch: DispatchAction } & VideoRequestProperties;\r\n\r\nexport const VideoRequest: FC<Props> = ({\r\n header = 'Video call',\r\n acceptLabel = 'Accept',\r\n declineLabel = 'Decline',\r\n dispatch,\r\n}) => {\r\n const actions = useMemo(() => {\r\n return [\r\n {\r\n label: acceptLabel,\r\n actionKey: 'accept-video-call',\r\n symbol: {\r\n type: 'Svg',\r\n content: 'video',\r\n },\r\n },\r\n {\r\n label: declineLabel,\r\n actionKey: 'decline-video-call',\r\n symbol: {\r\n type: 'Svg',\r\n content: 'close',\r\n },\r\n },\r\n ];\r\n }, [acceptLabel, declineLabel]);\r\n return (\r\n <StyledItemList\r\n header={header}\r\n items={actions}\r\n renderItem={(item: any) => {\r\n const bgColor = item.actionKey === 'accept-video-call' ? '#70c48e' : '#da5c85';\r\n return (\r\n <li key={item.actionKey}>\r\n <StyledButton\r\n onClick={() => {\r\n dispatch('action', item);\r\n }}\r\n aria-label={item.label}\r\n title={item.label}\r\n bgColor={bgColor}\r\n >\r\n <SymbolBadge symbol={item.symbol} size={25} />\r\n </StyledButton>\r\n </li>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\n\r\nconst StyledItemList = styled(ItemList)`\r\n ${itemList}\r\n > ul {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: ${(p) => p.theme.sizes?.normal};\r\n > li {\r\n margin: 0;\r\n }\r\n }\r\n ${messageContentPadding}\r\n`;\r\n\r\nconst StyledButton = styled(Button)<{ bgColor: string }>`\r\n ${buttonCss};\r\n\r\n background-color: ${(p) => p.bgColor};\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n color: #ffffff;\r\n width: 46px;\r\n height: 46px;\r\n border-radius: 100%;\r\n\r\n &:focus {\r\n ${(p) =>\r\n p.theme.accessibility?.isTabbing &&\r\n css`\r\n ${borderTabStyle}\r\n background-color: transparent;\r\n\r\n i,\r\n svg {\r\n color: ${(p) => p.theme.colors?.primary};\r\n\r\n path {\r\n stroke: ${(p) => p.theme.colors?.primary};\r\n }\r\n }\r\n `}\r\n }\r\n\r\n i,\r\n svg {\r\n color: #fff;\r\n\r\n path {\r\n stroke: #fff;\r\n }\r\n }\r\n`;\r\n","import React, { FC } from 'react';\r\n\r\nimport { DispatchAction, List, list } from '@telia-ace/widget-ui';\r\nimport { uuid } from '@telia-ace/widget-utilities';\r\nimport styled from 'styled-components';\r\nimport { ConversationMessageListItemType, ConverstationMessageItem } from '../../../../types';\r\nimport { ButtonList } from '../message-list-items/button-list';\r\nimport { Custom } from '../message-list-items/custom';\r\nimport { Html } from '../message-list-items/html';\r\nimport { LinkList } from '../message-list-items/link-list';\r\nimport { Separator } from '../message-list-items/separator';\r\nimport { Text } from '../message-list-items/text';\r\nimport { VideoRequest } from '../message-list-items/video-request';\r\n\r\ntype Props = {\r\n items: ConverstationMessageItem<any>[];\r\n dispatch: DispatchAction;\r\n};\r\n\r\nconst mapItem = ([type, content]: ConverstationMessageItem<any>) => {\r\n return { type, content, id: uuid() };\r\n};\r\n\r\nexport const MessageList: FC<Props> = ({ items, dispatch }) => {\r\n return (\r\n <StyledList\r\n items={items.map(mapItem)}\r\n renderLi\r\n renderItem={(item: any) => {\r\n switch (item.type) {\r\n case ConversationMessageListItemType.Text: {\r\n return <Text text={item.content} />;\r\n }\r\n case ConversationMessageListItemType.HTML: {\r\n return <Html {...item.content} />;\r\n }\r\n case ConversationMessageListItemType.Separator: {\r\n return <Separator {...item.content} />;\r\n }\r\n case ConversationMessageListItemType.LinkList: {\r\n return <LinkList {...item.content} dispatch={dispatch} />;\r\n }\r\n case ConversationMessageListItemType.ButtonList: {\r\n return <ButtonList {...item.content} dispatch={dispatch} />;\r\n }\r\n case ConversationMessageListItemType.VideoRequest: {\r\n return <VideoRequest {...item.content} dispatch={dispatch} />;\r\n }\r\n default: {\r\n return <Custom type={item.type} content={item.content} />;\r\n }\r\n }\r\n }}\r\n />\r\n );\r\n};\r\n\r\nconst StyledList = styled(List)<any>`\r\n ${list}\r\n\r\n > li {\r\n margin: 0;\r\n }\r\n`;\r\n","import { useDispatch } from '@telia-ace/widget-ui';\r\nimport { uuid } from '@telia-ace/widget-utilities';\r\nimport React, { useCallback } from 'react';\r\nimport { ConversationMessageType } from '../../../conversation-controller';\r\nimport { ConversationMessageContent } from '../../../types';\r\nimport { BundledConversationMessage } from '../plugin';\r\nimport { Html } from './message-list-items/html';\r\nimport { AgentMessage, SystemMessage, UserMessage } from './message-types';\r\nimport { MessageList } from './message-types/message-list';\r\nimport {\r\n ContentBundle,\r\n MessageContainer,\r\n MessageContent,\r\n MessageContentPart,\r\n MessageTitle,\r\n Stacked,\r\n StyledActionButton,\r\n StyledActionList,\r\n StyledForm,\r\n} from './styles';\r\n\r\ntype Props = {\r\n className?: string;\r\n} & BundledConversationMessage;\r\n\r\nexport const ConversationMessage: React.FC<Props> = ({\r\n className,\r\n timestamp,\r\n sender,\r\n type,\r\n content,\r\n}) => {\r\n const getMessageStackPosition = useCallback(\r\n (index: number): Stacked => {\r\n let messageOrder: Stacked = 'first';\r\n if (content.length > 1) {\r\n messageOrder =\r\n index === 0 ? 'first' : index + 1 === content.length ? 'last' : 'middle';\r\n }\r\n return messageOrder;\r\n },\r\n [content]\r\n );\r\n\r\n const createSystemMessage = () => {\r\n return (\r\n <>\r\n {content.map((item) => {\r\n const { key, body, title, form, actions } = item;\r\n const discrete = !!body && !title && !form && !actions;\r\n return (\r\n <SystemMessage\r\n className={className}\r\n key={key}\r\n discrete={discrete}\r\n timestamp={timestamp}\r\n fullWidth={!!form \|\| !!actions}\r\n >\r\n {discrete && body ? (\r\n <Html body={body} />\r\n ) : (\r\n <Message content={item} isUser={false} />\r\n )}\r\n </SystemMessage>\r\n );\r\n })}\r\n </>\r\n );\r\n };\r\n\r\n const createAgentMessage = () => {\r\n return (\r\n <AgentMessage sender={sender} timestamp={timestamp} className={className}>\r\n <ContentBundle>\r\n {content.map((item, index) => {\r\n return (\r\n <MessageContainer key={item.key}>\r\n <Message\r\n content={item}\r\n isUser={false}\r\n stacked={getMessageStackPosition(index)}\r\n />\r\n </MessageContainer>\r\n );\r\n })}\r\n </ContentBundle>\r\n </AgentMessage>\r\n );\r\n };\r\n\r\n const createUserMessage = () => {\r\n return (\r\n <UserMessage timestamp={timestamp} className={className}>\r\n <ContentBundle>\r\n {content.map((item, index) => {\r\n return (\r\n <MessageContainer user key={item.key}>\r\n <Message\r\n content={item}\r\n isUser={true}\r\n stacked={getMessageStackPosition(index)}\r\n />\r\n </MessageContainer>\r\n );\r\n })}\r\n </ContentBundle>\r\n </UserMessage>\r\n );\r\n };\r\n\r\n switch (type) {\r\n case ConversationMessageType.System:\r\n return createSystemMessage();\r\n case ConversationMessageType.Agent:\r\n return createAgentMessage();\r\n case ConversationMessageType.User:\r\n return createUserMessage();\r\n default:\r\n return null;\r\n }\r\n};\r\n\r\ntype MessageContentProps = {\r\n className?: string;\r\n content: ConversationMessageContent;\r\n isUser: boolean;\r\n stacked?: Stacked;\r\n CustomComponent?: any;\r\n};\r\n\r\nconst Message: React.FC<MessageContentProps> = ({ content, isUser, stacked }) => {\r\n const dispatch = useDispatch();\r\n const { title, body, actions, form, items } = content;\r\n\r\n return (\r\n <MessageContent user={isUser} stacked={stacked} fullWidth={!!form \|\| !!actions}>\r\n {title && (\r\n <MessageContentPart>\r\n <MessageTitle variant=\"h2\">{title}</MessageTitle>\r\n </MessageContentPart>\r\n )}\r\n {body && (\r\n <MessageContentPart>\r\n <Html body={body} />\r\n </MessageContentPart>\r\n )}\r\n {form && (\r\n <MessageContentPart>\r\n <StyledForm\r\n {...form}\r\n onChange={(key: string, data: any) => {\r\n dispatch('form', {\r\n data,\r\n formKey: form.schema.id,\r\n actionKey: key,\r\n });\r\n }}\r\n />\r\n </MessageContentPart>\r\n )}\r\n {actions && (\r\n <MessageContentPart>\r\n <StyledActionList\r\n items={Object.keys(actions).map((i: any) => {\r\n return { label: actions[i], actionKey: i };\r\n })}\r\n renderItem={(item: any) => {\r\n return (\r\n <li key={item.actionKey}>\r\n <StyledActionButton\r\n onClick={() => {\r\n dispatch('action', item.actionKey);\r\n }}\r\n >\r\n {item.label}\r\n </StyledActionButton>\r\n </li>\r\n );\r\n }}\r\n />\r\n </MessageContentPart>\r\n )}\r\n {items && <MessageList key={uuid()} items={items} dispatch={dispatch} />}\r\n </MessageContent>\r\n );\r\n};\r\n","import { borderTabStyle, headingElement, useProperties, useScroll } from '@telia-ace/widget-ui';\r\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { ConversationMessageSender } from '../../../types';\r\nimport { BundledConversationMessage, ConversationComponentProperties } from '../plugin';\r\nimport ConversationInput from './input';\r\nimport ConversationLoader from './loader';\r\nimport { ConversationMessage } from './message';\r\nimport { AgentMessage } from './message-types';\r\n\r\nexport const ConversationContent: React.FC = () => {\r\n const lastEntry = useRef<HTMLDivElement \| null>(null);\r\n\r\n const [scrollableCss, viewElem] = useScroll(true);\r\n const { messages, loading, typingActors } = useProperties<ConversationComponentProperties>();\r\n\r\n const scrollView = useCallback(() => {\r\n if (lastEntry.current) {\r\n lastEntry.current.scrollIntoView({\r\n block: 'end',\r\n behavior: 'smooth',\r\n });\r\n }\r\n }, [lastEntry]);\r\n\r\n useEffect(() => {\r\n const handler = setTimeout(scrollView, 250);\r\n\r\n return () => clearTimeout(handler);\r\n }, [messages, typingActors]);\r\n\r\n const isLoadingOrTyping = useMemo(() => {\r\n return !!typingActors.length \|\| loading;\r\n }, [typingActors, loading]);\r\n\r\n const renderTypingActors = () => {\r\n if (typingActors && typingActors.length) {\r\n return typingActors.map((actor: ConversationMessageSender, index) => {\r\n const isLast = index === typingActors.length - 1;\r\n return (\r\n <MessageEntry\r\n id={`typing_${actor.name}`}\r\n ref={loading ? null : isLast ? lastEntry : null}\r\n key={`typing_${actor.name}`}\r\n >\r\n <AgentMessage timestamp={Date.now()} sender={actor}>\r\n <ConversationLoader></ConversationLoader>\r\n </AgentMessage>\r\n </MessageEntry>\r\n );\r\n });\r\n }\r\n return null;\r\n };\r\n\r\n return (\r\n <>\r\n <Scrollable tabIndex={0} scrollableCss={scrollableCss} ref={viewElem}>\r\n {messages && messages.length\r\n ? messages.map((message: BundledConversationMessage, index) => {\r\n const { type, timestamp, sender, content } = message;\r\n const isLast = index === messages.length - 1;\r\n return (\r\n <MessageEntry\r\n className={'humany-conversation-entry'}\r\n tabIndex={-1}\r\n key={`${type}_${sender?.name}_${timestamp}_${content[0].key}`}\r\n ref={isLoadingOrTyping ? null : isLast ? lastEntry : null}\r\n >\r\n <ConversationMessage {...message} />\r\n </MessageEntry>\r\n );\r\n })\r\n : null}\r\n {renderTypingActors()}\r\n {loading && (\r\n <MessageEntry>\r\n <ConversationLoader ref={lastEntry} />\r\n </MessageEntry>\r\n )}\r\n </Scrollable>\r\n <ConversationInput />\r\n </>\r\n );\r\n};\r\n\r\nconst Scrollable = styled.div<{ scrolling: boolean } & any>`\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\r\n flex: 0 1 100%;\r\n padding: 0 ${(p) => p.theme.sizes?.normal};\r\n ${(p) => !!p.scrollableCss && p.scrollableCss};\r\n &:focus {\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n }\r\n`;\r\n\r\nconst MessageEntry = styled.div`\r\n margin: 0;\r\n margin-bottom: ${(p) => p.theme.sizes?.medium};\r\n\r\n &:first-of-type {\r\n margin-top: ${(p) => p.theme.sizes?.medium};\r\n }\r\n\r\n &:last-of-type {\r\n padding-bottom: ${(p) => p.theme.sizes?.medium};\r\n }\r\n\r\n & span,\r\n p,\r\n a,\r\n div {\r\n font-weight: 300;\r\n }\r\n\r\n & b,\r\n h1 {\r\n font-weight: normal;\r\n }\r\n\r\n ${headingElement(\r\n 'h1',\r\n css`\r\n font-weight: normal;\r\n `\r\n )}\r\n`;\r\n","import {\r\n borderTabStyle,\r\n Button,\r\n DispatchAction,\r\n SymbolBadge,\r\n Typography,\r\n WidgetOverlayOutlet,\r\n} from '@telia-ace/widget-ui';\r\nimport React, { FC, useEffect, useRef } from 'react';\r\nimport styled from 'styled-components';\r\nimport { ConversationContent } from './content';\r\n\r\ntype OverlayOutletProps = {\r\n dispatch: DispatchAction;\r\n};\r\n\r\nexport const OverlayOutlet: FC<OverlayOutletProps> = ({ dispatch }) => {\r\n const wrapperRef = useRef<HTMLDivElement>(null);\r\n\r\n useEffect(() => {\r\n if (wrapperRef.current && wrapperRef.current.parentNode) {\r\n dispatch('overlay-mounted', wrapperRef.current);\r\n }\r\n }, [wrapperRef]);\r\n\r\n return (\r\n <WidgetOverlayOutlet\r\n portalId=\"humany-conversation-overlay-portal\"\r\n className=\"humany-conversation-overlay-outlet\"\r\n ref={wrapperRef}\r\n />\r\n );\r\n};\r\n\r\ntype ConversationOverlayProps = {\r\n dispatch: DispatchAction;\r\n header?: string;\r\n buttonLabel?: string;\r\n};\r\n\r\nexport const ConversationOverlayOutlet: FC<ConversationOverlayProps> = ({\r\n dispatch,\r\n header,\r\n buttonLabel,\r\n}) => {\r\n return (\r\n <StyledWidgetOverlayOutlet\r\n portalId=\"humany-conversation-portal\"\r\n className=\"humany-conversation-outlet\"\r\n >\r\n <ConversationOverlayHead className=\"humany-conversation-outlet-head\">\r\n <ConversationOverlayHeadButton\r\n className=\"humany-conversation-outlet-head-button\"\r\n aria-label={buttonLabel}\r\n title={buttonLabel}\r\n onClick={() => dispatch('hide-overlay-conversation')}\r\n >\r\n <SymbolBadge\r\n symbol={{\r\n type: 'Svg',\r\n content: 'caret-down',\r\n }}\r\n size={20}\r\n />\r\n </ConversationOverlayHeadButton>\r\n {header && (\r\n <ConversationOverlayHeader\r\n className=\"humany-conversation-outlet-header\"\r\n variant=\"h1\"\r\n >\r\n {header}\r\n </ConversationOverlayHeader>\r\n )}\r\n </ConversationOverlayHead>\r\n <ConversationContent />\r\n </StyledWidgetOverlayOutlet>\r\n );\r\n};\r\n\r\nconst StyledWidgetOverlayOutlet = styled(WidgetOverlayOutlet)`\r\n z-index: 11;\r\n top: auto;\r\n height: 65%;\r\n background-color: #ffffff;\r\n display: flex;\r\n flex-direction: column;\r\n border-top-right-radius: ${(p) => p.theme.sizes?.large};\r\n border-top-left-radius: ${(p) => p.theme.sizes?.large};\r\n`;\r\n\r\nconst ConversationOverlayHead = styled.div`\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n gap: ${(p) => p.theme.sizes?.normal};\r\n padding: ${(p) => p.theme.sizes?.normal};\r\n ${(p) => p.theme.border && `border-bottom: ${p.theme.border};`}\r\n`;\r\n\r\nconst ConversationOverlayHeader = styled(Typography)`\r\n font-size: ${(p) => p.theme.fonts?.medium};\r\n color: ${(p) => p.theme.colors?.text};\r\n margin: 0;\r\n`;\r\n\r\nconst ConversationOverlayHeadButton = styled(Button)`\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: ${(p) => p.theme.sizes?.small} ${(p) => p.theme.sizes?.medium};\r\n ${(p) => p.theme.borderRadius && `border-radius: ${p.theme.borderRadius};`}\r\n\r\n &:focus {\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n }\r\n\r\n svg line {\r\n stroke: ${(p) => p.theme.colors?.text};\r\n }\r\n`;\r\n","import { useDispatch, useProperties } from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled from 'styled-components';\r\nimport { ConversationComponentProperties } from './plugin';\r\nimport { ConversationContent } from './ui/content';\r\nimport {\r\n ConversationOverlayOutlet,\r\n OverlayOutlet\r\n} from './ui/overlay-outlets';\r\n\r\ntype Props = {\r\n className: string;\r\n};\r\n\r\nconst Conversation: React.FC<Props> = ({ className }) => {\r\n const { \r\n overlay, \r\n overlayConversationHeader, \r\n overlayConversationCloseLabel,\r\n } = useProperties<ConversationComponentProperties>();\r\n const dispatch = useDispatch();\r\n return (\r\n <>\r\n <Wrapper className={appendClassNames(className, 'humany-conversation-component')}>\r\n <ConversationContent />\r\n </Wrapper>\r\n {overlay && (\r\n <>\r\n <OverlayOutlet dispatch={dispatch} />\r\n {overlay.conversation && (\r\n <ConversationOverlayOutlet\r\n dispatch={dispatch}\r\n header={overlayConversationHeader}\r\n buttonLabel={overlayConversationCloseLabel}\r\n />\r\n )}\r\n </>\r\n )}\r\n </>\r\n );\r\n};\r\n\r\nconst Wrapper = styled.div`\r\n position: absolute;\r\n right: 0;\r\n left: 0;\r\n bottom: 0;\r\n top: 0;\r\n overflow: hidden;\r\n display: flex;\r\n flex-direction: column;\r\n`;\r\n\r\nexport default Conversation;\r\n"],"names":["Wrapper","StyledButton","UiHtml"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,12 +1,13 @@
 {
     "name": "@telia-ace/widget-conversation",
-    "version": "1.0.21",
+    "version": "1.0.22",
     "description": "ACE Widget Conversation Platform",
     "license": "SEE LICENSE IN LICENSE.txt",
     "author": "Telia Company AB",
     "keywords": [
         "telia"
     ],
+    "source": "src/index.ts",
     "module": "dist/index.js",
     "types": "dist/index.d.ts",
     "files": [
@@ -24,12 +25,12 @@
     },
     "sideEffects": false,
     "dependencies": {
-        "@telia-ace/widget-core": "^1.0.9",
-        "@telia-ace/widget-forms": "^1.0.16",
-        "@telia-ace/widget-plugins": "^1.0.10",
-        "@telia-ace/widget-routing": "^1.0.10",
-        "@telia-ace/widget-services": "^1.0.9",
-        "@telia-ace/widget-ui": "^1.0.16",
+        "@telia-ace/widget-core": "^1.0.10",
+        "@telia-ace/widget-forms": "^1.0.17",
+        "@telia-ace/widget-plugins": "^1.0.11",
+        "@telia-ace/widget-routing": "^1.0.11",
+        "@telia-ace/widget-services": "^1.0.10",
+        "@telia-ace/widget-ui": "^1.0.17",
         "@telia-ace/widget-utilities": "^1.0.2",
         "@webprovisions/platform": "^1.1.2"
     },
@@ -40,5 +41,5 @@
     "devDependencies": {
         "@types/react": "^16.8.0"
     },
-    "gitHead": "f535ca11d93792a77738d112ca5bcf79dabaad08"
+    "gitHead": "57b2c5e993afd3dabe851f799db2f2fe9b3e3df3"
 }