@botonic/react 0.56.0-alpha.0 → 0.57.0-rslib-esm.1

package/lib/webchat/webchat.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/webchat.js","sources":["../../src/webchat/webchat.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-use-before-define */\nimport { BotonicAction, INPUT, params2queryString } from '@botonic/core'\nimport merge from 'lodash.merge'\nimport {\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react'\nimport { StyleSheetManager, ThemeProvider } from 'styled-components'\nimport { v7 as uuidv7 } from 'uuid'\n\nimport {\n  Audio,\n  Document,\n  Handoff,\n  Image,\n  normalizeWebchatSettings,\n  Text,\n  Video,\n  type WebchatSettingsProps,\n  type Webview,\n} from '../components'\nimport {\n  COLORS,\n  MAX_ALLOWED_SIZE_MB,\n  ROLES,\n  WEBCHAT,\n  WEBCHAT_DEFAULT_CONTENTS,\n} from '../constants'\nimport type { CloseWebviewOptions } from '../contexts'\nimport { SENDERS, type WebchatProps, type WebchatRef } from '../index-types'\nimport {\n  getMediaType,\n  isAllowedSize,\n  isAudio,\n  isDocument,\n  isImage,\n  isMedia,\n  isText,\n  isVideo,\n  readDataURL,\n} from '../message-utils'\nimport { msgToBotonic } from '../msg-to-botonic'\nimport { isDev } from '../util/environment'\nimport { deserializeRegex, stringifyWithRegexs } from '../util/regexs'\nimport {\n  _getThemeProperty,\n  getServerErrorMessage,\n  initSession,\n  shouldKeepSessionOnReload,\n  updateUserLocaleAndCountry,\n} from '../util/webchat'\nimport { ChatArea } from './chat-area'\nimport { OpenedPersistentMenu } from './components/opened-persistent-menu'\nimport { BotonicContainerId } from './constants'\nimport { useWebchat, WebchatContext, type WebchatState } from './context'\nimport { CoverComponent } from './cover-component'\nimport { WebchatHeader } from './header'\nimport {\n  useComponentWillMount,\n  usePrevious,\n  useScrollToBottom,\n  useTyping,\n} from './hooks'\nimport { InputPanel } from './input-panel'\nimport {\n  DarkBackgroundMenu,\n  ErrorMessage,\n  ErrorMessageContainer,\n  StyledWebchat,\n} from './styles'\nimport type { WebchatTheme } from './theme/types'\nimport { TriggerButton } from './trigger-button'\nimport { useStorageState } from './use-storage-state-hook'\nimport { getParsedAction } from './utils'\nimport { WebviewContainer } from './webview/index'\n\nconst Webchat = forwardRef<WebchatRef | null, WebchatProps>((props, ref) => {\n  const {\n    addMessage,\n    addMessageComponent,\n    clearMessages,\n    doRenderCustomComponent,\n    resetUnreadMessages,\n    setCurrentAttachment,\n    setError,\n    setIsInputFocused,\n    setLastMessageVisible,\n    setOnline,\n    toggleCoverComponent,\n    toggleEmojiPicker,\n    togglePersistentMenu,\n    toggleWebchat,\n    updateCustomMessageProps,\n    updateDevSettings,\n    updateHandoff,\n    updateLastMessageDate,\n    updateLastRoutePath,\n    updateLatestInput,\n    updateMessage,\n    updateReplies,\n    updateSession,\n    updateTheme,\n    updateTyping,\n    updateWebview,\n    removeWebview,\n    removeReplies,\n    webchatState,\n    webchatContainerRef,\n    chatAreaRef,\n    inputPanelRef,\n    headerRef,\n    repliesRef,\n    scrollableMessagesListRef,\n  } = props.webchatHooks || useWebchat(props.theme)\n\n  const contentsByLocale = props.contentsByLocale\n  const firstUpdate = useRef(true)\n  const isOnline = () => webchatState.online\n  const currentDateString = () => new Date().toISOString()\n  const theme = merge(webchatState.theme, props.theme)\n  const { initialSession, initialDevSettings, onStateChange } = props\n  const getThemeProperty = _getThemeProperty(theme)\n\n  const [customComponent, setCustomComponent] = useState(null)\n  const storage = props.storage\n  const storageKey =\n    typeof props.storageKey === 'function'\n      ? props.storageKey()\n      : props.storageKey\n\n  const [botonicState, saveState] = useStorageState(storage, storageKey)\n\n  const host = props.host || document.body\n\n  const { scrollToBottom } = useScrollToBottom({ host })\n\n  const saveWebchatState = (webchatState: WebchatState) => {\n    storage &&\n      saveState(\n        JSON.parse(\n          stringifyWithRegexs({\n            messages: webchatState.messagesJSON,\n            session: webchatState.session,\n            lastRoutePath: webchatState.lastRoutePath,\n            devSettings: webchatState.devSettings,\n            lastMessageUpdate: webchatState.lastMessageUpdate,\n            themeUpdates: webchatState.themeUpdates,\n          })\n        )\n      )\n  }\n\n  const handleAttachment = (event: any) => {\n    if (!isAllowedSize(event.target.files[0].size)) {\n      throw new Error(\n        `The file is too large. A maximum of ${MAX_ALLOWED_SIZE_MB}MB is allowed.`\n      )\n    }\n\n    // TODO: Attach more files?\n    setCurrentAttachment(event.target.files[0])\n  }\n\n  useEffect(() => {\n    if (webchatState.currentAttachment) {\n      sendAttachment(webchatState.currentAttachment)\n    }\n  }, [webchatState.currentAttachment])\n\n  const sendUserInput = async (input: any) => {\n    if (props.onUserInput) {\n      resetUnreadMessages()\n      scrollToBottom()\n      props.onUserInput({\n        user: webchatState.session.user,\n        // TODO: Review if this input.sentBy exists in the frontend\n        input: input,\n        //@ts-expect-error\n        session: webchatState.session,\n        // TODO: Review why we were passing lastRoutePath, is only for devMode?\n        lastRoutePath: webchatState.lastRoutePath,\n      })\n    }\n  }\n\n  // Load styles stored in window._botonicInsertStyles by Webpack\n  // biome-ignore lint/complexity/noExcessiveCognitiveComplexity: this is a complex useEffect that needs to be refactored, but it's not a problem for now\n  useComponentWillMount(() => {\n    if (window._botonicInsertStyles?.length) {\n      for (const botonicStyle of window._botonicInsertStyles) {\n        // Injecting styles at head is needed even if we use shadowDOM\n        // as some dependencies like simplebar rely on creating ephemeral elements\n        // on document.body and assume styles will be available globally\n        document.head.appendChild(botonicStyle)\n\n        // injecting styles in host node too so that shadowDOM works\n        if (props.shadowDOM) {\n          host.appendChild(botonicStyle.cloneNode(true))\n        }\n      }\n      delete window._botonicInsertStyles\n    }\n\n    if (props.shadowDOM) {\n      // emoji-picker-react injects styles in head, so we need to\n      // re-inject them in our host node to make it work with shadowDOM\n      for (const style of document.querySelectorAll('style')) {\n        if (style.textContent?.includes('emoji-picker-react')) {\n          host.appendChild(style.cloneNode(true))\n        }\n      }\n    }\n  })\n\n  // Load initial state from storage\n  useEffect(() => {\n    let {\n      messages,\n      session,\n      lastRoutePath,\n      devSettings,\n      lastMessageUpdate,\n      themeUpdates,\n    } = botonicState || {}\n    session = initSession(session)\n    updateSession(session)\n    if (shouldKeepSessionOnReload({ initialDevSettings, devSettings })) {\n      if (messages) {\n        messages.forEach(message => {\n          addMessage(message)\n          const newMessageComponent = msgToBotonic(\n            { ...message, delay: 0, typing: 0 },\n            props.theme?.message?.customTypes\n          )\n          if (newMessageComponent) {\n            addMessageComponent(newMessageComponent as any)\n          }\n        })\n      }\n      if (initialSession) {\n        updateSession(merge(initialSession, session))\n      }\n      if (lastRoutePath) {\n        updateLastRoutePath(lastRoutePath)\n      }\n    } else {\n      updateSession(merge(initialSession, session))\n    }\n    if (devSettings) {\n      updateDevSettings(devSettings)\n    } else if (initialDevSettings) {\n      updateDevSettings(initialDevSettings)\n    }\n\n    if (lastMessageUpdate) {\n      updateLastMessageDate(lastMessageUpdate)\n    }\n\n    if (themeUpdates !== undefined) {\n      updateTheme(merge(props.theme, themeUpdates), themeUpdates)\n    }\n\n    if (props.onInit) {\n      setTimeout(() => {\n        if (typeof props.onInit === 'function') {\n          props.onInit()\n          session.user = updateUserLocaleAndCountry(session.user)\n        }\n      }, 100)\n    }\n  }, [])\n\n  useEffect(() => {\n    if (!webchatState.isWebchatOpen) {\n      if (webchatState.isLastMessageVisible) {\n        resetUnreadMessages()\n      }\n      return\n    }\n  }, [webchatState.isWebchatOpen])\n\n  useEffect(() => {\n    const { messagesJSON, session } = webchatState\n    if (onStateChange && typeof onStateChange === 'function' && session.user) {\n      onStateChange({ messagesJSON, user: session.user })\n    }\n    saveWebchatState(webchatState)\n  }, [\n    webchatState.messagesJSON,\n    webchatState.session,\n    webchatState.lastRoutePath,\n    webchatState.devSettings,\n    webchatState.lastMessageUpdate,\n  ])\n\n  useEffect(() => {\n    if (!webchatState.online) {\n      setError({\n        message: getServerErrorMessage(props.server),\n      })\n    } else {\n      if (!firstUpdate.current) {\n        setError(undefined)\n      }\n    }\n  }, [webchatState.online])\n\n  useTyping({ webchatState, updateTyping, updateMessage, host })\n\n  useEffect(() => {\n    updateTheme(merge(props.theme, theme, webchatState.themeUpdates))\n  }, [props.theme, webchatState.themeUpdates])\n\n  const openWebview = (\n    webviewComponent: Webview,\n    params?: Record<string, string>\n  ) => {\n    updateWebview(webviewComponent, params)\n  }\n\n  const textareaRef = useRef<HTMLTextAreaElement | undefined>()\n\n  const closeWebview = async (options?: CloseWebviewOptions) => {\n    removeWebview()\n    if (userInputEnabled) {\n      textareaRef.current?.focus()\n    }\n    if (options?.payload) {\n      await sendPayload(options.payload)\n    } else if (options?.path) {\n      const params = options.params ? params2queryString(options.params) : ''\n      await sendPayload(`__PATH_PAYLOAD__${options.path}?${params}`)\n    }\n  }\n\n  const persistentMenuOptions = getThemeProperty(\n    WEBCHAT.CUSTOM_PROPERTIES.persistentMenu\n  )\n\n  const darkBackgroundMenu = getThemeProperty(\n    WEBCHAT.CUSTOM_PROPERTIES.darkBackgroundMenu\n  )\n\n  const getBlockInputs = (rule, inputData) => {\n    const processedInput = rule.preprocess\n      ? rule.preprocess(inputData)\n      : inputData\n\n    return rule.match.some(regex => {\n      if (typeof regex === 'string') {\n        regex = deserializeRegex(regex)\n      }\n      return regex.test(processedInput)\n    })\n  }\n\n  const checkBlockInput = input => {\n    // if is a text we check if it is a serialized RE\n    const blockInputs = webchatState.theme.userInput?.blockInputs\n    if (!Array.isArray(blockInputs)) {\n      return false\n    }\n    for (const rule of blockInputs) {\n      if (getBlockInputs(rule, input.data)) {\n        addMessageComponent(\n          <Text\n            // Is necessary to add the id of the input\n            // to keep the input.id generated in the frontend as id of the message\n            // @ts-expect-error input.id is not typed\n            id={input.id}\n            sentBy={SENDERS.user}\n            blob={false}\n            style={{\n              backgroundColor: COLORS.SCORPION_GRAY,\n              borderColor: COLORS.SCORPION_GRAY,\n              padding: '8px 12px',\n            }}\n          >\n            {rule.message}\n          </Text>\n        )\n        removeReplies()\n        return true\n      }\n    }\n    return false\n  }\n\n  const closeMenu = () => {\n    togglePersistentMenu(false)\n  }\n\n  const persistentMenu = () => {\n    return (\n      <OpenedPersistentMenu\n        onClick={closeMenu}\n        options={persistentMenuOptions}\n        borderRadius={webchatState.theme.style.borderRadius || '10px'}\n      />\n    )\n  }\n\n  const coverComponent = webchatState.theme.coverComponent\n  const coverComponentProps = webchatState.theme.coverComponent?.props\n\n  useEffect(() => {\n    if (!coverComponent) {\n      return\n    }\n    if (\n      !botonicState ||\n      (botonicState.messages && botonicState.messages.length === 0)\n    ) {\n      toggleCoverComponent(true)\n    }\n  }, [])\n\n  // biome-ignore lint/complexity/noExcessiveCognitiveComplexity: messageComponentFromInput is a complex\n  const messageComponentFromInput = input => {\n    let messageComponent: any = null\n    if (isText(input)) {\n      messageComponent = (\n        <Text\n          // Is necessary to add the id of the input\n          // to keep the input.id generated in the frontend as id of the message\n          // @ts-expect-error input.id is not typed\n          id={input.id}\n          // Is necessary to add the payload of the input when user clicks a button\n          payload={input.payload}\n          sentBy={SENDERS.user}\n        >\n          {input.data}\n        </Text>\n      )\n    } else if (isMedia(input)) {\n      const temporaryDisplayUrl = URL.createObjectURL(input.data)\n      // TODO: We should use URL.revokeObjectURL(temporaryDisplayUrl) when the component is unmounted\n      // https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL_static#memory_management\n      const mediaProps: {\n        id: string\n        sentBy: SENDERS\n        src: string\n        input?: any\n      } = {\n        id: input.id,\n        sentBy: SENDERS.user,\n        src: temporaryDisplayUrl,\n      }\n      if (isImage(input)) {\n        mediaProps.input = input\n        messageComponent = <Image {...mediaProps} />\n      } else if (isAudio(input)) {\n        messageComponent = <Audio {...mediaProps} />\n      } else if (isVideo(input)) {\n        messageComponent = <Video {...mediaProps} />\n      } else if (isDocument(input)) {\n        messageComponent = <Document {...mediaProps} />\n      }\n    }\n    return messageComponent\n  }\n\n  const sendInput = async (input: any) => {\n    if (!input || Object.keys(input).length === 0) {\n      return\n    }\n    if (isText(input) && (!input.data || !input.data.trim())) {\n      return // in case trim() doesn't work in a browser we can use !/\\S/.test(input.data)\n    }\n    if (isText(input) && checkBlockInput(input)) {\n      return\n    }\n    if (!input.id) {\n      input.id = uuidv7()\n    }\n    const messageComponent = messageComponentFromInput(input)\n    if (messageComponent) {\n      addMessageComponent(messageComponent)\n    }\n    if (isMedia(input)) {\n      input.data = await readDataURL(input.data)\n    }\n    sendUserInput(input)\n    updateLatestInput(input)\n    isOnline() && updateLastMessageDate(currentDateString())\n    removeReplies()\n    togglePersistentMenu(false)\n    toggleEmojiPicker(false)\n  }\n\n  /* This is the public API this component exposes to its parents\n  https://stackoverflow.com/questions/37949981/call-child-method-from-parent\n  */\n\n  const updateSessionWithUser = (userToUpdate: any) => {\n    if (contentsByLocale && userToUpdate.system_locale) {\n      const placeholder =\n        contentsByLocale[userToUpdate.system_locale]?.inputPlaceholder ??\n        WEBCHAT_DEFAULT_CONTENTS.INPUT_PLACEHOLDER\n      const themeUpdates = { userInput: { box: { placeholder } } }\n      updateTheme(\n        merge(props.theme, themeUpdates),\n        themeUpdates as WebchatTheme\n      )\n    }\n    updateSession(merge(webchatState.session, { user: userToUpdate }))\n  }\n\n  useImperativeHandle(ref, () => ({\n    addBotResponse: ({ response, session, lastRoutePath }) => {\n      updateTyping(false)\n\n      const isUnread =\n        !webchatState.isLastMessageVisible || webchatState.numUnreadMessages > 0\n\n      if (Array.isArray(response)) {\n        response.forEach(r => {\n          addMessageComponent({ ...r, props: { ...r.props, isUnread } })\n        })\n      } else if (response) {\n        addMessageComponent({\n          ...response,\n          props: { ...response.props, isUnread },\n        })\n      }\n\n      if (session) {\n        updateSession(merge(session, { user: webchatState.session.user }))\n        const action = session._botonic_action || ''\n        const handoff = action.startsWith(BotonicAction.CreateCase)\n        if (handoff && isDev) {\n          addMessageComponent(<Handoff />)\n        }\n        updateHandoff(handoff)\n      }\n\n      if (lastRoutePath) {\n        updateLastRoutePath(lastRoutePath)\n      }\n\n      updateLastMessageDate(currentDateString())\n    },\n    addSystemResponse: ({ response }) => {\n      if (Array.isArray(response)) {\n        response.forEach(r => {\n          addMessageComponent({ ...r, props: { ...r.props, isUnread: false } })\n        })\n      } else if (response) {\n        addMessageComponent({\n          ...response,\n          props: { ...response.props, isUnread: false },\n        })\n      }\n      updateLastMessageDate(currentDateString())\n    },\n    setTyping: (typing: boolean) => updateTyping(typing),\n    addUserMessage: message => sendInput(message),\n    updateUser: updateSessionWithUser,\n    openWebchat: () => toggleWebchat(true),\n    closeWebchat: () => toggleWebchat(false),\n    toggleWebchat: () => toggleWebchat(!webchatState.isWebchatOpen),\n    openCoverComponent: () => toggleCoverComponent(true),\n    closeCoverComponent: () => toggleCoverComponent(false),\n    renderCustomComponent: _customComponent => {\n      setCustomComponent(_customComponent)\n      doRenderCustomComponent(true)\n    },\n    unmountCustomComponent: () => doRenderCustomComponent(false),\n    toggleCoverComponent: () =>\n      toggleCoverComponent(!webchatState.isCoverComponentOpen),\n    setOnline,\n    getMessages: () => webchatState.messagesJSON,\n    isOnline,\n    clearMessages: () => {\n      clearMessages()\n      removeReplies()\n    },\n    getLastMessageUpdate: () => webchatState.lastMessageUpdate,\n    updateMessageInfo: (msgId: string, messageInfo: any) => {\n      const messageToUpdate = webchatState.messagesJSON.filter(\n        m => m.id === msgId\n      )[0]\n      const updatedMsg = merge(messageToUpdate, messageInfo)\n      if (updatedMsg.ack === 1) {\n        delete updatedMsg.unsentInput\n      }\n      updateMessage(updatedMsg)\n    },\n    updateWebchatSettings: (settings: WebchatSettingsProps) => {\n      if (settings.user) {\n        updateSessionWithUser(settings.user)\n      }\n      const themeUpdates = normalizeWebchatSettings(settings)\n      updateTheme(\n        merge(webchatState.theme, themeUpdates),\n        themeUpdates as WebchatTheme\n      )\n      updateTyping(false)\n    },\n    closeWebview: async (options?: CloseWebviewOptions) =>\n      closeWebview(options),\n  }))\n\n  const resolveCase = () => {\n    updateHandoff(false)\n    updateSession({ ...webchatState.session, _botonic_action: undefined })\n  }\n\n  const prevSession = usePrevious(webchatState.session)\n  useEffect(() => {\n    // Resume conversation after handoff\n    if (prevSession?._botonic_action && !webchatState.session._botonic_action) {\n      const action = getParsedAction(prevSession._botonic_action)\n      if (action?.on_finish) {\n        sendPayload(action.on_finish)\n      }\n    }\n  }, [webchatState.session._botonic_action])\n\n  const sendText = async (text: string, payload?: string) => {\n    if (!text) {\n      return\n    }\n    const input = { type: INPUT.TEXT, data: text, payload }\n    await sendInput(input)\n  }\n\n  const sendPayload = async (payload: string) => {\n    if (!payload) {\n      return\n    }\n    const input = { type: INPUT.POSTBACK, payload }\n    await sendInput(input)\n  }\n\n  const sendAttachment = async (attachment: File) => {\n    if (attachment) {\n      const attachmentType = getMediaType(attachment.type)\n      if (!attachmentType) {\n        return\n      }\n      const input = {\n        type: attachmentType,\n        data: attachment,\n      }\n      await sendInput(input)\n      setCurrentAttachment()\n    }\n  }\n\n  useEffect(() => {\n    if (firstUpdate.current) {\n      firstUpdate.current = false\n      return\n    }\n\n    if (webchatState.isWebchatOpen && props.onOpen) {\n      props.onOpen()\n    }\n\n    if (!webchatState.isWebchatOpen && props.onClose && !firstUpdate.current) {\n      props.onClose()\n      toggleEmojiPicker(false)\n      togglePersistentMenu(false)\n    }\n  }, [webchatState.isWebchatOpen])\n\n  const isUserInputEnabled = () => {\n    const isUserInputEnabled = getThemeProperty(\n      WEBCHAT.CUSTOM_PROPERTIES.enableUserInput\n    )\n    return isUserInputEnabled && !webchatState.isCoverComponentOpen\n  }\n\n  const userInputEnabled = isUserInputEnabled()\n\n  useEffect(() => {\n    // Prod mode\n    saveWebchatState(webchatState)\n  }, [webchatState.themeUpdates])\n\n  // Only needed for dev/serve mode\n  const updateWebchatDevSettings = settings => {\n    useEffect(() => {\n      const themeUpdates = normalizeWebchatSettings(settings)\n      updateTheme(\n        merge(webchatState.theme, themeUpdates),\n        themeUpdates as WebchatTheme\n      )\n    }, [webchatState.messagesJSON])\n  }\n\n  const DarkenBackground = ({ component }) => {\n    return (\n      <div>\n        {darkBackgroundMenu && (\n          <DarkBackgroundMenu\n            style={{\n              borderRadius: webchatState.theme.style.borderRadius,\n            }}\n          />\n        )}\n        {component}\n      </div>\n    )\n  }\n\n  const _renderCustomComponent = () => {\n    if (!customComponent) {\n      return <></>\n    } else {\n      return customComponent\n    }\n  }\n\n  const WebchatComponent = (\n    <WebchatContext.Provider\n      value={{\n        addMessage,\n        getThemeProperty,\n        closeWebview,\n        openWebview,\n        resolveCase,\n        resetUnreadMessages,\n        setIsInputFocused,\n        setLastMessageVisible,\n        sendAttachment,\n        sendInput,\n        sendPayload,\n        sendText,\n        toggleWebchat,\n        toggleEmojiPicker,\n        togglePersistentMenu,\n        toggleCoverComponent,\n        updateCustomMessageProps,\n        updateLatestInput,\n        updateMessage,\n        updateReplies,\n        updateUser: updateSessionWithUser,\n        updateWebchatDevSettings: updateWebchatDevSettings,\n        trackEvent: props.onTrackEvent,\n        previewUtils: props.previewUtils,\n        webchatState,\n        webchatContainerRef,\n        chatAreaRef,\n        inputPanelRef,\n        headerRef,\n        repliesRef,\n        scrollableMessagesListRef,\n      }}\n    >\n      <ThemeProvider theme={webchatState.theme}>\n        {!webchatState.isWebchatOpen && <TriggerButton />}\n\n        {webchatState.isWebchatOpen && (\n          <StyledWebchat\n            id={BotonicContainerId.Webchat}\n            ref={webchatContainerRef}\n            // TODO: Distinguish between multiple instances of webchat, e.g. `${uniqueId}-botonic-webchat`\n            role={ROLES.WEBCHAT}\n          >\n            <WebchatHeader ref={headerRef} />\n\n            {webchatState.isCoverComponentOpen ? (\n              <CoverComponent\n                component={coverComponent}\n                componentProps={coverComponentProps}\n              />\n            ) : (\n              <>\n                {webchatState.error.message && (\n                  <ErrorMessageContainer>\n                    <ErrorMessage>{webchatState.error.message}</ErrorMessage>\n                  </ErrorMessageContainer>\n                )}\n\n                <ChatArea />\n\n                {webchatState.isPersistentMenuOpen && (\n                  <DarkenBackground component={persistentMenu()} />\n                )}\n\n                {!webchatState.handoff && userInputEnabled && (\n                  <InputPanel\n                    handleAttachment={handleAttachment}\n                    textareaRef={textareaRef}\n                    host={host}\n                    onUserInput={props.onUserInput}\n                  />\n                )}\n\n                {webchatState.webview && (\n                  <WebviewContainer localWebviews={props.localWebviews} />\n                )}\n\n                {webchatState.isCustomComponentRendered &&\n                  customComponent &&\n                  _renderCustomComponent()}\n              </>\n            )}\n          </StyledWebchat>\n        )}\n      </ThemeProvider>\n    </WebchatContext.Provider>\n  )\n\n  return props.shadowDOM ? (\n    <StyleSheetManager target={host}>{WebchatComponent}</StyleSheetManager>\n  ) : (\n    WebchatComponent\n  )\n})\n\nWebchat.displayName = 'Webchat'\nexport { Webchat }\n"],"names":["BotonicAction","INPUT","params2queryString","merge","forwardRef","useEffect","useImperativeHandle","useRef","useState","StyleSheetManager","ThemeProvider","v7","uuidv7","Audio","Document","Handoff","Image","normalizeWebchatSettings","Text","Video","COLORS","MAX_ALLOWED_SIZE_MB","ROLES","WEBCHAT","WEBCHAT_DEFAULT_CONTENTS","SENDERS","getMediaType","isAllowedSize","isAudio","isDocument","isImage","isMedia","isText","isVideo","readDataURL","msgToBotonic","isDev","deserializeRegex","stringifyWithRegexs","_getThemeProperty","getServerErrorMessage","initSession","shouldKeepSessionOnReload","updateUserLocaleAndCountry","ChatArea","OpenedPersistentMenu","BotonicContainerId","useWebchat","WebchatContext","CoverComponent","WebchatHeader","useComponentWillMount","usePrevious","useScrollToBottom","useTyping","InputPanel","DarkBackgroundMenu","ErrorMessage","ErrorMessageContainer","StyledWebchat","TriggerButton","useStorageState","getParsedAction","WebviewContainer","Webchat","props","ref","addMessage","addMessageComponent","clearMessages","doRenderCustomComponent","resetUnreadMessages","setCurrentAttachment","setError","setIsInputFocused","setLastMessageVisible","setOnline","toggleCoverComponent","toggleEmojiPicker","togglePersistentMenu","toggleWebchat","updateCustomMessageProps","updateDevSettings","updateHandoff","updateLastMessageDate","updateLastRoutePath","updateLatestInput","updateMessage","updateReplies","updateSession","updateTheme","updateTyping","updateWebview","removeWebview","removeReplies","webchatState","webchatContainerRef","chatAreaRef","inputPanelRef","headerRef","repliesRef","scrollableMessagesListRef","contentsByLocale","firstUpdate","isOnline","currentDateString","Date","theme","initialSession","initialDevSettings","onStateChange","getThemeProperty","customComponent","setCustomComponent","storage","storageKey","botonicState","saveState","host","document","scrollToBottom","saveWebchatState","JSON","handleAttachment","event","Error","sendAttachment","sendUserInput","input","window","botonicStyle","style","messages","session","lastRoutePath","devSettings","lastMessageUpdate","themeUpdates","message","newMessageComponent","undefined","setTimeout","messagesJSON","openWebview","webviewComponent","params","textareaRef","closeWebview","options","userInputEnabled","sendPayload","persistentMenuOptions","darkBackgroundMenu","getBlockInputs","rule","inputData","processedInput","regex","checkBlockInput","blockInputs","Array","closeMenu","persistentMenu","coverComponent","coverComponentProps","messageComponentFromInput","messageComponent","temporaryDisplayUrl","URL","mediaProps","sendInput","Object","updateSessionWithUser","userToUpdate","placeholder","response","isUnread","r","action","handoff","typing","_customComponent","msgId","messageInfo","messageToUpdate","m","updatedMsg","settings","resolveCase","prevSession","sendText","text","payload","attachment","attachmentType","isUserInputEnabled","updateWebchatDevSettings","DarkenBackground","component","_renderCustomComponent","WebchatComponent"],"mappings":"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"}

package/lib/webchat/webview/header.d.ts

@@ -0,0 +1 @@
+export declare const WebviewHeader: () => import("react").JSX.Element;

package/lib/webchat/webview/header.js

@@ -0,0 +1,37 @@
+import { jsx } from "react/jsx-runtime";
+import { useContext } from "react";
+import { ROLES, WEBCHAT } from "../../constants.js";
+import { WebviewRequestContext } from "../../contexts.js";
+import { WebchatContext } from "../context/index.js";
+import { StyledCloseHeader, StyledWebviewHeader } from "./styles.js";
+
+
+
+
+
+
+
+
+
+
+
+
+
+const WebviewHeader = ()=>{
+    const { closeWebview } = useContext(WebviewRequestContext);
+    const { getThemeProperty } = useContext(WebchatContext);
+    return /*#__PURE__*/ jsx(StyledWebviewHeader, {
+        role: ROLES.WEBVIEW_HEADER,
+        style: {
+            ...getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.webviewHeaderStyle)
+        },
+        children: /*#__PURE__*/ jsx(StyledCloseHeader, {
+            onClick: ()=>closeWebview(),
+            children: "✕"
+        })
+    });
+};
+
+export { WebviewHeader };
+
+//# sourceMappingURL=header.js.map

package/lib/webchat/webview/header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/webview/header.js","sources":["../../../src/webchat/webview/header.tsx"],"sourcesContent":["import { useContext } from 'react'\n\nimport { ROLES, WEBCHAT } from '../../constants'\nimport { WebviewRequestContext } from '../../contexts'\nimport { WebchatContext } from '../context'\nimport { StyledCloseHeader, StyledWebviewHeader } from './styles'\n\nexport const WebviewHeader = () => {\n  const { closeWebview } = useContext(WebviewRequestContext)\n  const { getThemeProperty } = useContext(WebchatContext)\n\n  return (\n    <StyledWebviewHeader\n      role={ROLES.WEBVIEW_HEADER}\n      style={{\n        ...getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.webviewHeaderStyle),\n      }}\n    >\n      <StyledCloseHeader onClick={() => closeWebview()}>✕</StyledCloseHeader>\n    </StyledWebviewHeader>\n  )\n}\n"],"names":["useContext","ROLES","WEBCHAT","WebviewRequestContext","WebchatContext","StyledCloseHeader","StyledWebviewHeader","WebviewHeader","closeWebview","getThemeProperty"],"mappings":";;;;;;;;;;;;;;AAAkC;AAEc;AACM;AACX;AACsB;AAE1D,MAAMO,aAAaA,GAAG;IAC3B,MAAM,EAAEC,YAAY,EAAE,GAAGR,UAAUA,CAACG,qBAAqBA;IACzD,MAAM,EAAEM,gBAAgB,EAAE,GAAGT,UAAUA,CAACI,cAAcA;IAEtD,qBACE,IAACE,mBAAmBA;QAClB,MAAML,oBAAoB;QAC1B,OAAO;YACL,GAAGQ,iBAAiBP,4CAA4C,CAAC;QACnE;kBAEA,kBAACG,iBAAiBA;YAAC,SAAS,IAAMG;sBAAgB;;;AAGxD,EAAC"}

package/lib/webchat/webview/index.d.ts

@@ -0,0 +1,6 @@
+import type React from 'react';
+import { type WebchatState } from '../context/index.js';
+export declare const WebviewContainer: ({ localWebviews, }: {
+    localWebviews?: React.ComponentType[];
+}) => React.JSX.Element;
+export declare function getWebviewInDevMode(localWebviews: React.ComponentType[] | undefined, webchatState: WebchatState): React.ComponentType;

package/lib/webchat/webview/index.js

@@ -0,0 +1,116 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { isDev } from "@botonic/core";
+import { useContext, useEffect } from "react";
+import { ROLES, WEBCHAT } from "../../constants.js";
+import { WebviewRequestContext } from "../../contexts.js";
+import { WebchatContext } from "../context/index.js";
+import { WebviewHeader } from "./header.js";
+import { StyledFrame, StyledFrameAsDiv, StyledWebview, StyledWebviewContent } from "./styles.js";
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+const WebviewContainer = ({ localWebviews })=>{
+    const { closeWebview, getThemeProperty, webchatState } = useContext(WebchatContext);
+    const webviewRequestContext = {
+        params: webchatState.webviewParams,
+        session: webchatState.session || {},
+        getUserCountry: ()=>webchatState.session?.user?.country || '',
+        getUserLocale: ()=>webchatState.session?.user?.locale || '',
+        getSystemLocale: ()=>webchatState.session?.user?.system_locale || '',
+        closeWebview: async (options)=>await closeWebview(options)
+    };
+    const close = async (e)=>{
+        if (e.data === 'botonicCloseWebview') {
+            console.log('Received close message from webview');
+            await closeWebview();
+        }
+    };
+    useEffect(()=>{
+        window.addEventListener('message', close, false);
+        return ()=>window.removeEventListener('message', close, false);
+    }, []);
+    if (isDev(webchatState.session)) {
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        const Webview = getWebviewInDevMode(localWebviews, webchatState);
+        return /*#__PURE__*/ jsx(WebviewRequestContext.Provider, {
+            value: webviewRequestContext,
+            children: /*#__PURE__*/ jsxs(StyledWebview, {
+                role: ROLES.WEBVIEW,
+                style: {
+                    ...getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.webviewStyle)
+                },
+                children: [
+                    /*#__PURE__*/ jsx(WebviewHeader, {}),
+                    /*#__PURE__*/ jsx(StyledWebviewContent, {
+                        children: /*#__PURE__*/ jsx(StyledFrameAsDiv, {
+                            children: /*#__PURE__*/ jsx(Webview, {})
+                        })
+                    })
+                ]
+            })
+        });
+    }
+    const webviewUrl = webchatState.webview && typeof webchatState.webview === 'string' ? webchatState.webview : '';
+    return /*#__PURE__*/ jsx(WebviewRequestContext.Provider, {
+        value: webviewRequestContext,
+        children: /*#__PURE__*/ jsxs(StyledWebview, {
+            role: ROLES.WEBVIEW,
+            style: {
+                ...getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.webviewStyle)
+            },
+            children: [
+                /*#__PURE__*/ jsx(WebviewHeader, {}),
+                /*#__PURE__*/ jsx(StyledWebviewContent, {
+                    children: /*#__PURE__*/ jsx(StyledFrame, {
+                        src: webviewUrl
+                    })
+                })
+            ]
+        })
+    });
+};
+function isReactComponent(value) {
+    return typeof value === 'function';
+}
+function isWebviewDescriptor(value) {
+    return typeof value === 'object' && value !== null && 'name' in value && typeof value.name === 'string' && !isReactComponent(value);
+}
+function getWebviewInDevMode(localWebviews, webchatState) {
+    const { webview } = webchatState;
+    if (webview == null) {
+        throw new Error('No webview specified');
+    }
+    if (typeof webview === 'string') {
+        return webview;
+    }
+    if (isReactComponent(webview)) {
+        return webview;
+    }
+    if (isWebviewDescriptor(webview)) {
+        const localWebview = localWebviews?.find((local)=>local.name === webview.name);
+        if (!localWebview) {
+            const registeredNames = localWebviews?.map((w)=>w.name).filter(Boolean).join(', ') || 'none';
+            throw new Error(`Local webview "${webview.name}" not found. Registered webviews: ${registeredNames}`);
+        }
+        return localWebview;
+    }
+    throw new Error('Invalid webview type: expected a React component, a webview descriptor { name }, or a string URL');
+}
+
+export { WebviewContainer, getWebviewInDevMode };
+
+//# sourceMappingURL=index.js.map

package/lib/webchat/webview/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/webview/index.js","sources":["../../../src/webchat/webview/index.tsx"],"sourcesContent":["import { type Session as CoreSession, isDev } from '@botonic/core'\nimport type React from 'react'\nimport { useContext, useEffect } from 'react'\n\nimport type { Webview } from '../../components/index-types'\nimport { ROLES, WEBCHAT } from '../../constants'\nimport {\n  type CloseWebviewOptions,\n  WebviewRequestContext,\n  type WebviewRequestContextType,\n} from '../../contexts'\nimport { WebchatContext, type WebchatState } from '../context'\nimport { WebviewHeader } from './header'\nimport {\n  StyledFrame,\n  StyledFrameAsDiv,\n  StyledWebview,\n  StyledWebviewContent,\n} from './styles'\n\nexport const WebviewContainer = ({\n  localWebviews,\n}: {\n  localWebviews?: React.ComponentType[]\n}) => {\n  const { closeWebview, getThemeProperty, webchatState } =\n    useContext(WebchatContext)\n\n  const webviewRequestContext: WebviewRequestContextType = {\n    params: webchatState.webviewParams,\n    session: webchatState.session || ({} as Partial<CoreSession>),\n    getUserCountry: () => webchatState.session?.user?.country || '',\n    getUserLocale: () => webchatState.session?.user?.locale || '',\n    getSystemLocale: () => webchatState.session?.user?.system_locale || '',\n    closeWebview: async (options?: CloseWebviewOptions) =>\n      await closeWebview(options),\n  }\n\n  const close = async (e: any) => {\n    if (e.data === 'botonicCloseWebview') {\n      console.log('Received close message from webview')\n      await closeWebview()\n    }\n  }\n\n  useEffect(() => {\n    window.addEventListener('message', close, false)\n\n    return () => window.removeEventListener('message', close, false)\n  }, [])\n\n  if (isDev(webchatState.session as CoreSession)) {\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    const Webview = getWebviewInDevMode(localWebviews, webchatState)\n\n    return (\n      <WebviewRequestContext.Provider value={webviewRequestContext}>\n        <StyledWebview\n          role={ROLES.WEBVIEW}\n          style={{\n            ...getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.webviewStyle),\n          }}\n        >\n          <WebviewHeader />\n          <StyledWebviewContent>\n            <StyledFrameAsDiv>\n              <Webview />\n            </StyledFrameAsDiv>\n          </StyledWebviewContent>\n        </StyledWebview>\n      </WebviewRequestContext.Provider>\n    )\n  }\n\n  const webviewUrl =\n    webchatState.webview && typeof webchatState.webview === 'string'\n      ? webchatState.webview\n      : ''\n\n  return (\n    <WebviewRequestContext.Provider value={webviewRequestContext}>\n      <StyledWebview\n        role={ROLES.WEBVIEW}\n        style={{\n          ...getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.webviewStyle),\n        }}\n      >\n        <WebviewHeader />\n        <StyledWebviewContent>\n          <StyledFrame src={webviewUrl as string} />\n        </StyledWebviewContent>\n      </StyledWebview>\n    </WebviewRequestContext.Provider>\n  )\n}\n\nfunction isReactComponent(value: unknown): value is React.ComponentType {\n  return typeof value === 'function'\n}\n\nfunction isWebviewDescriptor(value: unknown): value is Webview {\n  return (\n    typeof value === 'object' &&\n    value !== null &&\n    'name' in value &&\n    typeof (value as Webview).name === 'string' &&\n    !isReactComponent(value)\n  )\n}\n\nexport function getWebviewInDevMode(\n  localWebviews: React.ComponentType[] | undefined,\n  webchatState: WebchatState\n): React.ComponentType {\n  const { webview } = webchatState\n\n  if (webview == null) {\n    throw new Error('No webview specified')\n  }\n\n  if (typeof webview === 'string') {\n    return webview as unknown as React.ComponentType\n  }\n\n  if (isReactComponent(webview)) {\n    return webview\n  }\n\n  if (isWebviewDescriptor(webview)) {\n    const localWebview = localWebviews?.find(\n      local => local.name === webview.name\n    )\n\n    if (!localWebview) {\n      const registeredNames =\n        localWebviews\n          ?.map(w => w.name)\n          .filter(Boolean)\n          .join(', ') || 'none'\n      throw new Error(\n        `Local webview \"${webview.name}\" not found. Registered webviews: ${registeredNames}`\n      )\n    }\n\n    return localWebview\n  }\n\n  throw new Error(\n    'Invalid webview type: expected a React component, a webview descriptor { name }, or a string URL'\n  )\n}\n"],"names":["isDev","useContext","useEffect","ROLES","WEBCHAT","WebviewRequestContext","WebchatContext","WebviewHeader","StyledFrame","StyledFrameAsDiv","StyledWebview","StyledWebviewContent","WebviewContainer","localWebviews","closeWebview","getThemeProperty","webchatState","webviewRequestContext","options","close","e","console","window","Webview","getWebviewInDevMode","webviewUrl","isReactComponent","value","isWebviewDescriptor","webview","Error","localWebview","local","registeredNames","w","Boolean"],"mappings":";;;;;;;;;;;;;;;;;;AAAkE;AAErB;AAGG;AAKzB;AACuC;AACtB;AAMvB;AAEV,MAAMY,gBAAgBA,GAAG,CAAC,EAC/BC,aAAa,EAGd;IACC,MAAM,EAAEC,YAAY,EAAEC,gBAAgB,EAAEC,YAAY,EAAE,GACpDf,UAAUA,CAACK,cAAcA;IAE3B,MAAMW,wBAAmD;QACvD,QAAQD,aAAa,aAAa;QAClC,SAASA,aAAa,OAAO,IAAK,CAAC;QACnC,gBAAgB,IAAMA,aAAa,OAAO,EAAE,MAAM,WAAW;QAC7D,eAAe,IAAMA,aAAa,OAAO,EAAE,MAAM,UAAU;QAC3D,iBAAiB,IAAMA,aAAa,OAAO,EAAE,MAAM,iBAAiB;QACpE,cAAc,OAAOE,UACnB,MAAMJ,aAAaI;IACvB;IAEA,MAAMC,QAAQ,OAAOC;QACnB,IAAIA,EAAE,IAAI,KAAK,uBAAuB;YACpCC,QAAQ,GAAG,CAAC;YACZ,MAAMP;QACR;IACF;IAEAZ,SAASA,CAAC;QACRoB,OAAO,gBAAgB,CAAC,WAAWH,OAAO;QAE1C,OAAO,IAAMG,OAAO,mBAAmB,CAAC,WAAWH,OAAO;IAC5D,GAAG,EAAE;IAEL,IAAInB,KAAKA,CAACgB,aAAa,OAAO,GAAkB;QAC9C,gEAAgE;QAChE,MAAMO,UAAUC,mBAAmBA,CAACX,eAAeG;QAEnD,qBACE,IAACX,8BAA8B;YAAC,OAAOY;sBACrC,mBAACP,aAAaA;gBACZ,MAAMP,aAAa;gBACnB,OAAO;oBACL,GAAGY,iBAAiBX,sCAAsC,CAAC;gBAC7D;;kCAEA,IAACG,aAAaA;kCACd,IAACI,oBAAoBA;kCACnB,kBAACF,gBAAgBA;sCACf,kBAACc;;;;;;IAMb;IAEA,MAAME,aACJT,aAAa,OAAO,IAAI,OAAOA,aAAa,OAAO,KAAK,WACpDA,aAAa,OAAO,GACpB;IAEN,qBACE,IAACX,8BAA8B;QAAC,OAAOY;kBACrC,mBAACP,aAAaA;YACZ,MAAMP,aAAa;YACnB,OAAO;gBACL,GAAGY,iBAAiBX,sCAAsC,CAAC;YAC7D;;8BAEA,IAACG,aAAaA;8BACd,IAACI,oBAAoBA;8BACnB,kBAACH,WAAWA;wBAAC,KAAKiB;;;;;;AAK5B,EAAC;AAED,SAASC,gBAAgBA,CAACC,KAAc;IACtC,OAAO,OAAOA,UAAU;AAC1B;AAEA,SAASC,mBAAmBA,CAACD,KAAc;IACzC,OACE,OAAOA,UAAU,YACjBA,UAAU,QACV,UAAUA,SACV,OAAQA,MAAkB,IAAI,KAAK,YACnC,CAACD,gBAAgBA,CAACC;AAEtB;AAEO,SAASH,mBAAmBA,CACjCX,aAAgD,EAChDG,YAA0B;IAE1B,MAAM,EAAEa,OAAO,EAAE,GAAGb;IAEpB,IAAIa,WAAW,MAAM;QACnB,MAAM,IAAIC,MAAM;IAClB;IAEA,IAAI,OAAOD,YAAY,UAAU;QAC/B,OAAOA;IACT;IAEA,IAAIH,gBAAgBA,CAACG,UAAU;QAC7B,OAAOA;IACT;IAEA,IAAID,mBAAmBA,CAACC,UAAU;QAChC,MAAME,eAAelB,eAAe,KAClCmB,CAAAA,QAASA,MAAM,IAAI,KAAKH,QAAQ,IAAI;QAGtC,IAAI,CAACE,cAAc;YACjB,MAAME,kBACJpB,eACI,IAAIqB,CAAAA,IAAKA,EAAE,IAAI,EAChB,OAAOC,SACP,KAAK,SAAS;YACnB,MAAM,IAAIL,MACR,CAAC,eAAe,EAAED,QAAQ,IAAI,CAAC,kCAAkC,EAAEI,iBAAiB;QAExF;QAEA,OAAOF;IACT;IAEA,MAAM,IAAID,MACR;AAEJ"}

package/lib/webchat/webview/styles.js

@@ -0,0 +1,64 @@
+import styled_components from "styled-components";
+import { COLORS } from "../../constants.js";
+
+
+
+
+
+const StyledWebview = styled_components.div`
+  position: absolute;
+  display: flex;
+  flex-direction: column;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  background-color: ${COLORS.SOLID_WHITE};
+  z-index: 2;
+  border-radius: ${(props)=>props.theme.style.borderRadius};
+
+  @media (max-width: ${(props)=>props.theme.mobileBreakpoint}px) {
+    position: ${(props)=>props.theme.mobileStyle.position};
+    right: ${(props)=>props.theme.mobileStyle.right};
+    bottom: ${(props)=>props.theme.mobileStyle.bottom};
+    width: ${(props)=>props.theme.mobileStyle.width};
+    height: ${(props)=>props.theme.mobileStyle.height};
+    border-radius: ${(props)=>props.theme.mobileStyle.borderRadius};
+    font-size: ${(props)=>props.theme.mobileStyle.fontSize};
+  }
+`;
+const StyledWebviewHeader = styled_components.div`
+  flex: none;
+  text-align: right;
+  background-color: ${COLORS.WILD_SAND_WHITE};
+  border-top: 1px solid ${COLORS.SOLID_BLACK_ALPHA_0_2};
+  border-bottom: 1px solid ${COLORS.SOLID_BLACK_ALPHA_0_2};
+  border-radius: ${(props)=>props.theme.header?.style?.borderRadius};
+
+  @media (max-width: ${(props)=>props.theme.mobileBreakpoint}px) {
+    border-radius: 0px;
+  }
+`;
+const StyledCloseHeader = styled_components.div`
+  display: inline-block;
+  padding: 8px 12px;
+  cursor: pointer;
+`;
+const StyledWebviewContent = styled_components.div`
+  flex: 1;
+  overflow: auto;
+`;
+const FrameStyles = `
+  border-style: none;
+  width: 100%;
+  height: 100%;
+`;
+const StyledFrame = styled_components.iframe`
+  ${FrameStyles}
+`;
+const StyledFrameAsDiv = styled_components.div`
+  ${FrameStyles}
+`;
+
+export { FrameStyles, StyledCloseHeader, StyledFrame, StyledFrameAsDiv, StyledWebview, StyledWebviewContent, StyledWebviewHeader };
+
+//# sourceMappingURL=styles.js.map

package/lib/webchat/webview/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/webview/styles.js","sources":["../../../src/webchat/webview/styles.ts"],"sourcesContent":["import styled from 'styled-components'\n\nimport { COLORS } from '../../constants'\n\nexport const StyledWebview = styled.div`\n  position: absolute;\n  display: flex;\n  flex-direction: column;\n  bottom: 0;\n  width: 100%;\n  height: 100%;\n  background-color: ${COLORS.SOLID_WHITE};\n  z-index: 2;\n  border-radius: ${props => props.theme.style.borderRadius};\n\n  @media (max-width: ${props => props.theme.mobileBreakpoint}px) {\n    position: ${props => props.theme.mobileStyle.position};\n    right: ${props => props.theme.mobileStyle.right};\n    bottom: ${props => props.theme.mobileStyle.bottom};\n    width: ${props => props.theme.mobileStyle.width};\n    height: ${props => props.theme.mobileStyle.height};\n    border-radius: ${props => props.theme.mobileStyle.borderRadius};\n    font-size: ${props => props.theme.mobileStyle.fontSize};\n  }\n`\n\nexport const StyledWebviewHeader = styled.div`\n  flex: none;\n  text-align: right;\n  background-color: ${COLORS.WILD_SAND_WHITE};\n  border-top: 1px solid ${COLORS.SOLID_BLACK_ALPHA_0_2};\n  border-bottom: 1px solid ${COLORS.SOLID_BLACK_ALPHA_0_2};\n  border-radius: ${props => props.theme.header?.style?.borderRadius};\n\n  @media (max-width: ${props => props.theme.mobileBreakpoint}px) {\n    border-radius: 0px;\n  }\n`\nexport const StyledCloseHeader = styled.div`\n  display: inline-block;\n  padding: 8px 12px;\n  cursor: pointer;\n`\n\nexport const StyledWebviewContent = styled.div`\n  flex: 1;\n  overflow: auto;\n`\n\nexport const FrameStyles = `\n  border-style: none;\n  width: 100%;\n  height: 100%;\n`\n\nexport const StyledFrame = styled.iframe`\n  ${FrameStyles}\n`\n\nexport const StyledFrameAsDiv = styled.div`\n  ${FrameStyles}\n`\n"],"names":["styled","COLORS","StyledWebview","props","StyledWebviewHeader","StyledCloseHeader","StyledWebviewContent","FrameStyles","StyledFrame","StyledFrameAsDiv"],"mappings":";;;;;AAAsC;AAEE;AAEjC,MAAME,aAAaA,GAAGF,qBAAU,CAAC;;;;;;;oBAOpB,EAAEC,kBAAkB,CAAC;;iBAExB,EAAEE,CAAAA,QAASA,MAAM,KAAK,CAAC,KAAK,CAAC,YAAY,CAAC;;qBAEtC,EAAEA,CAAAA,QAASA,MAAM,KAAK,CAAC,gBAAgB,CAAC;cAC/C,EAAEA,CAAAA,QAASA,MAAM,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC;WAC/C,EAAEA,CAAAA,QAASA,MAAM,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC;YACxC,EAAEA,CAAAA,QAASA,MAAM,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC;WAC3C,EAAEA,CAAAA,QAASA,MAAM,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC;YACxC,EAAEA,CAAAA,QAASA,MAAM,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC;mBACnC,EAAEA,CAAAA,QAASA,MAAM,KAAK,CAAC,WAAW,CAAC,YAAY,CAAC;eACpD,EAAEA,CAAAA,QAASA,MAAM,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC;;AAE3D,CAAC;AAEM,MAAMC,mBAAmBA,GAAGJ,qBAAU,CAAC;;;oBAG1B,EAAEC,sBAAsB,CAAC;wBACrB,EAAEA,4BAA4B,CAAC;2BAC5B,EAAEA,4BAA4B,CAAC;iBACzC,EAAEE,CAAAA,QAASA,MAAM,KAAK,CAAC,MAAM,EAAE,OAAO,aAAa;;qBAE/C,EAAEA,CAAAA,QAASA,MAAM,KAAK,CAAC,gBAAgB,CAAC;;;AAG7D,CAAC;AACM,MAAME,iBAAiBA,GAAGL,qBAAU,CAAC;;;;AAI5C,CAAC;AAEM,MAAMM,oBAAoBA,GAAGN,qBAAU,CAAC;;;AAG/C,CAAC;AAEM,MAAMO,WAAWA,GAAG,CAAC;;;;AAI5B,CAAC;AAEM,MAAMC,WAAWA,GAAGR,wBAAa,CAAC;EACvC,EAAEO,WAAWA,CAAC;AAChB,CAAC;AAEM,MAAME,gBAAgBA,GAAGT,qBAAU,CAAC;EACzC,EAAEO,WAAWA,CAAC;AAChB,CAAC"}

package/lib/webchat-app.d.ts

@@ -0,0 +1,114 @@
+import { type ServerConfig } from '@botonic/core';
+import type React from 'react';
+import type { BlockInputOption, WebchatSettingsProps } from './components/index.js';
+import type { CloseWebviewOptions } from './contexts.js';
+import { type ActionRequest, type Event, type EventArgs, type OnStateChangeArgs, type OnUserInputArgs, type PreviewUtils, type WebchatArgs, type WebchatLocaleContents, type WebchatMessage, type WebchatRef } from './index-types.js';
+import type { CoverComponentOptions, PersistentMenuOptionsTheme, WebchatTheme } from './webchat/theme/types.js';
+export declare class WebchatApp {
+    theme?: Partial<WebchatTheme>;
+    persistentMenu?: PersistentMenuOptionsTheme;
+    coverComponent?: CoverComponentOptions;
+    blockInputs?: BlockInputOption[];
+    enableEmojiPicker?: boolean;
+    enableAttachments?: boolean;
+    enableUserInput?: boolean;
+    enableAnimations?: boolean;
+    hostId?: string;
+    shadowDOM?: boolean | (() => boolean);
+    defaultDelay?: number;
+    defaultTyping?: number;
+    storage?: Storage | null;
+    storageKey: string;
+    onInit?: (app: WebchatApp, args: any) => void;
+    onOpen?: (app: WebchatApp, args: any) => void;
+    onClose?: (app: WebchatApp, args: any) => void;
+    onMessage?: (app: WebchatApp, message: WebchatMessage) => void;
+    onTrackEvent?: (request: ActionRequest, eventName: string, args?: EventArgs) => Promise<void>;
+    onConnectionChange?: (app: WebchatApp, isOnline: boolean) => void;
+    contentsByLocale?: Record<string, WebchatLocaleContents>;
+    appId?: string;
+    visibility?: boolean | (() => boolean) | 'dynamic';
+    server?: ServerConfig;
+    previewUtils?: PreviewUtils;
+    webchatRef: React.RefObject<WebchatRef | null>;
+    private reactRoot;
+    private host;
+    private hubtypeService;
+    constructor({ theme, persistentMenu, coverComponent, blockInputs, enableEmojiPicker, enableAttachments, enableUserInput, enableAnimations, hostId, shadowDOM, defaultDelay, defaultTyping, storage, storageKey, onInit, onOpen, onClose, onMessage, onTrackEvent, onConnectionChange, contentsByLocale, appId, visibility, server, previewUtils, }: WebchatArgs);
+    createRootElement(host: HTMLElement | null): void;
+    getReactMountNode(node?: (HTMLElement | null) | ShadowRoot): Element | DocumentFragment;
+    onInitWebchat(...args: [any]): void;
+    onOpenWebchat(...args: [any]): void;
+    onCloseWebchat(...args: [any]): void;
+    onUserInput({ user, input }: OnUserInputArgs): Promise<void>;
+    onTrackEventWebchat(request: ActionRequest, eventName: string, args?: EventArgs): Promise<void>;
+    onConnectionRegained(): Promise<void>;
+    onStateChange(args: OnStateChangeArgs): void;
+    onServiceEvent(event: Event): void;
+    updateUser(user: any): void;
+    setSystemLocale(locale: string): void;
+    setUserLocale(locale: string): void;
+    setUserCountry(country: string): void;
+    addBotMessage(message: any): void;
+    addSystemMessage(message: any): void;
+    addBotText(text: string): void;
+    addUserMessage(message: any): void;
+    addUserText(text: string): void;
+    addUserPayload(payload: string): void;
+    setTyping(typing: boolean): void;
+    open(): void;
+    close(): void;
+    closeWebview(options?: CloseWebviewOptions): Promise<void>;
+    toggle(): void;
+    openCoverComponent(): void;
+    closeCoverComponent(): void;
+    renderCustomComponent(_customComponent: any): void;
+    unmountCustomComponent(): void;
+    toggleCoverComponent(): void;
+    getMessages(): {
+        id: string;
+        ack: number;
+        unsentInput: import("@botonic/core").Input;
+    }[] | undefined;
+    clearMessages(): void;
+    getVisibility(): Promise<boolean>;
+    getLastMessageUpdate(): string | undefined;
+    updateMessageInfo(msgId: string, messageInfo: any): void | undefined;
+    updateWebchatSettings(settings: WebchatSettingsProps): void | undefined;
+    createInitialTheme(optionsAtRuntime?: WebchatArgs): WebchatTheme & Partial<WebchatTheme>;
+    createInitialThemeUserInput(theme: WebchatTheme, optionsAtRuntime?: WebchatArgs): {
+        attachments?: {
+            enable?: boolean;
+            custom?: React.ComponentType;
+        };
+        blockInputs?: BlockInputOption[];
+        box?: {
+            placeholder: string;
+            style?: any;
+        };
+        emojiPicker?: {
+            enable?: boolean;
+            custom?: React.ComponentType;
+        };
+        menu?: {
+            darkBackground?: boolean;
+            custom?: React.ComponentType<import("./webchat/theme/types.js").PersistentMenuOptionsProps>;
+        };
+        menuButton?: {
+            custom?: React.ComponentType;
+        };
+        persistentMenu?: PersistentMenuOptionsTheme;
+        sendButton?: {
+            enable?: boolean;
+            custom?: React.ComponentType;
+        };
+        enable?: boolean;
+        style?: any;
+    };
+    getComponent(host: HTMLDivElement, optionsAtRuntime?: WebchatArgs): React.JSX.Element;
+    isWebchatVisible(appId: string): Promise<boolean>;
+    isOnline(): boolean | undefined;
+    resolveWebchatVisibility(optionsAtRuntime?: WebchatArgs): Promise<boolean>;
+    destroy(): void;
+    render(dest: HTMLDivElement, optionsAtRuntime?: WebchatArgs): Promise<void>;
+}