npm - @cloudflare/realtimekit-ui - Versions diffs - 1.1.0-staging.11 → 1.1.0-staging.12 - Mend

@cloudflare/realtimekit-ui 1.1.0-staging.11 → 1.1.0-staging.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (726) hide show

package/dist/components/{p-ac80e7fc.js → p-54e0acc1.js} RENAMED Viewed

@@ -1,31 +1,33 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
-import { c as createDefaultConfig, e as defaultIconPack, i as useLanguage, f as defaultOverrides, L as FlagsmithFeatureFlags } from './p-dc9dde66.js';
-import { h as handleFilesDataTransfer, g as generateChatGroupKey, p as parseMessageForTarget } from './p-addb4be5.js';
-import { c as chatUnreadTimestamps } from './p-a83ccdbd.js';
-import { S as SyncWithStore } from './p-9c3c75a9.js';
-import { d as defineCustomElement$l } from './p-cec4d080.js';
-import { d as defineCustomElement$k } from './p-1391bef0.js';
-import { d as defineCustomElement$j } from './p-97d1dcb7.js';
-import { d as defineCustomElement$i } from './p-770c0fd7.js';
-import { d as defineCustomElement$h } from './p-1ea0d406.js';
-import { d as defineCustomElement$g } from './p-3245ace2.js';
-import { d as defineCustomElement$f } from './p-24481cb4.js';
-import { d as defineCustomElement$e } from './p-52e95364.js';
-import { d as defineCustomElement$d } from './p-777aa628.js';
-import { d as defineCustomElement$c } from './p-73baf5ba.js';
-import { d as defineCustomElement$b } from './p-f5101af9.js';
-import { d as defineCustomElement$a } from './p-8222af8c.js';
-import { d as defineCustomElement$9 } from './p-951a67af.js';
-import { d as defineCustomElement$8 } from './p-7e6ca4af.js';
-import { d as defineCustomElement$7 } from './p-fe648db5.js';
-import { d as defineCustomElement$6 } from './p-d3414935.js';
-import { d as defineCustomElement$5 } from './p-33db910f.js';
-import { d as defineCustomElement$4 } from './p-19d83dd6.js';
-import { d as defineCustomElement$3 } from './p-2ec120cd.js';
-import { d as defineCustomElement$2 } from './p-a6aea524.js';
-import { d as defineCustomElement$1 } from './p-63c79efa.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-fdad14c9.js';
+import { c as createDefaultConfig, e as defaultIconPack, i as useLanguage, f as defaultOverrides } from './p-f19b4abc.js';
+import { h as handleFilesDataTransfer } from './p-0db812c2.js';
+import { S as SyncWithStore } from './p-e334e15c.js';
+import { d as defineCustomElement$o } from './p-c9db1b82.js';
+import { d as defineCustomElement$n } from './p-e229128b.js';
+import { d as defineCustomElement$m } from './p-469f4396.js';
+import { d as defineCustomElement$l } from './p-321a4aef.js';
+import { d as defineCustomElement$k } from './p-db5556c3.js';
+import { d as defineCustomElement$j } from './p-7fcbd2dd.js';
+import { d as defineCustomElement$i } from './p-e0ef3893.js';
+import { d as defineCustomElement$h } from './p-d029dd2f.js';
+import { d as defineCustomElement$g } from './p-9e1478a0.js';
+import { d as defineCustomElement$f } from './p-154bed23.js';
+import { d as defineCustomElement$e } from './p-06de876f.js';
+import { d as defineCustomElement$d } from './p-a3cc7425.js';
+import { d as defineCustomElement$c } from './p-7384c20c.js';
+import { d as defineCustomElement$b } from './p-90420dc5.js';
+import { d as defineCustomElement$a } from './p-e7b7abfe.js';
+import { d as defineCustomElement$9 } from './p-cd6f04ae.js';
+import { d as defineCustomElement$8 } from './p-8a66a347.js';
+import { d as defineCustomElement$7 } from './p-862ec1f9.js';
+import { d as defineCustomElement$6 } from './p-793f074d.js';
+import { d as defineCustomElement$5 } from './p-d9fa18db.js';
+import { d as defineCustomElement$4 } from './p-dfdbb665.js';
+import { d as defineCustomElement$3 } from './p-7adb3504.js';
+import { d as defineCustomElement$2 } from './p-f5aecaad.js';
+import { d as defineCustomElement$1 } from './p-15156a2c.js';
-const rtkChatCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}.scrollbar{scrollbar-width:thin;scrollbar-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))\n    var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar{height:var(--rtk-space-1\\.5, 6px);width:var(--rtk-space-1\\.5, 6px);border-radius:9999px;background-color:var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar-thumb{border-radius:9999px;background-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))}:host{display:flex;height:100%;width:100%;flex-direction:column;font-size:14px;position:relative;color:rgb(var(--rtk-colors-text-1000, 255 255 255))}h3{margin:var(--rtk-space-0, 0px);display:flex;height:var(--rtk-space-12, 48px);align-items:center;justify-content:center;font-size:16px;font-weight:400;color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));text-align:center}#dropzone{position:absolute;top:var(--rtk-space-0, 0px);right:var(--rtk-space-0, 0px);bottom:var(--rtk-space-0, 0px);left:var(--rtk-space-0, 0px);z-index:10;display:none;flex-direction:column;align-items:center;justify-content:center;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-700, 255 255 255 / 0.64))}#dropzone.active{display:flex;animation:0.2s slide-up ease-in}rtk-chat-messages-ui,rtk-chat-messages-ui-paginated{flex:1 0 0}rtk-chat-composer-view{margin:var(--rtk-space-2, 8px)}.chat-container{display:flex;height:100%;width:100%;flex-direction:row;container-type:size;container-name:chatcontainer}.chat{display:flex;flex:1 1 0%;flex-direction:column}.banner{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.view-chats-btn{margin-top:var(--rtk-space-4, 16px)}.selector-container{z-index:50;width:100%;max-width:var(--rtk-space-80, 320px);border-right:var(--rtk-border-width-sm, 1px) solid rgb(var(--rtk-colors-background-600, 60 60 60))}.selector-container.hide{display:none}.mobile-close-btn{display:none}.selector-container.mobile{height:100%;width:100%;max-width:100%;position:absolute;top:var(--rtk-space-0, 0px);right:var(--rtk-space-0, 0px);bottom:var(--rtk-space-0, 0px);left:var(--rtk-space-0, 0px);background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / 0.6);display:flex}.selector-container.mobile .mobile-close-btn{margin-top:var(--rtk-space-4, 16px);margin-bottom:var(--rtk-space-4, 16px);margin-left:var(--rtk-space-6, 24px);margin-right:var(--rtk-space-6, 24px);display:block}.pinned-messages{position:relative;display:flex;flex-direction:column}.pinned-messages-header{display:flex;align-items:center;justify-content:space-between;gap:var(--rtk-space-2, 8px);padding:var(--rtk-space-4, 16px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity));font-size:14px;cursor:pointer}.pinned-messages-header div{display:flex;flex-direction:row;align-items:center;gap:var(--rtk-space-2, 8px)}.pinned-messages-header rtk-icon{height:var(--rtk-space-3, 12px);width:var(--rtk-space-3, 12px)}.pinned-messages-content{--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity));position:absolute;left:var(--rtk-space-0, 0px);top:100%;z-index:50;max-height:30vh;width:100%;overflow:auto}.pinned-message{display:flex;cursor:pointer;flex-direction:row;align-items:center;gap:var(--rtk-space-2, 8px);--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-border-opacity));padding:var(--rtk-space-4, 16px);border-bottom-width:var(--rtk-border-width-sm, 1px);border-right-width:var(--rtk-border-width-none, 0);border-left-width:var(--rtk-border-width-none, 0);border-top-width:var(--rtk-border-width-none, 0);border-style:solid}.pinned-message-avatar{height:var(--rtk-space-6, 24px) !important;width:var(--rtk-space-6, 24px) !important}@keyframes swipe-in{from{transform:translateX(-100%)}to{transform:translateX(0)}}";
+const rtkChatCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}.scrollbar{scrollbar-width:thin;scrollbar-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))\n    var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar{height:var(--rtk-space-1\\.5, 6px);width:var(--rtk-space-1\\.5, 6px);border-radius:9999px;background-color:var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar-thumb{border-radius:9999px;background-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))}:host{display:flex;height:100%;width:100%;flex-direction:column;font-size:14px;position:relative;box-sizing:border-box;color:rgb(var(--rtk-colors-text-1000, 255 255 255))}h3{margin:var(--rtk-space-0, 0px);display:flex;height:var(--rtk-space-12, 48px);align-items:center;justify-content:center;font-size:16px;font-weight:400;color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));text-align:center}#dropzone{position:absolute;top:var(--rtk-space-0, 0px);right:var(--rtk-space-0, 0px);bottom:var(--rtk-space-0, 0px);left:var(--rtk-space-0, 0px);z-index:10;display:none;flex-direction:column;align-items:center;justify-content:center;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-700, 255 255 255 / 0.64))}#dropzone.active{display:flex;animation:0.2s slide-up ease-in}rtk-chat-messages-ui,rtk-chat-messages-ui-paginated{flex:1 0 0}rtk-chat-composer-view{margin:var(--rtk-space-2, 8px)}.chat-container{display:flex;height:100%;width:100%;flex-direction:row;container-type:size;container-name:chatcontainer}.chat{box-sizing:border-box;display:flex;flex:1 1 0%;flex-direction:column}.banner{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.view-chats-btn{margin-top:var(--rtk-space-4, 16px)}.selector-container{z-index:50;width:100%;max-width:var(--rtk-space-80, 320px);border-right:var(--rtk-border-width-sm, 1px) solid rgb(var(--rtk-colors-background-600, 60 60 60))}.selector-container.hide{display:none}.mobile-close-btn{display:none}.selector-container.mobile{height:100%;width:100%;max-width:100%;position:absolute;top:var(--rtk-space-0, 0px);right:var(--rtk-space-0, 0px);bottom:var(--rtk-space-0, 0px);left:var(--rtk-space-0, 0px);background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / 0.6);display:flex}.selector-container.mobile .mobile-close-btn{margin-top:var(--rtk-space-4, 16px);margin-bottom:var(--rtk-space-4, 16px);margin-left:var(--rtk-space-6, 24px);margin-right:var(--rtk-space-6, 24px);display:block}.pinned-messages{position:relative;display:flex;flex-direction:column}.pinned-messages-header{display:flex;align-items:center;justify-content:space-between;gap:var(--rtk-space-2, 8px);padding:var(--rtk-space-4, 16px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity));font-size:14px;cursor:pointer}.pinned-messages-header div{display:flex;flex-direction:row;align-items:center;gap:var(--rtk-space-2, 8px)}.pinned-messages-header rtk-icon{height:var(--rtk-space-3, 12px);width:var(--rtk-space-3, 12px)}.pinned-messages-content{--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity));position:absolute;left:var(--rtk-space-0, 0px);top:100%;z-index:50;max-height:30vh;width:100%;overflow:auto}.pinned-message{display:flex;cursor:pointer;flex-direction:row;align-items:center;gap:var(--rtk-space-2, 8px);--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-border-opacity));padding:var(--rtk-space-4, 16px);border-bottom-width:var(--rtk-border-width-sm, 1px);border-right-width:var(--rtk-border-width-none, 0);border-left-width:var(--rtk-border-width-none, 0);border-top-width:var(--rtk-border-width-none, 0);border-style:solid}.pinned-message-avatar{height:var(--rtk-space-6, 24px) !important;width:var(--rtk-space-6, 24px) !important}@keyframes swipe-in{from{transform:translateX(-100%)}to{transform:translateX(0)}}";
 const RtkChatStyle0 = rtkChatCss;
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -44,13 +46,6 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
         this.__registerHost();
         this.__attachShadow();
         this.stateUpdate = createEvent(this, "rtkStateUpdate", 7);
-        this.chatUpdateListener = ({ message }) => {
-            if (!this.displayFilter || this.displayFilter(message)) {
-                this.addToChatGroup(message);
-                // shallow copy to trigger render
-                this.chatGroups = Object.assign({}, this.chatGroups);
-            }
-        };
         this.chatPermissionUpdateListener = () => {
             this.canSend = this.meeting.self.permissions.chatPublic.canSend;
             this.canSendTextMessage = this.meeting.self.permissions.chatPublic.text;
@@ -64,25 +59,8 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
         this.t = useLanguage();
         /** UI Overrides */
         this.overrides = defaultOverrides;
-        /** disables private chat */
-        this.disablePrivateChat = false;
         /** Can current user pin/unpin messages */
         this.canPinMessages = false;
-        /**
-         * @deprecated
-         * Beta API, will change in future
-         * List of target presets allowed as private chat recipient
-         */
-        this.privatePresetFilter = [];
-        /**
-         * @deprecated
-         * Beta API, will change in future
-         * A filter function for messages to be displayed
-         */
-        this.displayFilter = undefined;
-        this.unreadCountGroups = {};
-        this.chatGroups = { everyone: [] };
-        this.selectedGroup = 'everyone';
         this.now = new Date();
         this.dropzoneActivated = false;
         this.showLatestMessageButton = false;
@@ -93,7 +71,6 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
         this.canSendPrivateTexts = false;
         this.canSendPrivateFiles = false;
         this.emojiPickerEnabled = false;
-        this.chatRecipientId = 'everyone';
         this.participants = [];
         this.editingMessage = null;
         this.replyMessage = null;
@@ -128,32 +105,10 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
             });
         };
         this.disconnectMeeting = (meeting) => {
-            var _a;
-            if (this.isPrivateChatSupported()) {
-                meeting === null || meeting === void 0 ? void 0 : meeting.participants.joined.removeListener('participantJoined', this.onParticipantUpdate);
-                meeting === null || meeting === void 0 ? void 0 : meeting.participants.joined.removeListener('participantLeft', this.onParticipantUpdate);
-            }
-            (_a = meeting === null || meeting === void 0 ? void 0 : meeting.chat) === null || _a === void 0 ? void 0 : _a.removeListener('chatUpdate', this.chatUpdateListener);
             meeting.self.permissions.removeListener('*', this.chatPermissionUpdateListener);
         };
-        this.onParticipantUpdate = () => {
-            this.participants = this.meeting.participants.joined
-                .toArray()
-                .filter((p) => this.privatePresetFilter.length === 0 || this.privatePresetFilter.includes(p.presetName));
-            // if selected participant leaves, reset state to everyone
-            if (this.selectedParticipant && !this.participants.includes(this.selectedParticipant)) {
-                this.selectedParticipant = null;
-                this.chatRecipientId = this.selectedGroup = 'everyone';
-            }
-        };
-        this.updateUnreadCountGroups = (obj) => {
-            this.unreadCountGroups = Object.assign(Object.assign({}, this.unreadCountGroups), obj);
-        };
-        this.isPrivateChatSupported = () => {
-            return this.canPrivateMessage && !this.disablePrivateChat;
-        };
         this.isTextMessagingAllowed = () => {
-            if (this.chatRecipientId === 'everyone') {
+            if (!this.selectedParticipant) {
                 // public chat
                 return this.canSend && this.canSendTextMessage;
             }
@@ -161,7 +116,7 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
             return this.canPrivateMessage && this.canSendPrivateTexts;
         };
         this.isFileMessagingAllowed = () => {
-            if (this.chatRecipientId === 'everyone') {
+            if (!this.selectedParticipant) {
                 // public chat
                 return this.canSend && this.canSendFiles;
             }
@@ -234,26 +189,6 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
             this.replyMessage = null;
             this.editingMessage = message;
         };
-        this.getPinnedMessageLabel = (message) => {
-            if (message.type === 'text')
-                return message.message;
-            if (message.type === 'image')
-                return 'Image';
-            if (message.type === 'file')
-                return 'File';
-            return '';
-        };
-        this.renderPinnedMessagesHeader = () => {
-            if (this.meeting.chat.pinned.length === 0)
-                return null;
-            /**
-             * We do not display a picture against the avatar because the chatMessage API does not provide it.
-             */
-            return (h("div", { class: "pinned-messages" }, h("div", { class: "pinned-messages-header", onClick: () => (this.showPinnedMessages = !this.showPinnedMessages) }, h("div", null, h("rtk-icon", { icon: this.iconPack.pin, size: "sm" }), this.t('chat.pinned_msgs'), ` (${this.meeting.chat.pinned.length})`), h("rtk-icon", { icon: this.showPinnedMessages ? this.iconPack.chevron_up : this.iconPack.chevron_down, size: "sm" })), this.showPinnedMessages && (h("div", { class: "pinned-messages-content scrollbar" }, this.meeting.chat.pinned.map((message) => {
-                const label = this.getPinnedMessageLabel(message);
-                return (h("div", { class: "pinned-message" }, h("rtk-avatar", { class: "pinned-message-avatar", participant: { name: message.displayName, picture: '' }, size: "sm" }), h("span", null, label.length > 20 ? `${label.substring(0, 20)}...` : label)));
-            })))));
-        };
     }
     connectedCallback() {
         if (!this.meeting)
@@ -276,6 +211,16 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
             this.editingMessage = event.detail.payload;
         }
     }
+    onChatSelectorChange(event) {
+        var _a;
+        const selectedUser = (_a = event.detail) === null || _a === void 0 ? void 0 : _a.selectedUser;
+        // Everyone
+        if (!selectedUser) {
+            this.selectedParticipant = null;
+            return;
+        }
+        this.selectedParticipant = selectedUser;
+    }
     disconnectedCallback() {
         var _a;
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
@@ -285,7 +230,7 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
         this.host.removeEventListener('drop', this.onDrop);
     }
     meetingChanged(meeting, oldMeeting) {
-        var _a, _b, _c, _d, _e, _f;
+        var _a, _b, _c, _d;
         if (oldMeeting != undefined)
             this.disconnectMeeting(oldMeeting);
         if (meeting && !meeting.chat)
@@ -298,93 +243,16 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
                 ((_b = meeting.self.permissions.chatPrivate) === null || _b === void 0 ? void 0 : _b.canReceive));
             this.canSendPrivateTexts = !!((_c = meeting.self.permissions.chatPrivate) === null || _c === void 0 ? void 0 : _c.text);
             this.canSendPrivateFiles = !!((_d = meeting.self.permissions.chatPrivate) === null || _d === void 0 ? void 0 : _d.files);
-            this.canPinMessages =
-                ((_e = meeting === null || meeting === void 0 ? void 0 : meeting.__internals__) === null || _e === void 0 ? void 0 : _e.features.hasFeature(FlagsmithFeatureFlags.PINNED_MESSAGES)) &&
-                    meeting.self.permissions.pinParticipant;
-            this.initializeChatGroups();
-            // shallow copy to trigger render
-            this.chatGroups = Object.assign({}, this.chatGroups);
             meeting.self.permissions.on('*', this.chatPermissionUpdateListener);
-            this.onParticipantUpdate();
-            (_f = meeting.chat) === null || _f === void 0 ? void 0 : _f.addListener('chatUpdate', this.chatUpdateListener);
-            if (this.isPrivateChatSupported()) {
-                meeting.participants.joined.addListener('participantJoined', this.onParticipantUpdate);
-                meeting.participants.joined.addListener('participantLeft', this.onParticipantUpdate);
-            }
-        }
-    }
-    chatGroupsChanged(chatGroups) {
-        var _a, _b;
-        if (!this.isPrivateChatSupported()) {
-            return;
         }
-        const unreadCounts = {};
-        for (const key in chatGroups) {
-            const lastReadTimestamp = (_a = chatUnreadTimestamps[key]) !== null && _a !== void 0 ? _a : 0;
-            unreadCounts[key] = chatGroups[key].filter((c) => c.type == 'chat' &&
-                c.message.time > lastReadTimestamp &&
-                c.message.userId !== this.meeting.self.userId).length;
-            if (key ===
-                generateChatGroupKey([this.meeting.self.userId, (_b = this.selectedParticipant) === null || _b === void 0 ? void 0 : _b.userId]) ||
-                (key === 'everyone' && this.selectedParticipant === null)) {
-                unreadCounts[key] = 0;
-                chatUnreadTimestamps[key] = new Date();
-            }
-        }
-        this.updateUnreadCountGroups(unreadCounts);
-    }
-    initializeChatGroups() {
-        var _a;
-        (_a = this.meeting.chat) === null || _a === void 0 ? void 0 : _a.messages.forEach((message) => {
-            if (!this.displayFilter || this.displayFilter(message)) {
-                this.addToChatGroup(message);
-            }
-        });
-    }
-    onDisplayFilterChanged(newFilter, oldFilter) {
-        if (newFilter !== oldFilter) {
-            this.chatGroups = {};
-            this.initializeChatGroups();
-        }
-    }
-    addToChatGroup(message) {
-        var _a;
-        const parsedMessage = parseMessageForTarget(message);
-        let key = 'everyone';
-        if (((_a = parsedMessage.targetUserIds) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-            const allParticipants = new Set([
-                parsedMessage.userId,
-                ...parsedMessage.targetUserIds,
-            ]);
-            key = generateChatGroupKey(Array.from(allParticipants));
-        }
-        if (this.chatGroups[key] === undefined)
-            this.chatGroups[key] = [];
-        let isEditedMessage = false;
-        let messages = [];
-        this.chatGroups[key].forEach((chat) => {
-            if (chat.type === 'chat' && chat.message.id === message.id) {
-                isEditedMessage = true;
-                messages.push({ type: 'chat', message: parsedMessage });
-            }
-            else {
-                messages.push(chat);
-            }
-        });
-        if (!isEditedMessage) {
-            messages.push({ type: 'chat', message: parsedMessage });
-        }
-        this.chatGroups[key] = messages;
     }
     getRecipientPeerIds() {
-        let peerIds = [];
-        if (this.chatRecipientId !== 'everyone') {
-            peerIds = [this.selectedParticipant.id];
-        }
-        return peerIds;
+        if (!this.selectedParticipant)
+            return [];
+        return [this.selectedParticipant.id];
     }
     renderComposerUI() {
-        if (this.chatRecipientId === 'everyone') {
+        if (!this.selectedParticipant) {
             if (!this.canSendTextMessage && !this.canSendFiles)
                 return null;
         }
@@ -406,13 +274,11 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
         if (!this.meeting) {
             return null;
         }
-        return (h(Host, null, h("div", { class: "chat-container" }, h("div", { class: "chat" }, this.isFileMessagingAllowed() && (h("div", { id: "dropzone", class: { active: this.dropzoneActivated }, part: "dropzone" }, h("rtk-icon", { icon: this.iconPack.attach }), h("p", null, this.t('chat.send_attachment')))), this.renderPinnedMessagesHeader(), h("rtk-chat-messages-ui-paginated", { meeting: this.meeting, onPinMessage: this.onPinMessage, onEditMessage: this.onMessageEdit, onDeleteMessage: this.onDeleteMessage, size: this.size, iconPack: this.iconPack, t: this.t }), this.renderComposerUI()))));
+        return (h(Host, null, h("div", { class: "chat-container" }, h("div", { class: "chat" }, this.isFileMessagingAllowed() && (h("div", { id: "dropzone", class: { active: this.dropzoneActivated }, part: "dropzone" }, h("rtk-icon", { icon: this.iconPack.attach }), h("p", null, this.t('chat.send_attachment')))), h("rtk-chat-header", null), h("rtk-chat-messages-ui-paginated", { meeting: this.meeting, privateChatRecipient: this.selectedParticipant, onPinMessage: this.onPinMessage, onEditMessage: this.onMessageEdit, onDeleteMessage: this.onDeleteMessage, size: this.size, iconPack: this.iconPack, t: this.t }), this.renderComposerUI()))));
     }
     get host() { return this; }
     static get watchers() { return {
-        "meeting": ["meetingChanged"],
-        "chatGroups": ["chatGroupsChanged"],
-        "displayFilter": ["onDisplayFilterChanged"]
+        "meeting": ["meetingChanged"]
     }; }
     static get style() { return RtkChatStyle0; }
 }, [1, "rtk-chat", {
@@ -422,13 +288,7 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
         "iconPack": [16],
         "t": [16],
         "overrides": [16],
-        "disablePrivateChat": [4, "disable-private-chat"],
-        "privatePresetFilter": [16],
-        "displayFilter": [16],
         "canPinMessages": [32],
-        "unreadCountGroups": [32],
-        "chatGroups": [32],
-        "selectedGroup": [32],
         "now": [32],
         "dropzoneActivated": [32],
         "showLatestMessageButton": [32],
@@ -439,7 +299,6 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
         "canSendPrivateTexts": [32],
         "canSendPrivateFiles": [32],
         "emojiPickerEnabled": [32],
-        "chatRecipientId": [32],
         "participants": [32],
         "selectedParticipant": [32],
         "editingMessage": [32],
@@ -448,10 +307,8 @@ const RtkChat = /*@__PURE__*/ proxyCustomElement(class RtkChat extends H {
         "selectorState": [32],
         "isSendingMessage": [32],
         "showPinnedMessages": [32]
-    }, [[8, "editMessageInit", "onEditMessageInit"]], {
-        "meeting": ["meetingChanged"],
-        "chatGroups": ["chatGroupsChanged"],
-        "displayFilter": ["onDisplayFilterChanged"]
+    }, [[8, "editMessageInit", "onEditMessageInit"], [0, "rtkChatSelectorChange", "onChatSelectorChange"]], {
+        "meeting": ["meetingChanged"]
     }]);
 __decorate([
     SyncWithStore()
@@ -472,7 +329,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["rtk-chat", "rtk-avatar", "rtk-button", "rtk-chat-composer-view", "rtk-chat-messages-ui-paginated", "rtk-draft-attachment-view", "rtk-emoji-picker", "rtk-emoji-picker-button", "rtk-file-message-view", "rtk-file-picker-button", "rtk-icon", "rtk-image-message-view", "rtk-markdown-view", "rtk-menu", "rtk-menu-item", "rtk-menu-list", "rtk-message-view", "rtk-paginated-list", "rtk-spinner", "rtk-text-composer-view", "rtk-text-message-view", "rtk-tooltip"];
+    const components = ["rtk-chat", "rtk-avatar", "rtk-button", "rtk-chat-composer-view", "rtk-chat-header", "rtk-chat-messages-ui-paginated", "rtk-chat-selector", "rtk-draft-attachment-view", "rtk-emoji-picker", "rtk-emoji-picker-button", "rtk-file-message-view", "rtk-file-picker-button", "rtk-icon", "rtk-image-message-view", "rtk-markdown-view", "rtk-menu", "rtk-menu-item", "rtk-menu-list", "rtk-message-view", "rtk-paginated-list", "rtk-pinned-message-selector", "rtk-spinner", "rtk-text-composer-view", "rtk-text-message-view", "rtk-tooltip"];
     components.forEach(tagName => { switch (tagName) {
         case "rtk-chat":
             if (!customElements.get(tagName)) {
@@ -481,85 +338,100 @@ function defineCustomElement() {
             break;
         case "rtk-avatar":
             if (!customElements.get(tagName)) {
-                defineCustomElement$l();
+                defineCustomElement$o();
             }
             break;
         case "rtk-button":
             if (!customElements.get(tagName)) {
-                defineCustomElement$k();
+                defineCustomElement$n();
             }
             break;
         case "rtk-chat-composer-view":
             if (!customElements.get(tagName)) {
-                defineCustomElement$j();
+                defineCustomElement$m();
+            }
+            break;
+        case "rtk-chat-header":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$l();
             }
             break;
         case "rtk-chat-messages-ui-paginated":
             if (!customElements.get(tagName)) {
-                defineCustomElement$i();
+                defineCustomElement$k();
+            }
+            break;
+        case "rtk-chat-selector":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$j();
             }
             break;
         case "rtk-draft-attachment-view":
             if (!customElements.get(tagName)) {
-                defineCustomElement$h();
+                defineCustomElement$i();
             }
             break;
         case "rtk-emoji-picker":
             if (!customElements.get(tagName)) {
-                defineCustomElement$g();
+                defineCustomElement$h();
             }
             break;
         case "rtk-emoji-picker-button":
             if (!customElements.get(tagName)) {
-                defineCustomElement$f();
+                defineCustomElement$g();
             }
             break;
         case "rtk-file-message-view":
             if (!customElements.get(tagName)) {
-                defineCustomElement$e();
+                defineCustomElement$f();
             }
             break;
         case "rtk-file-picker-button":
             if (!customElements.get(tagName)) {
-                defineCustomElement$d();
+                defineCustomElement$e();
             }
             break;
         case "rtk-icon":
             if (!customElements.get(tagName)) {
-                defineCustomElement$c();
+                defineCustomElement$d();
             }
             break;
         case "rtk-image-message-view":
             if (!customElements.get(tagName)) {
-                defineCustomElement$b();
+                defineCustomElement$c();
             }
             break;
         case "rtk-markdown-view":
             if (!customElements.get(tagName)) {
-                defineCustomElement$a();
+                defineCustomElement$b();
             }
             break;
         case "rtk-menu":
             if (!customElements.get(tagName)) {
-                defineCustomElement$9();
+                defineCustomElement$a();
             }
             break;
         case "rtk-menu-item":
             if (!customElements.get(tagName)) {
-                defineCustomElement$8();
+                defineCustomElement$9();
             }
             break;
         case "rtk-menu-list":
             if (!customElements.get(tagName)) {
-                defineCustomElement$7();
+                defineCustomElement$8();
             }
             break;
         case "rtk-message-view":
             if (!customElements.get(tagName)) {
-                defineCustomElement$6();
+                defineCustomElement$7();
             }
             break;
         case "rtk-paginated-list":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "rtk-pinned-message-selector":
             if (!customElements.get(tagName)) {
                 defineCustomElement$5();
             }

package/dist/components/{p-a72d3d19.js → p-583f9282.js} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { j as defineProperty, k as isArrayLike, l as isIndex, m as eq, n as getPrototype, o as baseAssignValue, p as copyObject, q as keysIn, r as isArray, s as isBuffer, t as isTypedArray, v as copyArray, w as cloneBuffer, x as cloneTypedArray, y as isArguments, z as isFunction, A as initCloneObject, S as Stack } from './p-dc9dde66.js';
+import { j as defineProperty, k as isArrayLike, l as isIndex, m as eq, n as getPrototype, o as baseAssignValue, p as copyObject, q as keysIn, r as isArray, s as isBuffer, t as isTypedArray, v as copyArray, w as cloneBuffer, x as cloneTypedArray, y as isArguments, z as isFunction, A as initCloneObject, S as Stack } from './p-f19b4abc.js';
 import { i as isObject, a as isObjectLike, b as baseGetTag } from './p-632cbbe7.js';
 const spacingScale = [

package/dist/components/{p-7f790526.js → p-6ac87493.js} RENAMED Viewed

@@ -1,10 +1,10 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
-import { e as defaultIconPack, i as useLanguage } from './p-dc9dde66.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-fdad14c9.js';
+import { e as defaultIconPack, i as useLanguage } from './p-f19b4abc.js';
 import { i as isFullScreenEnabled, r as requestFullScreen, e as exitFullSreen, a as isFullScreenSupported } from './p-02f19345.js';
-import { S as SyncWithStore } from './p-9c3c75a9.js';
-import { d as defineCustomElement$3 } from './p-206acdcd.js';
-import { d as defineCustomElement$2 } from './p-73baf5ba.js';
-import { d as defineCustomElement$1 } from './p-19d83dd6.js';
+import { S as SyncWithStore } from './p-e334e15c.js';
+import { d as defineCustomElement$3 } from './p-dd8a892e.js';
+import { d as defineCustomElement$2 } from './p-a3cc7425.js';
+import { d as defineCustomElement$1 } from './p-dfdbb665.js';
 const rtkFullscreenToggleCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:block}:host([data-hidden]){display:none}";
 const RtkFullscreenToggleStyle0 = rtkFullscreenToggleCss;

package/dist/components/{p-bbffc0e1.js → p-6e373d96.js} RENAMED Viewed

@@ -1,8 +1,8 @@
-import { p as proxyCustomElement, H, h, e as Host } from './p-c3592601.js';
-import { i as useLanguage, e as defaultIconPack, N as showLivestream } from './p-dc9dde66.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-fdad14c9.js';
+import { i as useLanguage, e as defaultIconPack, M as showLivestream } from './p-f19b4abc.js';
 import './p-a83ccdbd.js';
-import { S as SyncWithStore } from './p-9c3c75a9.js';
-import { d as defineCustomElement$1 } from './p-73baf5ba.js';
+import { S as SyncWithStore } from './p-e334e15c.js';
+import { d as defineCustomElement$1 } from './p-a3cc7425.js';
 const rtkLivestreamIndicatorCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{margin-left:var(--rtk-space-2, 8px);margin-right:var(--rtk-space-2, 8px);display:flex}:host([data-hidden]){display:none}:host[size='sm']{margin-left:var(--rtk-space-1, 4px);margin-right:var(--rtk-space-1, 4px)}.indicator{display:flex;flex-direction:row;align-items:center;font-size:14px;--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}rtk-icon{margin-right:var(--rtk-space-1, 4px);height:var(--rtk-space-5, 20px);width:var(--rtk-space-5, 20px);animation:blink 4s linear infinite}:host([size='sm']) rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px)}:host([size='sm']) .indicator span{display:none}@keyframes blink{0%,10%{opacity:0}11%,100%{opacity:1}}";
 const RtkLivestreamIndicatorStyle0 = rtkLivestreamIndicatorCss;

package/dist/components/{p-56134994.js → p-707dced6.js} RENAMED Viewed

@@ -1,5 +1,5 @@
-import { h } from './p-c3592601.js';
-import { M as MAX_TEXT_LENGTH, e as extractReplyBlock, s as stripOutReplyBlock, d as parseRichText } from './p-addb4be5.js';
+import { h } from './p-fdad14c9.js';
+import { M as MAX_TEXT_LENGTH, e as extractReplyBlock, s as stripOutReplyBlock, p as parseRichText } from './p-0db812c2.js';
 const renderLink = (content) => {
     return (h("a", { class: "link", href: content, target: "_blank", rel: "noopener noreferrer" }, content));

package/dist/components/{p-b92c53c7.js → p-71fb663b.js} RENAMED Viewed

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, w as writeTask, h, e as Host } from './p-c3592601.js';
-import { e as defaultIconPack, i as useLanguage, D as disableSettingSinkId } from './p-dc9dde66.js';
-import { S as SyncWithStore } from './p-9c3c75a9.js';
-import { d as defineCustomElement$1 } from './p-73baf5ba.js';
+import { p as proxyCustomElement, H, w as writeTask, h, d as Host } from './p-fdad14c9.js';
+import { e as defaultIconPack, i as useLanguage, D as disableSettingSinkId } from './p-f19b4abc.js';
+import { S as SyncWithStore } from './p-e334e15c.js';
+import { d as defineCustomElement$1 } from './p-a3cc7425.js';
 const rtkMicrophoneSelectorCss = ".rtk-select{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-1000, 255 255 255))}.rtk-select: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(0px + 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)}.rtk-select{display:block;border-radius:var(--rtk-border-radius-sm, 4px);border-width:var(--rtk-border-width-none, 0);border-style:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:var(--rtk-space-3, 12px);font-size:16px;--icon-size:var(--rtk-select-chevron-size, var(--rtk-space-6, 24px));--icon-right-position:var(--rtk-select-chevron-right-position, var(--rtk-space-2, 8px));background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e\");background-position:right var(--icon-right-position) center;background-repeat:no-repeat;background-size:var(--icon-size) var(--icon-size);padding-right:calc(var(--icon-right-position) * 5);width:100%;max-width:100%;text-overflow:ellipsis}.inline .rtk-select{margin-top:var(--rtk-space-1, 4px);width:100%;padding-top:var(--rtk-space-1, 4px);padding-bottom:var(--rtk-space-1, 4px);padding-left:var(--rtk-space-1\\.5, 6px);padding-right:var(--rtk-space-1\\.5, 6px);padding-right:var(--rtk-space-8, 32px);font-size:14px}.row{margin-bottom:var(--rtk-space-2, 8px);display:flex;width:100%;align-items:center;justify-content:space-between;gap:var(--rtk-space-3, 12px)}.group{margin-top:var(--rtk-space-2, 8px);margin-bottom:var(--rtk-space-2, 8px)}.group>*{margin-bottom:var(--rtk-space-2, 8px)}.group>*:last-child{margin-bottom:var(--rtk-space-0, 0px)}.group select{flex:1 1 0%}.inline.group{margin-top:var(--rtk-space-0, 0px);margin-bottom:var(--rtk-space-0\\.5, 2px)}.inline.group>*{margin-bottom:var(--rtk-space-0, 0px)}label{display:flex;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;gap:var(--rtk-space-1, 4px);font-size:14px}.inline.container{display:flex;align-items:center;justify-content:flex-start;gap:var(--rtk-space-2, 8px);padding-left:var(--rtk-space-2, 8px);padding-right:var(--rtk-space-2, 8px)}";
 const RtkMicrophoneSelectorStyle0 = rtkMicrophoneSelectorCss;

package/dist/components/{p-51ef5a21.js → p-71fbfb8b.js} RENAMED Viewed

@@ -1,11 +1,11 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
-import { e as defaultIconPack, i as useLanguage } from './p-dc9dde66.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-fdad14c9.js';
+import { e as defaultIconPack, i as useLanguage } from './p-f19b4abc.js';
 import { b as getPreference, s as setPreference } from './p-a83ccdbd.js';
-import { S as SyncWithStore } from './p-9c3c75a9.js';
-import { d as defineCustomElement$4 } from './p-f95c314b.js';
-import { d as defineCustomElement$3 } from './p-73baf5ba.js';
-import { d as defineCustomElement$2 } from './p-93db20a6.js';
-import { d as defineCustomElement$1 } from './p-93947678.js';
+import { S as SyncWithStore } from './p-e334e15c.js';
+import { d as defineCustomElement$4 } from './p-d6024528.js';
+import { d as defineCustomElement$3 } from './p-a3cc7425.js';
+import { d as defineCustomElement$2 } from './p-401ce922.js';
+import { d as defineCustomElement$1 } from './p-fe0d125b.js';
 const rtkSettingsVideoCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}.rtk-select{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-1000, 255 255 255))}.rtk-select: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(0px + 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)}.rtk-select{display:block;border-radius:var(--rtk-border-radius-sm, 4px);border-width:var(--rtk-border-width-none, 0);border-style:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:var(--rtk-space-3, 12px);font-size:16px;--icon-size:var(--rtk-select-chevron-size, var(--rtk-space-6, 24px));--icon-right-position:var(--rtk-select-chevron-right-position, var(--rtk-space-2, 8px));background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e\");background-position:right var(--icon-right-position) center;background-repeat:no-repeat;background-size:var(--icon-size) var(--icon-size);padding-right:calc(var(--icon-right-position) * 5)}:host{display:flex;width:100%;flex-direction:column}.rtk-select{width:100%;text-overflow:ellipsis}rtk-participant-tile{margin-left:auto;margin-right:auto;margin-bottom:var(--rtk-space-4, 16px);max-width:100%}#icon{padding-bottom:var(--rtk-space-1, 4px)}.apply-button{height:var(--rtk-space-10, 40px)}label{-webkit-user-select:none;-moz-user-select:none;user-select:none;font-size:14px}.group{margin-top:var(--rtk-space-2, 8px);margin-bottom:var(--rtk-space-2, 8px)}.group>*{margin-bottom:var(--rtk-space-2, 8px)}.group>*:last-child{margin-bottom:var(--rtk-space-0, 0px)}.group select{flex:1 1 0%}.row{display:flex;align-items:center;justify-content:space-between;gap:var(--rtk-space-3, 12px)}.section{display:flex;flex-direction:column}@media only screen and (max-height: 480px) and (orientation: landscape){:host{flex-direction:row}:host([size='sm']){flex-direction:row}.section[part='tile-preview']{margin-left:var(--rtk-space-2, 8px);margin-right:var(--rtk-space-2, 8px);max-height:90%;max-width:40%;flex-shrink:1}.section[part='video-settings']{margin-left:var(--rtk-space-2, 8px);margin-right:var(--rtk-space-2, 8px);flex-grow:1}}";
 const RtkSettingsVideoStyle0 = rtkSettingsVideoCss;