whyuzeim 1.0.0

package/es/Sidebar/GroupList/OperateBtn/index.js

@@ -0,0 +1,236 @@
+import _asyncToGenerator from '@babel/runtime-corejs3/helpers/esm/asyncToGenerator';
+import _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
+import _regeneratorRuntime from '@babel/runtime-corejs3/regenerator';
+import _includesInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/includes';
+import React, { useContext, useState, useCallback, useEffect } from 'react';
+import { Modal, Tooltip, Button } from 'antd';
+import img$3 from './image/more.svg.js';
+import { Context } from '../../../IM/context.js';
+import { useDebounceCallback } from 'usehooks-ts';
+import { useConversationContext, rootStore } from 'agora-chat-uikit';
+import img from './image/muted.svg.js';
+import img$1 from './image/logout.svg.js';
+import img$2 from './image/delete.svg.js';
+import './style/index.scss';
+
+var OperateBtn = function OperateBtn(props) {
+  var conversationId = props.conversationId,
+    chatType = props.chatType,
+    silent = props.silent,
+    onDelete = props.onDelete;
+  var _useContext = useContext(Context),
+    http = _useContext.http;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    tooltipOpen = _useState2[0],
+    setTooltipOpen = _useState2[1];
+  var _useConversationConte = useConversationContext(),
+    deleteConversation = _useConversationConte.deleteConversation;
+  var _Modal$useModal = Modal.useModal(),
+    _Modal$useModal2 = _slicedToArray(_Modal$useModal, 2),
+    modal = _Modal$useModal2[0],
+    contextHolder = _Modal$useModal2[1];
+  var handleTooltip = useCallback(function (event) {
+    var _context;
+    if (!_includesInstanceProperty(_context = event.target.className).call(_context, "yuze-conversationItem-action-img")) {
+      setTooltipOpen(false);
+    }
+  }, [setTooltipOpen]);
+  useEffect(function () {
+    window.addEventListener("click", handleTooltip);
+    return function () {
+      window.removeEventListener("click", handleTooltip);
+    };
+  }, [handleTooltip]);
+  var handleMuted = useCallback(/*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(event) {
+      return _regeneratorRuntime.wrap(function _callee$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            event.stopPropagation();
+            if (silent) {
+              rootStore === null || rootStore === void 0 || rootStore.conversationStore.clearRemindTypeForConversation({
+                chatType: chatType,
+                conversationId: conversationId
+              });
+            } else {
+              rootStore === null || rootStore === void 0 || rootStore.conversationStore.setSilentModeForConversation({
+                chatType: chatType,
+                conversationId: conversationId
+              });
+            }
+          case 2:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee);
+    }));
+    return function (_x) {
+      return _ref.apply(this, arguments);
+    };
+  }(), [chatType, conversationId, silent]);
+  var handleDebounceMuted = useDebounceCallback(handleMuted, 100);
+  var handleConfirmDelete = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(event) {
+      return _regeneratorRuntime.wrap(function _callee2$(_context3) {
+        while (1) switch (_context3.prev = _context3.next) {
+          case 0:
+            event.stopPropagation();
+            _context3.next = 3;
+            return modal.confirm({
+              content: /*#__PURE__*/React.createElement("span", {
+                className: "text-sm "
+              }, "Are you sure you want to delete ?"),
+              footer: /*#__PURE__*/React.createElement("div", {
+                className: "yuze-confirm-footer flex justify-center gap-5 mt-4"
+              }, /*#__PURE__*/React.createElement(Button, {
+                type: "default",
+                className: "flex-1 bg-transparent",
+                size: "large",
+                onClick: function onClick() {
+                  Modal.destroyAll();
+                }
+              }, "Close"), /*#__PURE__*/React.createElement(Button, {
+                type: "primary",
+                className: "flex-1",
+                size: "large",
+                onClick: handleDebounceDelete
+              }, "Confirm"))
+            });
+          case 3:
+          case "end":
+            return _context3.stop();
+        }
+      }, _callee2);
+    }));
+    return function handleConfirmDelete(_x2) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+  var handleConfirmLeave = /*#__PURE__*/function () {
+    var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3(event) {
+      return _regeneratorRuntime.wrap(function _callee3$(_context4) {
+        while (1) switch (_context4.prev = _context4.next) {
+          case 0:
+            event.stopPropagation();
+            _context4.next = 3;
+            return modal.confirm({
+              content: /*#__PURE__*/React.createElement("span", {
+                className: "text-sm "
+              }, "Are you sure you want to delete and leave the group ?"),
+              footer: /*#__PURE__*/React.createElement("div", {
+                className: "yuze-confirm-footer flex justify-center gap-5 mt-4"
+              }, /*#__PURE__*/React.createElement(Button, {
+                type: "default",
+                className: "flex-1 bg-transparent",
+                size: "large",
+                onClick: function onClick() {
+                  Modal.destroyAll();
+                }
+              }, "Close"), /*#__PURE__*/React.createElement(Button, {
+                type: "primary",
+                className: "flex-1",
+                size: "large",
+                onClick: handleDebounceLeave
+              }, "Confirm"))
+            });
+          case 3:
+          case "end":
+            return _context4.stop();
+        }
+      }, _callee3);
+    }));
+    return function handleConfirmLeave(_x3) {
+      return _ref3.apply(this, arguments);
+    };
+  }();
+  var handleLeave = useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
+    return _regeneratorRuntime.wrap(function _callee4$(_context5) {
+      while (1) switch (_context5.prev = _context5.next) {
+        case 0:
+          _context5.next = 2;
+          return http.post("/capi/account/imchannel/exitchannel", {
+            sendbirdid: conversationId
+          });
+        case 2:
+          deleteConversation({
+            conversationId: conversationId,
+            chatType: chatType
+          });
+          onDelete && onDelete(conversationId);
+          Modal.destroyAll();
+        case 5:
+        case "end":
+          return _context5.stop();
+      }
+    }, _callee4);
+  })), [chatType, conversationId, deleteConversation, http, onDelete]);
+  var handleDebounceLeave = useDebounceCallback(handleLeave, 100);
+  var handleDelete = useCallback(/*#__PURE__*/function () {
+    var _ref5 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5(event) {
+      return _regeneratorRuntime.wrap(function _callee5$(_context6) {
+        while (1) switch (_context6.prev = _context6.next) {
+          case 0:
+            event.stopPropagation();
+            _context6.next = 3;
+            return http.post("/capi/account/imchannel/delete", {
+              sendbirdid: conversationId
+            });
+          case 3:
+            onDelete && onDelete(conversationId);
+            Modal.destroyAll();
+          case 5:
+          case "end":
+            return _context6.stop();
+        }
+      }, _callee5);
+    }));
+    return function (_x4) {
+      return _ref5.apply(this, arguments);
+    };
+  }(), [conversationId, http, onDelete]);
+  var handleDebounceDelete = useDebounceCallback(handleDelete, 100);
+  return /*#__PURE__*/React.createElement(Tooltip, {
+    open: tooltipOpen,
+    placement: "bottomRight",
+    title: /*#__PURE__*/React.createElement("div", {
+      className: "flex flex-col"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "yuze-conversationList-header-right-tooltip-item flex flex-row items-center gap-3 cursor-pointer",
+      onClick: handleDebounceMuted
+    }, /*#__PURE__*/React.createElement("img", {
+      src: img,
+      alt: "",
+      className: "yuze-conversationItem-action-img"
+    }), /*#__PURE__*/React.createElement("span", {
+      className: "text-sm"
+    }, silent ? "Unmuted" : "Muted")), chatType === "groupChat" && /*#__PURE__*/React.createElement("div", {
+      className: "yuze-conversationList-header-right-tooltip-item flex flex-row items-center gap-3 cursor-pointer",
+      onClick: handleConfirmLeave
+    }, /*#__PURE__*/React.createElement("img", {
+      src: img$1,
+      alt: "",
+      className: "yuze-conversationItem-action-img"
+    }), /*#__PURE__*/React.createElement("span", {
+      className: "text-sm"
+    }, "Leave Group")), /*#__PURE__*/React.createElement("div", {
+      className: "yuze-conversationList-header-right-tooltip-item flex flex-row items-center gap-3 cursor-pointer",
+      onClick: handleConfirmDelete
+    }, /*#__PURE__*/React.createElement("img", {
+      src: img$2,
+      alt: "",
+      className: "yuze-conversationItem-action-img"
+    }), /*#__PURE__*/React.createElement("span", {
+      className: "text-sm delete"
+    }, "Delete Group")))
+  }, /*#__PURE__*/React.createElement("img", {
+    src: img$3,
+    className: "cursor-pointer ml-2 yuze-conversationItem-action-img",
+    onClick: function onClick(event) {
+      event.stopPropagation();
+      setTooltipOpen(!tooltipOpen);
+    }
+  }), contextHolder);
+};
+
+export { OperateBtn as default };

package/es/Sidebar/GroupList/OperateBtn/style/index.scss

@@ -0,0 +1,14 @@
+.yuze-conversationItem-action-img {
+  width: 16px;
+  height: 16px;
+}
+.yuze-conversationList-header-right-tooltip-item{
+  .delete{
+    // color: var(--im-delete-fontColor);
+    color: rgba(233, 67, 89, 1);
+  }
+  .yuze-conversationItem-action-img{
+    width: 16px;
+    height: 16px;
+  }
+}

package/es/Sidebar/GroupList/index.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import "./style/index.scss";
+interface IGroupList {
+    style?: React.CSSProperties;
+}
+declare const GroupList: React.FC<IGroupList>;
+export default GroupList;

package/es/Sidebar/GroupList/index.js

@@ -0,0 +1,140 @@
+import _asyncToGenerator from '@babel/runtime-corejs3/helpers/esm/asyncToGenerator';
+import _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
+import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
+import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
+import _regeneratorRuntime from '@babel/runtime-corejs3/regenerator';
+import React, { useState, useContext, useCallback, useEffect } from 'react';
+import './style/index.scss';
+import classNames from 'classnames';
+import { Input, useConversationContext } from 'agora-chat-uikit';
+import { Tabs } from 'antd';
+import { Context } from '../../IM/context.js';
+import TypeItem from '../../TypeItem/index.js';
+import OperateBtn from './OperateBtn/index.js';
+import NoData from '../../NoData/index.js';
+import { useDebounceCallback } from 'usehooks-ts';
+
+var List = function List(props) {
+  var _props$activekey = props.activekey,
+    activekey = _props$activekey === void 0 ? "0" : _props$activekey,
+    keyword = props.keyword;
+  var _useContext = useContext(Context),
+    http = _useContext.http,
+    renderMidComponent = _useContext.renderMidComponent;
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    list = _useState2[0],
+    setList = _useState2[1];
+  var _useConversationConte = useConversationContext(),
+    setCurrentConversation = _useConversationConte.setCurrentConversation;
+  var handleGetGroupList = useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    var result;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _context.next = 2;
+          return http.post("/capi/account/imchannel/getchannels", {
+            name: keyword,
+            type: activekey
+          });
+        case 2:
+          result = _context.sent;
+          setList(result.data.data);
+        case 4:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  })), [activekey, http, keyword]);
+  // const handelDebounceGroupList = useDebounceCallback(handleGetGroupList,1000)
+  useEffect(function () {
+    handleGetGroupList();
+  }, [handleGetGroupList]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupList-tabs-content overflow-auto")
+  }, list === null || list === void 0 ? void 0 : _mapInstanceProperty(list).call(list, function (item) {
+    return /*#__PURE__*/React.createElement(TypeItem, {
+      type: "2",
+      key: item.id,
+      name: item.name,
+      avatar: item.headimgurl,
+      description: "".concat(item.members, " members"),
+      onClick: function onClick() {
+        renderMidComponent && renderMidComponent();
+        setCurrentConversation({
+          conversationId: item.sendbirdid,
+          chatType: "groupChat",
+          name: item.name
+        });
+      },
+      rightNode: /*#__PURE__*/React.createElement(OperateBtn, {
+        conversationId: item.sendbirdid,
+        chatType: "groupChat",
+        onDelete: function onDelete(id) {
+          var filterList = _filterInstanceProperty(list).call(list, function (item) {
+            return item.sendbirdid !== id;
+          });
+          setList(filterList);
+        }
+      })
+    });
+  }), (list === null || list === void 0 ? void 0 : list.length) === 0 && /*#__PURE__*/React.createElement(NoData, null));
+};
+var GroupList = function GroupList(props) {
+  var style = props.style;
+  var _useState3 = useState("0"),
+    _useState4 = _slicedToArray(_useState3, 2),
+    activekey = _useState4[0],
+    setActiveKey = _useState4[1];
+  var _useState5 = useState(""),
+    _useState6 = _slicedToArray(_useState5, 2),
+    keyword = _useState6[0],
+    setKeyword = _useState6[1];
+  var handleDebounceInput = useDebounceCallback(function (event) {
+    setKeyword(event.target.value);
+  }, 500);
+  var items = [{
+    label: "Created",
+    key: "0",
+    children: /*#__PURE__*/React.createElement(List, {
+      activekey: activekey,
+      keyword: keyword
+    })
+  }, {
+    label: "Admin",
+    key: "2",
+    children: /*#__PURE__*/React.createElement(List, {
+      activekey: activekey,
+      keyword: keyword
+    })
+  }, {
+    label: "Joined",
+    key: "1",
+    children: /*#__PURE__*/React.createElement(List, {
+      activekey: activekey,
+      keyword: keyword
+    })
+  }];
+  return /*#__PURE__*/React.createElement("div", {
+    className: "yuze-groupList h-full w-full",
+    style: style
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupList-header p-4")
+  }, /*#__PURE__*/React.createElement(Input, {
+    onChange: handleDebounceInput,
+    onClear: function onClear() {
+      setKeyword("");
+    }
+  })), /*#__PURE__*/React.createElement("div", {
+    className: classNames("yuze-groupList-tabs")
+  }, /*#__PURE__*/React.createElement(Tabs, {
+    activeKey: activekey,
+    centered: true,
+    items: items,
+    onChange: function onChange(activeKey) {
+      setActiveKey(activeKey);
+    }
+  })));
+};
+
+export { GroupList as default };

package/es/Sidebar/GroupList/style/index.scss

@@ -0,0 +1,40 @@
+.yuze-groupList {
+  background-color: var(--im-main-backgroundColor);
+  .ant-tabs .ant-tabs-tab {
+    color: var(--im-main-fontColor);
+  }
+  .ant-tabs .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
+    color: var(--im-tab-active-fontColor);
+  }
+  .ant-tabs,
+  .ant-tabs-content,
+  .ant-tabs-tabpane {
+    height: 100%;
+  }
+  &-tabs {
+    height: calc(100% - 68px);
+    .ant-tabs-nav{
+      &::before{
+        border: none;
+      }
+      .ant-tabs-ink-bar{
+        background-color: #fff;
+      }
+      .ant-tabs-tab{
+        color: var(--im-second-fontColor);
+        &.ant-tabs-tab-active{
+          .ant-tabs-tab-btn{
+            color: var(--im-main-fontColor);
+          }
+        }
+      }
+      //color: var(--im-main-fontColor);
+    }
+    &-content {
+      height: 100%;
+      &::-webkit-scrollbar {
+        display: none;
+      }
+    }
+  }
+}

package/es/Sidebar/MobileCreateGroup/index.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+import "./style/index.scss";
+export interface ICreateGroup {
+    name?: string;
+    onClose?: () => void;
+    open?: boolean;
+    style?: React.CSSProperties;
+    ref?: React.RefObject<IMobileCreateGroupRef | null>;
+}
+export interface IUserData {
+    walletaddress: string;
+    headimgurl: string;
+    nickname: string;
+    name: string;
+    id: string;
+    type: number;
+    userid: string;
+    username: string;
+    certification: number;
+    status: number;
+}
+export interface IMobileCreateGroupRef {
+    handleDebounceCreateGroup?: () => void;
+    clear?: () => void;
+}
+declare const MobileCreateGroup: React.FC<ICreateGroup>;
+export default MobileCreateGroup;

package/es/Sidebar/MobileCreateGroup/index.js

@@ -0,0 +1,169 @@
+import _toConsumableArray from '@babel/runtime-corejs3/helpers/esm/toConsumableArray';
+import _asyncToGenerator from '@babel/runtime-corejs3/helpers/esm/asyncToGenerator';
+import _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
+import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
+import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
+import _findInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/find';
+import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
+import _regeneratorRuntime from '@babel/runtime-corejs3/regenerator';
+import React, { forwardRef, useContext, useState, useEffect, useImperativeHandle } from 'react';
+import { Input, Avatar } from 'agora-chat-uikit';
+import TypeItem from '../../TypeItem/index.js';
+import { Context } from '../../IM/context.js';
+import { useDebounceCallback } from 'usehooks-ts';
+import img from '../image/ic_close.svg.js';
+import './style/index.scss';
+import classNames from 'classnames';
+
+var MobileCreateGroup = /*#__PURE__*/forwardRef(function (props, ref) {
+  var onClose = props.onClose,
+    style = props.style;
+  var _useContext = useContext(Context),
+    http = _useContext.http;
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    list = _useState2[0],
+    setList = _useState2[1];
+  var _useState3 = useState([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    member = _useState4[0],
+    setMember = _useState4[1];
+  var handleGetFrindList = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(keyword) {
+      var result, list;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.next = 2;
+            return http.post("/capi/account/imsearch/findpage", {
+              keyword: keyword,
+              type: 2,
+              userid: "fpn467kwz4rgzynyytb7enhqnjanggswe1hy5q8cja8",
+              size: 10,
+              page: 1
+            });
+          case 2:
+            result = _context.sent;
+            list = result.data.data.list;
+            setList(list);
+          case 5:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function handleGetFrindList(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  var handleDebounceGetFrindList = useDebounceCallback(handleGetFrindList, 100);
+  var handleCreateGroup = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+      var _result2$data;
+      var result1, data, result2;
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            _context2.next = 2;
+            return http.get("/capi/account/imchannel/imchannelconfig");
+          case 2:
+            result1 = _context2.sent;
+            data = {
+              name: _mapInstanceProperty(member).call(member, function (item) {
+                return item.name;
+              }).join(","),
+              customtype: "chat_group",
+              headimgurl: result1.data.data.headimgurl,
+              memberids: _mapInstanceProperty(member).call(member, function (item) {
+                return item.userid;
+              })
+            };
+            _context2.next = 6;
+            return http.post("/capi/account/imchannel/save", data);
+          case 6:
+            result2 = _context2.sent;
+            if ((_result2$data = result2.data) !== null && _result2$data !== void 0 && (_result2$data = _result2$data.data) !== null && _result2$data !== void 0 && _result2$data.sendbirdid) {
+              onClose && onClose();
+            }
+          case 8:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+    return function handleCreateGroup() {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+  var handleDebounceCreateGroup = useDebounceCallback(handleCreateGroup, 500);
+  useEffect(function () {
+    handleGetFrindList();
+  }, []);
+  useImperativeHandle(ref, function () {
+    return {
+      handleDebounceCreateGroup: handleDebounceCreateGroup,
+      clear: function clear() {
+        setMember([]);
+      }
+    };
+  }, [handleDebounceCreateGroup]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "yuze-createGroup px-4",
+    style: style
+  }, /*#__PURE__*/React.createElement(Input, {
+    className: "my-3",
+    onChange: function onChange(e) {
+      handleDebounceGetFrindList(e.target.value);
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    className: classNames("text-bse text-[var(--im-main-fontColor)]", {
+      "pb-3": member.length > 0
+    })
+  }, "Select: ", member.length), member.length > 0 && /*#__PURE__*/React.createElement("div", {
+    className: "overflow-auto pb-3 yuze-createGroup-scroll"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "flex flex-row items-center gap-4"
+  }, _mapInstanceProperty(member).call(member, function (item) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "yuze-createGroup-right-list-member relative shrink-0",
+      key: item.id,
+      onClick: function onClick() {
+        var filterMember = _filterInstanceProperty(member).call(member, function (child) {
+          return child.id !== item.id;
+        });
+        setMember(filterMember);
+      }
+    }, /*#__PURE__*/React.createElement(Avatar, {
+      src: item.headimgurl
+    }), /*#__PURE__*/React.createElement("div", {
+      className: "yuze-createGroup-right-list-member-close absolute"
+    }, /*#__PURE__*/React.createElement("img", {
+      src: img
+    })));
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "yuze-createGroup-list w-full overflow-auto"
+  }, _mapInstanceProperty(list).call(list, function (item) {
+    return /*#__PURE__*/React.createElement(TypeItem, {
+      isSelectable: true,
+      name: item.name,
+      isChecked: !!_findInstanceProperty(member).call(member, function (child) {
+        return child.id === item.id;
+      }),
+      key: item.id,
+      avatar: item.headimgurl,
+      onSelected: function onSelected() {
+        var _context3;
+        setMember(_concatInstanceProperty(_context3 = []).call(_context3, _toConsumableArray(member), [item]));
+      },
+      onCancel: function onCancel() {
+        var filterMember = _filterInstanceProperty(member).call(member, function (child) {
+          return child.id !== item.id;
+        });
+        setMember(filterMember);
+      }
+    });
+  })));
+});
+MobileCreateGroup.displayName = "MobileCreateGroup";
+
+export { MobileCreateGroup as default };

package/es/Sidebar/MobileCreateGroup/style/index.scss

@@ -0,0 +1,14 @@
+.yuze-createGroup {
+    height: 100%;
+ &-list{
+    height: calc(100% - 60px);
+    &::-webkit-scrollbar {
+      display: none;
+    }
+ }
+ &-scroll{
+    &::-webkit-scrollbar{
+        display: none;
+    }
+ }
+}

package/es/Sidebar/Searchbox/image/ic_messages.svg.js

@@ -0,0 +1,3 @@
+var img = "data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M6.45455 18L2 22V3C2 2.44772 2.44772 2 3 2H21C21.5523 2 22 2.44772 22 3V17C22 17.5523 21.5523 18 21 18H6.45455ZM5.76282 16H20V4H4V17.3851L5.76282 16ZM11 9H13V11H11V9ZM7 9H9V11H7V9ZM15 9H17V11H15V9Z' fill='white' fill-opacity='0.4'/%3e%3c/svg%3e";
+
+export { img as default };

package/es/Sidebar/Searchbox/index.d.ts

@@ -0,0 +1,31 @@
+import React from "react";
+import "./style/index.scss";
+export interface ISearchbox {
+    name?: string;
+    style?: React.CSSProperties;
+}
+export interface IUserData {
+    walletaddress: string;
+    headimgurl: string;
+    nickname: string;
+    name: string;
+    id: string;
+    type: number;
+    userid: string;
+    username: string;
+    certification: number;
+    status: number;
+}
+export interface IGroupData {
+    ownername: string;
+    members: number;
+    headimgurl: string;
+    name: string;
+    sendbirdid: string;
+    id: string;
+    type: 1;
+    userid: string;
+    groupcode: number;
+}
+declare const Searchbox: React.FC<ISearchbox>;
+export default Searchbox;