@envive-ai/react-widgets-v3 0.3.25 → 0.3.26

package/dist/widgets/TypingAnimationWidget/TypingAnimationWidget.d.ts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.js";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime18 from "react/jsx-runtime";
 
 //#region src/widgets/TypingAnimationWidget/TypingAnimationWidget.d.ts
 declare const TypingAnimationWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime0.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime18.JSX.Element;
   displayName: string;
 };
 interface TypingAnimationWidgetProps {
@@ -12,7 +12,7 @@ interface TypingAnimationWidgetProps {
 declare const TypingAnimationWidget: {
   ({
     widgetConfigId
-  }: TypingAnimationWidgetProps): react_jsx_runtime0.JSX.Element;
+  }: TypingAnimationWidgetProps): react_jsx_runtime18.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/TypingAnimationWidget/TypingAnimationWidget.js

@@ -1,17 +1,17 @@
 import { withBaseWidget } from "../../hocs/withBaseWidget/withBaseWidget.js";
 import "../../hocs/withBaseWidget/index.js";
 import { getStringIdForText } from "../utils/functions.js";
+import { useCallback } from "react";
+import { EnviveMetricsEventName, useAmplitude } from "@envive-ai/react-hooks/contexts/amplitudeContext";
+import { jsx } from "react/jsx-runtime";
 import { useSalesAgent } from "@envive-ai/react-hooks/contexts/salesAgentContext";
 import { WidgetTypeV3 } from "@envive-ai/react-hooks/contexts/typesV3";
 import { useChatToggle } from "@envive-ai/react-hooks/hooks/ChatToggle";
 import { useFeatureFlagService } from "@envive-ai/react-hooks/contexts/featureFlagServiceContext";
 import { ChatElementDisplayLocationV3, FeatureGates } from "@envive-ai/react-hooks/application/models";
-import { EnviveMetricsEventName, useAmplitude } from "@envive-ai/react-hooks/contexts/amplitudeContext";
 import { useWidgetInteraction } from "@envive-ai/react-hooks/hooks/WidgetInteraction";
 import { WidgetInteractionComponent, WidgetInteractionType } from "@envive-ai/react-hooks/hooks/WidgetInteraction/types";
 import { PromptCarouselRows, usePromptCarouselAnalytics } from "@envive-ai/react-toolkit-v3/PromptCarousel";
-import { useCallback } from "react";
-import { jsx } from "react/jsx-runtime";
 import { PromptButtonVariant } from "@envive-ai/react-toolkit-v3/PromptButton/types";
 import { TypingAnimation } from "@envive-ai/react-toolkit-v3/TypingAnimation";
 import { WidgetWrapperVariant } from "@envive-ai/react-toolkit-v3/WidgetWrapper";

package/dist/widgets/hooks/useGetWidgetStatus.cjs

@@ -1,8 +1,8 @@
 const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
 const require_functions = require('../utils/functions.cjs');
+let react = require("react");
 let __envive_ai_react_hooks_atoms_chat = require("@envive-ai/react-hooks/atoms/chat");
 let jotai = require("jotai");
-let react = require("react");
 let __envive_ai_react_hooks_atoms_chat_chatState = require("@envive-ai/react-hooks/atoms/chat/chatState");
 
 //#region src/widgets/hooks/useGetWidgetStatus.tsx

package/dist/widgets/hooks/useGetWidgetStatus.js

@@ -1,7 +1,7 @@
 import { isLoading, isProductComparison, userHasInteracted, userHasNotInteracted } from "../utils/functions.js";
+import { useMemo } from "react";
 import { chatAtom, lastAssistantMessageAtom } from "@envive-ai/react-hooks/atoms/chat";
 import { useAtomValue } from "jotai";
-import { useMemo } from "react";
 import { responseStreamingAtom } from "@envive-ai/react-hooks/atoms/chat/chatState";
 
 //#region src/widgets/hooks/useGetWidgetStatus.tsx

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@envive-ai/react-widgets-v3",
-  "version": "0.3.25",
+  "version": "0.3.26",
   "description": "React widget library v3 for Envive services.",
   "keywords": [
     "react",

package/src/CXIntegration/implementations/useTidioUnifiedCXButton.ts

@@ -3,6 +3,9 @@ import { useElementObserver } from '@envive-ai/react-hooks/hooks/ElementObserver
 import { FLOATING_BUTTON_ID } from '../../widgets/FloatingChatWidget/constants';
 import { CustomerServiceImplProps, UnifiedCXButton } from '../types';
 
+const CHAT_BUTTON_ID = 'tidio-chat';
+const CHAT_BUTTON_SELECTOR = 'id|tidio-chat @ id|button';
+
 declare global {
   interface Window {
     tidioChatApi?: {
@@ -16,21 +19,40 @@ interface UseTidioUnifiedCXButtonProps extends CustomerServiceImplProps {}
 
 export const useTidioUnifiedCXButton = ({
   onSwitchToAgent,
+  onCXClose,
+  suppressMerchantButton,
 }: UseTidioUnifiedCXButtonProps): UnifiedCXButton => {
-  const tidioButton = window.tidioChatApi;
+  const tidioApi = window.tidioChatApi;
   const enviveFloatingButton = useElementObserver(SelectorFactory.id(FLOATING_BUTTON_ID));
+  const tidioChatButton = useElementObserver(SelectorFactory.chain(CHAT_BUTTON_SELECTOR));
+  const tidioFrame = useElementObserver(SelectorFactory.id(CHAT_BUTTON_ID));
+
+  const chatButtonControl = (el: HTMLElement | null) => {
+    if (el) {
+      if (el.className.includes('chat-closed')) {
+        onCXClose?.();
+        if (suppressMerchantButton) {
+          tidioFrame.hide();
+        }
+        enviveFloatingButton.show();
+      }
+      if (el.className.includes('chat-open')) {
+        tidioFrame.show();
+        enviveFloatingButton.show();
+      }
+    }
+  };
+  tidioChatButton.onAdd(chatButtonControl);
+  tidioChatButton.onChange(chatButtonControl);
 
   const toggle = () => {
     onSwitchToAgent();
     enviveFloatingButton.hide();
-    if (tidioButton) {
-      tidioButton.open();
-    }
+    tidioFrame.show();
+    tidioApi?.open();
   };
 
-  const isTidioButtonEnabled = () => !!document.getElementById('tidio-chat-iframe');
-
-  const isSwitchEnabled = () => isTidioButtonEnabled();
+  const isSwitchEnabled = () => !!SelectorFactory.chain(CHAT_BUTTON_SELECTOR).parse();
 
   return {
     toggle,