@cloudflare/realtimekit-ui 1.1.0-staging.2 → 1.1.0-staging.4

package/dist/collection/components/rtk-chat/rtk-chat.css

@@ -188,30 +188,67 @@ rtk-chat-composer-view {
   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-2, 8px);
+  padding: var(--rtk-space-4, 16px);
   --tw-bg-opacity: 1;
-  background-color: rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity));
-  font-size: 12px;
+  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-header:hover {
+.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-brand-500, 33 96 253) / var(--tw-bg-opacity));
+  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;
+  width: 100%;
 }
 
-.pinned-messages-header.active {
-  --tw-bg-opacity: 1;
-  background-color: rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity));
+.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 {

package/dist/collection/components/rtk-chat/rtk-chat.js

@@ -16,6 +16,7 @@ import { chatUnreadTimestamps } from "../../utils/user-prefs";
 import { FlagsmithFeatureFlags } from "../../utils/flags";
 import { createDefaultConfig } from "../../exports";
 import { SyncWithStore } from "../../utils/sync-with-store";
+import { defaultOverrides } from "../../lib/overrides";
 /**
  * Fully featured chat component with image & file upload, emoji picker and auto-scroll.
  */
@@ -41,6 +42,8 @@ export class RtkChat {
         this.iconPack = defaultIconPack;
         /** Language */
         this.t = useLanguage();
+        /** UI Overrides */
+        this.overrides = defaultOverrides;
         /** disables private chat */
         this.disablePrivateChat = false;
         /** Can current user pin/unpin messages */
@@ -299,13 +302,25 @@ export class RtkChat {
             };
             return [everyone, ...participants];
         };
-        this.onTogglePinnedMessages = () => {
-            this.showPinnedMessages = !this.showPinnedMessages;
+        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;
-            return (h("rtk-tooltip", { label: this.t('chat.toggle_pinned_msgs') }, h("div", { class: { 'pinned-messages-header': true, active: this.showPinnedMessages }, onClick: this.onTogglePinnedMessages }, h("rtk-icon", { icon: this.iconPack.pin }), this.t('chat.pinned_msgs'), ` (${this.meeting.chat.pinned.length})`)));
+            /**
+             * 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" }, 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() {
@@ -440,7 +455,7 @@ export class RtkChat {
         this.onChannelChanged(e);
     }
     renderComposerUI() {
-        var _a, _b, _c;
+        var _a;
         if (this.chatRecipientId === 'everyone') {
             if (!this.canSendTextMessage && !this.canSendFiles)
                 return null;
@@ -452,17 +467,13 @@ export class RtkChat {
         const uiProps = { iconPack: this.iconPack, t: this.t, size: this.size };
         const message = this.editingMessage ? this.editingMessage.message : '';
         const quotedMessage = this.replyMessage ? this.replyMessage.message : '';
-        return (h("rtk-chat-composer-view", Object.assign({ message: message, storageKey: (_a = this.selectedChannelId) !== null && _a !== void 0 ? _a : `draft-${this.selectedChannelId}`, quotedMessage: quotedMessage, isEditing: !!this.editingMessage, canSendTextMessage: this.isTextMessagingAllowed(), canSendFiles: this.isFileMessagingAllowed(), disableEmojiPicker: !!((_c = (_b = this.meeting) === null || _b === void 0 ? void 0 : _b.__internals__) === null || _c === void 0 ? void 0 : _c.features.hasFeature(FlagsmithFeatureFlags.DISABLE_EMOJI_PICKER)), maxLength: this.meeting.chat.maxTextLimit, rateLimits: this.meeting.chat.rateLimits, inputTextPlaceholder: this.t('chat.message_placeholder'), onNewMessage: this.onNewMessageHandler, onEditMessage: this.onEditMessageHandler, onEditCancel: this.onEditCancel, onQuotedMessageDismiss: this.onQuotedMessageDismiss }, uiProps), h("slot", { name: "chat-addon", slot: "chat-addon" })));
+        return (h("rtk-chat-composer-view", Object.assign({ message: message, storageKey: (_a = this.selectedChannelId) !== null && _a !== void 0 ? _a : `draft-${this.selectedChannelId}`, quotedMessage: quotedMessage, isEditing: !!this.editingMessage, canSendTextMessage: this.isTextMessagingAllowed(), canSendFiles: this.isFileMessagingAllowed(), disableEmojiPicker: this.overrides.disableEmojiPicker, maxLength: this.meeting.chat.maxTextLimit, rateLimits: this.meeting.chat.rateLimits, inputTextPlaceholder: this.t('chat.message_placeholder'), onNewMessage: this.onNewMessageHandler, onEditMessage: this.onEditMessageHandler, onEditCancel: this.onEditCancel, onQuotedMessageDismiss: this.onQuotedMessageDismiss }, uiProps), h("slot", { name: "chat-addon", slot: "chat-addon" })));
     }
     render() {
         var _a;
         if (!this.meeting) {
             return null;
         }
-        let chatMessages = this.chatGroups[this.selectedGroup] || [];
-        if (this.showPinnedMessages && this.meeting.chat.pinned.length !== 0) {
-            chatMessages = chatMessages.filter((chat) => chat.type === 'chat' && chat.message.pinned);
-        }
         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(), this.isPrivateChatSupported() && (h("rtk-channel-selector-view", { channels: this.getPrivateChatRecipients(), selectedChannelId: ((_a = this.selectedParticipant) === null || _a === void 0 ? void 0 : _a.userId) || 'everyone', onChannelChange: this.updateRecipients, t: this.t, viewAs: "dropdown" })), h("rtk-chat-messages-ui-paginated", { meeting: this.meeting, onPinMessage: this.onPinMessage, onDeleteMessage: this.onDeleteMessage, size: this.size, iconPack: this.iconPack, t: this.t }), this.renderComposerUI()))));
     }
     static get is() { return "rtk-chat"; }
@@ -599,6 +610,30 @@ export class RtkChat {
                 "setter": false,
                 "defaultValue": "useLanguage()"
             },
+            "overrides": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "Overrides",
+                    "resolved": "Overrides",
+                    "references": {
+                        "Overrides": {
+                            "location": "import",
+                            "path": "../../lib/overrides",
+                            "id": "src/lib/overrides.ts::Overrides"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "UI Overrides"
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "defaultOverrides"
+            },
             "disablePrivateChat": {
                 "type": "boolean",
                 "mutable": false,
@@ -768,3 +803,6 @@ __decorate([
 __decorate([
     SyncWithStore()
 ], RtkChat.prototype, "t", void 0);
+__decorate([
+    SyncWithStore()
+], RtkChat.prototype, "overrides", void 0);

package/dist/collection/components/rtk-chat-message/rtk-chat-message.js

@@ -85,11 +85,11 @@ export class RtkChatMessage {
             } })));
     }
     render() {
-        return (h(Host, { key: '358cc92774694c9c31b965f823efd5047685ddd3' }, h("div", { key: '084dbfc81b75420c66f949b9799a60563c39b6b2', class: {
+        return (h(Host, { key: 'a7d70a55ded6f3995de04d97e8daba066af76b46' }, h("div", { key: '1eef4376ab7952b11a9271dcf396ea950e7a06a8', class: {
                 'message-wrapper': true,
                 'align-right': this.alignRight,
                 'left-align': this.leftAlign,
-            }, "is-continued": this.isContinued }, this.renderAvatar(), h("div", { key: 'e3f3490eccdc1550b9232bf70f2d8f6717f2fac4', class: {
+            }, "is-continued": this.isContinued }, this.renderAvatar(), h("div", { key: '0445d70d7d5eaa81b77214e6d0c4ab49da0d9cc6', class: {
                 message: true,
                 'show-on-hover': !this.isTouchDevice(),
             }, "is-continued": this.isContinued }, this.renderMessage(), this.renderControls()))));

package/dist/collection/components/rtk-chat-messages-ui/rtk-chat-messages-ui.js

@@ -162,7 +162,7 @@ export class RtkChatMessagesUi {
         var _a;
         let prevMessage = null;
         let reachedFirstUnread = false;
-        return (h(Host, { key: '02149982e96642f42c8850f5d501c038874300f7' }, h("div", { key: 'bcc27f4f4c620175c5b6daead99d0a1b64e6bba8', class: "chat-container scrollbar", ref: (el) => (this.$chat = el), part: "container" }, h("div", { key: '4d4ba71a572095a28aa7c03e70a724521122e96d', class: "spacer", part: "spacer" }), h("div", { key: 'eca7d4406536b4e1b8d907bffe9a1ed6ad311dd4', class: "chat", part: "chat" }, (_a = this.messages) === null || _a === void 0 ? void 0 : _a.map((item) => {
+        return (h(Host, { key: '178fac50ff102f6186953051af07d65e8811d2cf' }, h("div", { key: '00310e41a9d3494c3bc9c4a25594844854e240cb', class: "chat-container scrollbar", ref: (el) => (this.$chat = el), part: "container" }, h("div", { key: '1232aca1fc213e70bf3aa63bd13d2288ba3884a4', class: "spacer", part: "spacer" }), h("div", { key: 'f74b23005e75874224d4cf56e0286ddb4cacfe9d', class: "chat", part: "chat" }, (_a = this.messages) === null || _a === void 0 ? void 0 : _a.map((item) => {
             if (item.type === 'chat') {
                 const { message } = item;
                 const isSelfMessage = message.userId === this.selfUserId;
@@ -181,10 +181,10 @@ export class RtkChatMessagesUi {
                     } })))), message.pinned && (h("div", { class: "pin-button", part: "pin-button" }, h("rtk-tooltip", { label: this.t('unpin') }, h("rtk-button", { kind: "icon", variant: "ghost", onClick: () => this.onMessageActionHandler('pin_message', message), disabled: !this.canPinMessages }, h("rtk-icon", { icon: this.iconPack.pin, size: "sm" }))))))));
             }
             return null;
-        }))), h("div", { key: '8cbfbb3eef3f8640ddd66f68d0287cff5ade6997', class: "show-new-messages-ctr" }, h("rtk-button", { key: 'c9d841cf2d557b766c4a642291779562b71d25a1', class: {
+        }))), h("div", { key: '9123c1900c65f238962a51926e750dbebeab18f4', class: "show-new-messages-ctr" }, h("rtk-button", { key: '01de40dd8bdc2c27f4512bf98a0a6ff4d42714d4', class: {
                 'show-new-messages': true,
                 active: this.showLatestMessageButton,
-            }, kind: "icon", part: "show-new-messages", onClick: this.scrollToBottom }, h("rtk-icon", { key: 'c579ffd1d28139fd82535c6cc0f661118b670a59', icon: this.iconPack.chevron_down })))));
+            }, kind: "icon", part: "show-new-messages", onClick: this.scrollToBottom }, h("rtk-icon", { key: '68c7981e90a248d8aebb872123eaa92f2939b0af', icon: this.iconPack.chevron_down })))));
     }
     static get is() { return "rtk-chat-messages-ui"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-chat-messages-ui-paginated/rtk-chat-messages-ui-paginated.js

@@ -121,9 +121,9 @@ export class RtkChatMessagesUiPaginated {
             }
             const isSelf = message.userId === this.meeting.self.userId;
             const viewType = isSelf ? 'outgoing' : 'incoming';
-            return (h("div", { class: { pinned: message.pinned } }, h("div", { class: "message-wrapper" }, h("rtk-message-view", { time: message.time, actions: this.getMessageActions(message), authorName: message.displayName, isSelf: isSelf, avatarUrl: displayPicture, hideAuthorName: isContinued, viewType: viewType, variant: "bubble", onAction: (event) => this.onMessageActionHandler(event.detail, message) }, h("div", null, h("div", { class: "body" }, message.type === 'text' && (h("rtk-text-message-view", { text: message.message, isMarkdown: true })), message.type === 'file' && (h("rtk-file-message-view", { name: message.name, url: message.link, size: message.size })), message.type === 'image' && (h("rtk-image-message-view", { url: message.link, onPreview: () => {
+            return (h("div", null, h("div", { class: "message-wrapper" }, h("rtk-message-view", { pinned: message.pinned, time: message.time, actions: this.getMessageActions(message), authorName: message.displayName, isSelf: isSelf, avatarUrl: displayPicture, hideAuthorName: isContinued, viewType: viewType, variant: "bubble", onAction: (event) => this.onMessageActionHandler(event.detail, message) }, h("div", null, h("div", { class: "body" }, message.type === 'text' && (h("rtk-text-message-view", { text: message.message, isMarkdown: true })), message.type === 'file' && (h("rtk-file-message-view", { name: message.name, url: message.link, size: message.size })), message.type === 'image' && (h("rtk-image-message-view", { url: message.link, onPreview: () => {
                     this.stateUpdate.emit({ image: message });
-                } }))), message.pinned && (h("div", { class: "pin-icon", part: "pin-icon" }, h("rtk-icon", { icon: this.iconPack.pin, size: "sm" }))))))));
+                } }))))))));
         };
         this.chatUpdateListener = (data) => {
             if (this.selectedChannelId && data.message.channelId !== this.selectedChannelId)
@@ -169,7 +169,7 @@ export class RtkChatMessagesUiPaginated {
         this.lastReadMessageIndex = -1;
     }
     render() {
-        return (h(Host, { key: '732dea776303ba428aedc72608516a4e4dfc1591' }, h("rtk-paginated-list", { key: '6bc3cd1373ff487b897d3ca7a5bfbccfdbaa90da', ref: (el) => (this.$paginatedListRef = el), pageSize: this.pageSize, pagesAllowed: 3, fetchData: this.getChatMessages, createNodes: this.createChatNodes, selectedItemId: this.selectedChannelId, emptyListLabel: this.t('chat.empty_channel') }, h("slot", { key: 'f3cc795b3b39aa48f87f9908e3b205e2db6439b4' }))));
+        return (h(Host, { key: 'dbe69aec6f462c8cfa5d6574ad77efdbadd641b9' }, h("rtk-paginated-list", { key: 'b6b525ad58e8173a78577265f2cde2981ca015cf', ref: (el) => (this.$paginatedListRef = el), pageSize: this.pageSize, pagesAllowed: 3, fetchData: this.getChatMessages, createNodes: this.createChatNodes, selectedItemId: this.selectedChannelId, emptyListLabel: this.t('chat.empty_channel') }, h("slot", { key: '4045a3fccefe09d76edff35b5d0183a89db51491' }))));
     }
     static get is() { return "rtk-chat-messages-ui-paginated"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-chat-search-results/rtk-chat-search-results.js

@@ -32,7 +32,7 @@ export class RtkChatSearchResults {
         };
     }
     render() {
-        return (h(Host, { key: '226b9e52950fca3d296b041dbd93a6c060ad4abe' }, h("rtk-paginated-list", { key: '102af9de7e52317a5f9a8272e9e8a302f99268da', pageSize: this.pageSize, pagesAllowed: 3, fetchData: this.searchMessages, createNodes: this.nodeRenderer, selectedItemId: this.query })));
+        return (h(Host, { key: 'd16d67449de1e354428a96a798540b19a4a3b3b5' }, h("rtk-paginated-list", { key: '8979769039cf4f4d66e83d6cf8cb87075fbc8488', pageSize: this.pageSize, pagesAllowed: 3, fetchData: this.searchMessages, createNodes: this.nodeRenderer, selectedItemId: this.query })));
     }
     static get is() { return "rtk-chat-search-results"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-clock/rtk-clock.js

@@ -71,9 +71,9 @@ export class RtkClock {
     }
     render() {
         const showClock = this.startedTime !== undefined;
-        return (h(Host, { key: '6e6b7a331666cd98cb100dca5c2869a8b5688553', "data-hidden": !showClock, tabIndex: 0, role: "timer", "aria-live": "off" }, this.startedTime !== undefined && [
-            h("rtk-icon", { key: '91cd9140d88447cd6662e08f4d2ed4c0df62858b', icon: this.iconPack.clock, "aria-hidden": true, tabIndex: -1, part: "icon" }),
-            h("span", { key: 'eba0772ccc8f0cc14c9c4dd7c11574dcc368b443', part: "text" }, this.getFormattedTime()),
+        return (h(Host, { key: '39ec8f3aefb91d5314ea8d39b7ded49a1bced4f6', "data-hidden": !showClock, tabIndex: 0, role: "timer", "aria-live": "off" }, this.startedTime !== undefined && [
+            h("rtk-icon", { key: '76017ad292041e04dc2b420b4c3a9c1d14656706', icon: this.iconPack.clock, "aria-hidden": true, tabIndex: -1, part: "icon" }),
+            h("span", { key: '2cd75a435089d1bd534f49b50c0ceaa6e7335f8a', part: "text" }, this.getFormattedTime()),
         ]));
     }
     static get is() { return "rtk-clock"; }

package/dist/collection/components/rtk-confirmation-modal/rtk-confirmation-modal.js

@@ -47,7 +47,7 @@ export class RtkConfirmationModal {
     render() {
         var _a, _b;
         const state = this.states.activeConfirmationModal;
-        return (h(Host, { key: '716b099a3b9d9886c41626cf977e6de8e744894b' }, h("div", { key: 'bac586faa92a4a80b78e36cbef361eec830a8ee2', class: "leave-modal" }, h("div", { key: 'ee19990482ae51504da014bf7d804b4bf577a14a', class: "header" }, h("h2", { key: 'd220797780f3f93b27f1ae511a9fd30e0211b957', class: "title" }, state.header ? this.t(state.header) : this.t('cta.confirmation'))), state.content && h("p", { key: '498688e185b24eec250bcbcdd555fedc15980395', class: "message" }, this.t(state.content)), h("div", { key: '43f6068e6a14c1798ea2d9dec4dafd110222a5aa', class: "content" }, h("div", { key: 'dde485ee17c18a7a15dafd5347e9981ea6af4fe4', class: "leave-meeting" }, h("rtk-button", { key: '9cbbbe08509212e581b2e0768653a9f97efa45e3', variant: "secondary", title: state.cancelText ? this.t(state.cancelText) : this.t('cancel'), onClick: this.close, class: "br-secondary-btn" }, state.cancelText ? this.t(state.cancelText) : this.t('cancel')), h("rtk-button", { key: 'd6c1deaa86c2ec2dd607583aaf9ef3238c343183', onClick: () => this.onConfirmation(), variant: (_b = (_a = this.states.activeConfirmationModal) === null || _a === void 0 ? void 0 : _a.variant) !== null && _b !== void 0 ? _b : 'danger', title: state.ctaText ? this.t(state.ctaText) : this.t('yes') }, state.ctaText ? this.t(state.ctaText) : this.t('yes')))))));
+        return (h(Host, { key: 'c3c594fc3e7923a6cb96abfff6b1103b2f1e4bdb' }, h("div", { key: '5881e956eeefb1dbd9b19548f782a80ca24aa127', class: "leave-modal" }, h("div", { key: 'fa25434424c11296b40c999e6be8d20506542d4d', class: "header" }, h("h2", { key: '9e6d42901ce401796090653c20ebe59a8acb70f4', class: "title" }, state.header ? this.t(state.header) : this.t('cta.confirmation'))), state.content && h("p", { key: '1034d4eadbfb12ff02fb88200a7bcdd7a99c75ac', class: "message" }, this.t(state.content)), h("div", { key: '1868e2521cba84d48a19f544c70465373eaccebb', class: "content" }, h("div", { key: '432d21a121762174a1aedc4926656c9e52cbc5bd', class: "leave-meeting" }, h("rtk-button", { key: 'a5efa391321e6cdc973595637b379a42d1e51707', variant: "secondary", title: state.cancelText ? this.t(state.cancelText) : this.t('cancel'), onClick: this.close, class: "br-secondary-btn" }, state.cancelText ? this.t(state.cancelText) : this.t('cancel')), h("rtk-button", { key: 'b0cbd9943b9e46057ca8ea0829799fad6edfc335', onClick: () => this.onConfirmation(), variant: (_b = (_a = this.states.activeConfirmationModal) === null || _a === void 0 ? void 0 : _a.variant) !== null && _b !== void 0 ? _b : 'danger', title: state.ctaText ? this.t(state.ctaText) : this.t('yes') }, state.ctaText ? this.t(state.ctaText) : this.t('yes')))))));
     }
     static get is() { return "rtk-confirmation-modal"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-controlbar/rtk-controlbar.js

@@ -40,7 +40,7 @@ export class RtkControlbar {
             iconPack: this.iconPack,
             size: this.size,
         };
-        return (h(Host, { key: 'f4fee1168f1b057865a0c615c563158df7f7e2fd' }, !this.disableRender && (h(Render, { key: '58945391fb15e670a385f12e3d5861b03597ed61', element: "rtk-controlbar", defaults: defaults, onlyChildren: true })), h("slot", { key: 'df55eba453868617350ec45fc0437ecb11e03597' })));
+        return (h(Host, { key: '0376a3a5059538d4ae60fce32813e797fae18b2a' }, !this.disableRender && (h(Render, { key: 'b6990b5966e6b270c93181ddb1d156d55b02dbde', element: "rtk-controlbar", defaults: defaults, onlyChildren: true })), h("slot", { key: 'f5130e01e8efd65a0a52e035baac2836d5102731' })));
     }
     static get is() { return "rtk-controlbar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-counter/rtk-counter.js

@@ -40,7 +40,7 @@ export class RtkCounter {
         this.input = Math.max(this.minValue, parseInt(this.input) - 1).toString();
     }
     render() {
-        return (h(Host, { key: 'ef85b8128d8f6470dade486d8b31948db504ca21' }, h("rtk-button", { key: 'cfe52b812fcbb969cfa26cfd6f07aaf2f8b68cb2', kind: "icon", variant: "ghost", onClick: () => this.decrement() }, h("rtk-icon", { key: '947cbae0757f3b56ca511789d431da4a9457259a', icon: this.iconPack.subtract })), h("input", { key: '082850c82f03fa110b670234c676b35e56ac663f', type: "number", value: this.input, min: this.minValue, onInput: (e) => {
+        return (h(Host, { key: 'de6f4a676632e7e41089e4d6d9b02cc06253a5c1' }, h("rtk-button", { key: '3e3121dd327719b46997089c73271278d006ffa5', kind: "icon", variant: "ghost", onClick: () => this.decrement() }, h("rtk-icon", { key: '1133d022c7006fea9822f67c330f1ec1a74e0aa9', icon: this.iconPack.subtract })), h("input", { key: '9bd6dd7109ed8ed86b1ad4edef97ec2d455c3f31', type: "number", value: this.input, min: this.minValue, onInput: (e) => {
                 const val = parseInt(e.target.value, 10);
                 if (isNaN(val) || val < this.minValue) {
                     this.input = this.minValue.toString();
@@ -48,7 +48,7 @@ export class RtkCounter {
                 else {
                     this.input = val.toString();
                 }
-            } }), h("rtk-button", { key: 'fcb469289475e418446019725f47b3fcfe4a2ec1', kind: "icon", variant: "ghost", onClick: () => this.increment() }, h("rtk-icon", { key: 'd4f907255b622dfea369815f4c99ea3a4656caf7', icon: this.iconPack.add }))));
+            } }), h("rtk-button", { key: 'f5114a456b5c922ebac67df8711d5758109dcce8', kind: "icon", variant: "ghost", onClick: () => this.increment() }, h("rtk-icon", { key: 'f21dbbb4c4a667fefb24fcb2dbdebdf81ce9522a', icon: this.iconPack.add }))));
     }
     static get is() { return "rtk-counter"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-debugger-toggle/rtk-debugger-toggle.js

@@ -29,7 +29,7 @@ export class RtkDebuggerToggle {
         });
     }
     render() {
-        return (h(Host, { key: 'cc9ec6cade76093abba3a48502d12a82868a875a', title: this.t('Troubleshooting') }, h("rtk-controlbar-button", { key: '6b8bcf2e363dfcdfb8e0f90c8602d95cdf338544', size: this.size, iconPack: this.iconPack, onClick: () => this.toggleDebugger(), icon: this.iconPack.debug, label: this.t('Troubleshooting'), variant: this.variant })));
+        return (h(Host, { key: '921018aa53c87d13bd51b20d8a98ac84f7b1c2ff', title: this.t('Troubleshooting') }, h("rtk-controlbar-button", { key: '043c5e9648bf9303488977554f9a1e70ca681995', size: this.size, iconPack: this.iconPack, onClick: () => this.toggleDebugger(), icon: this.iconPack.debug, label: this.t('Troubleshooting'), variant: this.variant })));
     }
     static get is() { return "rtk-debugger-toggle"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-draft-attachment-view/rtk-draft-attachment-view.js

@@ -53,7 +53,7 @@ export class RtkDraftAttachmentView {
         this.onAttachmentChange();
     }
     render() {
-        return (h(Host, { key: 'b23eb412c60a62f542aec0e3cd3b99fc72de48f0' }, h("div", { key: '04251f8d4b13325f8474110c89733369bd8904f2', class: "preview-overlay" }, h("div", { key: '51963510a704b19e7c591ea177018bae6e0317f5', class: "preview" }, h("rtk-tooltip", { key: '3a2167ea7a02f1d744462826084f0fef5c607ac9', label: this.t('chat.cancel_upload') }, h("rtk-button", { key: '634c9a7e0962ed82c36519e919eb597c9b603f51', variant: "secondary", kind: "icon", onClick: this.onDeleteClickHandler }, h("rtk-icon", { key: 'b936e54ae44e1d54b73adf38a92551fbea0299c5', icon: this.iconPack.dismiss }))), this.attachment.type === 'image' ? (h("img", { class: "preview-image", src: this.filePreview })) : (h("div", { class: "preview-file" }, h("span", null, this.filePreview)))))));
+        return (h(Host, { key: '4ccd7a73401d3931dadc59779ec4edfddef219f1' }, h("div", { key: 'a75fa81f358436f6ac349a56b8a62671a25f38d7', class: "preview-overlay" }, h("div", { key: 'b95e371e0108cf613305f74c204ebb8fec26140d', class: "preview" }, h("rtk-tooltip", { key: '9c43de18dbdcff2d5cd6fdd344a13cd0d1e7c2f8', label: this.t('chat.cancel_upload') }, h("rtk-button", { key: 'e99f168f015abc65b33876e44d3a2d80f6fa6169', variant: "secondary", kind: "icon", onClick: this.onDeleteClickHandler }, h("rtk-icon", { key: '53f0ffd566825e8cb3d7a7b69c93a62c63206505', icon: this.iconPack.dismiss }))), this.attachment.type === 'image' ? (h("img", { class: "preview-image", src: this.filePreview })) : (h("div", { class: "preview-file" }, h("span", null, this.filePreview)))))));
     }
     static get is() { return "rtk-draft-attachment-view"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-emoji-picker/rtk-emoji-picker.js

@@ -57,7 +57,7 @@ export class RtkEmojiPicker {
         return (h("div", { id: "emoji-grid", class: "scrollbar max-w-40" }, this.filteredEmojis.map((e) => (h("rtk-button", { key: `emoji-button-${e.name}`, class: "emoji", variant: "ghost", kind: "icon", title: e.name, onClick: () => this.handleEmojiClick(e.emoji) }, e.emoji)))));
     }
     render() {
-        return (h(Host, { key: 'e099d5996a16c659de17ca9a36fcd79a9f02f400' }, h("div", { key: '2a3e300c9625b877feb2b6780df7d1a9851cb7f3', class: 'close-parent' }, h("rtk-button", { key: '7ca8421704136d09d107d1f7392ba393d5f59a9a', variant: "ghost", kind: "icon", class: "close", onClick: () => { var _a; return (_a = this.pickerClose) === null || _a === void 0 ? void 0 : _a.emit(); }, "aria-label": this.t('close') }, h("rtk-icon", { key: '040069093f7243bf5075d55b2c081c564d885a8f', icon: this.iconPack.dismiss }))), h("div", { key: '372a32be35dea5200323720e221424b5138cc4ab', class: 'emoji-parent' }, h("input", { key: 'fae2be13d736adbb99212146498f00d4f395636e', value: this.filterVal, onInput: (event) => this.handleInputChange(event.target), placeholder: this.t('search'), ref: (el) => (this.inputElement = el) }), this.mapEmojiList())));
+        return (h(Host, { key: 'f448ab61063b55b8e5572fbcb8be3f520b0704ea' }, h("div", { key: '459b42557c8e7b853410b53e42dd663461b0593a', class: 'close-parent' }, h("rtk-button", { key: '8b64136b51a96bda767b7fbbc05b51a335d1a7b9', variant: "ghost", kind: "icon", class: "close", onClick: () => { var _a; return (_a = this.pickerClose) === null || _a === void 0 ? void 0 : _a.emit(); }, "aria-label": this.t('close') }, h("rtk-icon", { key: '82bdc4ea24be656d182c9e420bd86b0b5cbfa589', icon: this.iconPack.dismiss }))), h("div", { key: '934d08102c4cffda109752eecd5be41854030133', class: 'emoji-parent' }, h("input", { key: '8c21c91a89d77fce9847ade88663d9ec969491da', value: this.filterVal, onInput: (event) => this.handleInputChange(event.target), placeholder: this.t('search'), ref: (el) => (this.inputElement = el) }), this.mapEmojiList())));
     }
     static get is() { return "rtk-emoji-picker"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-emoji-picker-button/rtk-emoji-picker-button.js

@@ -19,7 +19,7 @@ export class RtkEmojiPickerButton {
         this.t = useLanguage();
     }
     render() {
-        return (h("rtk-tooltip", { key: 'bcde14fb2c3a6544882502e65ffda7a6b3b6f13d', label: this.t('chat.send_emoji') }, h("rtk-button", { key: 'd82fa78c4ffe48c24131a6e38f087548f540fefa', variant: "ghost", kind: "icon", class: { active: this.isActive }, title: this.t('chat.send_emoji') }, h("rtk-icon", { key: '791bbe2537f1aeb064c5e9ccbbf4af37b706ec2a', icon: this.iconPack.emoji_multiple }))));
+        return (h("rtk-tooltip", { key: '45792cf2e2523dc94b5dd4c861d4006fae8aee56', label: this.t('chat.send_emoji') }, h("rtk-button", { key: 'd2f80aede59b62d7e0587515f4823bdb5e278c28', variant: "ghost", kind: "icon", class: { active: this.isActive }, title: this.t('chat.send_emoji') }, h("rtk-icon", { key: '15229de453f1cbf93c8de5c002d6ea33ff54ed3b', icon: this.iconPack.emoji_multiple }))));
     }
     static get is() { return "rtk-emoji-picker-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-file-dropzone/rtk-file-dropzone.js

@@ -37,7 +37,7 @@ export class RtkFileDropzone {
         });
     }
     render() {
-        return (h(Host, { key: 'd3fd9af2a148277b2481c94305104e43088a9b42' }, h("div", { key: 'f889ddc5635013ae7f364a6d36ef51936e179f7d', id: "dropzone", class: { active: this.dropzoneActivated }, part: "dropzone" }, h("rtk-icon", { key: 'ceb747a5fba7aa40ef108d404a7b8b02e6ab25b9', icon: this.iconPack.attach }), h("p", { key: '711b8a1ace2d73714f9abdbaba8c031e204fe07e' }, this.t('chat.send_attachment')))));
+        return (h(Host, { key: '9525e4e25630d45a8945e0cd169ac7830eb131b2' }, h("div", { key: '1be56002e1adecfaf2f9b6216e2551929bcac4e2', id: "dropzone", class: { active: this.dropzoneActivated }, part: "dropzone" }, h("rtk-icon", { key: 'e7d366446b6714ad64d2b95da7f08f67a1429333', icon: this.iconPack.attach }), h("p", { key: 'ab3b2e3a048ee8bd812ece1ad5a9afcc03d00c67' }, this.t('chat.send_attachment')))));
     }
     static get is() { return "rtk-file-dropzone"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-file-message/rtk-file-message.js

@@ -34,10 +34,10 @@ export class RtkFileMessage {
     }
     render() {
         const link = sanitizeLink(this.message.link);
-        return (h(Host, { key: '915330674d273f2c45ece29cb5e7c9408ee5cbe8' }, !this.isContinued && (h(ChatHead, { key: 'eb2877f6224de9be1c975f0d2dc010f29fef3bc9', name: this.message.displayName, time: this.message.time, now: this.now })), h("div", { key: '87d7f309379f23b76e404da2039cd2fd3fb7c95a', class: {
+        return (h(Host, { key: 'ec44f9204c991e853665069d0181b538da15893b' }, !this.isContinued && (h(ChatHead, { key: '2ef070076e554bf6c9ebf5762f61174a54079752', name: this.message.displayName, time: this.message.time, now: this.now })), h("div", { key: '5604b1d4d32e821b85a7535b9af2695815cb82e7', class: {
                 body: true,
                 bubble: this.showBubble,
-            }, part: "body" }, h("div", { key: '7683a17adf5784ef0e6af8f396c58c005a369f6b', class: "file" }, h("div", { key: '3005eb72a09ba4d241ec919f957b95f26077ed13', class: "file-data" }, h("div", { key: 'ca5fc3700f868fd321793d4da672e9c7aad38056', class: "name" }, this.message.name), h("div", { key: '463c37838eec7b9ee9b096803cb785445206041a', class: "file-data-split" }, h("div", { key: '9470b898708fc78ca01c2926f8fb6a3c6fae6eea', class: "ext" }, getExtension(this.message.name)), h("span", { key: '35fa7f199b45bb6e64a72614ca1eceaafa6044e7', class: "divider" }), h("div", { key: 'b19a9d32151bb1ddbbb7689dc6d8e09b021d0612', class: "size" }, getFileSize(this.message.size)))), h("rtk-button", { key: '6bb6a3223801a944fb9018765385ebadeae15e0f', variant: "secondary", kind: "icon", onClick: () => downloadFile(link, { name: this.message.name, fallbackName: 'file' }), part: "button" }, h("rtk-icon", { key: '9a7335c6720295a7f0b9073e35ac86014be53316', icon: this.iconPack.download }))))));
+            }, part: "body" }, h("div", { key: '6be5586c964424d8da850f6ead3315e14c439839', class: "file" }, h("div", { key: '28efbbf493a6050d1823b08714307a09b5c5b3f0', class: "file-data" }, h("div", { key: '6e6f42e9551480e6b483db9f7ddaff7e418436e0', class: "name" }, this.message.name), h("div", { key: 'c74d0f1ddf7db3fb9152584ff5c138c3ff5da2ac', class: "file-data-split" }, h("div", { key: '8ed34a2d09a4b849a0d173e22ca9e59ca67a6ff4', class: "ext" }, getExtension(this.message.name)), h("span", { key: 'c7a817891160161ee999aabe284e83cc864cb41a', class: "divider" }), h("div", { key: '6714d486a6d5564581330d76c95d06f3475e3c56', class: "size" }, getFileSize(this.message.size)))), h("rtk-button", { key: 'cc0ca70894c077a4252b6a49aefc544a0b228437', variant: "secondary", kind: "icon", onClick: () => downloadFile(link, { name: this.message.name, fallbackName: 'file' }), part: "button" }, h("rtk-icon", { key: 'a2837e81ab7452589857f1f71d8e7f1d38b5235d', icon: this.iconPack.download }))))));
     }
     static get is() { return "rtk-file-message"; }
     static get properties() {

package/dist/collection/components/rtk-file-message-view/rtk-file-message-view.js

@@ -22,7 +22,7 @@ export class RtkFileMessageView {
         this.iconPack = defaultIconPack;
     }
     render() {
-        return (h("div", { key: 'cdd46a1be912f807688dc86671dddd2fa5b9e7c9', class: "file" }, h("rtk-button", { key: '20bd6c448ec64902989cd742a8f18de32e368194', variant: "secondary", kind: "icon", onClick: () => downloadFile(sanitizeLink(this.url), { name: this.name, fallbackName: 'file' }), part: "button" }, h("rtk-icon", { key: '11ac30db5146132be8aaba67a79f66f8aba7bb8d', icon: this.iconPack.download })), h("div", { key: '342dd8daa944a5857a6519339b4d3bfb6c369eda', class: "file-data" }, h("div", { key: 'e161743b75677b1e81d09d7c373be494ccf8411a', class: "name" }, this.name), h("div", { key: '99f2d8d77ef3c129aa0c229260f6e79901ce268c', class: "file-data-split" }, h("div", { key: '7b9beadca2a810c151fb1ad43ee7c47ba451a37a', class: "ext" }, getExtension(this.name)), h("span", { key: 'd55f69a96bbe26c262461fa87f1a0a506854cf59', class: "divider" }), h("div", { key: 'cad33d263ab75aeb3083886e83063b8ccb2ea976', class: "size" }, getFileSize(this.size))))));
+        return (h("div", { key: 'f25ec20ac84c7ec0961abbdc58d74b64b3261042', class: "file" }, h("rtk-button", { key: '9daa2ca8992821456f7dad66550c1f3b0e07e5c2', variant: "secondary", kind: "icon", onClick: () => downloadFile(sanitizeLink(this.url), { name: this.name, fallbackName: 'file' }), part: "button" }, h("rtk-icon", { key: 'f4a578a8613eab5a2b91a86870ee02ff2659c4ec', icon: this.iconPack.download })), h("div", { key: '61d6a100bd716741e15f80404796ad8e5850d2a3', class: "file-data" }, h("div", { key: 'be8f7fdf168388073e5f094cb717d75766b291df', class: "name" }, this.name), h("div", { key: 'f1dbb45817084612a31baf71784d713ec85a3b79', class: "file-data-split" }, h("div", { key: '49ac2abd19ae9fb07da0a4f234c45b932cd41221', class: "ext" }, getExtension(this.name)), h("span", { key: 'fe7e8660a54184ffc3d5cff5a320a1f8929ec3e6', class: "divider" }), h("div", { key: '402df689a8cf059bd3031c9c036544c486846d40', class: "size" }, getFileSize(this.size))))));
     }
     static get is() { return "rtk-file-message-view"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-file-picker-button/rtk-file-picker-button.js

@@ -44,7 +44,7 @@ export class RtkFilePickerButton {
     render() {
         const label = this.label || this.t('chat.send_file');
         const icon = this.iconPack[this.icon];
-        return (h("rtk-tooltip", { key: '78ef1fd3a42656601c94561bbfc63f888d8180d3', label: label }, h("rtk-button", { key: 'a0a82e689c2e3a344936db1b3253e36def3a0ce5', variant: "ghost", kind: "icon", onClick: () => this.uploadFile(), title: label }, h("rtk-icon", { key: '1651a9f460e3851ff5296f05cf08554f9da21703', icon: icon }))));
+        return (h("rtk-tooltip", { key: '03d24cebc847667a6d59e21d22105c48db0c589c', label: label }, h("rtk-button", { key: 'bddd8cac214d897979c9a38b26643e1027e696e3', variant: "ghost", kind: "icon", onClick: () => this.uploadFile(), title: label }, h("rtk-icon", { key: '0a9756a9f6c1e8ab0c34ea46b3614816aa257df4', icon: icon }))));
     }
     static get is() { return "rtk-file-picker-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-header/rtk-header.js

@@ -40,7 +40,7 @@ export class RtkHeader {
             iconPack: this.iconPack,
             size: this.size,
         };
-        return (h(Host, { key: '00cfd80dbffa3f1c9c66e00397c7db1e7292664c' }, !this.disableRender && h(Render, { key: '521ab0493477836b0a5ce6de5ed85a842c71d32a', element: "rtk-header", defaults: defaults, onlyChildren: true }), h("slot", { key: 'f73693073b8a7162a5db2ec73e93de6bbccea7dd' })));
+        return (h(Host, { key: 'b027d881ec9b4b6e27750e13e9aa0ac50ce9748c' }, !this.disableRender && h(Render, { key: '7bb2e5d3b9d9b2aeb9550c5675743c5ddfeee99c', element: "rtk-header", defaults: defaults, onlyChildren: true }), h("slot", { key: '66bbb8bdcbb511f3e97a17f6b3703725ed708fe4' })));
     }
     static get is() { return "rtk-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-idle-screen/rtk-idle-screen.js

@@ -27,7 +27,7 @@ export class RtkIdleScreen {
         this.t = useLanguage();
     }
     render() {
-        return (h(Host, { key: '1243feb830c4b40ddbb41409ba5e4f5259d4aba2' }, h("slot", { key: 'e5c674091393508a202d514e9ad41ccae687a660' }, h("div", { key: 'bd6e459fc18148edf47ed45df3e9f1f3d3356383', class: "ctr", part: "container" }, h("rtk-logo", { key: '9b3211860563ef93307902744b37985908f71cdf', meeting: this.meeting, config: this.config, t: this.t, part: "logo" }), h("rtk-spinner", { key: '584a3355b5a023ae9bc66f1eafbd85f3d3b9bb92', "aria-label": "Idle, waiting for meeting data", part: "spinner", iconPack: this.iconPack })))));
+        return (h(Host, { key: '0d5f3eea616808cb6d59173bc875ed1e19a571eb' }, h("slot", { key: '9d647571d81e227c3deba0b131e05763f0e17bd4' }, h("div", { key: '856f24853a9d5d1a941be50ff2567083cccc2d0b', class: "ctr", part: "container" }, h("rtk-logo", { key: '0bceeddd22d96bd07f015041e5b79d5de19dac59', meeting: this.meeting, config: this.config, t: this.t, part: "logo" }), h("rtk-spinner", { key: '62841691c9f2669e3e11a4e995848a3f1df4180a', "aria-label": "Idle, waiting for meeting data", part: "spinner", iconPack: this.iconPack })))));
     }
     static get is() { return "rtk-idle-screen"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-image-message/rtk-image-message.js

@@ -34,10 +34,10 @@ export class RtkImageMessage {
         this.status = 'loading';
     }
     render() {
-        return (h(Host, { key: '1267763841d7162f1ad4152a5c4cdd809aaa3808' }, !this.isContinued && (h(ChatHead, { key: '9b415f65f456f8624cd4f981d7f8ae191772a3ce', name: this.message.displayName, time: this.message.time, now: this.now })), h("div", { key: '38ea5e45140f543ae6d16d2d00b0bf0c9a671910', class: {
+        return (h(Host, { key: '91690b290bd0fb2af8a55bea018b8b9353d60396' }, !this.isContinued && (h(ChatHead, { key: 'ef3341005308c597a2f60ec4930f2f38cf81e20a', name: this.message.displayName, time: this.message.time, now: this.now })), h("div", { key: '96d5ad95a36ada5c67ffa93e718e89dbe2a97fbb', class: {
                 body: true,
                 bubble: this.showBubble,
-            }, part: "body" }, h("div", { key: '3c842144038f9612fc46c3f5d18f87342f8376c4', class: { image: true, loaded: this.status === 'loaded' } }, h("img", { key: '39b2978696328d6ed6ac3bbbdc83a57fc7fa7d88', src: sanitizeLink(this.message.link), onLoad: () => {
+            }, part: "body" }, h("div", { key: 'ba3f2db210f343814896a2397386fbbfc7babd10', class: { image: true, loaded: this.status === 'loaded' } }, h("img", { key: '3ad9f01111c8c012513dd3a300b290b439d4a96c', src: sanitizeLink(this.message.link), onLoad: () => {
                 this.status = 'loaded';
             }, onError: () => {
                 this.status = 'errored';
@@ -45,9 +45,9 @@ export class RtkImageMessage {
                 if (this.status === 'loaded') {
                     this.stateUpdate.emit({ image: this.message });
                 }
-            } }), this.status === 'loading' && (h("div", { key: 'd83ca52f9330ddef301be3d4a84b663f91864ea3', class: "image-spinner", title: this.t('chat.img.loading'), "aria-label": this.t('chat.img.loading') }, h("rtk-spinner", { key: '6333ce5847ecd62793d5777a886a3a1a33641fab', iconPack: this.iconPack }))), this.status === 'errored' && (h("div", { key: 'e4063e68ad477069d8acaa03d0dd1c692f82c76f', class: "image-errored", title: this.t('chat.error.img_not_found'), "aria-label": this.t('chat.error.img_not_found') }, h("rtk-icon", { key: '010562aee164fdb63e45da4c0eaa29ad1cbdf66c', icon: this.iconPack.image_off }))), this.status === 'loaded' && (h("div", { key: '14773362280e9dd167db61e58b3f729e0a86d88d', class: "actions" }, h("rtk-button", { key: '8e0cd659fd47074729fa3e63897e3e8eab3193a3', class: "action", variant: "secondary", kind: "icon", onClick: () => {
+            } }), this.status === 'loading' && (h("div", { key: '35140b999e092b083cabfa53c21a468092257b05', class: "image-spinner", title: this.t('chat.img.loading'), "aria-label": this.t('chat.img.loading') }, h("rtk-spinner", { key: '863b39fd51599ace190b75ee00af7406bbbd6d27', iconPack: this.iconPack }))), this.status === 'errored' && (h("div", { key: '647d8f244b63ceb208b3d75bef6f5e4c7777243b', class: "image-errored", title: this.t('chat.error.img_not_found'), "aria-label": this.t('chat.error.img_not_found') }, h("rtk-icon", { key: 'bd40ec4564ae22d65badbec458a3b1b232e46e35', icon: this.iconPack.image_off }))), this.status === 'loaded' && (h("div", { key: 'bb6ff686812867825aca0fbd451e122fee19b6a0', class: "actions" }, h("rtk-button", { key: '5d9fad092c3f5d4049140dc12b73ca9f53ff1088', class: "action", variant: "secondary", kind: "icon", onClick: () => {
                 this.stateUpdate.emit({ image: this.message });
-            } }, h("rtk-icon", { key: '9db76d4971f2b6b45d87b6015b7ef449fa46ba85', icon: this.iconPack.full_screen_maximize })), h("rtk-button", { key: '978934fd136ab2c364521ec55d25e578940e5c7c', class: "action", variant: "secondary", kind: "icon", onClick: () => downloadFile(this.message.link, { fallbackName: 'image' }) }, h("rtk-icon", { key: '55be50aff54309a76e5348f437805e2872bcf548', icon: this.iconPack.download }))))))));
+            } }, h("rtk-icon", { key: 'c77c89797b993d2486e53d15eb8f8bf721bc2c97', icon: this.iconPack.full_screen_maximize })), h("rtk-button", { key: '45974cb9f8b88a71d340c0d260b6e5daf64eec12', class: "action", variant: "secondary", kind: "icon", onClick: () => downloadFile(this.message.link, { fallbackName: 'image' }) }, h("rtk-icon", { key: '3c50dba681609dae024479493b1bcc8ee25a5ef1', icon: this.iconPack.download }))))))));
     }
     static get is() { return "rtk-image-message"; }
     static get originalStyleUrls() {

package/dist/collection/components/rtk-image-message-view/rtk-image-message-view.js

@@ -25,7 +25,7 @@ export class RtkImageMessageView {
         this.status = 'loading';
     }
     render() {
-        return (h("div", { key: '47b2dd8f8dfc0d2aa20e80b513f802e1ebc09153', class: { image: true, loaded: this.status === 'loaded' } }, h("img", { key: 'fba4cfc015beb86040ec74b2a44e2163744a67c6', src: sanitizeLink(this.url), onLoad: () => {
+        return (h("div", { key: '99e8a76eea11e740c21642445fb803b3027f95ff', class: { image: true, loaded: this.status === 'loaded' } }, h("img", { key: '98c0477fab6ae6f86657579d4d4e44dab3af0bf5', src: sanitizeLink(this.url), onLoad: () => {
                 this.status = 'loaded';
             }, onError: () => {
                 this.status = 'errored';
@@ -33,9 +33,9 @@ export class RtkImageMessageView {
                 if (this.status === 'loaded') {
                     this.onPreview.emit(this.url);
                 }
-            } }), this.status === 'loading' && (h("div", { key: '4da0a3ab39d782e9affe7702a19232747bb4581c', class: "image-spinner", title: this.t('chat.img.loading'), "aria-label": this.t('chat.img.loading') }, h("rtk-spinner", { key: 'dea7afe2c92dd5c7c71620bc7b9089f743ef1aa2', iconPack: this.iconPack }))), this.status === 'errored' && (h("div", { key: 'ab303ce11b7182d20c64b00638a1c8be59aea774', class: "image-errored", title: this.t('chat.error.img_not_found'), "aria-label": this.t('chat.error.img_not_found') }, h("rtk-icon", { key: 'e14eb63cc4b2d18a5abd921e25ef305095f61c17', icon: this.iconPack.image_off }))), this.status === 'loaded' && (h("div", { key: 'ccceaa5cc5821ce9b4ddab742001cee78135636a', class: "actions" }, h("rtk-button", { key: 'de49516247d9655cc74afcd58bc50771e2594dca', class: "action", variant: "secondary", kind: "icon", onClick: () => {
+            } }), this.status === 'loading' && (h("div", { key: '91005900f67fb450d9b1515b8fc493e09f5ccebd', class: "image-spinner", title: this.t('chat.img.loading'), "aria-label": this.t('chat.img.loading') }, h("rtk-spinner", { key: 'c96f80a0a53426058635254c5efd78cdccd3a23f', iconPack: this.iconPack }))), this.status === 'errored' && (h("div", { key: 'c1f7a709ccaf0c0ba1104992616f8405e2380c95', class: "image-errored", title: this.t('chat.error.img_not_found'), "aria-label": this.t('chat.error.img_not_found') }, h("rtk-icon", { key: '27d22b3f706d641b5d77a5fa75ba4233663afb88', icon: this.iconPack.image_off }))), this.status === 'loaded' && (h("div", { key: '2caf4c258128cf03dae23769c832a3b7bb76be9e', class: "actions" }, h("rtk-button", { key: 'e668325aa6f1f20a2d4f7d172e483521b709b7c8', class: "action", variant: "secondary", kind: "icon", onClick: () => {
                 this.onPreview.emit(this.url);
-            } }, h("rtk-icon", { key: 'bd1ea608e4846d994a418236dca7856570bd689d', icon: this.iconPack.full_screen_maximize })), h("rtk-button", { key: '266a860a4ab4d6cf76bd89bb35c987efbc89a593', class: "action", variant: "secondary", kind: "icon", onClick: () => downloadFile(this.url, { fallbackName: 'image' }) }, h("rtk-icon", { key: 'ec26862ff95e116d519280c7e62ed7a7e1ede273', icon: this.iconPack.download }))))));
+            } }, h("rtk-icon", { key: 'ceea157f0a5e4802d2c4041f4304b9202b95bc11', icon: this.iconPack.full_screen_maximize })), h("rtk-button", { key: '2941579aef2546aa70c056bdee9bb76fea9e286f', class: "action", variant: "secondary", kind: "icon", onClick: () => downloadFile(this.url, { fallbackName: 'image' }) }, h("rtk-icon", { key: '3878b4a96f77e419e4a26725bfe7a49e29af8760', icon: this.iconPack.download }))))));
     }
     static get is() { return "rtk-image-message-view"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-image-viewer/rtk-image-viewer.js

@@ -39,7 +39,7 @@ export class RtkImageViewer {
         document.removeEventListener('click', this.handleOutsideClick);
     }
     render() {
-        return (h(Host, { key: '6e6e27bf5529ef5af5b0b7f02c0fcda77dba492c', class: "scrollbar", onClick: (e) => e.stopPropagation() }, h("div", { key: '53b1df2b76fb58d37154f246c09c38f17c4ac6b3', class: "header" }, h("div", { key: 'e5707219faa115dfccd330643d022c90abdcfc5b', class: "shared-by-user" }, this.t('chat.img.shared_by'), ' ', h("span", { key: '8387ffa67b78746a8d94f130ff23241313b5c1d8', class: "displayName" }, formatName(shorten(this.image.displayName)))), h("div", { key: 'cd70a8a95e264a533d2d093e4d32df49dfc3f2c7', class: "actions" }, h("rtk-button", { key: '404da530999c81a7754c07ed48ffb73eb8f915e3', onClick: () => downloadFile(this.image.link, { fallbackName: 'image' }) }, h("rtk-icon", { key: '5d7806419e55072fcfb8735229cef5b9b0816669', icon: this.iconPack.download, slot: "start" }), "Download"), h("rtk-button", { key: '6ac87cb0172f319706d8e8d4591a76d3fa60a2b9', kind: "icon", variant: "secondary", onClick: () => this.close.emit() }, h("rtk-icon", { key: 'd25982c4b4f3c422df8187782a762b12fffb76df', icon: this.iconPack.dismiss })))), h("div", { key: '968d31b08e5113419bbdc63c3887a8537d198284', class: "image-ctr" }, h("img", { key: 'a806265d98e09094dd267afc3dc6018f6cf692c4', src: this.image.link }))));
+        return (h(Host, { key: '8d935bb0caf8d693e1a689ca43aae99862170ac9', class: "scrollbar", onClick: (e) => e.stopPropagation() }, h("div", { key: '99e92847c61ae836819158df5e755a15ffc857c0', class: "header" }, h("div", { key: '00fa44b137b19e90480ab67a915d795e69d0e8d2', class: "shared-by-user" }, this.t('chat.img.shared_by'), ' ', h("span", { key: 'c8cdd90cdb236581421d39f397dcb532c0052f88', class: "displayName" }, formatName(shorten(this.image.displayName)))), h("div", { key: '5c4c76c34a58598056c737cab95966014713fda1', class: "actions" }, h("rtk-button", { key: '78e4b05fc056a4924e7d795ce751d26213b7b31c', onClick: () => downloadFile(this.image.link, { fallbackName: 'image' }) }, h("rtk-icon", { key: '97f528e26b23f749597e783b15ae2b28cdb57432', icon: this.iconPack.download, slot: "start" }), "Download"), h("rtk-button", { key: '1c8db312bcdbb7b58886bd042866dce4a742b2b6', kind: "icon", variant: "secondary", onClick: () => this.close.emit() }, h("rtk-icon", { key: '91a7127dce1d432cd6ab8bbba45d37054459b6d5', icon: this.iconPack.dismiss })))), h("div", { key: 'c5389b11ee44af064e9d12c443b2986a349d02de', class: "image-ctr" }, h("img", { key: 'a6b8cfadc2f11395695358f97a285986e5dab799', src: this.image.link }))));
     }
     static get is() { return "rtk-image-viewer"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-information-tooltip/rtk-information-tooltip.js

@@ -17,7 +17,7 @@ export class RtkInformationTooltip {
         this.iconPack = defaultIconPack;
     }
     render() {
-        return (h(Host, { key: '182572b0e68a80a504b3aed40ae526ae371a9921' }, h("div", { key: 'c46d1aedd29c015e36c0496dd36ccd7d2afcd4ee', class: "tooltip-container" }, h("rtk-icon", { key: '25465b17d5b97a102273621e6e942fb34f542d53', icon: this.iconPack.info, size: "sm" }), h("div", { key: '9f3e5eea9a21b1ff48e8a3e7e91e3f81e748af79', class: "tooltip" }, h("slot", { key: 'a0f42e3681ffddf9287ddacd111ea3fa64f77c01', name: "tootlip-text" })))));
+        return (h(Host, { key: 'a94703e845d2ed6757b794e5582a27790d9ffc22' }, h("div", { key: '9dba2927f2763b84127237d269bbb21bda299018', class: "tooltip-container" }, h("rtk-icon", { key: 'dda3376f2f3e0bcc61a978f6ed4d9a746243480c', icon: this.iconPack.info, size: "sm" }), h("div", { key: '87df9ff5be316f60f1b9b6445ee19f48aed6918c', class: "tooltip" }, h("slot", { key: '25cacd1c76d12aef06b7c757d6cc1580f214d938', name: "tootlip-text" })))));
     }
     static get is() { return "rtk-information-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-join-stage/rtk-join-stage.js

@@ -43,7 +43,7 @@ export class RtkJoinStage {
             iconPack: this.iconPack,
             t: this.t,
         };
-        return (h(Host, { key: 'b69a0a77d20a65a3112a393f33e4bc71564b16e1', class: { stage: true } }, h("header", { key: 'c9860a7bd9139b4ddb188f03f4efadcecf2d4259' }, h("h2", { key: '3222f6b149c9584205f355daecb4ebc7a2c329e3' }, this.dataConfig.title)), h(Render, { key: 'ae93b03e1ffeef036560de82bd1cfd678be9895a', element: "rtk-participant-setup", defaults: defaults, props: { participant: (_a = this.meeting) === null || _a === void 0 ? void 0 : _a.self, size: 'md' }, childProps: { participant: (_b = this.meeting) === null || _b === void 0 ? void 0 : _b.self, size: 'md' }, deepProps: true }), h("div", { key: 'b579bcd55ac13475d46a9b363e50a293b3f8ab87', class: "summary" }, this.dataConfig.description), h("div", { key: 'b7002bbcf12848243621dbd4e0e62d73ed5c7043', class: "container" }, h("rtk-button", { key: '240d7e4f50f89e6859be85917a325075d5d98628', variant: "secondary", onClick: () => this.leaveStage.emit(), title: this.dataConfig.label.reject }, this.dataConfig.label.reject), h("rtk-button", { key: 'c510ea579e35bf1302b6364065a2bb4eac43bec0', onClick: () => {
+        return (h(Host, { key: 'e5d51e22abdf1f0192e48ea4d4cbb614747edcc1', class: { stage: true } }, h("header", { key: 'd2a658de63ba4df5d5827a3aff348347c271c21d' }, h("h2", { key: '9e0279be859026b0c330bd174a47556b145f14c6' }, this.dataConfig.title)), h(Render, { key: '47b47ff8103b8f0aec5f667750b2f011e55e0eea', element: "rtk-participant-setup", defaults: defaults, props: { participant: (_a = this.meeting) === null || _a === void 0 ? void 0 : _a.self, size: 'md' }, childProps: { participant: (_b = this.meeting) === null || _b === void 0 ? void 0 : _b.self, size: 'md' }, deepProps: true }), h("div", { key: 'eb435cd2a823279760819d199228eeb4b848b8c7', class: "summary" }, this.dataConfig.description), h("div", { key: '7f161d269e0508e3f184adf590043b707809fac4', class: "container" }, h("rtk-button", { key: '98344f17b421583410b1f279c2ee8dd533090ebb', variant: "secondary", onClick: () => this.leaveStage.emit(), title: this.dataConfig.label.reject }, this.dataConfig.label.reject), h("rtk-button", { key: '5f8cf91e9e864df3c85b63677ab9ac2e17e7aa18', onClick: () => {
                 if (this.isLoading)
                     return;
                 this.isLoading = true;

package/dist/collection/components/rtk-leave-button/rtk-leave-button.js

@@ -29,7 +29,7 @@ export class RtkLeaveButton {
     }
     render() {
         const text = this.t('leave');
-        return (h(Host, { key: '27ea1d3f7593e32d53b8160537e00147be6e2a2d', label: text }, h("rtk-controlbar-button", { key: 'f0952b09acd1f7cff04fd521252ecf75715e9a74', size: this.size, iconPack: this.iconPack, class: "leave red-icon", onClick: this.leave, icon: this.iconPack.call_end, label: text, variant: this.variant, part: "controlbar-button" })));
+        return (h(Host, { key: '5b0ccd7eca4a3330a6bbfd377fa5cbdc050ac346', label: text }, h("rtk-controlbar-button", { key: '8dcb835fb29edad956d715c2cbe882686ccce40d', size: this.size, iconPack: this.iconPack, class: "leave red-icon", onClick: this.leave, icon: this.iconPack.call_end, label: text, variant: this.variant, part: "controlbar-button" })));
     }
     static get is() { return "rtk-leave-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/rtk-leave-meeting/rtk-leave-meeting.js

@@ -75,9 +75,9 @@ export class RtkLeaveMeeting {
         }
     }
     render() {
-        return (h(Host, { key: 'aea5962feea02bcf96948f3fe61eb6d59657de0d' }, h("div", { key: '183292c3726e742323faba5d94c21ccefe3d56c5', class: "leave-modal" }, h("div", { key: '313b84d84c8a575883c5aa89613bf8a07b53a6aa', class: "header" }, h("h2", { key: 'd87fcdf179052a18b70b9681e56858e09acb04b5', class: "title" }, this.t('leave'))), h("p", { key: 'd03e97a6556e27b3719d4ca9ea89ee8a286d3f16', class: "message" }, this.isBreakoutRoomsActive && this.isChildMeeting
+        return (h(Host, { key: '4680ed34de64c4ab67dc939941a0c0a8f72af619' }, h("div", { key: '6ed0410cb32c8bd113dbc7cc5cfe5a3079606ff5', class: "leave-modal" }, h("div", { key: '8f9702a7fd68a1785bb63620587836c769c379bc', class: "header" }, h("h2", { key: 'e071e2ddbdba0ad61a3e5dc4a8ecf5c39610ffac', class: "title" }, this.t('leave'))), h("p", { key: '39ec1123fadc7fb945b600d114246aaf7b251e5a', class: "message" }, this.isBreakoutRoomsActive && this.isChildMeeting
             ? this.t('breakout_rooms.leave_confirmation')
-            : this.t('leave_confirmation')), h("div", { key: '39742fe6bfbadfb30b116ee38685f1193c773e1c', class: "content" }, h("rtk-button", { key: '39d88ee45a920e56593cd23237bf241951d8b178', variant: "secondary", onClick: this.close, class: "secondary-btn" }, this.t('cancel')), this.isBreakoutRoomsActive && this.isChildMeeting && this.canJoinMainRoom && (h("rtk-button", { key: '250fb2f7e0a44e64a29072bc59d966191ce55a88', variant: "secondary", onClick: this.handleJoinMainRoom, class: "secondary-btn" }, this.t('breakout_rooms.leave_confirmation.main_room_btn'))), h("rtk-button", { key: 'bdbea0eb8468240008a11b1f4456d52633dc2637', variant: "danger", title: this.t('leave'), onClick: this.handleLeave }, this.t('leave')), this.canEndMeeting && (h("rtk-button", { key: 'abff846edc62ce861159bc19101ef6714a5ad99b', variant: "danger", class: "secondary-btn secondary-danger-btn", onClick: this.handleEndMeeting }, this.t('end.all')))))));
+            : this.t('leave_confirmation')), h("div", { key: 'ae5e42b89313baedea3478e59c320ccadd871e3b', class: "content" }, h("rtk-button", { key: '5eccf433e1de71cbbe84d9b9062848f47bcb68b6', variant: "secondary", onClick: this.close, class: "secondary-btn" }, this.t('cancel')), this.isBreakoutRoomsActive && this.isChildMeeting && this.canJoinMainRoom && (h("rtk-button", { key: 'ad34c1c74a3c76289bfaf87e0d03e9323222735a', variant: "secondary", onClick: this.handleJoinMainRoom, class: "secondary-btn" }, this.t('breakout_rooms.leave_confirmation.main_room_btn'))), h("rtk-button", { key: '45a051102497bcfce0efb7a113a6d00a43de0605', variant: "danger", title: this.t('leave'), onClick: this.handleLeave }, this.t('leave')), this.canEndMeeting && (h("rtk-button", { key: '581e73b8d12ecb3a09182cb6561cdbb61ebb913f', variant: "danger", class: "secondary-btn secondary-danger-btn", onClick: this.handleEndMeeting }, this.t('end.all')))))));
     }
     static get is() { return "rtk-leave-meeting"; }
     static get encapsulation() { return "shadow"; }