@jrapps/my_tickets_chat_ui 0.2.2 → 0.3.1

package/dist/cjs/components/SiteChatComponent/index.js

@@ -1,998 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/components/SiteChatComponent/index.ts
-var SiteChatComponent_exports = {};
-__export(SiteChatComponent_exports, {
-  SiteChatComponent: () => SiteChatComponent
-});
-module.exports = __toCommonJS(SiteChatComponent_exports);
-
-// src/components/SiteChatComponent/SiteChatComponent.tsx
-var import_react7 = __toESM(require("react"));
-var import_design_system9 = require("@wix/design-system");
-var import_styles_global = require("@wix/design-system/styles.global.css");
-
-// src/components/SiteChatComponent/useSiteChatComponent.ts
-function useSiteChatComponent() {
-  return {};
-}
-
-// src/components/SiteChatComponent/FabButton/FabButton.tsx
-var import_react = __toESM(require("react"));
-var import_design_system = require("@wix/design-system");
-var import_wix_ui_icons_common = require("@wix/wix-ui-icons-common");
-var import_jsx_runtime = require("react/jsx-runtime");
-var FabButton = import_react.default.forwardRef(
-  ({
-    className,
-    children,
-    onClick,
-    type = "textIcon",
-    icon = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_wix_ui_icons_common.WixChat, {}),
-    text,
-    ...rest
-  }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-      "button",
-      {
-        className: "site-chat-component-fab",
-        onClick,
-        children: [
-          type === "textIcon" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "site-chat-component-fab-fab-button-icon", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Box, { height: "100%", children: icon }) }) : null,
-          type === "textIcon" || type === "text" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "site-chat-component-fab-fab-button-text", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "site-chat-component-fab-fab-button-label", children: text }) }) : null,
-          type === "icon" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "site-chat-component-fab-fab-button-icon", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Box, { height: "100%", width: "max-content", children: icon }) }) : null
-        ]
-      }
-    ) });
-  }
-);
-FabButton.displayName = "SiteChatComponent.FabButton";
-
-// src/components/SiteChatComponent/Footer/Footer.tsx
-var import_react3 = __toESM(require("react"));
-var import_design_system4 = require("@wix/design-system");
-
-// src/components/SiteChatComponent/Footer/send-button/send-button.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var SendButton = ({
-  text = "Send",
-  className = "",
-  onClick,
-  disabled = false
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    "button",
-    {
-      className: `site-chat-component-footer-my-tickets-chat-widget-send-button ${className}`,
-      onClick,
-      disabled,
-      children: text
-    }
-  );
-};
-var send_button_default = SendButton;
-
-// src/components/SiteChatComponent/Footer/attachment-list/attachment-list.tsx
-var import_react2 = require("react");
-var import_design_system2 = require("@wix/design-system");
-var import_wix_ui_icons_common2 = require("@wix/wix-ui-icons-common");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var AttachmentList = ({ items, onRemove, onClick, onFilesSent }) => {
-  const [localItems, setLocalItems] = (0, import_react2.useState)(items);
-  (0, import_react2.useEffect)(() => {
-    setLocalItems(items);
-  }, [items]);
-  const handleOnRemove = (id) => {
-    if (onRemove) {
-      onRemove(id);
-    }
-    setLocalItems((prev) => prev.filter((item) => item.id !== id));
-  };
-  const handleSendFiles = () => {
-    if (onFilesSent && localItems.length > 0) {
-      onFilesSent(localItems);
-      setLocalItems([]);
-    }
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system2.Box, { direction: "horizontal", gap: 2, maxWidth: "100%", minWidth: "100%", overflowY: "hidden", boxSizing: "border-box", scrollbarWidth: "thin", overflowX: "auto", children: localItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "site-chat-component-footer-file-item-container", onClick: () => onClick && onClick(item.id, item.url), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_wix_ui_icons_common2.Page, { size: "15px" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "site-chat-component-footer-file-name", children: item.name }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system2.IconButton, { size: "tiny", onClick: () => handleOnRemove(item.id), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_wix_ui_icons_common2.DismissSmall, {}) })
-  ] }, item.id)) });
-};
-var attachment_list_default = AttachmentList;
-
-// src/components/SiteChatComponent/Footer/message-input/message-input.tsx
-var import_design_system3 = require("@wix/design-system");
-var import_wix_ui_icons_common3 = require("@wix/wix-ui-icons-common");
-
-// src/components/SiteChatComponent/Footer/message-input/open-file-picker.ts
-var import_essentials = require("@wix/essentials");
-var import_meta = {};
-var uploadFile = async (file) => {
-  var _a;
-  try {
-    const baseApiUrl = new URL(import_meta.url).origin;
-    const response = await import_essentials.httpClient.fetchWithAuth(`${baseApiUrl}/api/widget/chat/upload-attachment`, {
-      method: "POST",
-      headers: {
-        "Content-Type": file.type || "application/octet-stream",
-        "x-file-name": encodeURIComponent(file.name),
-        "x-file-type": file.type || "application/octet-stream"
-      },
-      body: file
-    });
-    const data = await response.json();
-    if (!response.ok) {
-      throw new Error(data.error || "Failed to upload file");
-    }
-    if (!((_a = data.file) == null ? void 0 : _a.id) || !data.file.displayName || !data.file.url) {
-      throw new Error("Invalid response format from upload endpoint");
-    }
-    return data.file;
-  } catch (error) {
-    console.error("Error uploading file:", error);
-    return null;
-  }
-};
-var openFilePicker = async (options) => {
-  const win = window;
-  if (!win.showOpenFilePicker) {
-    console.error("File Picker API is not supported in this browser.");
-    return;
-  }
-  try {
-    const fileHandles = await win.showOpenFilePicker(options);
-    const fileHandle = fileHandles[0];
-    const file = await fileHandle.getFile();
-    const uploadedFile = await uploadFile(file);
-    if (!uploadedFile) {
-      console.error("Failed to upload file.");
-      return;
-    }
-    return {
-      id: uploadedFile.id,
-      name: uploadedFile.displayName,
-      url: uploadedFile.url
-    };
-  } catch (error) {
-    console.error("Error opening file picker:", error);
-    return null;
-  }
-};
-
-// src/components/SiteChatComponent/Footer/message-input/message-input.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var MessageInput = ({
-  placeholder = "Type a message...",
-  disabled = false,
-  className = "",
-  suffix,
-  value = "",
-  onChange,
-  onKeyDown,
-  onAttachmentAdded
-}) => {
-  const handleAttachmentOnClick = async () => {
-    try {
-      await openFilePicker({ multiple: false }).then((file) => {
-        if (file && onAttachmentAdded) {
-          onAttachmentAdded(file);
-        }
-      });
-    } catch (error) {
-      console.error("Error opening file picker:", error);
-    }
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: `site-chat-component-footer-input-wrapper ${className}`, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      "input",
-      {
-        name: "messageInput",
-        className: "site-chat-component-footer-chat-input",
-        placeholder,
-        disabled,
-        value,
-        onChange,
-        onKeyDown
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("sub", { className: "site-chat-component-footer-suffix", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system3.IconButton, { onClick: handleAttachmentOnClick, className: "attachment-icon-button", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_wix_ui_icons_common3.AttachmentSmall, {}) }) })
-  ] });
-};
-var message_input_default = MessageInput;
-
-// src/components/SiteChatComponent/Footer/Footer.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var Footer = import_react3.default.forwardRef(
-  ({
-    className,
-    children,
-    sendButtonConfig,
-    attachmentListConfig,
-    messageInputConfig,
-    onAttachmentAdded,
-    ...rest
-  }, ref) => {
-    const handleSendMessage = (text, messageType, attachment) => {
-      if (sendButtonConfig == null ? void 0 : sendButtonConfig.onClick) {
-        sendButtonConfig.onClick(text, messageType, attachment);
-      } else {
-        console.warn("handleSendMessage function is not provided in sendButtonConfig");
-      }
-    };
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_design_system4.Box, { ref, className: "site-chat-component-footer-message-input-container", direction: "vertical", gap: 1, verticalAlign: "middle", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system4.Box, { width: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(attachment_list_default, { items: (attachmentListConfig == null ? void 0 : attachmentListConfig.items) || [], onRemove: attachmentListConfig == null ? void 0 : attachmentListConfig.onRemove, onClick: attachmentListConfig == null ? void 0 : attachmentListConfig.onClick, onFilesSent: attachmentListConfig == null ? void 0 : attachmentListConfig.onFilesSent }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_design_system4.Box, { alignContent: "bottom", width: "100%", direction: "horizontal", gap: 2, verticalAlign: "middle", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-          message_input_default,
-          {
-            placeholder: (messageInputConfig == null ? void 0 : messageInputConfig.placeholder) || "Type your message here...",
-            className: (messageInputConfig == null ? void 0 : messageInputConfig.className) || "message-input",
-            value: (messageInputConfig == null ? void 0 : messageInputConfig.value) || "",
-            onChange: messageInputConfig == null ? void 0 : messageInputConfig.onChange,
-            onKeyDown: messageInputConfig == null ? void 0 : messageInputConfig.onKeyDown,
-            disabled: messageInputConfig == null ? void 0 : messageInputConfig.disabled,
-            onAttachmentAdded
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-          send_button_default,
-          {
-            onClick: () => handleSendMessage((messageInputConfig == null ? void 0 : messageInputConfig.value) || "", (attachmentListConfig == null ? void 0 : attachmentListConfig.items) ? "ATTACHMENT" : "TEXT"),
-            disabled: sendButtonConfig == null ? void 0 : sendButtonConfig.disabled,
-            text: (sendButtonConfig == null ? void 0 : sendButtonConfig.buttonText) || "Send"
-          }
-        )
-      ] })
-    ] });
-  }
-);
-Footer.displayName = "SiteChatComponent.Footer";
-
-// src/components/SiteChatComponent/Header/Header.tsx
-var import_react4 = __toESM(require("react"));
-var import_design_system5 = require("@wix/design-system");
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var Header = import_react4.default.forwardRef(
-  ({
-    className,
-    children,
-    title,
-    subtitle,
-    image,
-    onClose,
-    ...rest
-  }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_design_system5.Box, { ref, className: "site-chat-component-header-container", verticalAlign: "middle", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_design_system5.Box, { width: "100%", direction: "horizontal", align: "center", gap: "10px", children: [
-      image && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_design_system5.Box, { className: "site-chat-component-header-image", width: "60px", height: "50px", borderRadius: "999px", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("img", { style: { borderRadius: "999px" }, width: "100%", height: "100%", src: String(image), alt: "Business Logo" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_design_system5.Box, { direction: "vertical", className: "site-chat-component-header-text-section", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_design_system5.Box, { className: "site-chat-component-header-top-section", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_design_system5.Box, { className: "site-chat-component-header-top", verticalAlign: "middle", WebkitJustifyContent: "space-between", width: "100%", children: [
-          title && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h2", { className: "site-chat-component-header-title", children: title }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-            "button",
-            {
-              onClick: onClose,
-              "aria-label": "Close",
-              className: "site-chat-component-header-close-button",
-              children: "\u2715"
-            }
-          )
-        ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_design_system5.Box, { className: "site-chat-component-header-bottom-section", children: subtitle && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h3", { className: "site-chat-component-header-subtitle", children: subtitle }) })
-      ] })
-    ] }) });
-  }
-);
-Header.displayName = "SiteChatComponent.Header";
-
-// src/components/SiteChatComponent/MessageContainer/MessageContainer.tsx
-var import_react6 = __toESM(require("react"));
-var import_design_system8 = require("@wix/design-system");
-
-// src/components/SiteChatComponent/MessageContainer/messages/messages-wrapper.tsx
-var import_react5 = require("react");
-var import_design_system7 = require("@wix/design-system");
-
-// src/components/SiteChatComponent/MessageContainer/messages/attachment.tsx
-var import_design_system6 = require("@wix/design-system");
-var import_wix_ui_icons_common4 = require("@wix/wix-ui-icons-common");
-var import_on_stage = require("@wix/wix-ui-icons-common/on-stage");
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var Attachment = ({ item }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_design_system6.Box, { direction: "horizontal", maxWidth: "100%", boxSizing: "border-box", className: "site-chat-component-message-container-in-chat-file-item-wrapper-box", children: item && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "site-chat-component-message-container-in-chat-file-item-container", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_wix_ui_icons_common4.Page, { className: "site-chat-component-message-container-in-chat-file-icon", width: "20px", height: "20px" }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "site-chat-component-message-container-in-chat-file-names-container", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "site-chat-component-message-container-in-chat-file-name", children: item.name }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "site-chat-component-message-container-in-chat-file-sub-name", children: "Attachment" })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_design_system6.TextButton, { size: "tiny", onClick: () => window.open(item.url, "_blank"), suffixIcon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_on_stage.ArrowTopRight, { size: "tiny" }), children: "Open" })
-  ] }, item.id) });
-};
-var attachment_default = Attachment;
-
-// src/components/SiteChatComponent/MessageContainer/messages/messages-wrapper.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var AGENT_MESSAGE_GAP = "10px";
-var AGENT_MESSAGE_WIDTH = "75%";
-var AGENT_MESSAGE_INNER_GAP = "4px";
-var ONE_MINUTE_MS = 6e4;
-var ONE_DAY_MS = 864e5;
-var DAYS_IN_WEEK = 7;
-var formatTimestamp = (timestamp) => {
-  if (!timestamp) return "";
-  const date = new Date(timestamp);
-  const now = /* @__PURE__ */ new Date();
-  if (now.getTime() - date.getTime() < ONE_MINUTE_MS) return "Just now";
-  const time = date.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
-  const startOfToday = new Date(now.getFullYear(), now.getMonth(), now.getDate());
-  const startOfDay = new Date(date.getFullYear(), date.getMonth(), date.getDate());
-  const diffDays = Math.floor((startOfToday.getTime() - startOfDay.getTime()) / ONE_DAY_MS);
-  if (diffDays === 0) return `Today at ${time}`;
-  if (diffDays === 1) return `Yesterday at ${time}`;
-  if (diffDays < DAYS_IN_WEEK && date.getDay() < now.getDay())
-    return `${date.toLocaleDateString([], { weekday: "short" })} at ${time}`;
-  return `${date.toLocaleDateString([], { month: "short", day: "numeric", year: "numeric" })} at ${time}`;
-};
-var MessagesWrapper = ({ messages = [] }) => {
-  const wrapperRef = (0, import_react5.useRef)(null);
-  (0, import_react5.useEffect)(() => {
-    if (wrapperRef.current) {
-      wrapperRef.current.scrollTop = wrapperRef.current.scrollHeight;
-    }
-  }, [messages]);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-messages-wrapper", ref: wrapperRef, children: messages.map(({ _id, message, attachment, timestamp, senderType, senderName }, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: `message-item ${senderType}`, children: senderType === "agent" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AgentMessageWrapper, { message, attachment: attachment ? Array.isArray(attachment) ? attachment[0] : attachment : void 0, timestamp, agentName: senderName }) : senderType === "user" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(UserMessageWrapper, { message, attachment: attachment ? Array.isArray(attachment) ? attachment[0] : attachment : void 0, timestamp }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SystemMessageWrapper, { message, timestamp }) }, _id || index)) });
-};
-var GetSystemMessage = ({ type }) => {
-  switch (type) {
-    case "AGENT_JOINED":
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-system-message-message", children: "An agent has joined the chat." });
-    case "AGENT_LEFT":
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-system-message-message", children: "An agent has left the chat." });
-    case "USER_JOINED":
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-system-message-message", children: "A user has joined the chat." });
-    case "USER_LEFT":
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-system-message-message", children: "A user has left the chat." });
-    case "CHAT_ENDED":
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-system-message-message", children: "The chat has ended." });
-    case "CHAT_REOPENED":
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-system-message-message", children: "The chat has been reopened." });
-    case "CHAT_TRANSFERRED":
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-system-message-message", children: "The chat has been transferred to another agent." });
-    case "WAITING_FOR_AGENT":
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-system-message-message", children: "Waiting for an agent to join the chat..." });
-    default:
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-system-message-message", children: "System message" });
-  }
-};
-var SystemMessageWrapper = ({ message, timestamp }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-system-message-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "site-chat-component-message-container-system-message", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("hr", { className: "dashed" }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(GetSystemMessage, { type: message }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("hr", { className: "dashed" })
-  ] }) });
-};
-var AgentMessageWrapper = ({ message, attachment, timestamp, agentName }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { display: "flex", flexDirection: "row", gap: AGENT_MESSAGE_GAP }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_design_system7.Avatar, { size: "size24", className: "site-chat-component-message-container-agent-message-avatar", name: agentName }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { width: AGENT_MESSAGE_WIDTH, gap: AGENT_MESSAGE_INNER_GAP, display: "flex", flexDirection: "column" }, children: [
-      agentName && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "site-chat-component-message-container-agent-name-time-container", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-agent-name", children: agentName }),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-agent-message-timestamp", children: formatTimestamp(timestamp) })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: `site-chat-component-message-container-agent-message-wrapper${attachment ? "-attachment" : ""}`, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "site-chat-component-message-container-agent-message", children: [
-        message && message,
-        attachment && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(attachment_default, { item: attachment })
-      ] }) })
-    ] })
-  ] });
-};
-var UserMessageWrapper = ({ message, attachment, timestamp }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-end", gap: "4px" }, children: [
-    !attachment && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "site-chat-component-message-container-user-name", children: "Me" }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: `site-chat-component-message-container-user-message-wrapper${attachment ? "-attachment" : ""}`, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "site-chat-component-message-container-user-message", children: [
-      message && message,
-      attachment && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(attachment_default, { item: attachment })
-    ] }) })
-  ] });
-};
-var messages_wrapper_default = MessagesWrapper;
-
-// src/components/SiteChatComponent/MessageContainer/MessageContainer.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var MessageContainer = import_react6.default.forwardRef(
-  ({
-    className,
-    children,
-    messages,
-    loading,
-    ...rest
-  }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_design_system8.Box, { ref, className: "site-chat-component-message-container", children: [
-      loading && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_design_system8.Box, { className: "site-chat-component-message-container-loading-state", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { children: "Loading messages..." }) }),
-      messages.length === 0 && !loading && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_design_system8.Box, { className: "site-chat-component-message-container-empty-state", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { children: "No messages yet. Start a conversation" }) }),
-      messages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(messages_wrapper_default, { messages })
-    ] });
-  }
-);
-MessageContainer.displayName = "SiteChatComponent.MessageContainer";
-
-// src/components/SiteChatComponent/SiteChatComponent.css
-if (typeof document !== "undefined" && !document.getElementById("jrapps-style-3c48ccde")) {
-  const s = document.createElement("style");
-  s.id = "jrapps-style-3c48ccde";
-  s.textContent = `.site-chat-component {
-  /* SiteChatComponent base styles */
-}
-
-/* ---------- Header styles ---------- */
-
-.site-chat-component-header-container {
-  background: var(--my-tickets-chat-widget-panel-header-background-color);
-  padding: 10px;
-  border-top-right-radius: inherit;
-  border-top-left-radius: inherit;
-}
-
-.site-chat-component-header-container .site-chat-component-header-text-section {
-  width: 100%;
-}
-
-.site-chat-component-header-title {
-  font-style: var(--my-tickets-chat-widget-panel-header-title-font-style);
-  margin-bottom: 0 !important;
-  color: var(--my-tickets-chat-widget-panel-header-title-color);
-}
-
-.site-chat-component-header-subtitle {
-  font-style: var(--my-tickets-chat-widget-panel-header-subtitle-font-style);
-  font-weight: normal !important;
-  margin-top: 0 !important;
-  color: var(--my-tickets-chat-widget-panel-header-subtitle-color);
-}
-
-.site-chat-component-header-close-button {
-  cursor: pointer !important;
-  background: none;
-  border: none;
-  padding: 4px;
-  color: var(--my-tickets-chat-widget-panel-header-button-color);
-  font-size: 1.25rem;
-  line-height: 1;
-  border-radius: 4px;
-  transition: opacity 0.15s;
-}
-
-.site-chat-component-header-close-button:hover {
-  opacity: 0.8;
-}
-
-/* ---------- Footer styles ---------- */
-
-.site-chat-component-footer-message-input-container {
-  padding: var(--cw-space-md, 16px);
-  background: var(--my-tickets-chat-widget-panel-footer-background-color);
-  font-family: var(--cw-font, sans-serif);
-  border-radius: 0 0 var(--cw-radius-panel, 16px) var(--cw-radius-panel, 16px);
-}
-
-.site-chat-component-footer-attachment-icon-button {
-  width: 20px;
-  height: 20px;
-}
-
-.site-chat-component-footer-my-tickets-chat-widget-send-button {
-  background: var(--my-tickets-chat-widget-panel-footer-button-color);
-  border: 1px solid var(--my-tickets-chat-widget-panel-footer-button-border-color);
-  color: var(--my-tickets-chat-widget-panel-footer-button-text-color);
-  padding: 6px;
-  border-radius: 4px;
-  width: 80px;
-  cursor: pointer;
-}
-
-.site-chat-component-footer-my-tickets-chat-widget-send-button:disabled {
-  opacity: 0.5;
-  cursor: default;
-}
-
-.site-chat-component-footer-file-item-container {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 2px 4px;
-  border-radius: var(--wds-input-area-border-radius-default-medium, 6px);
-  background-color: var(--wds-color-surface, var(--wsr-color-surface, #FFFFFF));
-  border: 1px solid var(--wds-input-border-color, var(--wsr-color-B40, #D6E6FE));
-  box-sizing: border-box;
-}
-
-.site-chat-component-footer-file-name {
-  font-family: var(--wds-font-family-default, var(--wsr-font-family, Madefor, "Helvetica Neue", Helvetica, Arial, "\\30E1\\30A4\\30EA\\30AA", "meiryo", "\\30D2\\30E9\\30AE\\30CE\\89D2\\30B4   pro w3", "hiragino kaku gothic pro", sans-serif));
-  font-size: var(--wds-font-size-body-small, var(--wsr-text-font-size-small, 14px));
-  font-weight: var(--wds-font-weight-regular, var(--wsr-font-weight-regular, 400));
-  line-height: var(--wds-font-line-height-body-small, var(--wsr-text-line-height-small, 20px));
-  letter-spacing: var(--wds-font-letter-spacing-0, unset);
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: 115px;
-}
-
-.site-chat-component-footer-input-wrapper {
-  padding: 5px;
-  box-sizing: border-box;
-  width: inherit;
-  display: flex;
-  justify-content: center;
-  flex-direction: row;
-  gap: 10px;
-  border-radius: 4px;
-  background: var(--my-tickets-chat-widget-panel-footer-input-background-color);
-  border: 2px solid var(--my-tickets-chat-widget-panel-footer-input-border-color);
-  color: var(--my-tickets-chat-widget-panel-footer-input-text-color);
-  font-size: var(--my-tickets-chat-widget-panel-footer-input-text-size);
-  font-family: 'Arial', sans-serif;
-}
-
-.site-chat-component-footer-suffix {
-  background: inherit;
-  width: max-content;
-  min-height: 100%;
-  max-height: 100%;
-  align-items: center;
-  justify-content: center;
-  display: flex;
-  font-size: inherit;
-  padding: 0px;
-  margin: 0px;
-  font-family: inherit;
-  color: inherit;
-  box-sizing: border-box;
-}
-
-.site-chat-component-footer-chat-input {
-  background: inherit;
-  border: none;
-  font-size: inherit;
-  font-family: inherit;
-  color: inherit;
-  width: inherit;
-}
-
-.site-chat-component-footer-chat-input::placeholder {
-  background: inherit;
-  border: none;
-  font-size: inherit;
-  font-family: inherit;
-  color: inherit;
-  opacity: 0.5;
-}
-
-.site-chat-component-footer-chat-input:focus {
-  outline: none;
-}
-
-/* ---------- Messages styles ---------- */
-/* Message Container */
-.site-chat-component-message-container {
-  display: flex !important;
-  flex-direction: column !important;
-  padding: var(--cw-space-md, 16px) !important;
-  background: var(--my-tickets-chat-widget-panel-messages-background-color) !important;
-  flex: 1 !important;
-  min-height: 0;
-  overflow-y: auto !important;
-}
-
-.site-chat-component-message-container-messages-wrapper {
-  display: flex;
-  flex-direction: column;
-  gap: var(--cw-space-sm, 8px);
-}
-
-.site-chat-component-message-container-agent-message-wrapper,
-.site-chat-component-message-container-user-message-wrapper {
-  display: flex;
-  padding: 10px 14px;
-  border-radius: var(--cw-radius-bubble, 12px);
-  width: max-content;
-  max-width: 80%;
-  font-family: var(--cw-font, sans-serif);
-}
-
-.site-chat-component-message-container-agent-name {
-  color: var(--my-tickets-chat-widget-panel-messages-agent-name-text-color);
-  font-size: var(--my-tickets-chat-widget-panel-messages-agent-name-text-size);
-  font-weight: 500;
-}
-
-.site-chat-component-message-container-user-name {
-  color: var(--my-tickets-chat-widget-panel-messages-user-name-text-color);
-  font-size: var(--my-tickets-chat-widget-panel-messages-user-name-text-size);
-  font-weight: 500;
-  display: var(--my-tickets-chat-widget-panel-messages-user-name-text-visible);
-}
-
-.site-chat-component-message-container-agent-message-avatar {
-  margin-top: 20px;
-  display: var(--my-tickets-chat-widget-panel-messages-agent-icon-visible);
-}
-
-.site-chat-component-message-container-user-message,
-.site-chat-component-message-container-agent-message {
-  line-height: 1.5;
-  word-wrap: break-word;
-}
-
-.site-chat-component-message-container-agent-message {
-  font-size: var(--my-tickets-chat-widget-panel-messages-agent-text-size);
-}
-
-.site-chat-component-message-container-user-message {
-  font-size: var(--my-tickets-chat-widget-panel-messages-user-text-size);
-}
-
-.site-chat-component-message-container-agent-message-wrapper {
-  justify-content: flex-start;
-  align-self: flex-start;
-  background-color: var(--my-tickets-chat-widget-panel-messages-agent-bubble-color);
-  color: var(--my-tickets-chat-widget-panel-messages-agent-text-color);
-}
-
-.site-chat-component-message-container-user-message-wrapper {
-  justify-content: flex-end;
-  align-self: flex-end;
-  margin-left: auto;
-  background-color: var(--my-tickets-chat-widget-panel-messages-user-bubble-color);
-  color: var(--my-tickets-chat-widget-panel-messages-user-text-color);
-}
-
-.site-chat-component-message-container-agent-name-time-container {
-  gap: 8px;
-  display: flex;
-  align-items: center;
-  font-family: 'Madefor';
-  font-size: 13px;
-}
-
-/* System Messages */
-
-.site-chat-component-message-container-system-message {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  gap: var(--cw-space-sm, 8px);
-}
-
-.site-chat-component-message-container-system-message .dashed {
-  flex: 1;
-  border: none;
-  border-top: 1px dashed var(--my-tickets-chat-widget-panel-messages-system-color);
-  margin: 0;
-}
-
-.site-chat-component-message-container-system-message-message {
-  color: var(--my-tickets-chat-widget-panel-messages-system-color);
-  font-family: var(--cw-font, sans-serif);
-  font-size: var(--my-tickets-chat-widget-panel-messages-system-size);
-  font-weight: 500;
-  white-space: nowrap;
-}
-
-/* Empty and Loading States */
-
-.site-chat-component-message-container-empty-state {
-  display: flex;
-  flex: 1;
-  align-items: center;
-  justify-content: center;
-}
-
-.site-chat-component-message-container-empty-state p {
-  font-family: var(--cw-font, sans-serif);
-  font-size: 14px;
-  color: var(--my-tickets-chat-widget-panel-messages-system-color);
-}
-
-.site-chat-component-message-container-loading-state {
-  display: flex;
-  flex: 1;
-  align-items: center;
-  justify-content: center;
-}
-
-.site-chat-component-message-container-loading-state p {
-  font-family: var(--cw-font, sans-serif);
-  font-size: 14px;
-  color: var(--my-tickets-chat-widget-panel-messages-system-color);
-}
-
-.site-chat-component-message-container-in-chat-file-item-container {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 4px 8px;
-  border-radius: var(--wds-input-area-border-radius-default-medium, 6px);
-  background-color: var(--wds-color-surface, var(--wsr-color-surface, #FFFFFF));
-  border: 1px solid var(--wds-input-border-color, var(--wsr-color-B40, #D6E6FE));
-  box-sizing: border-box;
-}
-
-.site-chat-component-message-container-in-chat-file-name {
-  font-family: var(--wds-font-family-default, var(--wsr-font-family, Madefor, "Helvetica Neue", Helvetica, Arial, "\\30E1\\30A4\\30EA\\30AA", "meiryo", "\\30D2\\30E9\\30AE\\30CE\\89D2\\30B4   pro w3", "hiragino kaku gothic pro", sans-serif));
-  font-size: var(--wds-font-size-body-tiny, var(--wsr-text-font-size-tiny, 10px));
-  font-weight: var(--wds-font-weight-regular, var(--wsr-font-weight-regular, 400));
-  line-height: var(--wds-font-line-height-body-tiny, var(--wsr-text-line-height-tiny, 12px));
-  letter-spacing: var(--wds-font-letter-spacing-0, unset);
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: 150px;
-  color: black;
-}
-
-.site-chat-component-message-container-in-chat-file-sub-name {
-  font-family: var(--wds-font-family-default, var(--wsr-font-family, Madefor, "Helvetica Neue", Helvetica, Arial, "\\30E1\\30A4\\30EA\\30AA", "meiryo", "\\30D2\\30E9\\30AE\\30CE\\89D2\\30B4   pro w3", "hiragino kaku gothic pro", sans-serif));
-  font-size: var(--wds-font-size-body-tiny, var(--wsr-text-font-size-tiny, 10px));
-  font-weight: var(--wds-font-weight-regular, var(--wsr-font-weight-regular, 400));
-  line-height: var(--wds-font-line-height-body-tiny, var(--wsr-text-line-height-tiny, 12px));
-  letter-spacing: var(--wds-font-letter-spacing-0, unset);
-  color: var(--wds-color-text-secondary, var(--wsr-color-text-secondary, #6B6B6B));
-}
-
-.site-chat-component-message-container-in-chat-file-icon {
-  fill: black !important;
-}
-
-.site-chat-component-message-container-in-chat-file-names-container {
-  display: flex;
-  flex-direction: column;
-  gap: 0px;
-}
-
-.site-chat-component-message-container-user-message-wrapper-attachment .site-chat-component-message-container-in-chat-file-item-wrapper-box {
-  align-items: flex-end;
-  display: flex;
-  flex-direction: column;
-}
-
-.site-chat-component-message-container-agent-message-wrapper-attachment .site-chat-component-message-container-in-chat-file-item-wrapper-box {
-  align-items: flex-start;
-  display: flex;
-  flex-direction: column;
-}
-
-/* FAB */
-.site-chat-component-fab {
-  position: fixed;
-  bottom: 24px;
-  right: 24px;
-  gap: 4.5px;
-  cursor: pointer;
-  z-index: 100;
-  user-select: none;
-  border-radius: 99px;
-  padding: 9px 25px;
-  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-direction: row;
-
-  font-size: var(--my-tickets-chat-widget-button-text-size) !important;
-  background-color: var(--my-tickets-chat-widget-button-color);
-  border: 1px solid var(--my-tickets-chat-widget-button-border-color);
-  color: var(--my-tickets-chat-widget-button-text-color);
-  font: var(--my-tickets-chat-widget-button-text-font);
-}
-
-.site-chat-component-fab-fab-button-label {
-  margin: 0;
-  padding: 0;
-  line-height: 1;
-  display: inline-flex;
-  align-items: center;
-  margin-top: 2px;
-}
-
-.site-chat-component-fab-fab-button-icon,
-.site-chat-component-fab-fab-button-text {
-  display: inline-flex;
-  align-items: center;
-  height: 100%;
-}
-
-.site-chat-component-fab-fab-button-icon svg {
-  width: var(--my-tickets-chat-widget-button-icon-size);
-  height: var(--my-tickets-chat-widget-button-icon-size);
-  font-weight: inherit;
-}
-
-/* \u2500\u2500 Design Tokens \u2500\u2500 */
-:host {
-  --cw-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-
-  /* Primary palette */
-  --cw-primary: #3B82F6;
-  --cw-primary-hover: #2563EB;
-  --cw-primary-light: #EFF6FF;
-  --cw-primary-shadow: rgba(59, 130, 246, 0.35);
-  --cw-primary-shadow-hover: rgba(59, 130, 246, 0.5);
-
-  /* Neutrals */
-  --cw-bg: #F8FAFC;
-  --cw-surface: #FFFFFF;
-  --cw-border: #E2E8F0;
-
-  /* Text */
-  --cw-text: #1E293B;
-  --cw-text-muted: #64748B;
-  --cw-text-inverse: #FFFFFF;
-
-  /* Message bubbles */
-  --cw-bubble-user: var(--cw-primary);
-  --cw-bubble-user-text: var(--cw-text-inverse);
-  --cw-bubble-agent: #F1F5F9;
-  --cw-bubble-agent-text: var(--cw-text);
-
-  /* Radii */
-  --cw-radius-panel: 16px;
-  --cw-radius-bubble: 12px;
-  --cw-radius-pill: 50px;
-
-  /* Spacing */
-  --cw-space-xs: 4px;
-  --cw-space-sm: 8px;
-  --cw-space-md: 16px;
-  --cw-space-lg: 24px;
-
-  /* Shadows */
-  --cw-shadow-panel: 0 20px 60px rgba(0, 0, 0, 0.12), 0 4px 16px rgba(0, 0, 0, 0.05);
-  --cw-shadow-fab: 0 8px 24px var(--cw-primary-shadow);
-  --cw-shadow-fab-hover: 0 12px 32px var(--cw-primary-shadow-hover);
-}
-
-/* \u2500\u2500 Hide toggle \u2500\u2500 */
-#site-chat-component-chat-toggle {
-  display: none;
-}
-
-/* \u2500\u2500 Panel \u2500\u2500 */
-.site-chat-component-panel {
-  position: fixed !important;
-  bottom: 60px;
-  right: 30px;
-  width: min(340px, 100vw);
-  max-height: 50vh;
-  max-height: 50dvh;
-  background: var(--cw-surface);
-  border-radius: var(--cw-radius-panel, 16px) !important;
-  box-shadow: var(--cw-shadow-panel);
-  transform: scale(0.85) translateY(16px);
-  transform-origin: bottom right;
-  opacity: 0;
-  pointer-events: none;
-  transition: transform 0.3s cubic-bezier(.175, .885, .32, 1.275), opacity 0.25s ease;
-  z-index: 99;
-  display: flex !important;
-  flex-direction: column !important;
-  min-height: 450px;
-  font-family: var(--cw-font);
-  overflow: hidden;
-  border: 0px solid var(--wst-color-line);
-  box-shadow: 0 2px 6px var(--wst-color-line), 0 0 0 1px var(--wst-color-line);
-}
-
-.site-chat-component-panel.open {
-  transform: scale(1) translateY(0);
-  opacity: 1;
-  pointer-events: all;
-  z-index: 101;
-  bottom: 10px;
-}
-
-/* \u2500\u2500 Mobile: fill screen \u2500\u2500 */
-@media (max-width: 480px) {
-  .site-chat-component-panel {
-    width: 100vw;
-    height: 100vh;
-    height: 100dvh;
-    min-height: 0;
-    max-height: none;
-    bottom: 0;
-    right: 0;
-  }
-
-  .site-chat-component-panel.open {
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-  }
-}
-
-/* \u2500\u2500 Small tablets \u2500\u2500 */
-@media (min-width: 481px) and (max-width: 768px) {
-  .site-chat-component-panel {
-    width: min(380px, calc(100vw - 24px));
-    max-height: 70vh;
-    max-height: 70dvh;
-  }
-}
-
-/* \u2500\u2500 Large screens \u2500\u2500 */
-@media (min-width: 1200px) {
-  .site-chat-component-panel {
-    width: 350px;
-    max-height: 70vh;
-    max-height: 70dvh;
-  }
-}
-`;
-  document.head.appendChild(s);
-}
-
-// src/components/SiteChatComponent/SiteChatComponent.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var SiteChatComponentRoot = import_react7.default.forwardRef(
-  ({
-    children,
-    viewMode,
-    editorShowChatPanel,
-    handleToggle,
-    buttonTextValue,
-    isOpen
-  }, _ref) => {
-    useSiteChatComponent();
-    if (viewMode === "Editor") {
-      if (typeof editorShowChatPanel === "undefined") {
-        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_design_system9.Box, { align: "center", verticalAlign: "middle", height: "100%", width: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_design_system9.Text, { children: "Editor view mode detected but editorShowChatPanel prop is not provided" }) });
-      }
-      return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_design_system9.Box, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FabButton, { onClick: handleToggle, text: buttonTextValue }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_design_system9.Box, { className: `site-chat-component-panel ${editorShowChatPanel ? "open" : ""}`, children })
-      ] });
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_design_system9.Box, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FabButton, { onClick: handleToggle, text: buttonTextValue }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_design_system9.Box, { className: `site-chat-component-panel ${isOpen ? "open" : ""}`, children })
-    ] });
-  }
-);
-SiteChatComponentRoot.displayName = "SiteChatComponent";
-var SiteChatComponent = Object.assign(SiteChatComponentRoot, {
-  Header,
-  MessageContainer,
-  Footer,
-  FabButton
-});
-//# sourceMappingURL=index.js.map