@modochats/widget 0.1.0 → 0.1.2

package/src/services/chat/message-utils.ts

@@ -1,221 +0,0 @@
-import {ConversationMessage} from "@modochats/chat-client";
-import {marked} from "marked";
-
-type MessageRelatedUtil<T extends Array<any> = [], R = void> = (message: ConversationMessage, ...args: T) => R;
-
-const initMessageElement: MessageRelatedUtil = message => {
-  const element = document.createElement("div");
-  const widget = window.getMWidget?.();
-  element.id = `message-${message.id}`;
-  // Format time from createdAt
-  const messageTime = new Date(message.createdAt);
-  const timeString = messageTime.toLocaleTimeString("fa-IR", {
-    hour: "2-digit",
-    minute: "2-digit",
-    hour12: false
-  });
-
-  // Build the HTML with replied-to message preview if exists
-  let repliedToHtml = "";
-  if (message.repliedTo) {
-    const repliedContent = message.repliedTo.content.length > 40 ? message.repliedTo.content.substring(0, 40) + "..." : message.repliedTo.content;
-    repliedToHtml = `
-        <div class="mw-replied-to-preview" data-reply-message-id="${message.repliedTo.id}">
-          <div class="mw-replied-to-header">
-            <span class="mw-replied-to-sender">${message.repliedTo.type === "USER" ? "شما" : "پشتیبان"}</span>
-          </div>
-          <div class="mw-replied-to-content">${repliedContent}</div>
-        </div>
-      `;
-  }
-
-  // Build file preview HTML if file exists
-  let filePreviewHtml = "";
-  if (message.fileSrc) {
-    const displayFileName = message.fileSrc.length > 20 ? message.fileSrc.substring(0, 17) + "..." : message.fileSrc;
-    filePreviewHtml = `
-        <a href="${message.fileSrc}" target="_blank" rel="noopener noreferrer" class="mw-file-preview" title="دانلود فایل">
-          <div class="mw-file-preview-icon">
-            ${'<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24"><path fill="currentColor" d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-8-6m4 18H6V4h7v5h5v11z"/></svg>'}
-          </div>
-          <div class="mw-file-preview-info">
-            <div class="mw-file-preview-name">${displayFileName}</div>
-            <div class="mw-file-preview-type">${"file"}</div>
-          </div>
-        </a>
-      `;
-  }
-
-  element.innerHTML = `
-    <div class="mw-chat-message ${message.type === "USER" ? "mw-chat-message-user" : "mw-chat-message-supporter"}">
-    ${repliedToHtml}
-    ${filePreviewHtml}
-        <div class="mw-message-content">${marked.parse(message.content) as string}</div>
-      </div>
-      <div class="mw-message-footer">
-      ${
-        message.type !== "USER"
-          ? `
-        <div class="mw-message-feedback">
-        <button class="mw-feedback-btn mw-feedback-dislike" data-message-id="${message.id}" title="مفید نبود">
-        <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><g fill="none"><path fill="currentColor" d="m15 14l-.986.164A1 1 0 0 1 15 13zM4 14v1a1 1 0 0 1-1-1zm16.522-2.392l.98-.196zM6 3h11.36v2H6zm12.56 12H15v-2h3.56zm-2.573-1.164l.805 4.835L14.82 19l-.806-4.836zM14.82 21h-.214v-2h.214zm-3.543-1.781l-2.515-3.774l1.664-1.11l2.516 3.774zM7.93 15H4v-2h3.93zM3 14V6h2v8zm17.302-8.588l1.2 6l-1.96.392l-1.2-6zM8.762 15.445A1 1 0 0 0 7.93 15v-2a3 3 0 0 1 2.496 1.336zm8.03 3.226A2 2 0 0 1 14.82 21v-2zM18.56 13a1 1 0 0 0 .981-1.196l1.961-.392A3 3 0 0 1 18.561 15zm-1.2-10a3 3 0 0 1 2.942 2.412l-1.96.392A1 1 0 0 0 17.36 5zm-2.754 18a4 4 0 0 1-3.328-1.781l1.664-1.11a2 2 0 0 0 1.664.891zM6 5a1 1 0 0 0-1 1H3a3 3 0 0 1 3-3z"/><path stroke="currentColor" stroke-width="2" d="M8 14V4"/></g></svg>
-        </button>
-        <button class="mw-feedback-btn mw-feedback-like" data-message-id="${message.id}" title="مفید بود">
-        <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><g fill="none"><path fill="currentColor" d="m15 10l-.74-.123a.75.75 0 0 0 .74.873zM4 10v-.75a.75.75 0 0 0-.75.75zm16.522 2.392l.735.147zM6 20.75h11.36v-1.5H6zm12.56-11.5H15v1.5h3.56zm-2.82.873l.806-4.835l-1.48-.247l-.806 4.836zm-.92-6.873h-.214v1.5h.213zm-3.335 1.67L8.97 8.693l1.248.832l2.515-3.773zM7.93 9.25H4v1.5h3.93zM3.25 10v8h1.5v-8zm16.807 8.54l1.2-6l-1.47-.295l-1.2 6zM8.97 8.692a1.25 1.25 0 0 1-1.04.557v1.5c.92 0 1.778-.46 2.288-1.225zm7.576-3.405A1.75 1.75 0 0 0 14.82 3.25v1.5a.25.25 0 0 1 .246.291zm2.014 5.462c.79 0 1.38.722 1.226 1.495l1.471.294A2.75 2.75 0 0 0 18.56 9.25zm-1.2 10a2.75 2.75 0 0 0 2.697-2.21l-1.47-.295a1.25 1.25 0 0 1-1.227 1.005zm-2.754-17.5a3.75 3.75 0 0 0-3.12 1.67l1.247.832a2.25 2.25 0 0 1 1.873-1.002zM6 19.25c-.69 0-1.25-.56-1.25-1.25h-1.5A2.75 2.75 0 0 0 6 20.75z"/><path stroke="currentColor" stroke-width="1.5" d="M8 10v10"/></g></svg>
-        </button>
-        </div>
-        `
-          : ""
-      }
-    <div class="mw-message-time">${timeString}</div>
-    </div>
-    `;
-
-  element.className = `mw-message-wrapper ${message.type === "USER" ? "mw-message-wrapper-user" : "mw-message-wrapper-supporter"}`;
-  widget?.chat?.conversation.containerElement?.appendChild(element);
-
-  addMessageElementListeners(message);
-
-  // Add feedback event listeners for non-user messages
-  if (message.type !== "USER") {
-    addMessageFeedbackListeners(message);
-  }
-
-  // Add clicked listener for replied-to preview
-  if (message.repliedTo) {
-    addMessageRepliedToListener(message);
-  }
-};
-
-const addMessageElementListeners: MessageRelatedUtil = message => {
-  const widget = window.getMWidget?.();
-  const element = getMessageElement(message);
-
-  element?.addEventListener("dblclick", () => {
-    widget?.chat.replyMaster.setReply(message);
-  });
-};
-
-const addMessageFeedbackListeners: MessageRelatedUtil = message => {
-  const element = getMessageElement(message);
-  const likeBtn = element?.querySelector(".mw-feedback-like") as HTMLButtonElement;
-  const dislikeBtn = element?.querySelector(".mw-feedback-dislike") as HTMLButtonElement;
-
-  if (likeBtn) {
-    likeBtn.addEventListener("click", () => {
-      sendMessageFeedBack(message, true);
-    });
-  }
-
-  if (dislikeBtn) {
-    dislikeBtn.addEventListener("click", () => {
-      sendMessageFeedBack(message, false);
-    });
-  }
-};
-
-const sendMessageFeedBack: MessageRelatedUtil<[liked: boolean]> = async (message, liked) => {
-  const element = getMessageElement(message);
-  if (message.hasFeedback) return; // Prevent multiple feedback submissions
-  disableMessageFeedbackButtons(message);
-  try {
-    await message.sendFeedBack(liked);
-    const likeBtn = element?.querySelector(".mw-feedback-like") as HTMLButtonElement;
-    const dislikeBtn = element?.querySelector(".mw-feedback-dislike") as HTMLButtonElement;
-
-    if (liked && likeBtn) {
-      likeBtn.classList.add("mw-feedback-active");
-    } else if (!liked && dislikeBtn) {
-      dislikeBtn.classList.add("mw-feedback-active");
-    }
-  } catch {
-    enableMessageFeedbackButtons(message);
-  }
-};
-
-const disableMessageFeedbackButtons: MessageRelatedUtil = message => {
-  const element = getMessageElement(message);
-  const likeBtn = element?.querySelector(".mw-feedback-like") as HTMLButtonElement;
-  const dislikeBtn = element?.querySelector(".mw-feedback-dislike") as HTMLButtonElement;
-
-  if (likeBtn) {
-    likeBtn.disabled = true;
-    likeBtn.classList.add("mw-feedback-disabled");
-  }
-
-  if (dislikeBtn) {
-    dislikeBtn.disabled = true;
-    dislikeBtn.classList.add("mw-feedback-disabled");
-  }
-};
-
-const addMessageRepliedToListener: MessageRelatedUtil = message => {
-  const element = getMessageElement(message);
-
-  const repliedToEl = getMessageElement(message.repliedTo! || {});
-  const repliedToPreview = element?.querySelector(".mw-replied-to-preview") as HTMLDivElement;
-  if (repliedToPreview && repliedToEl) {
-    repliedToPreview.addEventListener("click", () => {
-      // Scroll to the replied message
-      repliedToEl?.scrollIntoView({behavior: "smooth", block: "center"});
-
-      // Add highlight effect
-      repliedToEl?.classList.add("mw-message-highlight");
-      setTimeout(() => {
-        repliedToEl?.classList.remove("mw-message-highlight");
-      }, 2000);
-    });
-  }
-};
-
-const getMessageElement: MessageRelatedUtil<[], HTMLDivElement | undefined | null> = message => {
-  const widget = window.getMWidget?.();
-  return widget?.chat.conversation.containerElement?.querySelector(`#message-${message.id}`);
-};
-
-const showMessageTooltip: MessageRelatedUtil = message => {
-  const widget = window.getMWidget?.();
-  const tooltip = widget?.container?.querySelector(".mw-toggle-tooltip");
-  const tooltipText = widget?.container?.querySelector(".mw-toggle-tooltip-text");
-  if (tooltip && tooltipText) {
-    // Show the tooltip
-    tooltip.classList.remove("mw-hidden");
-
-    // Update tooltip text with message preview
-    const preview = message.content.length > 50 ? message.content.substring(0, 50) + "..." : message.content;
-    tooltipText.textContent = preview;
-
-    // Auto-hide after 3 seconds
-    setTimeout(() => {
-      tooltip.classList.add("mw-hidden");
-    }, 3000);
-  }
-};
-
-const enableMessageFeedbackButtons: MessageRelatedUtil = message => {
-  const element = getMessageElement(message);
-  const likeBtn = element?.querySelector(".mw-feedback-like") as HTMLButtonElement;
-  const dislikeBtn = element?.querySelector(".mw-feedback-dislike") as HTMLButtonElement;
-
-  if (likeBtn) {
-    likeBtn.disabled = false;
-    likeBtn.classList.remove("mw-feedback-disabled");
-  }
-
-  if (dislikeBtn) {
-    dislikeBtn.disabled = false;
-    dislikeBtn.classList.remove("mw-feedback-disabled");
-  }
-};
-
-export {
-  initMessageElement,
-  addMessageElementListeners,
-  addMessageFeedbackListeners,
-  sendMessageFeedBack,
-  disableMessageFeedbackButtons,
-  addMessageRepliedToListener,
-  getMessageElement,
-  showMessageTooltip,
-  enableMessageFeedbackButtons
-};

package/src/services/chat/model.ts

@@ -1,139 +0,0 @@
-import {Conversation} from "#src/models/conversation.js";
-import {ChatClient, ConversationMessage, EventType} from "@modochats/chat-client";
-import {onSocketConnectionUpdate} from "../socket/utils.js";
-
-class Chat {
-  private instance?: ChatClient;
-  fileMaster: CFileMaster;
-  replyMaster: CReplyMaster;
-  conversation: Conversation;
-  constructor() {
-    this.fileMaster = new CFileMaster();
-    this.replyMaster = new CReplyMaster();
-    this.conversation = new Conversation();
-  }
-  initInstance() {
-    const widget = window.getMWidget?.();
-    const savedUUid = localStorage.getItem(`modo-chat:${widget?.chatbot?.uuid}-conversation-uuid`);
-    this.instance = new ChatClient({
-      chatbotUuid: widget?.chatbot?.uuid as string,
-      userData: {uuid: widget?.customerData.uniqueId as string, phoneNumber: widget?.customerData.phoneNumber},
-      conversationUUid: savedUUid || undefined
-    });
-    this.instance.on(EventType.CONVERSATION_SYSTEM_MESSAGE, ev => {
-      this.conversation.addSystemMessage(ev.message);
-    });
-    this.instance.on(EventType.CONVERSATION_MESSAGE, ev => {
-      this.conversation.addMessage(ev.message, {incoming: ev.incoming});
-    });
-    this.instance.on(EventType.SOCKET_CONNECTED, ev => {
-      onSocketConnectionUpdate(true);
-    });
-    this.instance.on(EventType.SOCKET_DISCONNECTED, ev => {
-      onSocketConnectionUpdate(false);
-    });
-    this.instance.on(EventType.CONVERSATION_LOAD, ev => {
-      this.conversation.clearContainerEl();
-      this.conversation.setStatus();
-      this.conversation.onInit();
-
-      localStorage.setItem(`modo-chat:${widget?.chatbot?.uuid}-conversation-uuid`, this.instance?.conversation?.uuid as string);
-    });
-    this.instance.on(EventType.CONVERSATION_MESSAGES_CLEAR, () => {
-      this.conversation.clearContainerEl();
-    });
-  }
-  get socket() {
-    return this.instance?.socket;
-  }
-  // conversation data , since the instance only stores and handles data ^^
-  get conversationD() {
-    return this.instance?.conversation;
-  }
-  clear() {
-    this.conversation.clear();
-    this.instance?.clearConversation();
-  }
-
-  sendMessage(...args: Parameters<ChatClient["sendMessage"]>) {
-    return this.instance?.sendMessage(...args);
-  }
-}
-class CFileMaster {
-  file?: File;
-
-  clearFile() {
-    this.file = undefined;
-    this.toggleUiState();
-  }
-  setFile(file: File) {
-    this.file = file;
-    this.toggleUiState();
-  }
-  toggleUiState() {
-    const container = window.getMWidget?.().container;
-    const fileUploadBtn = container?.querySelector(".mw-file-upload-btn") as HTMLButtonElement;
-    const fileInput = container?.querySelector(".mw-file-input") as HTMLInputElement;
-    const uploadIcon = container?.querySelector(".mw-file-upload-icon") as SVGElement;
-    const removeIcon = container?.querySelector(".mw-file-remove-icon") as SVGElement;
-
-    if (this.file) {
-      uploadIcon.classList.add("mw-hidden");
-      removeIcon.classList.remove("mw-hidden");
-      fileUploadBtn.classList.add("mw-file-uploaded");
-    } else {
-      fileInput.value = "";
-      uploadIcon.classList.remove("mw-hidden");
-      removeIcon.classList.add("mw-hidden");
-      fileUploadBtn.classList.remove("mw-file-uploaded");
-    }
-  }
-}
-
-class CReplyMaster {
-  replyingTo?: ConversationMessage;
-
-  setReply(message: ConversationMessage) {
-    this.replyingTo = message;
-    this.updateReplyUI();
-  }
-
-  clearReply() {
-    this.replyingTo = undefined;
-
-    this.updateReplyUI();
-  }
-
-  private updateReplyUI() {
-    const container = window.getMWidget?.().container;
-    const replyPreview = container?.querySelector(".mw-reply-preview") as HTMLDivElement;
-    const replyText = container?.querySelector(".mw-reply-preview-text") as HTMLElement;
-    const chatMessagesContainer = container?.querySelector(".mw-chat-messages-con") as HTMLDivElement;
-
-    if (this.replyingTo) {
-      // Show reply preview
-      if (replyPreview && replyText) {
-        // Truncate content to 50 chars
-        const content = this.replyingTo.content.length > 50 ? this.replyingTo.content.substring(0, 50) + "..." : this.replyingTo.content;
-        replyText.textContent = content;
-        replyPreview.classList.remove("mw-hidden");
-
-        // Add reply active class to messages container
-        if (chatMessagesContainer) {
-          chatMessagesContainer.classList.add("mw-reply-active");
-        }
-      }
-    } else {
-      // Hide reply preview
-      if (replyPreview) {
-        replyPreview.classList.add("mw-hidden");
-
-        // Remove reply active class from messages container
-        if (chatMessagesContainer) {
-          chatMessagesContainer.classList.remove("mw-reply-active");
-        }
-      }
-    }
-  }
-}
-export {Chat};

package/src/services/chatbot/chatbot.ts

@@ -1,66 +0,0 @@
-class Chatbot {
-  name: string;
-  image: string;
-  shortDescription: string;
-  starters: string[] = [];
-  voiceChat: boolean;
-  createdAt: string;
-  updatedAt: string;
-  deletedAt: string | null;
-  uuid: string;
-  allowedHosts: string[] = [];
-  id: number;
-  greetingMessage?: string;
-  uiConfig: {
-    primaryColor: string;
-    foregroundColor: string;
-    theme: "dark" | "light";
-  };
-  constructor(data: Record<string, any>) {
-    this.name = data.name;
-    this.image = data.image;
-    this.shortDescription = data.short_description;
-    this.starters = data.starters;
-    this.voiceChat = data.voice_agent;
-    this.createdAt = data.setting.created_at;
-    this.updatedAt = data.setting.updated_at;
-    this.deletedAt = data.setting.deleted_at;
-    this.uuid = data.setting.unique_id;
-    this.allowedHosts = data.setting.allow_hosts?.split(",") ?? [];
-    this.id = data.setting.chatbot;
-    this.allowedHosts.push("modochats.com");
-    this.uiConfig = {
-      primaryColor: data.primary_color,
-      foregroundColor: data.foreground_color,
-      theme: data.theme
-    };
-    this.greetingMessage = data.greeting_message;
-  }
-  showTooltip() {
-    const widget = window.getMWidget?.();
-    const tooltip = widget?.container?.querySelector(".mw-toggle-tooltip");
-    const tooltipText = widget?.container?.querySelector(".mw-toggle-tooltip-text");
-    const hasSeen = localStorage.getItem(`modochats:${widget?.publicKey}-has-seen-greeting-message`) === "true";
-
-    if (tooltip && tooltipText && this.greetingMessage && !hasSeen) {
-      // Show the tooltip
-      tooltip.classList.remove("mw-hidden");
-
-      // Update tooltip text with greeting message
-      tooltipText.textContent = this.greetingMessage;
-
-      // Auto-hide after 5 seconds
-      // setTimeout(() => {
-      //   tooltip.classList.add("mw-hidden");
-      // }, 5000);
-    }
-  }
-  hideTooltip() {
-    const widget = window.getMWidget?.();
-    const tooltip = widget?.container?.querySelector(".mw-toggle-tooltip");
-    if (tooltip) {
-      tooltip.classList.add("mw-hidden");
-    }
-  }
-}
-export {Chatbot};

package/src/services/checker.ts

@@ -1,10 +0,0 @@
-import {Widget} from "#src/app.js";
-import {parse} from "tldts";
-
-const checkIfHostIsAllowed = (widget: Widget) => {
-  const currentHost = parse(window.location.origin).hostname;
-  const allowedHosts = widget.chatbot?.allowedHosts || [];
-  if (currentHost) return allowedHosts.includes(currentHost);
-};
-
-export {checkIfHostIsAllowed};

package/src/services/listeners/adders.ts

@@ -1,178 +0,0 @@
-import {getMessageElement} from "#src/services/chat/message-utils.js";
-import {sendMessage, submitPhoneNumberForm} from "./fn.js";
-
-const registerListeners = (widgetContainer: HTMLDivElement) => {
-  let chatBody = widgetContainer.querySelector(".mw-chat-body");
-  const toggleChatBtn = widgetContainer.querySelector(".mw-toggle-chat-btn") as HTMLButtonElement;
-  let isBodyOpen = false;
-
-  // Set footer link URL with origin parameter and version title
-  const footerLink = widgetContainer.querySelector(".mw-footer-link") as HTMLAnchorElement;
-  if (footerLink) {
-    const widget = window.getMWidget?.();
-    footerLink.href = `https://modochats.com?utm_source=${encodeURIComponent(window.location.origin)}`;
-    footerLink.title = `مودوچت v${widget?.version || "0.1"}`;
-  }
-
-  // toggle chat body visibility (only if not in fullscreen mode)
-  if (toggleChatBtn) {
-    toggleChatBtn.addEventListener(
-      "click",
-      () => {
-        const widget = window.getMWidget?.();
-        isBodyOpen = !isBodyOpen;
-        if (isBodyOpen) widget?.onOpen();
-        else widget?.onClose();
-        chatBody?.classList.toggle("mw-hidden");
-        toggleChatBtn.classList.toggle("mw-chat-open", isBodyOpen);
-      },
-      {capture: false}
-    );
-  }
-
-  registerSendMessageListener(widgetContainer);
-  registerPhoneNumberFormListeners(widgetContainer);
-  registerNewConversationListener(widgetContainer);
-  registerFileUploadListener(widgetContainer);
-  registerReplyPreviewListener(widgetContainer);
-  registerTooltipCloseListener(widgetContainer);
-};
-
-const registerSendMessageListener = (widgetContainer: HTMLDivElement) => {
-  const chatInput = widgetContainer.querySelector(".mw-chat-input") as HTMLInputElement;
-  const sendMessageBtn = widgetContainer.querySelector(".mw-send-message-btn") as HTMLButtonElement;
-
-  let isDisabled = false;
-  function toggleLoading() {
-    isDisabled = !isDisabled;
-    chatInput.disabled = isDisabled;
-    sendMessageBtn.disabled = isDisabled;
-    sendMessageBtn.setAttribute("data-is-loading", String(isDisabled));
-  }
-
-  chatInput.addEventListener("keydown", e => {
-    if (e.key === "Enter") {
-      e.preventDefault();
-      const message = chatInput.value;
-      toggleLoading();
-      sendMessage(message)
-        .then(() => {
-          chatInput.value = "";
-        })
-        .finally(toggleLoading);
-    }
-  });
-  sendMessageBtn.addEventListener("click", e => {
-    e.preventDefault();
-    const message = chatInput.value;
-    toggleLoading();
-    sendMessage(message)
-      .then(() => {
-        chatInput.value = "";
-      })
-      .finally(toggleLoading);
-  });
-};
-
-const registerPhoneNumberFormListeners = (widgetContainer: HTMLDivElement) => {
-  const formOverlay = widgetContainer.querySelector(".mw-form-overlay") as HTMLDivElement;
-  const phoneInput = widgetContainer.querySelector(".mw-phone-input") as HTMLInputElement;
-  const formSubmitBtn = widgetContainer.querySelector(".mw-form-submit-btn") as HTMLButtonElement;
-  const formCancelBtn = widgetContainer.querySelector(".mw-form-cancel-btn") as HTMLButtonElement;
-  formSubmitBtn.addEventListener("click", () => {
-    const phoneNumber = phoneInput.value;
-    submitPhoneNumberForm(phoneNumber);
-  });
-  formCancelBtn.addEventListener("click", () => {
-    formOverlay.classList.add("mw-hidden");
-  });
-};
-
-const registerNewConversationListener = (widgetContainer: HTMLDivElement) => {
-  const newBtn = widgetContainer.querySelector(".mw-new-conversation-btn") as HTMLButtonElement;
-
-  newBtn.addEventListener("click", () => {
-    const widget = window.getMWidget?.();
-    if (widget) {
-      widget.chat!.clear();
-    }
-  });
-};
-
-const registerFileUploadListener = (widgetContainer: HTMLDivElement) => {
-  const fileUploadBtn = widgetContainer.querySelector(".mw-file-upload-btn") as HTMLButtonElement;
-  const fileInput = widgetContainer.querySelector(".mw-file-input") as HTMLInputElement;
-  const widget = window?.getMWidget?.();
-
-  // Trigger file input when button is clicked
-  fileUploadBtn.addEventListener("click", () => {
-    if (widget?.chat.fileMaster.file) {
-      // If a file is selected, remove it
-      widget?.chat.fileMaster.clearFile();
-    } else {
-      // Otherwise, open file picker
-      fileInput.click();
-    }
-  });
-
-  // Handle file selection
-  fileInput.addEventListener("change", () => {
-    if (fileInput.files && fileInput.files.length > 0) {
-      widget?.chat.fileMaster.setFile(fileInput.files[0]);
-    }
-  });
-};
-
-const registerReplyPreviewListener = (widgetContainer: HTMLDivElement) => {
-  const replyPreview = widgetContainer.querySelector(".mw-reply-preview") as HTMLDivElement;
-  const replyPreviewClose = widgetContainer.querySelector(".mw-reply-preview-close") as HTMLButtonElement;
-  const replyPreviewInfo = widgetContainer.querySelector(".mw-reply-preview-info") as HTMLDivElement;
-
-  if (!replyPreview || !replyPreviewClose || !replyPreviewInfo) return;
-
-  // Close button - clear reply
-  replyPreviewClose.addEventListener("click", e => {
-    e.stopPropagation();
-    const widget = window.getMWidget?.();
-    if (widget?.chat) {
-      widget.chat.replyMaster.clearReply();
-    }
-  });
-
-  // Click on preview info - scroll to message
-  replyPreviewInfo.addEventListener("click", () => {
-    const widget = window.getMWidget?.();
-    const replyingToEl = getMessageElement(widget?.chat.replyMaster.replyingTo! || {});
-
-    if (replyingToEl) {
-      // Scroll to the message
-      const messagesContainer = widgetContainer.querySelector(".mw-chat-messages-con") as HTMLDivElement;
-      if (messagesContainer) {
-        replyingToEl.scrollIntoView({behavior: "smooth", block: "center"});
-
-        // Add a highlight effect
-        replyingToEl.classList.add("mw-message-highlight");
-        setTimeout(() => {
-          replyingToEl?.classList.remove("mw-message-highlight");
-        }, 2000);
-      }
-    }
-  });
-};
-
-const registerTooltipCloseListener = (widgetContainer: HTMLDivElement) => {
-  const widget = window.getMWidget?.();
-  const tooltipCloseBtn = widgetContainer.querySelector(".mw-toggle-tooltip-close") as HTMLButtonElement;
-  const tooltip = widgetContainer.querySelector(".mw-toggle-tooltip") as HTMLDivElement;
-  if (tooltipCloseBtn) {
-    tooltipCloseBtn.addEventListener("click", e => {
-      localStorage.setItem(`modochats:${widget?.publicKey}-has-seen-greeting-message`, "true");
-      e.stopPropagation();
-      if (tooltip) {
-        tooltip.classList.add("mw-hidden");
-      }
-    });
-  }
-};
-
-export {registerListeners, registerNewConversationListener};

package/src/services/listeners/fn.ts

@@ -1,77 +0,0 @@
-import {PhoneNumberRegex} from "#src/constants/regex.js";
-
-const sendMessage = async (message: string) => {
-  if (message.trim().length) {
-    if (checkIfUserHasPhoneNumber()) {
-      const widget = window.getMWidget?.();
-
-      if (widget) {
-        const savedFile = widget.chat.fileMaster.file;
-        const savedReply = widget.chat.replyMaster.replyingTo?.id;
-        if (widget?.conversation?.d?.uuid) {
-          const chatInput = widget.container?.querySelector(".mw-chat-input") as HTMLInputElement;
-          if (chatInput) chatInput.value = "";
-        }
-        widget.chat.fileMaster.clearFile();
-        widget.chat.replyMaster.clearReply();
-        await widget?.chat.sendMessage(message, {file: savedFile, replyTo: savedReply});
-      } else {
-        console.error("Widget instance not found");
-      }
-    } else {
-      throw new Error("User has not submitted the phone number form");
-    }
-  }
-};
-
-const checkIfUserHasPhoneNumber = () => {
-  const widget = window.getMWidget?.();
-  if (widget?.customerData?.hasSubmittedPhoneForm()) {
-    // User has already submitted the phone number form (whether empty or with phone number)
-    return true;
-  } else {
-    // Show phone number form
-    switchToPhoneNumberFormView();
-    return false;
-  }
-};
-
-const switchToPhoneNumberFormView = () => {
-  const formOverlay = window.getMWidget?.().container?.querySelector(".mw-form-overlay");
-  if (formOverlay) {
-    formOverlay.classList.remove("mw-hidden");
-    formOverlay.classList.add("mw-active");
-  }
-};
-const submitPhoneNumberForm = (phoneNumber: string) => {
-  // Allow empty phone number or valid phone number
-  const parsedPhoneNumber = phoneNumber.replace(/[۰-۹٠-٩]/g, ch => {
-    const fa = "۰۱۲۳۴۵۶۷۸۹".indexOf(ch);
-    if (fa > -1) return String(fa);
-    const ar = "٠١٢٣٤٥٦٧٨٩".indexOf(ch);
-    if (ar > -1) return String(ar);
-    return ch;
-  });
-
-  if (parsedPhoneNumber.trim() === "" || PhoneNumberRegex.test(parsedPhoneNumber)) {
-    const widget = window.getMWidget?.();
-    if (widget) {
-      // Update the phone number
-      widget.customerData.savePhoneNumber(phoneNumber.trim() || undefined);
-
-      const formOverlay = widget.container?.querySelector(".mw-form-overlay");
-      if (formOverlay) {
-        formOverlay.classList.remove("mw-active");
-        formOverlay.classList.add("mw-hidden");
-      }
-
-      (widget.container?.querySelector(".mw-send-message-btn") as HTMLButtonElement)?.click();
-    } else {
-      console.error("Widget instance not found");
-    }
-  } else {
-    alert("لطفا شماره تلفن معتبر وارد کنید یا فیلد را خالی بگذارید.");
-  }
-};
-
-export {sendMessage, submitPhoneNumberForm};