yt-chat-components 0.1.0

package/src/YtChatView/chatWidget/chatWindow/types/chatWidget/index.ts

@@ -0,0 +1,37 @@
+export type ChatMessageType = {
+  message: {
+    message: string; // 真正的文本消息
+    isSend: boolean; // true为用户发送，false为机器人发送
+    rawInfo?: any; // 消息的原始信息，对应数据库字段
+  };
+  isSend: boolean;
+  error?: boolean;
+  host_url: string;
+  bot_message_style?: React.CSSProperties;
+  user_message_style?: React.CSSProperties;
+  error_message_style?: React.CSSProperties;
+  rawInfo?: any;
+};
+
+export type ChatMessagePlaceholderType = {
+  bot_message_style?: React.CSSProperties;
+};
+
+export type embedAppExtend = {
+  http_extend: {
+    bd:{},
+    header: {
+      appId: string;
+      metaId: string;
+      menuId: string;
+    };
+    params: {
+      code: string;
+    };
+    body: {
+      code: string
+    }
+    operator_id: string;
+    upload_file_path_list: string[];
+  };
+};

package/src/YtChatView/chatWidget/chatWindow/utils.ts

@@ -0,0 +1,75 @@
+export function getChatPosition(
+	triggerPosition: DOMRect,
+	Cwidth:number,
+	Cheight:number,
+	position?: string,
+): { top: string; left: string;
+	position?: string, } {
+	if (!triggerPosition) {
+		return { top: "0px", left: "0px" }; // Return empty string if trigger position is not available
+	}
+
+	const { top, left, width, height } = triggerPosition;
+
+	const distance = 5; // Adjust this value to set the desired distance from the trigger
+	if(!position) return { top: distance + height+ "px", left: width + "px" };
+
+	switch (position) {
+		case "top-left":
+			return { top: - distance - Cheight + "px", left: -Cwidth + "px" };
+		case "top-center":
+			return { top: - distance - Cheight + "px", left: width/2-Cwidth / 2 + "px" };
+		case "top-right":
+			return { top: - distance - Cheight + "px", left: width+ "px" };
+		case "center-left":
+			return { top: width/2-Cheight/2 + "px", left: -Cwidth - distance + "px" };
+		case "center-right":
+			return {
+				top: width/2-Cheight/2 + "px",
+				left: width + distance + "px",
+			};
+		case "bottom-right":
+			return { top: distance + height+ "px", left: width + "px" };
+		case "bottom-center":
+			return {
+				top: distance + height+ "px",
+				left: width/2-Cwidth / 2 + "px",
+			};
+		case "bottom-left":
+			return { top: distance + height+ "px", left: -Cwidth + "px"};
+		default:
+			return { top: distance + height+ "px", left: width + "px" };
+		}
+}
+
+export function getAnimationOrigin(position?:string) {
+	if(!position) return "origin-top-left";
+	switch (position) {
+		case "top-left":
+			return 'origin-bottom-right'
+		case "top-center":
+			return "origin-bottom";
+		case "top-right":
+			return "origin-bottom-left";
+		case "center-left":
+			return "origin-center";
+		case "center-right":
+			return "origin-center";
+		case "bottom-right":
+			return "origin-top-left";
+		case "bottom-center":
+			return "origin-top";
+		case "bottom-left":
+			return "origin-top-right"
+		default:
+			return "origin-top-left"
+		}
+}
+
+export function extractMessageFromOutput(output:{type:string, message:any}){
+	const {type, message} = output;
+	if(type === "text") return message;
+	if (type ==="message") return message.text;
+	if(type==="object") return message.text;
+	return "Unknown message structure"
+}