@carbon/ai-chat 0.4.0-rc.2 → 0.4.0-rc.3

package/dist/es/chat/shared/containers/main/MainWindow.js

@@ -1,708 +0,0 @@
-import "intl-pluralrules";
-
-import cx from "classnames";
-
-import FocusTrap from "focus-trap-react";
-
-import React, { Component, Suspense } from "react";
-
-import { connect } from "react-redux";
-
-import { HydrationPanel } from "../../components/HydrationPanel.js";
-
-import { OverlayPanel, OverlayPanelName } from "../../components/OverlayPanel.js";
-
-import { CustomPanel as CustomPanelExport } from "../../components/panels/CustomPanel.js";
-
-import { HideComponent } from "../../components/util/HideComponent.js";
-
-import VisuallyHidden from "../../components/util/VisuallyHidden.js";
-
-import { ModalPortalRootContext } from "../../contexts/ModalPortalRootContext.js";
-
-import actions from "../../store/actions.js";
-
-import { selectIsInputToAgent, selectInputState, selectAgentDisplayState } from "../../store/selectors.js";
-
-import { AnimationOutType, AnimationInType } from "../../../../types/utilities/Animation.js";
-
-import { ChatWidthBreakpoint } from "../../../../types/state/AppState.js";
-
-import { addClassNameToState, removeClassNameFromState } from "../../../../types/utilities/HasAddRemoveClassName.js";
-
-import { IS_MOBILE, IS_IOS } from "../../utils/browserUtils.js";
-
-import "../../utils/constants.js";
-
-import { doFocusRef, SCROLLBAR_WIDTH } from "../../utils/domUtils.js";
-
-import { arrayLastValue } from "../../utils/lang/arrayUtils.js";
-
-import { createMessageRequestForText, createMessageRequestForChoice } from "../../utils/messageUtils.js";
-
-import { consoleError, createDidCatchErrorData } from "../../utils/miscUtils.js";
-
-import { MessageSendSource, MainWindowCloseReason } from "../../../../types/events/eventBusTypes.js";
-
-import { lazyChat, lazyCatastrophicError, lazyDisclaimer, lazyHomeScreenContainer, lazyIFramePanel, lazyViewSourcePanel, lazyBodyAndFooterPanelComponent } from "../../../dynamic-imports/dynamic-imports.js";
-
-import { ViewType } from "../../../../types/instance/apiTypes.js";
-
-import { CornersType } from "../../../../types/config/CornersType.js";
-
-/*
- *  Copyright IBM Corp. 2025
- *
- *  This source code is licensed under the Apache-2.0 license found in the
- *  LICENSE file in the root directory of this source tree.
- *
- *  @license
- */ const Chat = lazyChat();
-
-const CatastrophicError = lazyCatastrophicError();
-
-const Disclaimer = lazyDisclaimer();
-
-const HomeScreenContainer = lazyHomeScreenContainer();
-
-const IFramePanel = lazyIFramePanel();
-
-const ViewSourcePanel = lazyViewSourcePanel();
-
-const BodyAndFooterPanelComponent = lazyBodyAndFooterPanelComponent();
-
-const WIDTH_BREAKPOINT_STANDARD = "WAC--standardWidth";
-
-const WIDTH_BREAKPOINT_NARROW = "WAC--narrowWidth";
-
-const WIDTH_BREAKPOINT_WIDE = "WAC--wideWidth";
-
-class MainWindow extends Component {
-  constructor() {
-    super(...arguments);
-    this.state = {
-      closing: false,
-      open: this.props.persistedToBrowserStorage.launcherState.viewState.mainWindow,
-      modalPortalHostElement: null,
-      numPanelsOpen: 0,
-      numPanelsAnimating: 0,
-      numPanelsCovering: 0,
-      isHydrationAnimationComplete: this.props.isHydrated,
-      shouldAutoFocus: this.props.config.public.shouldTakeFocusIfOpensAutomatically,
-      extraClassNames: [],
-      areModulesLoaded: false
-    };
-    this.mainWindowRef = React.createRef();
-    this.containerRef = React.createRef();
-    this.botChatRef = React.createRef();
-    this.homeScreenInputRef = React.createRef();
-    this.disclaimerRef = React.createRef();
-    this.brandingRef = React.createRef();
-    this.animationContainerRef = React.createRef();
-    this.iframePanelRef = React.createRef();
-    this.viewSourcePanelRef = React.createRef();
-    this.previousBodyVisibility = undefined;
-    this.previousBodyPosition = undefined;
-    this.onResize = () => {
-      let appChatWidthBreakpoint;
-      const height = this.containerRef?.current?.offsetHeight;
-      const width = this.containerRef?.current?.offsetWidth;
-      if (width >= 672 + 16 + 16) {
-        appChatWidthBreakpoint = ChatWidthBreakpoint.WIDE;
-      } else if (width >= 360) {
-        appChatWidthBreakpoint = ChatWidthBreakpoint.STANDARD;
-      } else {
-        appChatWidthBreakpoint = ChatWidthBreakpoint.NARROW;
-      }
-      this.props.serviceManager.store.dispatch(actions.setAppStateValue("chatWidth", width));
-      this.props.serviceManager.store.dispatch(actions.setAppStateValue("chatHeight", height));
-      this.props.serviceManager.store.dispatch(actions.setAppStateValue("chatWidthBreakpoint", appChatWidthBreakpoint));
-    };
-    this.onVisualViewportResize = () => {
-      this.updateFromVisualViewport();
-    };
-    this.updateFromVisualViewport = () => {
-      const element = this.props.serviceManager.container;
-      const {visualViewport: visualViewport} = window;
-      if (visualViewport) {
-        element.style.setProperty("--cds-chat-viewport-height", `${visualViewport.height}px`);
-        element.style.setProperty("--cds-chat-viewport-width", `${visualViewport.width}px`);
-        element.style.setProperty("--cds-chat-viewport-offsetTop", `${visualViewport.offsetTop}px`);
-        element.style.setProperty("--cds-chat-viewport-offsetLeft", `${visualViewport.offsetLeft}px`);
-      } else {
-        const height = "100vh";
-        element.style.setProperty("--cds-chat-viewport-height", height);
-        element.style.setProperty("--cds-chat-viewport-width", "100vw");
-        element.style.setProperty("--cds-chat-viewport-offsetTop", "0");
-        element.style.setProperty("--cds-chat-viewport-offsetLeft", "0");
-      }
-    };
-    this.setModalPortalHostElement = ref => {
-      if (this.state.modalPortalHostElement !== ref) {
-        this.setState({
-          modalPortalHostElement: ref
-        });
-      }
-    };
-    this.onSendInput = async (text, source, options) => {
-      const isInputToAgent = selectIsInputToAgent(this.props);
-      const {serviceManager: serviceManager} = this.props;
-      const state = serviceManager.store.getState();
-      const {files: files} = selectInputState(state);
-      if (isInputToAgent) {
-        serviceManager.humanAgentService.sendMessageToAgent(text, files);
-      } else {
-        const messageRequest = createMessageRequestForText(text);
-        serviceManager.actions.sendWithCatch(messageRequest, source, {
-          ...options
-        });
-      }
-      if (files.length) {
-        serviceManager.store.dispatch(actions.clearInputFiles(isInputToAgent));
-      }
-    };
-    this.onSendHomeButtonInput = input => {
-      const messageRequest = createMessageRequestForChoice(input);
-      this.props.serviceManager.actions.sendWithCatch(messageRequest, MessageSendSource.HOME_SCREEN_STARTER);
-    };
-    this.removeChatFromDom = () => {
-      this.containerRef.current.removeEventListener("animationend", this.removeChatFromDom);
-      this.setState({
-        open: false,
-        closing: false
-      });
-    };
-    this.onRestart = async () => {
-      await this.props.serviceManager.actions.restartConversation();
-      this.requestFocus();
-    };
-    this.onClose = async () => this.doClose(false);
-    this.onCloseAndRestart = async () => this.doClose(true);
-    this.onToggleHomeScreen = () => {
-      this.props.serviceManager.store.dispatch(actions.toggleHomeScreen());
-    };
-    this.requestFocus = () => {
-      try {
-        if (this.state.shouldAutoFocus && !IS_MOBILE) {
-          if (this.getShowDisclaimer()) {
-            if (this.disclaimerRef.current) {
-              doFocusRef(this.disclaimerRef);
-            }
-          } else if (this.getShowHomeScreen()) {
-            if (this.homeScreenInputRef.current) {
-              this.homeScreenInputRef.current.takeFocus();
-            }
-          } else if (this.props.iFramePanelState.isOpen) {
-            if (this.iframePanelRef.current) {
-              this.iframePanelRef.current.requestFocus();
-            }
-          } else if (this.botChatRef.current) {
-            this.botChatRef.current.requestInputFocus();
-          }
-        }
-      } catch (error) {
-        consoleError("An error occurred in MainWindow.requestFocus", error);
-      }
-    };
-    this.onUserTyping = isTyping => {
-      if (this.props.serviceManager.store.getState().persistedToBrowserStorage.chatState.agentState.isConnected) {
-        this.props.serviceManager.humanAgentService.userTyping(isTyping);
-      }
-    };
-    this.onAcceptDisclaimer = () => {
-      this.props.serviceManager.store.dispatch(actions.acceptDisclaimer());
-    };
-    this.onPanelOpenStart = coverBackground => {
-      this.setState(prevState => ({
-        numPanelsOpen: prevState.numPanelsOpen + 1,
-        numPanelsAnimating: prevState.numPanelsAnimating + 1,
-        numPanelsCovering: prevState.numPanelsCovering + (coverBackground ? 1 : 0)
-      }), this.requestFocus);
-    };
-    this.onPanelOpenEnd = () => {
-      this.setState(prevState => ({
-        numPanelsAnimating: prevState.numPanelsAnimating - 1
-      }));
-    };
-    this.onPanelCloseStart = () => {
-      this.setState(prevState => ({
-        numPanelsAnimating: prevState.numPanelsAnimating + 1
-      }), this.requestFocus);
-    };
-    this.onPanelCloseEnd = coverBackground => {
-      this.setState(prevState => ({
-        numPanelsOpen: prevState.numPanelsOpen - 1,
-        numPanelsAnimating: prevState.numPanelsAnimating - 1,
-        numPanelsCovering: prevState.numPanelsCovering - (coverBackground ? 1 : 0)
-      }));
-    };
-    this.onHydrationPanelClose = () => {
-      this.setState({
-        isHydrationAnimationComplete: true
-      }, this.requestFocus);
-    };
-  }
-  componentDidMount() {
-    const {persistedToBrowserStorage: persistedToBrowserStorage, config: config, serviceManager: serviceManager, mainWindowRef: mainWindowRef} = this.props;
-    const {viewState: viewState} = persistedToBrowserStorage.launcherState;
-    const {public: publicConfig} = config;
-    serviceManager.mainWindow = this;
-    mainWindowRef.current = this;
-    this.mainWindowObserver = new ResizeObserver(this.onResize);
-    this.mainWindowObserver.observe(this.containerRef.current);
-    if (IS_MOBILE && !publicConfig.disableCustomElementMobileEnhancements) {
-      const {visualViewport: visualViewport} = window;
-      if (visualViewport) {
-        visualViewport.addEventListener("resize", this.onVisualViewportResize);
-        visualViewport.addEventListener("scroll", this.updateFromVisualViewport);
-      }
-      this.updateFromVisualViewport();
-      this.updateBody(false);
-    }
-    this.containerRef.current.style.setProperty("--cds-chat-scrollbar-width", `${SCROLLBAR_WIDTH()}px`);
-    if (viewState.mainWindow) {
-      this.loadPanels();
-    }
-  }
-  componentWillUnmount() {
-    this.mainWindowObserver.unobserve(this.containerRef.current);
-  }
-  destroy() {
-    if (IS_MOBILE && !this.props.config.public.disableCustomElementMobileEnhancements) {
-      const {visualViewport: visualViewport} = window;
-      if (visualViewport) {
-        visualViewport.removeEventListener("resize", this.onVisualViewportResize);
-        visualViewport.removeEventListener("scroll", this.updateFromVisualViewport);
-      }
-    }
-    this.updateBody(true);
-  }
-  componentDidUpdate(oldProps, oldState) {
-    const newProps = this.props;
-    const newState = this.state;
-    const {persistedToBrowserStorage: persistedToBrowserStorage, useCustomHostElement: useCustomHostElement, isDestroyed: isDestroyed} = newProps;
-    const {viewState: viewState} = persistedToBrowserStorage.launcherState;
-    const {open: open} = newState;
-    const prevViewState = oldProps.persistedToBrowserStorage.launcherState.viewState;
-    if (viewState.mainWindow !== prevViewState.mainWindow) {
-      this.updateBody(false);
-      this.updateFromVisualViewport();
-    }
-    if (isDestroyed && !oldProps.isDestroyed) {
-      this.destroy();
-    }
-    if ((oldState.areModulesLoaded !== newState.areModulesLoaded || oldProps.isHydrated !== newProps.isHydrated) && newProps.isHydrated && newState.areModulesLoaded) {
-      this.setState({
-        isHydrationAnimationComplete: true
-      }, () => {
-        requestAnimationFrame(() => {
-          this.requestFocus();
-        });
-      });
-    }
-    if (viewState.mainWindow && (!prevViewState.mainWindow || !open)) {
-      this.setState({
-        open: true
-      }, () => {
-        this.requestFocus();
-      });
-      this.loadPanels();
-    } else if (!viewState.mainWindow && prevViewState.mainWindow && oldState.open && open) {
-      this.setState({
-        closing: true
-      });
-      if (useCustomHostElement) {
-        this.removeChatFromDom();
-      } else {
-        this.containerRef.current.addEventListener("animationend", this.removeChatFromDom);
-        this.requestFocus();
-      }
-    }
-    if (newProps.config.public.shouldTakeFocusIfOpensAutomatically) {
-      if (!oldProps.persistedToBrowserStorage.chatState.hasSentNonWelcomeMessage && newProps.persistedToBrowserStorage.chatState.hasSentNonWelcomeMessage && !this.state.shouldAutoFocus) {
-        this.setState({
-          shouldAutoFocus: true
-        });
-      } else if (oldProps.botMessageState.localMessageIDs.length > newProps.botMessageState.localMessageIDs.length && this.state.shouldAutoFocus) {
-        this.setState({
-          shouldAutoFocus: false
-        });
-      } else if (oldProps.botMessageState.localMessageIDs.length < newProps.botMessageState.localMessageIDs.length && !this.state.shouldAutoFocus) {
-        this.setState({
-          shouldAutoFocus: true
-        });
-      }
-    }
-    const newLastItemID = arrayLastValue(newProps.botMessageState.localMessageIDs);
-    const oldLastItemID = arrayLastValue(oldProps.botMessageState.localMessageIDs);
-    if (newLastItemID !== oldLastItemID && newState.shouldAutoFocus) {
-      const lastMessageItem = newProps.allMessageItemsByID[newLastItemID];
-      const lastMessage = newProps.allMessagesByID[lastMessageItem?.fullMessageID];
-      if (!lastMessage?.history?.from_history) {
-        this.requestFocus();
-      }
-    }
-  }
-  componentDidCatch(error, errorInfo) {
-    this.props.serviceManager.actions.errorOccurred(createDidCatchErrorData("MainWindow", error, errorInfo, true));
-  }
-  loadPanels() {
-    Promise.all([ Chat.preload(), CatastrophicError.preload(), Disclaimer.preload(), HomeScreenContainer.preload(), IFramePanel.preload(), ViewSourcePanel.preload(), BodyAndFooterPanelComponent.preload() ]).then(() => {
-      this.setState({
-        areModulesLoaded: true
-      });
-    });
-  }
-  updateBody(unmounting) {
-    if (IS_IOS && !this.props.config.public.disableCustomElementMobileEnhancements) {
-      if ((window.screen.width <= 500 || window.screen.height <= 500) && this.props.persistedToBrowserStorage.launcherState.viewState.mainWindow && !unmounting) {
-        this.previousBodyVisibility = document.body.style.getPropertyValue("visibility");
-        this.previousBodyPosition = document.body.style.getPropertyValue("position");
-        document.body.style.setProperty("visibility", "hidden", "important");
-        document.body.style.setProperty("position", "fixed", "important");
-      } else {
-        document.body.style.setProperty("visibility", this.previousBodyVisibility);
-        document.body.style.setProperty("position", this.previousBodyPosition);
-      }
-    }
-  }
-  async doClose(fromCloseAndRestart) {
-    const {serviceManager: serviceManager} = this.props;
-    const {activeTour: activeTour} = serviceManager.store.getState().persistedToBrowserStorage.launcherState;
-    if (fromCloseAndRestart) {
-      const newViewState = await serviceManager.actions.changeView(ViewType.LAUNCHER, {
-        mainWindowCloseReason: MainWindowCloseReason.MAIN_WINDOW_CLOSED_AND_RESTARTED
-      });
-      if (!newViewState.mainWindow) {
-        await serviceManager.actions.restartConversation();
-      }
-    } else {
-      await serviceManager.actions.changeView(activeTour ? ViewType.TOUR : ViewType.LAUNCHER, {
-        mainWindowCloseReason: MainWindowCloseReason.DEFAULT_MINIMIZE
-      });
-    }
-  }
-  getShowHomeScreen() {
-    return this.props.homeScreenConfig.is_on && this.props.persistedToBrowserStorage.chatState.homeScreenState.isHomeScreenOpen && !this.getShowDisclaimer();
-  }
-  getShowDisclaimer() {
-    return this.props.config.public.disclaimer?.is_on && !this.props.persistedToBrowserStorage.chatState.disclaimersAccepted[window.location.hostname];
-  }
-  doAutoScroll(options) {
-    this.botChatRef?.current?.doAutoScroll(options);
-  }
-  getMessagesScrollBottom() {
-    return this.botChatRef?.current?.getMessagesScrollBottom();
-  }
-  doScrollToMessage(messageID, animate = true) {
-    this.botChatRef.current?.doScrollToMessage(messageID, animate);
-  }
-  getMessageInput() {
-    return this.botChatRef.current?.getMessageInput();
-  }
-  getHomeScreenInput() {
-    return this.homeScreenInputRef.current?.getMessageInput();
-  }
-  addClassName(name) {
-    this.setState(addClassNameToState(name));
-  }
-  removeClassName(name) {
-    this.setState(removeClassNameFromState(name));
-  }
-  renderChat() {
-    const {isHydrated: isHydrated, config: config, chatWidthBreakpoint: chatWidthBreakpoint} = this.props;
-    const {areModulesLoaded: areModulesLoaded} = this.state;
-    const showCovering = this.state.numPanelsCovering > 0 && config.public.layout?.hasContentMaxWidth && chatWidthBreakpoint === ChatWidthBreakpoint.WIDE;
-    return React.createElement("div", {
-      className: "WACWidget--content"
-    }, this.renderCustomPanel(), this.renderHydrationPanel(), isHydrated && areModulesLoaded && React.createElement(React.Fragment, null, this.renderDisclaimerPanel(), this.renderResponsePanel(), this.renderHomeScreenPanel(), this.renderIFramePanel(), this.renderViewSourcePanel(), showCovering && React.createElement("div", {
-      className: "WACBackgroundCover"
-    }), this.renderBotChat()));
-  }
-  renderBotChat() {
-    const {botName: botName, languagePack: languagePack, config: config, serviceManager: serviceManager, botMessageState: botMessageState, agentState: agentState, allMessageItemsByID: allMessageItemsByID, isHydrated: isHydrated, locale: locale, theme: theme, headerDisplayName: headerDisplayName, headerAvatarConfig: headerAvatar} = this.props;
-    const {numPanelsAnimating: numPanelsAnimating, numPanelsOpen: numPanelsOpen, isHydrationAnimationComplete: isHydrationAnimationComplete} = this.state;
-    const inputState = selectInputState(this.props);
-    const agentDisplayState = selectAgentDisplayState(this.props);
-    const showDisclaimer = this.getShowDisclaimer();
-    let hideBotContainer;
-    if (!isHydrationAnimationComplete) {
-      hideBotContainer = true;
-    } else if (numPanelsAnimating > 0) {
-      hideBotContainer = false;
-    } else if (numPanelsOpen > 0) {
-      hideBotContainer = true;
-    }
-    return React.createElement(HideComponent, {
-      className: "WACBotContainer",
-      hidden: hideBotContainer
-    }, React.createElement(Suspense, {
-      fallback: null
-    }, React.createElement(Chat, {
-      botName: botName,
-      headerDisplayName: headerDisplayName,
-      headerAvatarConfig: headerAvatar,
-      ref: this.botChatRef,
-      languagePack: languagePack,
-      config: config,
-      serviceManager: serviceManager,
-      onClose: this.onClose,
-      onCloseAndRestart: this.onCloseAndRestart,
-      messageState: botMessageState,
-      onSendInput: text => this.onSendInput(text, MessageSendSource.MESSAGE_INPUT),
-      agentState: agentState,
-      agentDisplayState: agentDisplayState,
-      allMessageItemsByID: allMessageItemsByID,
-      onRestart: this.onRestart,
-      isHydrated: isHydrated,
-      isHydrationAnimationComplete: isHydrationAnimationComplete && !showDisclaimer,
-      inputState: inputState,
-      onToggleHomeScreen: this.onToggleHomeScreen,
-      onUserTyping: this.onUserTyping,
-      locale: locale,
-      useAITheme: theme.useAITheme,
-      carbonTheme: theme.carbonTheme
-    })));
-  }
-  renderInnerHydrationPanel() {
-    const {botMessageState: botMessageState, serviceManager: serviceManager, languagePack: languagePack, headerDisplayName: headerDisplayName, persistedToBrowserStorage: persistedToBrowserStorage, homeScreenConfig: homeScreenConfig} = this.props;
-    const {areModulesLoaded: areModulesLoaded} = this.state;
-    const useHomeScreenVersion = homeScreenConfig.is_on && !persistedToBrowserStorage.launcherState.hasSentNonWelcomeMessage;
-    return React.createElement(HydrationPanel, {
-      headerDisplayName: headerDisplayName,
-      isHydrated: botMessageState.isHydratingCounter === 0 && areModulesLoaded,
-      serviceManager: serviceManager,
-      onClose: this.onClose,
-      languagePack: languagePack,
-      useHomeScreenVersion: useHomeScreenVersion
-    });
-  }
-  renderHydrationPanel() {
-    const {botMessageState: botMessageState, serviceManager: serviceManager, catastrophicErrorType: catastrophicErrorType, persistedToBrowserStorage: persistedToBrowserStorage} = this.props;
-    const {viewState: viewState} = persistedToBrowserStorage.launcherState;
-    const {areModulesLoaded: areModulesLoaded} = this.state;
-    return React.createElement(OverlayPanel, {
-      onOpenStart: () => this.onPanelOpenStart(false),
-      onCloseStart: this.onPanelCloseStart,
-      onOpenEnd: this.onPanelOpenEnd,
-      onCloseEnd: () => {
-        this.onHydrationPanelClose();
-        this.onPanelCloseEnd(false);
-      },
-      animationOnOpen: AnimationInType.NONE,
-      animationOnClose: AnimationOutType.NONE,
-      shouldOpen: (botMessageState.isHydratingCounter > 0 || !areModulesLoaded) && !catastrophicErrorType && viewState.mainWindow,
-      shouldHide: false,
-      serviceManager: serviceManager,
-      overlayPanelName: OverlayPanelName.HYDRATING
-    }, this.renderInnerHydrationPanel());
-  }
-  renderCatastrophicPanel() {
-    const {serviceManager: serviceManager, botName: botName, languagePack: languagePack, headerDisplayName: headerDisplayName} = this.props;
-    return React.createElement(OverlayPanel, {
-      animationOnOpen: AnimationInType.NONE,
-      animationOnClose: AnimationOutType.NONE,
-      shouldOpen: true,
-      serviceManager: serviceManager,
-      overlayPanelName: OverlayPanelName.CATASTROPHIC
-    }, React.createElement(Suspense, {
-      fallback: null
-    }, React.createElement(CatastrophicError, {
-      onClose: this.onClose,
-      headerDisplayName: headerDisplayName,
-      languagePack: languagePack,
-      onRestart: this.onRestart,
-      showHeader: true,
-      botName: botName
-    })));
-  }
-  renderDisclaimerPanel() {
-    const {serviceManager: serviceManager, config: config} = this.props;
-    const showDisclaimer = this.getShowDisclaimer();
-    return config.public.disclaimer?.is_on ? React.createElement(OverlayPanel, {
-      onOpenStart: () => this.onPanelOpenStart(false),
-      onCloseStart: this.onPanelCloseStart,
-      onOpenEnd: this.onPanelOpenEnd,
-      onCloseEnd: () => this.onPanelCloseEnd(false),
-      animationOnOpen: AnimationInType.FADE_IN,
-      animationOnClose: AnimationOutType.FADE_OUT,
-      shouldOpen: showDisclaimer,
-      serviceManager: serviceManager,
-      overlayPanelName: OverlayPanelName.DISCLAIMER
-    }, React.createElement(Suspense, {
-      fallback: null
-    }, React.createElement(Disclaimer, {
-      onAcceptDisclaimer: this.onAcceptDisclaimer,
-      onClose: this.onClose,
-      disclaimerHTML: config.public.disclaimer?.disclaimerHTML,
-      disclaimerAcceptButtonRef: this.disclaimerRef
-    }))) : null;
-  }
-  renderHomeScreenPanel() {
-    const {isHydrationAnimationComplete: isHydrationAnimationComplete} = this.state;
-    const showHomeScreen = this.getShowHomeScreen();
-    return React.createElement(Suspense, {
-      fallback: null
-    }, React.createElement(HomeScreenContainer, {
-      onPanelOpenStart: () => this.onPanelOpenStart(false),
-      onPanelOpenEnd: this.onPanelOpenEnd,
-      onPanelCloseStart: this.onPanelCloseStart,
-      onPanelCloseEnd: () => this.onPanelCloseEnd(false),
-      onClose: this.onClose,
-      onCloseAndRestart: this.onCloseAndRestart,
-      onSendBotInput: text => this.onSendInput(text, MessageSendSource.HOME_SCREEN_INPUT),
-      onSendButtonInput: this.onSendHomeButtonInput,
-      onRestart: this.onRestart,
-      showHomeScreen: showHomeScreen,
-      isHydrationAnimationComplete: isHydrationAnimationComplete,
-      homeScreenInputRef: this.homeScreenInputRef,
-      onToggleHomeScreen: this.onToggleHomeScreen,
-      requestFocus: this.requestFocus
-    }));
-  }
-  renderIFramePanel() {
-    const {serviceManager: serviceManager, iFramePanelState: iFramePanelState} = this.props;
-    return React.createElement(OverlayPanel, {
-      className: "WAC__overlay--covering",
-      onOpenStart: () => this.onPanelOpenStart(true),
-      onCloseStart: this.onPanelCloseStart,
-      onOpenEnd: this.onPanelOpenEnd,
-      onCloseEnd: () => this.onPanelCloseEnd(true),
-      animationOnOpen: AnimationInType.SLIDE_IN_FROM_BOTTOM,
-      animationOnClose: AnimationOutType.SLIDE_OUT_TO_BOTTOM,
-      shouldOpen: iFramePanelState.isOpen,
-      serviceManager: serviceManager,
-      overlayPanelName: OverlayPanelName.IFRAME
-    }, React.createElement(Suspense, {
-      fallback: null
-    }, React.createElement(IFramePanel, {
-      useAITheme: this.props.theme.useAITheme,
-      ref: this.iframePanelRef,
-      onClickClose: this.onClose,
-      onClickRestart: this.onRestart,
-      onClickCloseAndRestart: this.onCloseAndRestart
-    })));
-  }
-  renderViewSourcePanel() {
-    const {serviceManager: serviceManager, viewSourcePanelState: viewSourcePanelState} = this.props;
-    return React.createElement(OverlayPanel, {
-      className: "WAC__overlay--covering",
-      onOpenStart: () => this.onPanelOpenStart(true),
-      onCloseStart: this.onPanelCloseStart,
-      onOpenEnd: this.onPanelOpenEnd,
-      onCloseEnd: () => this.onPanelCloseEnd(true),
-      animationOnOpen: AnimationInType.SLIDE_IN_FROM_BOTTOM,
-      animationOnClose: AnimationOutType.SLIDE_OUT_TO_BOTTOM,
-      shouldOpen: viewSourcePanelState.isOpen,
-      serviceManager: serviceManager,
-      overlayPanelName: OverlayPanelName.CONVERSATIONAL_SEARCH_CITATION
-    }, React.createElement(Suspense, {
-      fallback: null
-    }, React.createElement(ViewSourcePanel, {
-      ref: this.viewSourcePanelRef,
-      onClickClose: this.onClose,
-      onClickRestart: this.onRestart,
-      onClickCloseAndRestart: this.onCloseAndRestart
-    })));
-  }
-  renderCustomPanel() {
-    return React.createElement(CustomPanelExport, {
-      useAITheme: this.props.theme.useAITheme,
-      onClose: this.onClose,
-      onClickRestart: this.onRestart,
-      onCloseAndRestart: this.onCloseAndRestart,
-      onPanelOpenStart: () => this.onPanelOpenStart(true),
-      onPanelOpenEnd: this.onPanelOpenEnd,
-      onPanelCloseStart: this.onPanelCloseStart,
-      onPanelCloseEnd: () => this.onPanelCloseEnd(true)
-    });
-  }
-  renderResponsePanel() {
-    if (!this.props.responsePanelState.localMessageItem) {
-      return null;
-    }
-    const {isOpen: isOpen, localMessageItem: localMessageItem, isMessageForInput: isMessageForInput} = this.props.responsePanelState;
-    const panelOptions = (localMessageItem?.item).panel;
-    const eventName = `"Show panel" opened`;
-    const eventDescription = "Panel opened through panel response type";
-    const overlayPanelName = OverlayPanelName.PANEL_RESPONSE;
-    return React.createElement(Suspense, {
-      fallback: null
-    }, React.createElement(BodyAndFooterPanelComponent, {
-      eventName: eventName,
-      eventDescription: eventDescription,
-      overlayPanelName: overlayPanelName,
-      testIdPrefix: overlayPanelName,
-      isOpen: isOpen,
-      isMessageForInput: isMessageForInput,
-      localMessageItem: localMessageItem,
-      title: panelOptions?.title,
-      showAnimations: panelOptions?.show_animations,
-      useAITheme: this.props.theme.useAITheme,
-      requestFocus: this.requestFocus,
-      onClose: this.onClose,
-      onClickRestart: this.onRestart,
-      onCloseAndRestart: this.onCloseAndRestart,
-      onClickBack: () => this.props.serviceManager.store.dispatch(actions.setResponsePanelIsOpen(false)),
-      onPanelOpenStart: () => this.onPanelOpenStart(true),
-      onPanelOpenEnd: this.onPanelOpenEnd,
-      onPanelCloseStart: this.onPanelCloseStart,
-      onPanelCloseEnd: () => {
-        this.onPanelCloseEnd(true);
-        this.props.serviceManager.store.dispatch(actions.setResponsePanelContent(null, false));
-      }
-    }));
-  }
-  renderWidget() {
-    const {serviceManager: serviceManager, useCustomHostElement: useCustomHostElement, locale: locale, catastrophicErrorType: catastrophicErrorType, config: config, isHydrated: isHydrated, theme: theme, chatWidthBreakpoint: chatWidthBreakpoint, layout: layout, languagePack: languagePack} = this.props;
-    const {closing: closing, open: open, extraClassNames: extraClassNames} = this.state;
-    const localeClassName = `WACLocale-${locale || "en"}`;
-    const showGlass = config.public.enableFocusTrap && open && !config.public.hideCloseButton && !config.public.headerConfig.hideMinimizeButton;
-    const trapActive = Boolean(showGlass && isHydrated);
-    const isWideWidth = chatWidthBreakpoint === ChatWidthBreakpoint.WIDE;
-    return React.createElement(FocusTrap, {
-      active: trapActive
-    }, React.createElement("div", {
-      className: cx("WACMainWindow", "WACWidget__FocusTrapContainer", ...extraClassNames),
-      ref: this.mainWindowRef
-    }, showGlass && React.createElement("div", {
-      className: "WACWidget__FocusTrapGlass"
-    }), React.createElement("div", {
-      id: `WACWidget${serviceManager.namespace.suffix}`,
-      className: cx(`WACWidget ${localeClassName}`, {
-        "WACWidget--rounded": theme.corners === CornersType.ROUND,
-        "WACWidget--defaultElement": !useCustomHostElement,
-        "WACWidget--launched": !closing,
-        "WACWidget--closing": closing,
-        "WACWidget--closed": !open,
-        "WACWidget--maxWidth": isWideWidth && layout.hasContentMaxWidth,
-        [WIDTH_BREAKPOINT_NARROW]: chatWidthBreakpoint === ChatWidthBreakpoint.NARROW,
-        [WIDTH_BREAKPOINT_STANDARD]: chatWidthBreakpoint === ChatWidthBreakpoint.STANDARD,
-        [WIDTH_BREAKPOINT_WIDE]: isWideWidth
-      }),
-      ref: this.containerRef
-    }, React.createElement(VisuallyHidden, null, React.createElement("h1", null, languagePack.window_title)), catastrophicErrorType && this.renderCatastrophicPanel(), !catastrophicErrorType && React.createElement("div", {
-      ref: this.animationContainerRef,
-      className: "WACWidget__animationContainer",
-      onScroll: () => {
-        if (this.animationContainerRef.current.scrollTop !== 0) {
-          this.animationContainerRef.current.scrollTop = 0;
-        }
-      }
-    }, this.renderChat()), React.createElement("div", {
-      className: "WACMainWindowModalHost",
-      ref: this.setModalPortalHostElement
-    }))));
-  }
-  render() {
-    return React.createElement(ModalPortalRootContext.Provider, {
-      value: this.state.modalPortalHostElement
-    }, this.renderWidget());
-  }
-}
-
-var MainWindow$1 = connect(state => state, null, null, {
-  forwardRef: true
-})(MainWindow);
-
-export { MainWindow$1 as default };