@droppii-org/chat-sdk 0.0.18 → 0.0.20

package/dist/hooks/conversation/useConversation.js

@@ -1,45 +1,52 @@
-import { getSDK } from '@openim/wasm-client-sdk';
-import { useCallback, useEffect, useState } from 'react';
-const DChatSDK = getSDK();
-export const useConversationList = () => {
+import { CbEvents, } from "@openim/wasm-client-sdk";
+import { useCallback, useEffect, useState } from "react";
+import { DChatSDK } from "../../constants/sdk";
+export const useConversationList = (selectedThreadId) => {
     const [conversationList, setConversationList] = useState([]);
     const getAllConversationList = useCallback(async () => {
-        DChatSDK.getAllConversationList().then(({ data }) => {
-            console.log('getAllConversationList', data);
+        DChatSDK.getAllConversationList()
+            .then(({ data }) => {
             setConversationList(data);
-        }).catch((err) => {
-            console.log('getAllConversationList', err);
-        });
-    }, []);
-    const getOneConversation = useCallback(async () => {
-        DChatSDK.getOneConversation({
-            sourceID: '3408237279',
-            sessionType: 3
-        }).then(({ data }) => {
-            console.log('getOneConversation', data);
-        }).catch((err) => {
-            console.log('getOneConversation', err);
+        })
+            .catch((err) => {
+            console.log("getAllConversationList", err);
         });
     }, []);
     useEffect(() => {
         getAllConversationList();
-        getOneConversation();
     }, [getAllConversationList]);
+    useEffect(() => {
+        DChatSDK.on(CbEvents.OnConversationChanged, ({ data }) => {
+            setConversationList(data);
+        });
+        return () => {
+            DChatSDK.off(CbEvents.OnConversationChanged, () => { });
+        };
+    }, []);
+    useEffect(() => {
+        if (selectedThreadId) {
+            DChatSDK.markConversationMessageAsRead(selectedThreadId).catch(({ errCode, errMsg }) => {
+                console.error("Failed to mark messages as read", errCode, errMsg);
+            });
+        }
+    }, [selectedThreadId]);
     return {
         conversationList,
+        getAllConversationList,
     };
 };
-export const useConversationDetail = ({ sourceID, sessionType }) => {
+export const useConversationDetail = ({ sourceID, sessionType, }) => {
     const [conversationDetail, setConversationDetail] = useState(null);
     const getConversationDetail = useCallback(async () => {
         DChatSDK.getOneConversation({
             sourceID,
-            sessionType
-        }).then(({ data }) => {
-            console.log('getOneConversation', data);
+            sessionType,
+        })
+            .then(({ data }) => {
             setConversationDetail(data);
-        }).catch((err) => {
-            console.log('getOneConversation', err);
+        })
+            .catch((err) => {
+            console.log("getOneConversation", err);
         });
     }, [sourceID, sessionType]);
     useEffect(() => {

package/dist/hooks/message/useMessage.d.ts

@@ -1,6 +1,9 @@
 import { MessageItem } from "@openim/wasm-client-sdk";
+import { GroupMessageItem } from "../../types/chat";
 export declare const useMessage: (conversationId?: string) => {
+    groupMessages: GroupMessageItem[];
     refetch: () => void;
+    markConversationMessageAsRead: (message?: MessageItem) => void;
     isEnd?: boolean | undefined;
     errCode?: number | undefined;
     errMsg?: string | undefined;

package/dist/hooks/message/useMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMessage.d.ts","sourceRoot":"","sources":["../../../src/hooks/message/useMessage.ts"],"names":[],"mappings":"AACA,OAAO,EAKL,WAAW,EACZ,MAAM,yBAAyB,CAAC;AAGjC,eAAO,MAAM,UAAU,GAAI,iBAAiB,MAAM;;;;;;CAqDjD,CAAC"}
+{"version":3,"file":"useMessage.d.ts","sourceRoot":"","sources":["../../../src/hooks/message/useMessage.ts"],"names":[],"mappings":"AACA,OAAO,EAIL,WAAW,EACZ,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAqB,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAEvE,eAAO,MAAM,UAAU,GAAI,iBAAiB,MAAM;;;8CAgEnC,WAAW;;;;;CA8BzB,CAAC"}

package/dist/hooks/message/useMessage.js

@@ -1,8 +1,33 @@
-import { useCallback, useEffect, useState } from "react";
-import { getSDK, ViewType, CbEvents, } from "@openim/wasm-client-sdk";
-const DChatSDK = getSDK();
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { ViewType, CbEvents, } from "@openim/wasm-client-sdk";
+import { DChatSDK } from "../../constants/sdk";
 export const useMessage = (conversationId) => {
     const [dataMessages, setDataMessages] = useState(null);
+    const groupMessages = useMemo(() => {
+        var _a;
+        if (!dataMessages || !(dataMessages === null || dataMessages === void 0 ? void 0 : dataMessages.messageList))
+            return [];
+        const mGroupMessages = (_a = dataMessages === null || dataMessages === void 0 ? void 0 : dataMessages.messageList) === null || _a === void 0 ? void 0 : _a.reduce((acc, cur) => {
+            const extendMessageInfo = JSON.parse((cur === null || cur === void 0 ? void 0 : cur.ex) || "{}");
+            if (extendMessageInfo === null || extendMessageInfo === void 0 ? void 0 : extendMessageInfo.groupMessageID) {
+                const findGroupMessageIndex = acc.findIndex((item) => item.groupMessageID === (extendMessageInfo === null || extendMessageInfo === void 0 ? void 0 : extendMessageInfo.groupMessageID));
+                if (findGroupMessageIndex === -1) {
+                    acc.push({
+                        groupMessageID: extendMessageInfo.groupMessageID,
+                        messages: [cur],
+                        sendID: cur.sendID,
+                        sendTime: cur.sendTime,
+                    });
+                }
+                else {
+                    acc[findGroupMessageIndex].messages.push(cur);
+                }
+            }
+            return acc;
+        }, []);
+        return mGroupMessages;
+    }, [dataMessages]);
+    console.log("groupMessages", groupMessages);
     const getAdvancedHistoryMessageList = useCallback(() => {
         if (!conversationId)
             return;
@@ -20,7 +45,6 @@ export const useMessage = (conversationId) => {
             viewType: ViewType.History,
         })
             .then(({ data }) => {
-            console.log("getAdvancedHistoryMessageList", data);
             setDataMessages(data);
         })
             .catch((err) => {
@@ -30,17 +54,25 @@ export const useMessage = (conversationId) => {
     const onRecvNewMessages = useCallback((data) => {
         getAdvancedHistoryMessageList();
     }, [getAdvancedHistoryMessageList]);
+    const markConversationMessageAsRead = useCallback((message) => {
+        if (!conversationId)
+            return;
+        DChatSDK.markConversationMessageAsRead(conversationId)
+            .then()
+            .catch(({ errCode, errMsg }) => {
+            // Failed call
+        });
+    }, [conversationId]);
     useEffect(() => {
         getAdvancedHistoryMessageList();
     }, [getAdvancedHistoryMessageList]);
     useEffect(() => {
         DChatSDK.on(CbEvents.OnRecvNewMessages, ({ data }) => {
-            console.log("OnRecvNewMessages123", data);
             onRecvNewMessages(data);
         });
         return () => {
             DChatSDK.off(CbEvents.OnRecvNewMessages, () => { });
         };
     }, [onRecvNewMessages]);
-    return Object.assign(Object.assign({}, dataMessages), { refetch: getAdvancedHistoryMessageList });
+    return Object.assign(Object.assign({}, dataMessages), { groupMessages, refetch: getAdvancedHistoryMessageList, markConversationMessageAsRead });
 };

package/dist/hooks/message/useSendMessage.d.ts

@@ -1,10 +1,13 @@
+import { MessageItem } from "@openim/wasm-client-sdk";
+import { ExtendMessageInfo } from "../../types/chat";
 interface SendMessageProps {
     recvID: string;
     groupID: string;
 }
-export declare const createTextMessage: (text: string) => Promise<import("@openim/wasm-client-sdk").MessageItem | null>;
+export declare const createTextMessage: (text: string) => Promise<MessageItem | null>;
 export declare const useSendMessage: (props: SendMessageProps) => {
-    sendTextMessage: (text: string) => Promise<boolean>;
+    sendTextMessage: (text: string, lastMessage?: MessageItem) => Promise<boolean>;
 };
+export declare const generateExtendMessageInfo: (currentUserID: string, lastMessage?: MessageItem) => ExtendMessageInfo;
 export {};
 //# sourceMappingURL=useSendMessage.d.ts.map

package/dist/hooks/message/useSendMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSendMessage.d.ts","sourceRoot":"","sources":["../../../src/hooks/message/useSendMessage.ts"],"names":[],"mappings":"AAIA,UAAU,gBAAgB;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,iBAAiB,GAAU,MAAM,MAAM,kEAUnD,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,gBAAgB;4BAIf,MAAM;CAsB5C,CAAC"}
+{"version":3,"file":"useSendMessage.d.ts","sourceRoot":"","sources":["../../../src/hooks/message/useSendMessage.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAMrD,UAAU,gBAAgB;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,iBAAiB,GAAU,MAAM,MAAM,gCAanD,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,gBAAgB;4BAKrC,MAAM,gBAAgB,WAAW;CAiCjD,CAAC;AAEF,eAAO,MAAM,yBAAyB,GACpC,eAAe,MAAM,EACrB,cAAc,WAAW,KAapB,iBACN,CAAC"}

package/dist/hooks/message/useSendMessage.js

@@ -1,42 +1,54 @@
-import { getSDK } from "@openim/wasm-client-sdk";
+import { DChatSDK } from "../../constants/sdk";
+import dayjs from "dayjs";
+import { v4 as uuidv4 } from "uuid";
 import { useChatContext } from "../../context/ChatContext";
-const DChatSDK = getSDK();
+import { useCallback } from "react";
 export const createTextMessage = async (text) => {
-    let textMessage = await DChatSDK.createTextMessage(text)
+    let textMessage = await DChatSDK.createTextMessage(text, new Date().getTime().toString())
         .then(({ data }) => {
         return data;
     })
         .catch(({ errCode, errMsg }) => {
-        console.log("createTextMessage", errCode, errMsg);
+        console.error("createTextMessage", errCode, errMsg);
         return null;
     });
     return textMessage;
 };
 export const useSendMessage = (props) => {
-    const { user } = useChatContext();
     const { recvID, groupID } = props;
-    const sendTextMessage = async (text) => {
+    const { user } = useChatContext();
+    const sendTextMessage = useCallback(async (text, lastMessage) => {
         let result = false;
         if (!recvID && !groupID)
             return false;
         const textMessage = await createTextMessage(text);
-        console.log("textMessage", textMessage);
         if (!textMessage)
             return false;
+        const extendMessageInfo = generateExtendMessageInfo((user === null || user === void 0 ? void 0 : user.userID) || "", lastMessage);
         try {
             await DChatSDK.sendMessage({
                 recvID,
                 groupID,
-                message: textMessage,
-            });
+                message: Object.assign(Object.assign({}, textMessage), { ex: JSON.stringify(extendMessageInfo) || "{}" }),
+            }, new Date().getTime().toString());
             result = true;
         }
         catch (error) {
             console.log("sendMessage", error);
         }
         return result;
-    };
+    }, [recvID, groupID, user]);
     return {
         sendTextMessage,
     };
 };
+export const generateExtendMessageInfo = (currentUserID, lastMessage) => {
+    const diffSendTime = dayjs().diff(lastMessage === null || lastMessage === void 0 ? void 0 : lastMessage.sendTime, "minutes");
+    const isSameSender = (lastMessage === null || lastMessage === void 0 ? void 0 : lastMessage.sendID) === currentUserID;
+    const lastMessageExtendMessageInfo = JSON.parse((lastMessage === null || lastMessage === void 0 ? void 0 : lastMessage.ex) || "{}");
+    return {
+        groupMessageID: isSameSender && diffSendTime <= 5
+            ? (lastMessageExtendMessageInfo === null || lastMessageExtendMessageInfo === void 0 ? void 0 : lastMessageExtendMessageInfo.groupMessageID) || uuidv4()
+            : uuidv4(),
+    };
+};

package/dist/hooks/user/useAuth.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAuth.d.ts","sourceRoot":"","sources":["../../../src/hooks/user/useAuth.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY;;CAOxB,CAAC"}
+{"version":3,"file":"useAuth.d.ts","sourceRoot":"","sources":["../../../src/hooks/user/useAuth.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY;;CAOxB,CAAC"}

package/dist/hooks/user/useAuth.js

@@ -1,5 +1,4 @@
-import { getSDK } from "@openim/wasm-client-sdk";
-const DChatSDK = getSDK();
+import { DChatSDK } from "../../constants/sdk";
 export const useDChatAuth = () => {
     const logout = async () => {
         const res = await DChatSDK.logout();

package/dist/hooks/zustand/useMessageStore.d.ts

@@ -0,0 +1,9 @@
+interface MessageStore {
+    selectedThreadId: string;
+    selectedSourceId: string;
+    setSelectedThreadId: (threadId: string) => void;
+    setSelectedSourceId: (sourceId: string) => void;
+}
+declare const useMessageStore: import("zustand").UseBoundStore<import("zustand").StoreApi<MessageStore>>;
+export default useMessageStore;
+//# sourceMappingURL=useMessageStore.d.ts.map

package/dist/hooks/zustand/useMessageStore.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMessageStore.d.ts","sourceRoot":"","sources":["../../../src/hooks/zustand/useMessageStore.ts"],"names":[],"mappings":"AAEA,UAAU,YAAY;IACpB,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CACjD;AAED,QAAA,MAAM,eAAe,2EAKlB,CAAC;AAEJ,eAAe,eAAe,CAAC"}

package/dist/hooks/zustand/useMessageStore.js

@@ -0,0 +1,8 @@
+import { create } from "zustand";
+const useMessageStore = create((set) => ({
+    selectedThreadId: "",
+    setSelectedThreadId: (threadId) => set({ selectedThreadId: threadId }),
+    selectedSourceId: "",
+    setSelectedSourceId: (sourceId) => set({ selectedSourceId: sourceId }),
+}));
+export default useMessageStore;

package/dist/index.d.ts

@@ -1,9 +1,9 @@
-import DChatDeskMessage from "./screens/desk-message";
+import DChatDeskMessage from "./screens/deskMessage";
+import DChatBubble from "./screens/chatBubble";
 import { Platform, LogLevel, SessionType, InitAndLoginConfig } from "@openim/wasm-client-sdk";
 import { Icon } from "./components/icon";
-import ChatBubble from "./components/ChatBubble";
 export { ChatProvider, useChatContext } from "./context/ChatContext";
-export { DChatDeskMessage, ChatBubble, Icon };
+export { DChatDeskMessage, DChatBubble, Icon };
 export { useDChatAuth } from "./hooks/user/useAuth";
 export { Platform as DChatPlatform, LogLevel as DChatLogLevel, SessionType as DChatSessionType, };
 export type { InitAndLoginConfig as DChatInitAndLoginConfig };

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,MAAM,wBAAwB,CAAC;AACtD,OAAO,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,UAAU,MAAM,yBAAyB,CAAC;AAGjD,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAGrE,OAAO,EAAE,gBAAgB,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC;AAG9C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAIpD,OAAO,EACL,QAAQ,IAAI,aAAa,EACzB,QAAQ,IAAI,aAAa,EACzB,WAAW,IAAI,gBAAgB,GAChC,CAAC;AAEF,YAAY,EAAE,kBAAkB,IAAI,uBAAuB,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AACrD,OAAO,WAAW,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAGzC,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAGrE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;AAG/C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAIpD,OAAO,EACL,QAAQ,IAAI,aAAa,EACzB,QAAQ,IAAI,aAAa,EACzB,WAAW,IAAI,gBAAgB,GAChC,CAAC;AAEF,YAAY,EAAE,kBAAkB,IAAI,uBAAuB,EAAE,CAAC"}

package/dist/index.js

@@ -1,11 +1,11 @@
-import DChatDeskMessage from "./screens/desk-message";
+import DChatDeskMessage from "./screens/deskMessage";
+import DChatBubble from "./screens/chatBubble";
 import { Platform, LogLevel, SessionType, } from "@openim/wasm-client-sdk";
 import { Icon } from "./components/icon";
-import ChatBubble from "./components/ChatBubble";
 // Main exports for the SDK
 export { ChatProvider, useChatContext } from "./context/ChatContext";
 //Components
-export { DChatDeskMessage, ChatBubble, Icon };
+export { DChatDeskMessage, DChatBubble, Icon };
 //Hooks
 export { useDChatAuth } from "./hooks/user/useAuth";
 // export * from "./types/sdk";

package/dist/screens/chatBubble/index.d.ts

@@ -0,0 +1,10 @@
+import { SessionType } from "@openim/wasm-client-sdk";
+interface DChatBubbleProps {
+    conversationId: string;
+    sourceID: string;
+    sessionType: SessionType;
+    className?: string;
+}
+declare const DChatBubble: (props: DChatBubbleProps) => import("react/jsx-runtime").JSX.Element | null;
+export default DChatBubble;
+//# sourceMappingURL=index.d.ts.map

package/dist/screens/chatBubble/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/screens/chatBubble/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAKtD,UAAU,gBAAgB;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,WAAW,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,WAAW,GAAI,OAAO,gBAAgB,mDAY3C,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/screens/chatBubble/index.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import ChatBubble from "../../components/chatBubble/ChatBubble";
+import { useChatContext } from "../../context/ChatContext";
+import { ConnectStatus } from "../../types/chat";
+const DChatBubble = (props) => {
+    const { conversationId, sourceID, sessionType, className } = props;
+    const { connectStatus } = useChatContext();
+    if (connectStatus !== ConnectStatus.Connected)
+        return null;
+    return (_jsx(ChatBubble, { conversationId: conversationId, sourceID: sourceID, sessionType: sessionType, className: className }));
+};
+export default DChatBubble;

package/dist/screens/deskMessage/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/screens/deskMessage/index.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,gBAAgB,+CA4BrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/screens/deskMessage/index.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { SessionType } from "@openim/wasm-client-sdk";
+import MessageList from "../../components/message/MessageList";
+import DeskConversationList from "../../components/conversation/DeskConversationList";
+import { useConversationDetail } from "../../hooks/conversation/useConversation";
+import AssignedSessionFilter from "../../components/session/AssignedSessionFilter";
+import useMessageStore from "../../hooks/zustand/useMessageStore";
+import { useChatContext } from "../../context/ChatContext";
+import { Spin } from "antd";
+import { ConnectStatus } from "../../types/chat";
+const DChatDeskMessage = () => {
+    const selectedThreadId = useMessageStore((state) => state.selectedThreadId);
+    const selectedSourceId = useMessageStore((state) => state.selectedSourceId);
+    const { conversationDetail } = useConversationDetail({
+        sourceID: selectedSourceId,
+        sessionType: SessionType.Group,
+    });
+    const { connectStatus } = useChatContext();
+    return (_jsx(_Fragment, { children: connectStatus === ConnectStatus.Connected ? (_jsxs("div", { className: "flex flex-1 flex-row h-screen bg-gray-50", children: [_jsx(AssignedSessionFilter, {}), _jsx(DeskConversationList, {}), _jsx(MessageList, { conversationId: selectedThreadId, conversationData: conversationDetail })] })) : (_jsx("div", { className: "flex flex-1 flex-row h-screen bg-gray-50", children: connectStatus === ConnectStatus.Connecting && _jsx(Spin, { fullscreen: true }) })) }));
+};
+export default DChatDeskMessage;

package/dist/styles/global.css

@@ -1 +1 @@
-*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.absolute{position:absolute}.relative{position:relative}.-bottom-0\.5{bottom:-.125rem}.-right-0\.5{right:-.125rem}.bottom-0{bottom:0}.left-0{left:0}.left-3{left:.75rem}.top-0{top:0}.top-1\/2{top:50%}.\!z-\[9999\]{z-index:9999!important}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.ml-2{margin-left:.5rem}.ml-4{margin-left:1rem}.mt-0\.5{margin-top:.125rem}.flex{display:flex}.inline-flex{display:inline-flex}.h-12{height:3rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-full{height:100%}.h-screen{height:100vh}.min-h-0{min-height:0}.w-1{width:.25rem}.w-12{width:3rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-64{width:16rem}.w-full{width:100%}.min-w-0{min-width:0}.max-w-full{max-width:100%}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.-translate-y-1\/2{--tw-translate-y:-50%}.-translate-y-1\/2,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.border-r-2{border-right-width:2px}.border-t{border-top-width:1px}.border-blue-500{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity,1))}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246/var(--tw-border-opacity,1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219/var(--tw-border-opacity,1))}.border-white{--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity,1))}.bg-blue-100{--tw-bg-opacity:1;background-color:rgb(219 234 254/var(--tw-bg-opacity,1))}.bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity,1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.bg-green-100{--tw-bg-opacity:1;background-color:rgb(220 252 231/var(--tw-bg-opacity,1))}.bg-green-500{--tw-bg-opacity:1;background-color:rgb(34 197 94/var(--tw-bg-opacity,1))}.bg-orange-100{--tw-bg-opacity:1;background-color:rgb(255 237 213/var(--tw-bg-opacity,1))}.bg-red-100{--tw-bg-opacity:1;background-color:rgb(254 226 226/var(--tw-bg-opacity,1))}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-yellow-100{--tw-bg-opacity:1;background-color:rgb(254 249 195/var(--tw-bg-opacity,1))}.object-cover{-o-object-fit:cover;object-fit:cover}.p-3{padding:.75rem}.p-4{padding:1rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.pl-10{padding-left:2.5rem}.pr-4{padding-right:1rem}.text-left{text-align:left}.text-center{text-align:center}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246/var(--tw-text-opacity,1))}.text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity,1))}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity,1))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity,1))}.text-green-500{--tw-text-opacity:1;color:rgb(34 197 94/var(--tw-text-opacity,1))}.text-green-600{--tw-text-opacity:1;color:rgb(22 163 74/var(--tw-text-opacity,1))}.text-orange-400{--tw-text-opacity:1;color:rgb(251 146 60/var(--tw-text-opacity,1))}.text-orange-500{--tw-text-opacity:1;color:rgb(249 115 22/var(--tw-text-opacity,1))}.text-purple-500{--tw-text-opacity:1;color:rgb(168 85 247/var(--tw-text-opacity,1))}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.text-yellow-600{--tw-text-opacity:1;color:rgb(202 138 4/var(--tw-text-opacity,1))}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.hover\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.focus\:border-blue-500:focus{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity,1))}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-blue-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(59 130 246/var(--tw-ring-opacity,1))}@media (min-width:640px){.sm\:p-4{padding:1rem}.sm\:px-4{padding-left:1rem;padding-right:1rem}.sm\:py-2{padding-top:.5rem;padding-bottom:.5rem}.sm\:text-base{font-size:1rem;line-height:1.5rem}}
+*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.absolute{position:absolute}.relative{position:relative}.bottom-0{bottom:0}.left-0{left:0}.top-0{top:0}.\!z-\[9999\]{z-index:9999!important}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.ml-2{margin-left:.5rem}.ml-4{margin-left:1rem}.mt-0\.5{margin-top:.125rem}.flex{display:flex}.h-full{height:100%}.h-screen{height:100vh}.min-h-0{min-height:0}.w-1{width:.25rem}.w-64{width:16rem}.w-full{width:100%}.min-w-0{min-width:0}.max-w-full{max-width:100%}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.rounded-2xl{border-radius:1rem}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.border-r-2{border-right-width:2px}.border-t{border-top-width:1px}.border-blue-500{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity,1))}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246/var(--tw-border-opacity,1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity,1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-3{padding:.75rem}.p-4{padding:1rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.text-left{text-align:left}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity,1))}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity,1))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity,1))}.text-green-600{--tw-text-opacity:1;color:rgb(22 163 74/var(--tw-text-opacity,1))}.text-orange-400{--tw-text-opacity:1;color:rgb(251 146 60/var(--tw-text-opacity,1))}.text-orange-500{--tw-text-opacity:1;color:rgb(249 115 22/var(--tw-text-opacity,1))}.text-purple-500{--tw-text-opacity:1;color:rgb(168 85 247/var(--tw-text-opacity,1))}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.hover\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}@media (min-width:640px){.sm\:px-4{padding-left:1rem;padding-right:1rem}.sm\:py-2{padding-top:.5rem;padding-bottom:.5rem}.sm\:text-base{font-size:1rem;line-height:1.5rem}}

package/dist/types/chat.d.ts

@@ -1,9 +1,23 @@
-import { InitAndLoginConfig, SelfUserInfo } from "@openim/wasm-client-sdk";
+import { InitAndLoginConfig, MessageItem, SelfUserInfo } from "@openim/wasm-client-sdk";
+export declare enum ConnectStatus {
+    Disconnected = 0,
+    Connected = 1,
+    Connecting = 2
+}
 export interface ChatContextType {
     user: SelfUserInfo | null;
+    connectStatus: ConnectStatus;
 }
 export interface ChatProviderProps {
     children: React.ReactNode;
     config: InitAndLoginConfig;
+    refetchToken: () => Promise<string>;
+}
+export interface GroupMessageItem extends Pick<MessageItem, "sendID" | "sendTime"> {
+    groupMessageID: string;
+    messages: MessageItem[];
+}
+export interface ExtendMessageInfo {
+    groupMessageID: string;
 }
 //# sourceMappingURL=chat.d.ts.map

package/dist/types/chat.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chat.d.ts","sourceRoot":"","sources":["../../src/types/chat.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAE3E,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,YAAY,GAAG,IAAI,CAAC;CAC3B;AAED,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,EAAE,kBAAkB,CAAC;CAC5B"}
+{"version":3,"file":"chat.d.ts","sourceRoot":"","sources":["../../src/types/chat.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,WAAW,EACX,YAAY,EACb,MAAM,yBAAyB,CAAC;AAEjC,oBAAY,aAAa;IACvB,YAAY,IAAI;IAChB,SAAS,IAAI;IACb,UAAU,IAAI;CACf;AACD,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,YAAY,GAAG,IAAI,CAAC;IAC1B,aAAa,EAAE,aAAa,CAAC;CAC9B;AAED,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,EAAE,kBAAkB,CAAC;IAC3B,YAAY,EAAE,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC;CACrC;AAED,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,GAAG,UAAU,CAAC;IAChD,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,WAAW,EAAE,CAAC;CACzB;AAED,MAAM,WAAW,iBAAiB;IAChC,cAAc,EAAE,MAAM,CAAC;CACxB"}

package/dist/types/chat.js

@@ -1 +1,6 @@
-export {};
+export var ConnectStatus;
+(function (ConnectStatus) {
+    ConnectStatus[ConnectStatus["Disconnected"] = 0] = "Disconnected";
+    ConnectStatus[ConnectStatus["Connected"] = 1] = "Connected";
+    ConnectStatus[ConnectStatus["Connecting"] = 2] = "Connecting";
+})(ConnectStatus || (ConnectStatus = {}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@droppii-org/chat-sdk",
-  "version": "0.0.18",
+  "version": "0.0.20",
   "description": "Droppii React Chat SDK",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -33,6 +33,10 @@
       "import": "./dist/assets/*.js",
       "types": "./dist/assets/*.d.ts"
     },
+    "./constants/*": {
+      "import": "./dist/constants/*.js",
+      "types": "./dist/constants/*.d.ts"
+    },
     "./styles/global.css": "./dist/styles/global.css"
   },
   "files": [
@@ -60,13 +64,21 @@
   "dependencies": {
     "@openim/wasm-client-sdk": "3.8.3-patch.10",
     "@tailwindcss/postcss": "^4.1.12",
+    "@types/react-window": "^1.8.8",
+    "@types/react-window-infinite-loader": "^1.0.9",
     "antd": "^5.27.0",
     "clsx": "^2.0.0",
+    "dayjs": "^1.11.13",
     "lucide-react": "^0.263.1",
     "postcss": "^8.5.6",
     "react-icomoon": "^2.6.1",
+    "react-virtualized-auto-sizer": "^1.0.26",
+    "react-window": "^1.8.11",
+    "react-window-infinite-loader": "^1.0.10",
     "tailwind-merge": "^2.0.0",
-    "tailwindcss": "^3.3.0"
+    "tailwindcss": "^3.3.0",
+    "uuid": "^11.1.0",
+    "zustand": "^5.0.7"
   },
   "peerDependencies": {
     "react": "^18.0.0",

package/dist/components/ChatBubble.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ChatBubble.d.ts","sourceRoot":"","sources":["../../src/components/ChatBubble.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAGtD,UAAU,eAAe;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,WAAW,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,UAAU,GAAI,uDAKjB,eAAe,4CAmDjB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/chat-bubble/ChatBubble.d.ts

@@ -1,9 +0,0 @@
-import type { ConversationItem } from "@openim/wasm-client-sdk";
-interface ChatBubbleProps {
-    conversationId: string;
-    conversationData: ConversationItem | null;
-    className?: string;
-}
-declare const ChatBubble: ({ conversationId, conversationData, className }: ChatBubbleProps) => import("react/jsx-runtime").JSX.Element;
-export default ChatBubble;
-//# sourceMappingURL=ChatBubble.d.ts.map

package/dist/components/chat-bubble/ChatBubble.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ChatBubble.d.ts","sourceRoot":"","sources":["../../../src/components/chat-bubble/ChatBubble.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAA;AAE/D,UAAU,eAAe;IACvB,cAAc,EAAE,MAAM,CAAA;IACtB,gBAAgB,EAAE,gBAAgB,GAAG,IAAI,CAAA;IACzC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,UAAU,GAAI,iDAAiD,eAAe,4CAkDnF,CAAA;AAED,eAAe,UAAU,CAAA"}

package/dist/components/chat-bubble/ChatBubble.js

@@ -1,27 +0,0 @@
-"use client";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { FloatButton, Drawer } from "antd";
-import { MessageOutlined, CloseOutlined } from "@ant-design/icons";
-import MessageList from "../message/MessageList";
-const ChatBubble = ({ conversationId, conversationData, className }) => {
-    const [isOpen, setIsOpen] = useState(false);
-    const toggleChat = () => {
-        setIsOpen(!isOpen);
-    };
-    return (_jsxs(_Fragment, { children: [_jsx(FloatButton, { icon: isOpen ? _jsx(CloseOutlined, {}) : _jsx(MessageOutlined, {}), type: "primary", style: {
-                    right: 24,
-                    bottom: 24,
-                    width: 60,
-                    height: 60,
-                }, onClick: toggleChat, className: className }), _jsx(Drawer, { title: "Chat", placement: "right", onClose: () => setIsOpen(false), open: isOpen, width: 400, height: 600, style: {
-                    position: "fixed",
-                    right: 24,
-                    bottom: 100,
-                    borderRadius: "12px",
-                }, styles: {
-                    body: { padding: 0, height: "100%" },
-                    header: { padding: "12px 16px", borderBottom: "1px solid #f0f0f0" },
-                }, mask: false, destroyOnClose: false, children: _jsx("div", { style: { height: "100%", display: "flex", flexDirection: "column" }, children: _jsx(MessageList, { conversationId: conversationId, conversationData: conversationData, className: "flex-1" }) }) })] }));
-};
-export default ChatBubble;

package/dist/screens/desk-message/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/screens/desk-message/index.tsx"],"names":[],"mappings":"AAQA,QAAA,MAAM,gBAAgB,+CAcrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/screens/desk-message/index.js

@@ -1,14 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { SessionType } from "@openim/wasm-client-sdk";
-import MessageList from "../../components/message/MessageList";
-import DeskConversationList from "../../components/conversation/DeskConversationList";
-import { useConversationDetail } from "../../hooks/conversation/useConversation";
-const DChatDeskMessage = () => {
-    const { conversationDetail } = useConversationDetail({
-        sourceID: "3408237279",
-        sessionType: SessionType.Group,
-    });
-    return (_jsxs("div", { className: "flex flex-1 flex-row h-screen bg-gray-50", children: [_jsx(DeskConversationList, {}), _jsx(MessageList, { conversationId: "sg_3408237279", conversationData: conversationDetail })] }));
-};
-export default DChatDeskMessage;

package/dist/styles.css

@@ -1 +0,0 @@
-*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.-bottom-0\.5{bottom:-.125rem}.-right-0\.5{right:-.125rem}.bottom-0{bottom:0}.left-0{left:0}.left-3{left:.75rem}.top-0{top:0}.top-1\/2{top:50%}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.ml-2{margin-left:.5rem}.ml-4{margin-left:1rem}.mt-0\.5{margin-top:.125rem}.flex{display:flex}.inline-flex{display:inline-flex}.h-12{height:3rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-full{height:100%}.h-screen{height:100vh}.min-h-0{min-height:0}.w-1{width:.25rem}.w-12{width:3rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-64{width:16rem}.w-full{width:100%}.min-w-0{min-width:0}.max-w-full{max-width:100%}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.-translate-y-1\/2{--tw-translate-y:-50%}.-translate-y-1\/2,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.border-r-2{border-right-width:2px}.border-t{border-top-width:1px}.border-blue-500{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity,1))}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246/var(--tw-border-opacity,1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219/var(--tw-border-opacity,1))}.border-white{--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity,1))}.bg-blue-100{--tw-bg-opacity:1;background-color:rgb(219 234 254/var(--tw-bg-opacity,1))}.bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity,1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.bg-green-100{--tw-bg-opacity:1;background-color:rgb(220 252 231/var(--tw-bg-opacity,1))}.bg-green-500{--tw-bg-opacity:1;background-color:rgb(34 197 94/var(--tw-bg-opacity,1))}.bg-orange-100{--tw-bg-opacity:1;background-color:rgb(255 237 213/var(--tw-bg-opacity,1))}.bg-red-100{--tw-bg-opacity:1;background-color:rgb(254 226 226/var(--tw-bg-opacity,1))}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-yellow-100{--tw-bg-opacity:1;background-color:rgb(254 249 195/var(--tw-bg-opacity,1))}.object-cover{-o-object-fit:cover;object-fit:cover}.p-3{padding:.75rem}.p-4{padding:1rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.pl-10{padding-left:2.5rem}.pr-4{padding-right:1rem}.text-left{text-align:left}.text-center{text-align:center}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246/var(--tw-text-opacity,1))}.text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity,1))}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity,1))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity,1))}.text-green-500{--tw-text-opacity:1;color:rgb(34 197 94/var(--tw-text-opacity,1))}.text-green-600{--tw-text-opacity:1;color:rgb(22 163 74/var(--tw-text-opacity,1))}.text-orange-400{--tw-text-opacity:1;color:rgb(251 146 60/var(--tw-text-opacity,1))}.text-orange-500{--tw-text-opacity:1;color:rgb(249 115 22/var(--tw-text-opacity,1))}.text-purple-500{--tw-text-opacity:1;color:rgb(168 85 247/var(--tw-text-opacity,1))}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.text-yellow-600{--tw-text-opacity:1;color:rgb(202 138 4/var(--tw-text-opacity,1))}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.hover\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.focus\:border-blue-500:focus{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity,1))}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-blue-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(59 130 246/var(--tw-ring-opacity,1))}@media (min-width:640px){.sm\:p-4{padding:1rem}.sm\:px-4{padding-left:1rem;padding-right:1rem}.sm\:py-2{padding-top:.5rem;padding-bottom:.5rem}.sm\:text-base{font-size:1rem;line-height:1.5rem}}