whyuzeim 1.0.0

package/cjs/GroupDetail/index.js

@@ -0,0 +1,265 @@
+'use strict';
+
+var _asyncToGenerator = require('@babel/runtime-corejs3/helpers/esm/asyncToGenerator');
+var _slicedToArray = require('@babel/runtime-corejs3/helpers/esm/slicedToArray');
+var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
+var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
+var _regeneratorRuntime = require('@babel/runtime-corejs3/regenerator');
+var React = require('react');
+var classNames = require('classnames');
+var agoraChatUikit = require('agora-chat-uikit');
+var ic_close = require('./image/ic_close.svg.js');
+var ic_share = require('./image/ic_share.svg.js');
+var ic_group_edit = require('./image/ic_group_edit.svg.js');
+var icon_translation = require('./image/icon_translation.svg.js');
+var ic_messages = require('./image/ic_messages.svg.js');
+var index$2 = require('../TypeItem/index.js');
+var context = require('../IM/context.js');
+require('./style/index.scss');
+var index = require('./GroupDetailEditView/index.js');
+var index$1 = require('./GroupShareView/index.js');
+
+var GroupDetail = function GroupDetail(props) {
+  var _groupInfo$sendbirdid;
+  var _useContext = React.useContext(context.Context),
+    http = _useContext.http;
+  var _useState = React.useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isEdit = _useState2[0],
+    setIsEdit = _useState2[1];
+  var _useState3 = React.useState(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    groupInfo = _useState4[0],
+    setGroupInfo = _useState4[1];
+  var _useState5 = React.useState([]),
+    _useState6 = _slicedToArray(_useState5, 2),
+    memberList = _useState6[0],
+    setMemberList = _useState6[1];
+  var _useState7 = React.useState(0),
+    _useState8 = _slicedToArray(_useState7, 2),
+    isautomatictranslate = _useState8[0],
+    setIsautomatictranslate = _useState8[1];
+  var _useConversationConte = agoraChatUikit.useConversationContext(),
+    setCurrentConversation = _useConversationConte.setCurrentConversation;
+  var _useState9 = React.useState(false),
+    _useState10 = _slicedToArray(_useState9, 2),
+    isShare = _useState10[0],
+    setIsShare = _useState10[1];
+  var getGroupDetailInfo = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    var groupid, response, data, _data$data;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _context.prev = 0;
+          groupid = agoraChatUikit.rootStore.conversationStore.currentCvs.conversationId;
+          _context.next = 4;
+          return http.post("/capi/account/imchannel/getdetails", {
+            sendbirdid: groupid
+          });
+        case 4:
+          response = _context.sent;
+          data = response.data;
+          if (data && data.code === 200) {
+            setGroupInfo(data.data);
+            setIsautomatictranslate((_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.isautomatictranslate);
+          }
+          _context.next = 11;
+          break;
+        case 9:
+          _context.prev = 9;
+          _context.t0 = _context["catch"](0);
+        case 11:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee, null, [[0, 9]]);
+  })), [http, props.userId]);
+  var handleGetGroupList = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+    var groupid, result;
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          _context2.prev = 0;
+          groupid = agoraChatUikit.rootStore.conversationStore.currentCvs.conversationId;
+          _context2.next = 4;
+          return http.post("/capi/account/imchannel/getchanneluserv2", {
+            page: 1,
+            size: 2000,
+            sendbirdid: groupid
+          });
+        case 4:
+          result = _context2.sent;
+          setMemberList(result.data.data.list);
+          _context2.next = 11;
+          break;
+        case 8:
+          _context2.prev = 8;
+          _context2.t0 = _context2["catch"](0);
+          console.log(_context2.t0);
+        case 11:
+        case "end":
+          return _context2.stop();
+      }
+    }, _callee2, null, [[0, 8]]);
+  })), [http]);
+  // /capi/account/imchannel/setautomatictranslate
+  var handleTranslate = React.useCallback(/*#__PURE__*/function () {
+    var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3(checked) {
+      var groupid;
+      return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+        while (1) switch (_context3.prev = _context3.next) {
+          case 0:
+            _context3.prev = 0;
+            groupid = agoraChatUikit.rootStore.conversationStore.currentCvs.conversationId;
+            _context3.next = 4;
+            return http.post("/capi/account/imchannel/setautomatictranslate", {
+              sendbirdid: groupid,
+              type: 0,
+              isautomatictranslate: checked ? 1 : 0
+            });
+          case 4:
+            _context3.next = 9;
+            break;
+          case 6:
+            _context3.prev = 6;
+            _context3.t0 = _context3["catch"](0);
+            console.log(_context3.t0);
+          case 9:
+          case "end":
+            return _context3.stop();
+        }
+      }, _callee3, null, [[0, 6]]);
+    }));
+    return function (_x) {
+      return _ref3.apply(this, arguments);
+    };
+  }(), [http]);
+  React.useEffect(function () {
+    getGroupDetailInfo();
+  }, []);
+  React.useEffect(function () {
+    handleGetGroupList();
+  }, [handleGetGroupList]);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, isEdit ? /*#__PURE__*/React.createElement(index, {
+    groupInfo: groupInfo,
+    onClickClose: function onClickClose(needRefresh) {
+      setIsEdit(false);
+      if (needRefresh) {
+        getGroupDetailInfo();
+        if (groupInfo !== null && groupInfo !== void 0 && groupInfo.id) {
+          agoraChatUikit.rootStore.addressStore.getGroupInfo(groupInfo === null || groupInfo === void 0 ? void 0 : groupInfo.id);
+        }
+      }
+    }
+  }) : isShare ? /*#__PURE__*/React.createElement(index$1, {
+    shareObjId: (_groupInfo$sendbirdid = groupInfo === null || groupInfo === void 0 ? void 0 : groupInfo.sendbirdid) !== null && _groupInfo$sendbirdid !== void 0 ? _groupInfo$sendbirdid : '',
+    shareObjName: groupInfo === null || groupInfo === void 0 ? void 0 : groupInfo.name,
+    shareObjImageurl: groupInfo === null || groupInfo === void 0 ? void 0 : groupInfo.headimgurl,
+    onClickClose: function onClickClose() {
+      return setIsShare(false);
+    }
+  }) : /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupDetail w-full h-full")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupDetail-header flex flex-row items-center justify-between")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupDetail-header-left flex flex-row gap-5")
+  }, /*#__PURE__*/React.createElement("img", {
+    src: ic_close,
+    className: "cursor-pointer",
+    onClick: function onClick() {
+      if (props.onClickClose) {
+        props.onClickClose();
+      }
+    }
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "text-base"
+  }, "Profile")), /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupDetail-header-right")
+  }, /*#__PURE__*/React.createElement("img", {
+    onClick: function onClick() {
+      return setIsEdit(true);
+    },
+    src: ic_group_edit,
+    className: "cursor-pointer"
+  }), /*#__PURE__*/React.createElement("img", {
+    onClick: function onClick() {
+      return setIsShare(true);
+    },
+    src: ic_share,
+    className: "cursor-pointer"
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupDetail-content-wrap  overflow-auto")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupDetail-content flex flex-col items-center justify-between p-4")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupDetail-content-avatar flex flex-col items-center")
+  }, /*#__PURE__*/React.createElement("img", {
+    src: groupInfo === null || groupInfo === void 0 ? void 0 : groupInfo.headimgurl,
+    alt: ""
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "text-base mt-1"
+  }, groupInfo === null || groupInfo === void 0 ? void 0 : groupInfo.name), /*#__PURE__*/React.createElement("span", {
+    className: "text-base text-[var(--im-third-fontColor)] font-normal mt-2"
+  }, groupInfo === null || groupInfo === void 0 ? void 0 : groupInfo.members, " members")), /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupDetail-content-translation flex items-center justify-between w-full mt-4")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "flex gap-4 items-center flex-row"
+  }, /*#__PURE__*/React.createElement("img", {
+    src: icon_translation,
+    alt: ""
+  }), /*#__PURE__*/React.createElement("span", null, "Enable auto-translation")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(agoraChatUikit.Switch, {
+    checked: isautomatictranslate === 1,
+    onChange: function onChange(event) {
+      setIsautomatictranslate(event.target.checked ? 1 : 0);
+      handleTranslate(event.target.checked);
+    }
+  })))), /*#__PURE__*/React.createElement("div", {
+    className: "yuze-groupDetail-member p-4"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "block text-center"
+  }, "Member"), /*#__PURE__*/React.createElement("div", {
+    className: "yuze-groupDetail-member-list pt-4"
+  }, _mapInstanceProperty(memberList).call(memberList, function (item) {
+    return /*#__PURE__*/React.createElement(index$2, {
+      isprohibition: item.isprohibition,
+      name: item.nickname,
+      avatar: item.headimgurl,
+      key: item.userid,
+      roletype: item.roletype,
+      rightNode: /*#__PURE__*/React.createElement("img", {
+        src: ic_messages,
+        onClick: function onClick() {
+          // addConversation({
+          //   conversationId: item.userid,
+          //   chatType: "singleChat",
+          //   lastMessage: "",
+          //   unreadCount: 0,
+          // });
+          setCurrentConversation({
+            conversationId: item.userid,
+            chatType: "singleChat",
+            name: item.nickname
+          });
+        }
+      }),
+      showMore: true,
+      userId: item.userid,
+      sendbirdid: agoraChatUikit.rootStore.conversationStore.currentCvs.conversationId,
+      onBlock: function onBlock(value) {
+        var resetMemeber = _filterInstanceProperty(memberList).call(memberList, function (item) {
+          return item.userid !== value;
+        });
+        setMemberList(resetMemeber);
+      },
+      onDelete: function onDelete(value) {
+        var resetMemeber = _filterInstanceProperty(memberList).call(memberList, function (item) {
+          return item.userid !== value;
+        });
+        setMemberList(resetMemeber);
+      }
+    });
+  }))))));
+};
+
+module.exports = GroupDetail;

package/cjs/GroupDetail/style/index.scss

@@ -0,0 +1,66 @@
+.yuze-groupDetail {
+  background-color: var(--im-main-backgroundColor);
+  .yuze-groupDetail-header {
+    height: 64px;
+    box-sizing: border-box;
+    padding: 0 10px;
+    .yuze-groupDetail-header-left {
+      span {
+        color: var(--im-main-fontColor);
+      }
+    }
+    &-right {
+      display: flex;
+      flex-direction: row;
+      gap: 8px;
+      align-items: center;
+    }
+  }
+  .yuze-groupDetail-content-wrap {
+    height: calc(100% - 64px);
+  }
+  .yuze-groupDetail-content {
+    .yuze-groupDetail-content-avatar {
+      img {
+        width: 80px;
+        height: 80px;
+        object-fit: cover;
+      }
+      span {
+        color: var(--im-main-fontColor);
+      }
+    }
+    .yuze-groupDetail-content-username {
+      img {
+        width: 20px;
+        height: 20px;
+      }
+      span {
+        color: var(--im-main-fontColor);
+
+        &:nth-child(2) {
+          color: #707579;
+        }
+      }
+    }
+    .yuze-groupDetail-content-translation {
+      img {
+        width: 20px;
+        height: 20px;
+      }
+      span {
+        color: var(--im-main-fontColor);
+      }
+      .cui-switch .cui-switch-container-checked {
+        background-color: var(--im-main-switchColor);
+      }
+    }
+  }
+  .yuze-groupDetail-member {
+    & > span {
+      height: 34px;
+      color: var(--im-main-fontColor);
+      border-bottom: solid 1px #fff;
+    }
+  }
+}

package/cjs/IM/DefaultIMLayout/MobileHeader/index.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import "./style/index.scss";
+export interface IMobileHeader {
+    leftIcon?: React.ReactElement;
+    rightIcon?: React.ReactElement;
+    title?: React.ReactElement;
+    className?: string;
+    style?: React.CSSProperties;
+}
+declare const MobileHeader: React.FC<IMobileHeader>;
+export default MobileHeader;

package/cjs/IM/DefaultIMLayout/MobileHeader/index.js

@@ -0,0 +1,29 @@
+'use strict';
+
+var React = require('react');
+require('./style/index.scss');
+var classNames = require('classnames');
+
+var MobileHeader = function MobileHeader(props) {
+  var title = props.title,
+    leftIcon = props.leftIcon,
+    rightIcon = props.rightIcon,
+    className = props.className,
+    style = props.style;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-mobileHeader flex flex-row items-center justify-between px-4", className),
+    style: style
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "yuze-mobileHeader-left"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "yuze-mobileHeader-item flex flex-row items-center justify-center"
+  }, leftIcon)), /*#__PURE__*/React.createElement("div", {
+    className: "yuze-mobileHeader-middle text-xl text-[var(--im-main-fontColor)]"
+  }, title), /*#__PURE__*/React.createElement("div", {
+    className: "yuze-mobileHeader-right"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "yuze-mobileHeader-item flex flex-row items-center justify-center"
+  }, rightIcon)));
+};
+
+module.exports = MobileHeader;

package/cjs/IM/DefaultIMLayout/MobileHeader/style/index.scss

@@ -0,0 +1,11 @@
+.yuze-mobileHeader {
+  height: 64px;
+  box-sizing: border-box;
+  border-bottom: solid 1px var(--im-mainContent-left-borderColor);
+  &-item {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    background-color: #292e23;
+  }
+}

package/cjs/IM/DefaultIMLayout/index.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const DefaultIMLayout: () => React.JSX.Element;
+export default DefaultIMLayout;

package/cjs/IM/DefaultIMLayout/index.js

@@ -0,0 +1,29 @@
+'use strict';
+
+var React = require('react');
+var index = require('../MainContent/index.js');
+var index$1 = require('../../Sidebar/index.js');
+var context = require('../context.js');
+
+/* eslint-disable @typescript-eslint/no-unused-expressions */
+var DefaultIMLayout = function DefaultIMLayout() {
+  var _useContext = React.useContext(context.Context),
+    setRightComponent = _useContext.setRightComponent,
+    midComponent = _useContext.midComponent,
+    renderMidComponent = _useContext.renderMidComponent;
+  return /*#__PURE__*/React.createElement(index, {
+    renderLeft: function renderLeft() {
+      return /*#__PURE__*/React.createElement(index$1, {
+        onConversationItemClick: function onConversationItemClick() {
+          setRightComponent && setRightComponent(undefined);
+          renderMidComponent && renderMidComponent();
+        }
+      });
+    },
+    renderMid: function renderMid() {
+      return midComponent;
+    }
+  });
+};
+
+module.exports = DefaultIMLayout;

package/cjs/IM/MainContent/index.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import "./style/index.scss";
+export type IMainContent = {
+    renderLeft?: () => React.ReactElement;
+    renderMid?: () => React.ReactElement;
+};
+declare const MainContent: React.FC<IMainContent>;
+export default MainContent;

package/cjs/IM/MainContent/index.js

@@ -0,0 +1,87 @@
+'use strict';
+
+var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
+var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
+var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
+var _findInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/find');
+var React = require('react');
+var classNames = require('classnames');
+var context = require('../context.js');
+require('./style/index.scss');
+var agoraChatUikit = require('agora-chat-uikit');
+
+var MainContent = function MainContent(props) {
+  var renderLeft = props.renderLeft,
+    renderMid = props.renderMid;
+  var _useContext = React.useContext(context.Context),
+    rightComponent = _useContext.rightComponent,
+    sidebarExpand = _useContext.sidebarExpand,
+    midComponent = _useContext.midComponent;
+  //同步群图片
+  React.useEffect(function () {
+    // 获取群组头像
+    if (agoraChatUikit.rootStore.loginState) {
+      var _context, _context2;
+      var groupIds = _mapInstanceProperty(_context = _filterInstanceProperty(_context2 = agoraChatUikit.rootStore.addressStore.groups).call(_context2, function (item) {
+        return !item.avatarUrl;
+      })).call(_context, function (item) {
+        // @ts-ignore
+        return item.groupid;
+      }) || [];
+      _forEachInstanceProperty(groupIds).call(groupIds, function (groupid) {
+        agoraChatUikit.rootStore.addressStore.getGroupInfo(groupid);
+      });
+    }
+  }, [agoraChatUikit.rootStore.loginState, agoraChatUikit.rootStore.addressStore.groups.length]);
+  //当前会话发生改变，检测群图片
+  React.useEffect(function () {
+    if (agoraChatUikit.rootStore.conversationStore.currentCvs.chatType === "groupChat") {
+      var _rootStore$addressSto, _context3;
+      var groupAvatarUrl = (_rootStore$addressSto = _findInstanceProperty(_context3 = agoraChatUikit.rootStore.addressStore.groups).call(_context3, function (item) {
+        return item.groupid === agoraChatUikit.rootStore.conversationStore.currentCvs.conversationId;
+      })) === null || _rootStore$addressSto === void 0 ? void 0 : _rootStore$addressSto.avatarUrl;
+      if (!groupAvatarUrl) {
+        agoraChatUikit.rootStore.addressStore.getGroupInfo(agoraChatUikit.rootStore.conversationStore.currentCvs.conversationId);
+      }
+    }
+  }, [agoraChatUikit.rootStore.conversationStore.currentCvs]);
+  React.useEffect(function () {
+    var _context4, _context5, _context6;
+    var groupIds = _mapInstanceProperty(_context4 = _filterInstanceProperty(_context5 = agoraChatUikit.rootStore.addressStore.groups).call(_context5, function (item) {
+      return !item.avatarUrl;
+    })).call(_context4, function (item) {
+      // @ts-ignore
+      return item.groupid;
+    }) || [];
+    _forEachInstanceProperty(groupIds).call(groupIds, function (groupid) {
+      agoraChatUikit.rootStore.addressStore.getGroupInfo(groupid);
+    });
+    _forEachInstanceProperty(_context6 = agoraChatUikit.rootStore.conversationStore.conversationList).call(_context6, function (conversation) {
+      if (!conversation.avatarUrl) {
+        if (conversation.chatType === "groupChat") {
+          agoraChatUikit.rootStore.addressStore.getGroupInfo(conversation.conversationId);
+        } else {
+          agoraChatUikit.rootStore.addressStore.getUserInfo(conversation.conversationId);
+        }
+      }
+    });
+  }, []);
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames("flex flex-row h-full w-screen yuze-mainContent relative sm:w-auto", {
+      "yuze-mainContent-folder": !sidebarExpand
+    })
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames("h-full yuze-mainContent-left shrink-0 overflow-hidden w-full sm:w-[360px]", {
+      // "flex-1": sidebarExpand,
+    })
+  }, renderLeft && renderLeft()), midComponent && /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-mainContent-middle shrink-0 h-full absolute top-0 left-0 w-full sm:relative", {
+      "sm:w-[884px]": !rightComponent,
+      "sm:w-[568px]": rightComponent
+    })
+  }, renderMid && renderMid()), rightComponent && /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-mainContent-right shrink-0 h-full absolute top-0 left-0 z-1000 w-full sm:relative sm:w-[316px]")
+  }, rightComponent));
+};
+
+module.exports = MainContent;

package/cjs/IM/MainContent/style/index.scss

@@ -0,0 +1,22 @@
+.flex-1\.8 {
+  flex: 1.8;
+}
+.flex-2\.8 {
+  flex: 2.8;
+}
+.yuze-mainContent {
+  .yuze-mainContent-left {
+    // width: 360px;
+    transition: all 0.2s;
+    border-right: solid 1px var(--im-mainContent-left-borderColor);
+  }
+
+  &.yuze-mainContent-folder {
+    .yuze-mainContent-left {
+      width: 80px;
+      .cui-conversationItem-info {
+        right: -50px;
+      }
+    }
+  }
+}

package/cjs/IM/MobileHeader/index.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import "./style/index.scss";
+export interface IMobileHeader {
+    leftIcon?: React.ReactElement;
+    rightIcon?: React.ReactElement;
+    title?: React.ReactElement;
+    className?: string;
+    style?: React.CSSProperties;
+}
+declare const MobileHeader: React.FC<IMobileHeader>;
+export default MobileHeader;

package/cjs/IM/MobileHeader/index.js

@@ -0,0 +1,29 @@
+'use strict';
+
+var React = require('react');
+require('./style/index.scss');
+var classNames = require('classnames');
+
+var MobileHeader = function MobileHeader(props) {
+  var title = props.title,
+    leftIcon = props.leftIcon,
+    rightIcon = props.rightIcon,
+    className = props.className,
+    style = props.style;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-mobileHeader flex flex-row items-center justify-between px-4", className),
+    style: style
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "yuze-mobileHeader-left"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "yuze-mobileHeader-item flex flex-row items-center justify-center"
+  }, leftIcon)), /*#__PURE__*/React.createElement("div", {
+    className: "yuze-mobileHeader-middle text-xl text-[var(--im-main-fontColor)]"
+  }, title), /*#__PURE__*/React.createElement("div", {
+    className: "yuze-mobileHeader-right"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "yuze-mobileHeader-item flex flex-row items-center justify-center"
+  }, rightIcon)));
+};
+
+module.exports = MobileHeader;

package/cjs/IM/MobileHeader/style/index.scss

@@ -0,0 +1,11 @@
+.yuze-mobileHeader {
+  height: 64px;
+  box-sizing: border-box;
+  border-bottom: solid 1px var(--im-mainContent-left-borderColor);
+  &-item {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    background-color: #292e23;
+  }
+}

package/cjs/IM/context.d.ts

@@ -0,0 +1,21 @@
+import { AxiosInstance } from "axios";
+import React from "react";
+export interface IUserInfo {
+    uid: string;
+    username?: string;
+    avatar?: string;
+}
+export type ConfigConsumerProps = {
+    rightComponent?: React.ReactElement;
+    setRightComponent?: (element: React.ReactElement | undefined) => void;
+    midComponent?: React.ReactElement;
+    setMidComponent?: (element: React.ReactElement | undefined) => void;
+    renderMidComponent?: () => void;
+    http: AxiosInstance;
+    userInfo: IUserInfo;
+    sidebarExpand?: boolean;
+    setSidebarExpand?: (value: boolean) => void;
+    mobile?: boolean;
+    onChatIconClick?: () => void;
+};
+export declare const Context: React.Context<ConfigConsumerProps>;

package/cjs/IM/context.js

@@ -0,0 +1,14 @@
+'use strict';
+
+var axios = require('axios');
+var React = require('react');
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+var Context = /*#__PURE__*/React.createContext({
+  http: axios.create({}),
+  userInfo: {
+    uid: ""
+  }
+});
+
+exports.Context = Context;

package/cjs/IM/encryption.d.ts

@@ -0,0 +1,22 @@
+export declare const aesKey: string;
+export declare function createAesKey(): string;
+/**
+ * AES 加密
+ * @param word 待加密字段
+ * @param keyStr 加密 key
+ * @returns {string} 返回加密字段
+ */
+export declare function aesEncrypt(word: any, keyStr: string): string;
+/**
+ * AES 解密
+ * @param word 待解密数据
+ * @param keyStr 解密 key
+ * @returns {string} 返回解密字符串
+ */
+export declare function aesDecrypt(word: string, keyStr: string): string;
+/**
+ * RSA 设置公钥
+ * @param val 公钥
+ */
+export declare function setPublicKey(val: string): void;
+export declare function rsaEncrypt(data: string, keyStr: string): string | false;