@xapp/chat-widget 1.50.2 → 1.52.0

package/dist/index.js

@@ -1584,9 +1584,6 @@ var Avatar = function (props) {
     return (React__default$1["default"].createElement("div", { className: "avatar ".concat(agentAva ? "avatar--agent" : "avatar--visitor", " ").concat(!hasImage ? "avatar--empty" : ""), style: style, title: entity ? entity.display_name : "Agent" }, child));
 };
 
-/**
- * This mirrors the declaration in Chat-Server
- */
 function isChatServerActionLink(arg) {
     return arg.hasOwnProperty("label");
 }
@@ -1997,9 +1994,11 @@ function execute(url, behavior) {
 }
 function useOpenUrlCallback() {
     var env = useWidgetEnv();
-    return React$1.useCallback(function (url) {
-        var policy = (env === null || env === void 0 ? void 0 : env.urls) ? resolveUrlPolicy(url, env.urls) : defaultBehavior;
-        execute(url, policy);
+    return React$1.useCallback(function (url, behavior) {
+        if (!behavior) {
+            behavior = (env === null || env === void 0 ? void 0 : env.urls) ? resolveUrlPolicy(url, env.urls) : defaultBehavior;
+        }
+        execute(url, behavior);
     }, [env]);
 }
 
@@ -7155,7 +7154,7 @@ Object.defineProperty(WidgetTheme, "__esModule", { value: true });
 var guards = {};
 
 Object.defineProperty(guards, "__esModule", { value: true });
-guards.isStandardMenuItem = guards.isStaticTextMenuItem = guards.isStaticImageMenuItem = void 0;
+guards.isOpenURLMenuItem = guards.isStandardMenuItem = guards.isStaticTextMenuItem = guards.isStaticImageMenuItem = void 0;
 function isStaticImageMenuItem(item) {
     return !!item && !!item.imageUrl;
 }
@@ -7168,6 +7167,10 @@ function isStandardMenuItem(item) {
     return !!item && !!item.label;
 }
 guards.isStandardMenuItem = isStandardMenuItem;
+function isOpenURLMenuItem(item) {
+    return !!item && !!item.url;
+}
+guards.isOpenURLMenuItem = isOpenURLMenuItem;
 
 (function (exports) {
 	var __createBinding = (commonjsGlobal && commonjsGlobal.__createBinding) || (Object.create ? (function(o, m, k, k2) {
@@ -7208,9 +7211,11 @@ var ChatMenuItem = function (props) {
     return (React__default$1["default"].createElement("button", { type: "button", className: "chat-menu-item", tabIndex: props.tabIndex ? Number(props.tabIndex) : 0, onClick: handleClick }, content));
 };
 
+var _this = undefined;
 var ChatMenu = function (props) {
     var items = props.items, opened = props.opened;
     var openFrom = props.openFrom || "bottom";
+    var handleOpenUrl = useOpenUrlCallback();
     return (React__default$1["default"].createElement("div", { className: "chat-menu-".concat(openFrom, " ").concat(opened ? "chat-menu-".concat(openFrom, "--opened") : "chat-menu-".concat(openFrom, "--closed")) }, items.map(function (item, i) {
         if (lib.isStandardMenuItem(item)) {
             return React__default$1["default"].createElement(ChatMenuItem, { key: i, onClick: props.onItemClick, label: item.label, subtitle: item.subtitle });
@@ -7228,6 +7233,9 @@ var ChatMenu = function (props) {
                     React__default$1["default"].createElement("div", null, item.title),
                     React__default$1["default"].createElement("div", { className: "chat-menu-item-static-text--body" }, item.body))));
         }
+        else if (lib.isOpenURLMenuItem(item)) {
+            return React__default$1["default"].createElement("button", { key: i, className: "chat-menu-item", onClick: handleOpenUrl.bind(_this, item.url, item.behavior) }, item.text);
+        }
         return React__default$1["default"].createElement("p", null, "Unknown");
     })));
 };
@@ -31061,6 +31069,17 @@ function getCtaStyle(style) {
     return union(getBackgroundStyle(style.background), getTextStyle(style.text));
 }
 
+var ModalContent = function (_a) {
+    var onClose = _a.onClose, onReset = _a.onReset;
+    return (React__default$1["default"].createElement("div", { className: "modalContent" },
+        React__default$1["default"].createElement("div", { className: "modalBody" },
+            React__default$1["default"].createElement("h2", null, "Restart Conversation"),
+            React__default$1["default"].createElement("p", null, "Would you like to refresh and return to the starting point of the conversation?")),
+        React__default$1["default"].createElement("div", { className: "modalActions" },
+            React__default$1["default"].createElement("button", { onClick: onClose, className: "cancelBtn" }, "Cancel"),
+            React__default$1["default"].createElement("button", { onClick: onReset, className: "restartBtn" }, "Restart"))));
+};
+
 var ChatWidgetWrapper = function (props) {
     var rawConfig = props.config;
     var connection = useConnectionInfo(rawConfig);
@@ -31071,7 +31090,9 @@ var ChatWidgetWrapper = function (props) {
     var token = reactRedux.useSelector(function (state) { return state.connection.token; });
     var options = React$1.useMemo(function () {
         var configurableMessages = getConfigurableMessages();
-        if (rawConfig.configurableMessages && Array.isArray(rawConfig.configurableMessages.items) && rawConfig.configurableMessages.items.length > 0) {
+        if (rawConfig.configurableMessages &&
+            Array.isArray(rawConfig.configurableMessages.items) &&
+            rawConfig.configurableMessages.items.length > 0) {
             configurableMessages = rawConfig.configurableMessages;
         }
         return {
@@ -31079,7 +31100,7 @@ var ChatWidgetWrapper = function (props) {
             bot: {
                 nick: "Bot",
                 displayName: rawConfig.botName,
-                avatarPath: rawConfig.avatarUrl,
+                avatarPath: rawConfig.avatarUrl
             },
             configurableMessages: configurableMessages,
             hooks: rawConfig.hooks
@@ -31096,6 +31117,13 @@ var ChatWidget = function (props) {
     var dispatch = useChatServerDispatch();
     // From Redux
     var chatState = reactRedux.useSelector(function (state) { return state; });
+    var modalRef = React$1.useRef({});
+    function openModal() {
+        modalRef.current.style.display = "block";
+    }
+    function closeModal() {
+        modalRef.current.style.display = "none";
+    }
     var mode = (_a = props.mode) !== null && _a !== void 0 ? _a : "normal";
     var dockedMode = mode === "docked";
     var staticMode = mode === "static";
@@ -31111,7 +31139,10 @@ var ChatWidget = function (props) {
         canCancel = !dockedMode && !staticMode;
     }
     // Our state - pull from storage
-    var _x = React$1.useState((!canMinimize && !canCancel) || !!get("visible") || (((_k = props.config) === null || _k === void 0 ? void 0 : _k.autoOpenOnWidth) && window.matchMedia("(min-width: ".concat((_l = props.config) === null || _l === void 0 ? void 0 : _l.autoOpenOnWidth, ")")).matches)), visible = _x[0], setVisibleState = _x[1];
+    var _x = React$1.useState((!canMinimize && !canCancel) ||
+        !!get("visible") ||
+        (((_k = props.config) === null || _k === void 0 ? void 0 : _k.autoOpenOnWidth) &&
+            window.matchMedia("(min-width: ".concat((_l = props.config) === null || _l === void 0 ? void 0 : _l.autoOpenOnWidth, ")")).matches)), visible = _x[0], setVisibleState = _x[1];
     var _y = React$1.useState(false), typing = _y[0], setTypingState = _y[1]; // false initially
     var chatServer = React$1.useContext(ChatServerContext);
     var setVisible = React$1.useCallback(function (newVisible) {
@@ -31123,7 +31154,7 @@ var ChatWidget = function (props) {
     }, [staticMode]);
     React$1.useEffect(function () {
         var _a;
-        document.addEventListener('keydown', function (event) {
+        document.addEventListener("keydown", function (event) {
             var body = document.getElementsByTagName("body")[0];
             body.tabIndex = -1;
             if (event.key === "Escape") {
@@ -31186,6 +31217,7 @@ var ChatWidget = function (props) {
         return visible ? "visible" : "";
     }
     function refreshOnClick() {
+        closeModal();
         innerDispatch(reset());
     }
     function minimizeOnClick() {
@@ -31211,15 +31243,17 @@ var ChatWidget = function (props) {
             type: "chat.msg",
             user: {
                 displayName: "Chat Agent",
-                nick: "agent:offline",
+                nick: "agent:offline"
             },
             timestamp: +new Date(),
-            msg: { text: "Sorry, we are offline at the moment. Please leave us your contact information and we will get back to you soon!" }
+            msg: {
+                text: "Sorry, we are offline at the moment. Please leave us your contact information and we will get back to you soon!"
+            }
         });
         messages.push({
             type: "chat.offline",
             user: {
-                nick: "agent:offline",
+                nick: "agent:offline"
             },
             timestamp: +new Date()
         });
@@ -31230,7 +31264,7 @@ var ChatWidget = function (props) {
             messages.push({
                 type: "chat.prechat",
                 user: {
-                    nick: "agent:offline",
+                    nick: "agent:offline"
                 },
                 timestamp: +new Date()
             });
@@ -31248,12 +31282,14 @@ var ChatWidget = function (props) {
     return (React__default$1["default"].createElement(React__default$1["default"].Fragment, null,
         React__default$1["default"].createElement("div", { className: "widget-container ".concat(modeClass, " ").concat(getVisibilityClass()) },
             React__default$1["default"].createElement(WidgetStylesheet, { theme: config === null || config === void 0 ? void 0 : config.theme }),
-            React__default$1["default"].createElement(ChatHeader, { accountStatus: chatState.accountStatus, refreshOnClick: refreshOnClick, minimizeOnClick: minimizeOnClick, cancelOnClick: cancelOnClick, agent: (_o = chatState.agents["agent:robot"]) === null || _o === void 0 ? void 0 : _o.user, canRefresh: canRefresh, canMinimize: canMinimize, canCancel: canCancel, config: config === null || config === void 0 ? void 0 : config.header, menuConfig: config.menu, onSubmit: handleOnSubmit }),
+            React__default$1["default"].createElement(ChatHeader, { accountStatus: chatState.accountStatus, refreshOnClick: openModal, minimizeOnClick: minimizeOnClick, cancelOnClick: cancelOnClick, agent: ((_o = chatState.agents["agent:robot"]) === null || _o === void 0 ? void 0 : _o.user) || (config === null || config === void 0 ? void 0 : config.agent), canRefresh: canRefresh, canMinimize: canMinimize, canCancel: canCancel, config: config === null || config === void 0 ? void 0 : config.header, menuConfig: config.menu, onSubmit: handleOnSubmit }),
             React__default$1["default"].createElement(MessageList, { visible: visible, queuePosition: chatState.queuePosition, isChatting: chatState.isChatting, isOffline: isOffline, messages: messages, agents: chatState.agents, lastRatingRequestTimestamp: chatState.lastRatingRequestTimestamp, hasRating: chatState.hasRating, visitorId: chatState.visitorId, messageMiddleware: props.messageMiddleware, textTypingStatusEnabled: (_q = (_p = props.config) === null || _p === void 0 ? void 0 : _p.typingStatus) === null || _q === void 0 ? void 0 : _q.textTypingStatusEnabled, onSend: handleSendMessage, onWrite: handleWriteMessage, onOpenUrl: handleOpenUrl }),
             React__default$1["default"].createElement("div", { className: "spinner-container ".concat(visible && connectionStatus === "pending" ? "visible" : "") },
                 React__default$1["default"].createElement("div", { className: "spinner" })),
             connectionStatus === "offline" && React__default$1["default"].createElement(ServerOffline, null),
-            React__default$1["default"].createElement(ChatFooter, { isChatting: chatState.isChatting, placeholder: (_r = config === null || config === void 0 ? void 0 : config.input) === null || _r === void 0 ? void 0 : _r.placeholder, sendButtonIcon: (_t = (_s = config === null || config === void 0 ? void 0 : config.footer) === null || _s === void 0 ? void 0 : _s.sendButton) === null || _t === void 0 ? void 0 : _t.icon, visible: visible, menuConfig: props.config.menu, footerConfig: (_u = props.config) === null || _u === void 0 ? void 0 : _u.footer, inputConfig: (_v = props.config) === null || _v === void 0 ? void 0 : _v.input, onChange: handleOnChange, onSubmit: handleOnSubmit, onFileUpload: handleFileUpload })),
+            React__default$1["default"].createElement(ChatFooter, { isChatting: chatState.isChatting, placeholder: (_r = config === null || config === void 0 ? void 0 : config.input) === null || _r === void 0 ? void 0 : _r.placeholder, sendButtonIcon: (_t = (_s = config === null || config === void 0 ? void 0 : config.footer) === null || _s === void 0 ? void 0 : _s.sendButton) === null || _t === void 0 ? void 0 : _t.icon, visible: visible, menuConfig: props.config.menu, footerConfig: (_u = props.config) === null || _u === void 0 ? void 0 : _u.footer, inputConfig: (_v = props.config) === null || _v === void 0 ? void 0 : _v.input, onChange: handleOnChange, onSubmit: handleOnSubmit, onFileUpload: handleFileUpload }),
+            React__default$1["default"].createElement("div", { className: "restartModal", ref: modalRef, onClick: closeModal },
+                React__default$1["default"].createElement(ModalContent, { onClose: closeModal, onReset: refreshOnClick }))),
         React__default$1["default"].createElement(ChatButton, { addClass: getVisibilityClass(), onClick: chatButtonOnClick, config: (_w = props.config) === null || _w === void 0 ? void 0 : _w.cta, visible: visible })));
 };