@cloudflare/realtimekit-ui 1.0.3-staging.4 → 1.0.4-staging.1

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

@@ -171,7 +171,7 @@ export class RtkChatMessagesUiPaginated {
         this.lastReadMessageIndex = -1;
     }
     render() {
-        return (h(Host, { key: '088b35f5fe196ed2b3271a0b36eef02df47f28e0' }, h("rtk-paginated-list", { key: 'a856bde7e481f78b081dcd20351d872a6dd687fa', 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: 'a4c15d852264ca50ae784a8b26b052585b0acac8' }))));
+        return (h(Host, { key: 'ab3da087eddff60e803af97f66b05dbb51a3957f' }, h("rtk-paginated-list", { key: 'd22d325b961625596c529a9c6fb8e086f6e24e00', 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: '9bcd54c7f8e1e97c8e876e9c06435fa6bbe27fae' }))));
     }
     static get is() { return "rtk-chat-messages-ui-paginated"; }
     static get encapsulation() { return "shadow"; }
@@ -371,7 +371,7 @@ export class RtkChatMessagesUiPaginated {
                         "TextMessage": {
                             "location": "import",
                             "path": "@cloudflare/realtimekit",
-                            "id": "../../node_modules/@cloudflare/realtimekit/dist/index.d.ts::TextMessage"
+                            "id": "node_modules::TextMessage"
                         }
                     }
                 }
@@ -392,7 +392,7 @@ export class RtkChatMessagesUiPaginated {
                         "Message": {
                             "location": "import",
                             "path": "@cloudflare/realtimekit",
-                            "id": "../../node_modules/@cloudflare/realtimekit/dist/index.d.ts::Message"
+                            "id": "node_modules::Message"
                         }
                     }
                 }
@@ -413,7 +413,7 @@ export class RtkChatMessagesUiPaginated {
                         "Message": {
                             "location": "import",
                             "path": "@cloudflare/realtimekit",
-                            "id": "../../node_modules/@cloudflare/realtimekit/dist/index.d.ts::Message"
+                            "id": "node_modules::Message"
                         }
                     }
                 }

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

@@ -31,7 +31,7 @@ export class RtkChatSearchResults {
         };
     }
     render() {
-        return (h(Host, { key: 'f94f965504c412fd2a33fd9f50a8baaedd05f3ab' }, h("rtk-paginated-list", { key: '6e21d19a60937f67733162a2f2fcdae290c5991f', pageSize: this.pageSize, pagesAllowed: 3, fetchData: this.searchMessages, createNodes: this.nodeRenderer, selectedItemId: this.query })));
+        return (h(Host, { key: 'f9dc934ec73372295dde976d216dc1f8ffb6f11e' }, h("rtk-paginated-list", { key: '4bdb8438495075558df2ee013a58dbbd56e3f274', 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-chat-toggle/rtk-chat-toggle.js

@@ -79,7 +79,7 @@ export class RtkChatToggle {
     }
     meetingChanged(meeting) {
         var _a, _b, _c, _d, _e, _f, _g;
-        if (meeting == null)
+        if (!meeting)
             return;
         if (usePaginatedChat(meeting)) {
             (_a = meeting.chat) === null || _a === void 0 ? void 0 : _a.getMessages(new Date().getTime(), 1, true).then((res) => {
@@ -108,6 +108,8 @@ export class RtkChatToggle {
         }
     }
     render() {
+        if (!this.meeting)
+            return null;
         if (!this.canViewChat)
             return h(Host, { "data-hidden": true });
         return (h(Host, { title: this.t('chat') }, usePaginatedChat(this.meeting)

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: '2775471382c6d07aae0ba8e18677d6850fd9cb34', "data-hidden": !showClock, tabIndex: 0, role: "timer", "aria-live": "off" }, this.startedTime !== undefined && [
-            h("rtk-icon", { key: '48b8bdfeef973d7f3eb4cdd526e386226a4b999a', icon: this.iconPack.clock, "aria-hidden": true, tabIndex: -1, part: "icon" }),
-            h("span", { key: '9f2bb7aa7adc6ecb65c5fef57e406801e6592e59', part: "text" }, this.getFormattedTime()),
+        return (h(Host, { key: 'f9d97a2d88a418623011aa33839e3262cb106419', "data-hidden": !showClock, tabIndex: 0, role: "timer", "aria-live": "off" }, this.startedTime !== undefined && [
+            h("rtk-icon", { key: 'c1b4cb9b3859d6523529c5590f84a571f245330b', icon: this.iconPack.clock, "aria-hidden": true, tabIndex: -1, part: "icon" }),
+            h("span", { key: 'af7242035fc017d49aa0f21c3da844b37dd87277', 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: 'e9a8a58afa42b97d8dba92f3619b3b0b67160d04' }, h("div", { key: '5ad16431e2157600116bbdbf47c194d8a4980621', class: "leave-modal" }, h("div", { key: '9285137f1130bcc7f67183e476e5464688ccff90', class: "header" }, h("h2", { key: 'ef2144a5de17b8f1dd41f4bf765e3da17ae058e5', class: "title" }, state.header ? this.t(state.header) : this.t('cta.confirmation'))), state.content && h("p", { key: '2227d4079e7df0e02b805aef57c2187c3a55e785', class: "message" }, this.t(state.content)), h("div", { key: 'd6f587b79bbf99d0e8a00f7bb65975b2eafa80ad', class: "content" }, h("div", { key: 'cdd81faaf9fa4192a2ed57f9d4d3f36e45400250', class: "leave-meeting" }, h("rtk-button", { key: 'ff9ddfccf098ea4cc956f95c22e94816e3b0561a', 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: 'bc680bd1d2995998e759cbb520f4b146bf6e359e', 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: '22ee38d06ab212134ac17a656da1251a3dc05372' }, h("div", { key: 'ed29620d69abd3202a823de32c06d7b2fb71f828', class: "leave-modal" }, h("div", { key: '07466875c79feb312e7df26cec679e62a4fc2991', class: "header" }, h("h2", { key: '4ebc7ab0dc5c2175cb234575435a30e4d1ce7a13', class: "title" }, state.header ? this.t(state.header) : this.t('cta.confirmation'))), state.content && h("p", { key: 'a9fcfa27f006dfb6ee1be60529b2c02611edc4cd', class: "message" }, this.t(state.content)), h("div", { key: '940cb8e8344bd99ba5d5266e284cc5161e666748', class: "content" }, h("div", { key: 'b8862b1db1f77121f9c2032e1f8213eeced5217d', class: "leave-meeting" }, h("rtk-button", { key: '0b4e17540009e0a465097e628904b36c54e17462', 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: '5f8c65ea6678c14855ece31827cb4aff714a0965', 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

@@ -9,7 +9,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { Host, h } from "@stencil/core";
-import { defaultConfig, defaultIconPack } from "../../exports";
+import { createDefaultConfig, defaultIconPack } from "../../exports";
 import { useLanguage } from "../../lib/lang";
 import { Render } from "../../lib/render";
 import { SyncWithStore } from "../../utils/sync-with-store";
@@ -25,7 +25,7 @@ export class RtkControlbar {
         /** Whether to render the default UI */
         this.disableRender = false;
         /** Config */
-        this.config = defaultConfig;
+        this.config = createDefaultConfig();
         /** Icon Pack */
         this.iconPack = defaultIconPack;
         /** Language */
@@ -40,7 +40,7 @@ export class RtkControlbar {
             iconPack: this.iconPack,
             size: this.size,
         };
-        return (h(Host, { key: '03a753b729584aee302a0e76f7961ae057dc0746' }, !this.disableRender && (h(Render, { key: '488995338fff693e38de3f98f72a656cd71a5882', element: "rtk-controlbar", defaults: defaults, onlyChildren: true })), h("slot", { key: '6fb547f8c56b9a610c532d66aa3582d16b3b40ef' })));
+        return (h(Host, { key: '3821bcb1a2328652bcf259d55c96f0adbb3c4ab6' }, !this.disableRender && (h(Render, { key: '9cdaf23eb3616d6ed4b725a289399b29b86e8c36', element: "rtk-controlbar", defaults: defaults, onlyChildren: true })), h("slot", { key: 'a7c56a8ab40766012c4a2ba32592e90f3051b293' })));
     }
     static get is() { return "rtk-controlbar"; }
     static get encapsulation() { return "shadow"; }
@@ -141,7 +141,7 @@ export class RtkControlbar {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "defaultConfig"
+                "defaultValue": "createDefaultConfig()"
             },
             "states": {
                 "type": "unknown",
@@ -245,6 +245,9 @@ export class RtkControlbar {
 __decorate([
     SyncWithStore()
 ], RtkControlbar.prototype, "meeting", void 0);
+__decorate([
+    SyncWithStore()
+], RtkControlbar.prototype, "config", void 0);
 __decorate([
     SyncWithStore()
 ], RtkControlbar.prototype, "states", void 0);

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

@@ -28,7 +28,7 @@ export class RtkControlbarButton {
         this.brandIcon = false;
     }
     render() {
-        return (h(Host, { key: '9a1150fd8a0fbd0022f33f325e7413d0670d0820' }, h("button", { key: '0fabd8a63a8013e1630dd3838f0c2f1378f423f7', "aria-label": this.label, part: "button" }, this.isLoading ? (h("rtk-spinner", { id: "icon", part: "spinner", iconPack: this.iconPack })) : (h("rtk-icon", { id: "icon", icon: this.icon, tabIndex: -1, "aria-hidden": true, part: "icon" })), h("span", { key: '117f1bff41fb719a832ef89d000b2abef6f1388a', class: "label", part: "label" }, this.label), this.showWarning && (h("rtk-icon", { key: '4d8b9170c833a930e013613089755ec768df0695', id: "warning-indicator", icon: this.iconPack.warning, part: "warning-indicator" })))));
+        return (h(Host, { key: '9883914979b6b7ca3cb39624476bf09d4c3d9849' }, h("button", { key: '0edc9db5989a895003f8f6df75352009475af716', "aria-label": this.label, part: "button" }, this.isLoading ? (h("rtk-spinner", { id: "icon", part: "spinner", iconPack: this.iconPack })) : (h("rtk-icon", { id: "icon", icon: this.icon, tabIndex: -1, "aria-hidden": true, part: "icon" })), h("span", { key: '36fe6f2c97c62350a08a8b57317e32201d26182c', class: "label", part: "label" }, this.label), this.showWarning && (h("rtk-icon", { key: 'a0a6ebe1e21a3eb3fec815e2aeeda12378b911f6', id: "warning-indicator", icon: this.iconPack.warning, part: "warning-indicator" })))));
     }
     static get is() { return "rtk-controlbar-button"; }
     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: '69da144af824d130db538c62561020197f7b93fa' }, h("rtk-button", { key: 'c31072304b50d8f4eb75379ad9cf924762107425', kind: "icon", variant: "ghost", onClick: () => this.decrement() }, h("rtk-icon", { key: 'ff4247e38e693b1a642cebb6c7dc4efc675945de', icon: this.iconPack.subtract })), h("input", { key: 'ffe5abe4110565707ec1fcd26e74fae44cf9f7a9', type: "number", value: this.input, min: this.minValue, onInput: (e) => {
+        return (h(Host, { key: '272e7b55fbdf3b7bca96c737152319c310d1f112' }, h("rtk-button", { key: 'c9fd1fc0b3338b9428eb76f10d1d63f73292995b', kind: "icon", variant: "ghost", onClick: () => this.decrement() }, h("rtk-icon", { key: '695097f6acef35020d3ca70f6afce1df28cebfba', icon: this.iconPack.subtract })), h("input", { key: '72fb69566bd509998bcaef9ce995ed048b0db5a8', 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: '5b063c1a3698c7f8ccbd6e7fb406efe0905a260b', kind: "icon", variant: "ghost", onClick: () => this.increment() }, h("rtk-icon", { key: 'dbc1a35da59b9973eceab21fdf6fcb395942ac45', icon: this.iconPack.add }))));
+            } }), h("rtk-button", { key: '9f0eb1678344ae27fa06b179fac938cbfdbb8307', kind: "icon", variant: "ghost", onClick: () => this.increment() }, h("rtk-icon", { key: 'd895d47a9bc64aa95723970313eca8ea2503a8c1', icon: this.iconPack.add }))));
     }
     static get is() { return "rtk-counter"; }
     static get encapsulation() { return "shadow"; }

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

@@ -65,7 +65,7 @@ export class RtkDebugger {
         }
     }
     render() {
-        if (this.meeting == null)
+        if (!this.meeting)
             return null;
         const defaults = {
             meeting: this.meeting,

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

@@ -29,7 +29,7 @@ export class RtkDebuggerToggle {
         });
     }
     render() {
-        return (h(Host, { key: 'e46722c024802f6c96cebb487c9049e8834c48f8', title: this.t('Troubleshooting') }, h("rtk-controlbar-button", { key: 'ee3d60dd6993d2757f763a0ae8ba173887c9ceba', size: this.size, iconPack: this.iconPack, onClick: () => this.toggleDebugger(), icon: this.iconPack.debug, label: this.t('Troubleshooting'), variant: this.variant })));
+        return (h(Host, { key: '3f0fb6e513b44c36dfcbe4ddef47c40a6b97f361', title: this.t('Troubleshooting') }, h("rtk-controlbar-button", { key: 'f790e80162d8d711d7fac27247ddd96bceca5356', 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-dialog/rtk-dialog.js

@@ -9,7 +9,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { Host, h } from "@stencil/core";
-import { defaultConfig } from "../../lib/default-ui-config";
+import { createDefaultConfig } from "../../lib/default-ui-config";
 import { defaultIconPack } from "../../lib/icons";
 import { useLanguage } from "../../lib/lang";
 import { SyncWithStore } from "../../utils/sync-with-store";
@@ -23,7 +23,7 @@ export class RtkDialog {
         /** Whether Escape key can close the modal */
         this.disableEscapeKey = false;
         /** UI Config */
-        this.config = defaultConfig;
+        this.config = createDefaultConfig();
         /** Icon pack */
         this.iconPack = defaultIconPack;
         /** Language */
@@ -166,7 +166,7 @@ export class RtkDialog {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "defaultConfig"
+                "defaultValue": "createDefaultConfig()"
             },
             "states": {
                 "type": "unknown",
@@ -308,6 +308,9 @@ export class RtkDialog {
 __decorate([
     SyncWithStore()
 ], RtkDialog.prototype, "meeting", void 0);
+__decorate([
+    SyncWithStore()
+], RtkDialog.prototype, "config", void 0);
 __decorate([
     SyncWithStore()
 ], RtkDialog.prototype, "states", void 0);

package/dist/collection/components/rtk-dialog-manager/rtk-dialog-manager.js

@@ -9,7 +9,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { Host, h } from "@stencil/core";
-import { defaultConfig } from "../../lib/default-ui-config";
+import { createDefaultConfig } from "../../lib/default-ui-config";
 import { defaultIconPack } from "../../lib/icons";
 import { useLanguage } from "../../lib/lang";
 import { SyncWithStore } from "../../utils/sync-with-store";
@@ -28,7 +28,7 @@ import { Render } from "../../lib/render";
 export class RtkDialogManager {
     constructor() {
         /** UI Config */
-        this.config = defaultConfig;
+        this.config = createDefaultConfig();
         /** Icon pack */
         this.iconPack = defaultIconPack;
         /** Language */
@@ -70,6 +70,9 @@ export class RtkDialogManager {
     }
     render() {
         var _a, _b, _c, _d;
+        if (!this.meeting) {
+            return;
+        }
         const defaults = {
             meeting: this.meeting,
             states: this.states,
@@ -195,7 +198,7 @@ export class RtkDialogManager {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "defaultConfig"
+                "defaultValue": "createDefaultConfig()"
             },
             "states": {
                 "type": "unknown",
@@ -329,6 +332,9 @@ export class RtkDialogManager {
 __decorate([
     SyncWithStore()
 ], RtkDialogManager.prototype, "meeting", void 0);
+__decorate([
+    SyncWithStore()
+], RtkDialogManager.prototype, "config", void 0);
 __decorate([
     SyncWithStore()
 ], RtkDialogManager.prototype, "states", void 0);

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: 'bf052df6f3c49b6a52b3002a8ed92bae6cbd7b06' }, h("div", { key: '786126525fd361e17ec716615da402f11b5f5d1d', class: "preview-overlay" }, h("div", { key: '1d89de4184961ebc4c8822aa016394706d37b2ba', class: "preview" }, h("rtk-tooltip", { key: '87177c3ff98e59097c02bfcc397c13b68952199c', label: this.t('chat.cancel_upload') }, h("rtk-button", { key: 'f2a2ce338be78a7572c6a819ee5a75a9521f73b0', variant: "secondary", kind: "icon", onClick: this.onDeleteClickHandler }, h("rtk-icon", { key: '12b0d383efb984307eba05ccdb783a8bd9c2d636', 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: 'f6ede093bcdf8100807baab4de2a296fc4960a07' }, h("div", { key: 'b19bbe9b2ea58ea4adccc2028a1b24ea6bc9f0a9', class: "preview-overlay" }, h("div", { key: 'cbb2bfcb3a50e6e7fbfd4109eb340ba51d6a162d', class: "preview" }, h("rtk-tooltip", { key: '15b50c547470b0fa22014e0992a1c7e26b234573', label: this.t('chat.cancel_upload') }, h("rtk-button", { key: '940332a51747af3368ffec497d5ef76fa64ecf75', variant: "secondary", kind: "icon", onClick: this.onDeleteClickHandler }, h("rtk-icon", { key: 'cc04b0ac70753e970ff638f187ad5f702dc3656b', 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: '989c0508bb88941926f29091895707e7b4a3e139' }, h("div", { key: '83a90c6b73ca11fb6e864a59362d15bf83391d20', class: 'close-parent' }, h("rtk-button", { key: '446a4c1a343eb11032b9ea2bf5b4cd5bef6f7f1b', 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: 'cacfe97be0590e840d332fc9197bb473fef22d9f', icon: this.iconPack.dismiss }))), h("div", { key: '461a263d19a60547aff16689d3c6f4f31aea8a3a', class: 'emoji-parent' }, h("input", { key: 'c9a111769b48d5ff12ac48d8c172a8d3f371df2c', value: this.filterVal, onInput: (event) => this.handleInputChange(event.target), placeholder: this.t('search'), ref: (el) => (this.inputElement = el) }), this.mapEmojiList())));
+        return (h(Host, { key: '6581d26d75a7b869d0ba00243ec74ee06b927e7d' }, h("div", { key: '3705d8c557ac3e05769171998e9176e7e40a232c', class: 'close-parent' }, h("rtk-button", { key: 'b437e579cb828a709de255ddfa6b751e4bdfbe51', 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: '7fac79a21c6be57156d17ceeff9ceb2834bbf709', icon: this.iconPack.dismiss }))), h("div", { key: '46cb2af6654ef36b7258baf47e3cd9e5bd60bf89', class: 'emoji-parent' }, h("input", { key: 'cfde33638d531f9bac1b1bf25d966a369f4dfb38', 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: '5edf35e2100be583f2be4feadaa3b3149f9c8962', label: this.t('chat.send_emoji') }, h("rtk-button", { key: '00bfc269a700ab10955a627095aac31b64d8a28e', variant: "ghost", kind: "icon", class: { active: this.isActive }, title: this.t('chat.send_emoji') }, h("rtk-icon", { key: '47bd54c1593f7f5ea04eb96ccbca07ea3c22e511', icon: this.iconPack.emoji_multiple }))));
+        return (h("rtk-tooltip", { key: '45ef1f18da6d1ecc3c02882590cd22e930461562', label: this.t('chat.send_emoji') }, h("rtk-button", { key: '6504abab2f1c6537443699c53a8cbdcf13530cba', variant: "ghost", kind: "icon", class: { active: this.isActive }, title: this.t('chat.send_emoji') }, h("rtk-icon", { key: 'd730c81abce72d9c3226f1f666941e1136bee77f', icon: this.iconPack.emoji_multiple }))));
     }
     static get is() { return "rtk-emoji-picker-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -11,7 +11,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { Host, h } from "@stencil/core";
 import { useLanguage } from "../../lib/lang";
 import { defaultIconPack } from "../../lib/icons";
-import { defaultConfig } from "../../exports";
+import { createDefaultConfig } from "../../exports";
 import { SyncWithStore } from "../../utils/sync-with-store";
 /**
  * A screen which shows a meeting has ended.
@@ -19,7 +19,7 @@ import { SyncWithStore } from "../../utils/sync-with-store";
 export class RtkEndedScreen {
     constructor() {
         /** Config object */
-        this.config = defaultConfig;
+        this.config = createDefaultConfig();
         /** Icon */
         this.icon = defaultIconPack;
         /** Language */
@@ -75,6 +75,8 @@ export class RtkEndedScreen {
         return (h(Host, null, h("div", { class: "ctr", part: "container" }, h("rtk-icon", { icon: this.iconPack.breakout_rooms }), h("p", { part: "message", class: "breakout" }, this.t(this.message)))));
     }
     render() {
+        if (!this.meeting)
+            return null;
         const states = this.states;
         if (states.roomLeftState === 'connected-meeting') {
             return this.renderBreakoutRoomScreen();
@@ -117,7 +119,7 @@ export class RtkEndedScreen {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "defaultConfig"
+                "defaultValue": "createDefaultConfig()"
             },
             "size": {
                 "type": "string",
@@ -253,6 +255,9 @@ export class RtkEndedScreen {
             }];
     }
 }
+__decorate([
+    SyncWithStore()
+], RtkEndedScreen.prototype, "config", void 0);
 __decorate([
     SyncWithStore()
 ], RtkEndedScreen.prototype, "size", void 0);

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

@@ -37,7 +37,7 @@ export class RtkFileDropzone {
         });
     }
     render() {
-        return (h(Host, { key: '197cf2a1b1deff5e45125b4e489d020d474a02dd' }, h("div", { key: '84e88151d3080dc0bd9f44f22b401d605f7f286f', id: "dropzone", class: { active: this.dropzoneActivated }, part: "dropzone" }, h("rtk-icon", { key: 'debea53f3376bb54bca692aed0450cf218f576d3', icon: this.iconPack.attach }), h("p", { key: '19b161b26bd4acc13447c47f5ee17b9645f91cc3' }, this.t('chat.send_attachment')))));
+        return (h(Host, { key: '6a205001d1e1e1f7c54855005cab34b81e95c9b9' }, h("div", { key: 'b87bcc6c90819127b2783665e541b69ce49f1032', id: "dropzone", class: { active: this.dropzoneActivated }, part: "dropzone" }, h("rtk-icon", { key: '1f603086a79a170a4fc3f3df53df9cfdfbae73fe', icon: this.iconPack.attach }), h("p", { key: '0b4914a3fb881006b1af20533750e6b273a82a48' }, 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

@@ -33,10 +33,10 @@ export class RtkFileMessage {
     }
     render() {
         const link = sanitizeLink(this.message.link);
-        return (h(Host, { key: '25ff2cd29b951ffee9fb266ec4937258db527ef4' }, !this.isContinued && (h(ChatHead, { key: '50dc45f56ac2837215619c597f557c0e71e5fd85', name: this.message.displayName, time: this.message.time, now: this.now })), h("div", { key: '5b300ea679f835b6d7421568dde80aa38cbbc821', class: {
+        return (h(Host, { key: '7c75a7c9e627cddd7beeeadf11473894371395d8' }, !this.isContinued && (h(ChatHead, { key: 'c05c95453e3f878767770c6a261ebb90e2a06e7d', name: this.message.displayName, time: this.message.time, now: this.now })), h("div", { key: '69b824cc5d3d328a3b08cc4def693d86bd96a39b', class: {
                 body: true,
                 bubble: this.showBubble,
-            }, part: "body" }, h("div", { key: '895f033df99c8d9dfc1241bbaf5f20137b905395', class: "file" }, h("div", { key: '345bd0370a81c50c1ef46fa7119fa321213ad741', class: "file-data" }, h("div", { key: 'fb30c6c130af584d2f4294029c4304e213ddd339', class: "name" }, this.message.name), h("div", { key: 'd0de234e1697b196fe248bbfbad18109b59c20df', class: "file-data-split" }, h("div", { key: '635343bd7dbcbfeea1a7534c943be355decf20c4', class: "ext" }, getExtension(this.message.name)), h("span", { key: 'bd7772e273ae55297c99d8564cfa44e6dd1b43d0', class: "divider" }), h("div", { key: 'd6df3a4fca8932d3bcdeb805ef7b3bed1c3e8c15', class: "size" }, getFileSize(this.message.size)))), h("rtk-button", { key: '4b4d9be6f228e5deda5590f2aa6038b3501623d7', variant: "secondary", kind: "icon", onClick: () => downloadFile(link, { name: this.message.name, fallbackName: 'file' }), part: "button" }, h("rtk-icon", { key: '187e0b8f903bd7cd8b5f9e25ef2d6841299fe87f', icon: this.iconPack.download }))))));
+            }, part: "body" }, h("div", { key: '86315ca5ed3c9b9f48d84ffef9f52ebbd1d3515e', class: "file" }, h("div", { key: '3475ccfa9c266adb6fefefa1eadcc3d8b1fe37f1', class: "file-data" }, h("div", { key: 'e99e1b1c6acd5b7892d9916680cde1d937dfcb82', class: "name" }, this.message.name), h("div", { key: '4f213fd3a36d457da93e75b7b51573120978893c', class: "file-data-split" }, h("div", { key: '3484e59af9f316eabfcf9bc35f015a0d3b7d286d', class: "ext" }, getExtension(this.message.name)), h("span", { key: 'b223670e2ed2bbc84b1145123fe14ca52f5f0a88', class: "divider" }), h("div", { key: 'ebe6b5e3f8e6da099438a7015a3c2d10770808b6', class: "size" }, getFileSize(this.message.size)))), h("rtk-button", { key: '5a109a7b43db38b10e9d084f9fb141e5a0535d9b', variant: "secondary", kind: "icon", onClick: () => downloadFile(link, { name: this.message.name, fallbackName: 'file' }), part: "button" }, h("rtk-icon", { key: '57aaf2b09f11a066c298d675a06ec10202e18fc8', icon: this.iconPack.download }))))));
     }
     static get is() { return "rtk-file-message"; }
     static get properties() {
@@ -51,7 +51,7 @@ export class RtkFileMessage {
                         "FileMessage": {
                             "location": "import",
                             "path": "@cloudflare/realtimekit",
-                            "id": "../../node_modules/@cloudflare/realtimekit/dist/index.d.ts::FileMessage"
+                            "id": "node_modules::FileMessage"
                         }
                     }
                 },

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: '7bc636599452b840ae0a5467fcf579a883a98727', class: "file" }, h("rtk-button", { key: '98bfff6ca8aa598d296ff1f3b39994f8b839572c', variant: "secondary", kind: "icon", onClick: () => downloadFile(sanitizeLink(this.url), { name: this.name, fallbackName: 'file' }), part: "button" }, h("rtk-icon", { key: '26b9fe1b7e884ffa993e988eb94e18351eec8c25', icon: this.iconPack.download })), h("div", { key: 'c3d045925ef1a13039c44624930b96cd326d769f', class: "file-data" }, h("div", { key: '619e9cd8f72f342e31c334586e44813e2d3216ba', class: "name" }, this.name), h("div", { key: '71b788c2a10c8a7290da1f77d82c6b6e66746223', class: "file-data-split" }, h("div", { key: '550720228247cdaf766a84938df720bf95249bf5', class: "ext" }, getExtension(this.name)), h("span", { key: '2bb1940a95e5e06ec8a064a775ea2257ff80fcc7', class: "divider" }), h("div", { key: 'e5451bcd50b3e05d90b149a98b7c328711025827', class: "size" }, getFileSize(this.size))))));
+        return (h("div", { key: '5cc29b4780f581a2f8b045e5051bcc66f3fdaf55', class: "file" }, h("rtk-button", { key: '4100b47bc1d72f08ec5fe645291bfbb58e3a6486', variant: "secondary", kind: "icon", onClick: () => downloadFile(sanitizeLink(this.url), { name: this.name, fallbackName: 'file' }), part: "button" }, h("rtk-icon", { key: '52ae14abb7c27b89861d5ba4c907d606257628c9', icon: this.iconPack.download })), h("div", { key: '02c9ad8d173172a85cc474273a966607d456360e', class: "file-data" }, h("div", { key: '6ceca21685d04f175006ba35a6de194cc98879ad', class: "name" }, this.name), h("div", { key: 'b07d07bcaedee3fd6fbcfe81ce2f6bf757655b5f', class: "file-data-split" }, h("div", { key: '280635ef486de02bc68ca3e774be14fa5a461d1c', class: "ext" }, getExtension(this.name)), h("span", { key: '84f72d8b37b7d15c257faed036b76c737eec780b', class: "divider" }), h("div", { key: '1b88f48f51afe3fceb57920c3d17f586e848a25f', 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: 'ea570679bd495c1230a563d08496211e57645797', label: label }, h("rtk-button", { key: '894429d9abc652daf0d897fe3757b3a81dc06da2', variant: "ghost", kind: "icon", onClick: () => this.uploadFile(), title: label }, h("rtk-icon", { key: '12f9e9a114accb42178da6663f85cac8a3cf70e2', icon: icon }))));
+        return (h("rtk-tooltip", { key: '057a0a5a714dbbde228e3481e53adea4f88fb3ad', label: label }, h("rtk-button", { key: '04193df1053b14687fb9464a122b9158707bdda1', variant: "ghost", kind: "icon", onClick: () => this.uploadFile(), title: label }, h("rtk-icon", { key: 'ed2fce30b93dfce9dd6b967d5993c93496cf3388', icon: icon }))));
     }
     static get is() { return "rtk-file-picker-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -9,7 +9,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { Host, h } from "@stencil/core";
-import { defaultConfig } from "../../lib/default-ui-config";
+import { createDefaultConfig } from "../../lib/default-ui-config";
 import { defaultIconPack } from "../../lib/icons";
 import { useLanguage } from "../../lib/lang";
 import debounce from "lodash/debounce";
@@ -17,7 +17,6 @@ import { Render } from "../../lib/render";
 import { isLiveStreamViewer } from "../../utils/livestream";
 import { SyncWithStore } from "../../utils/sync-with-store";
 import { defaultGridSize } from "../../lib/grid";
-import { uiState } from "../../utils/sync-with-store/ui-store";
 const MASS_ACTIONS_DEBOUNCE_TIMER = 50; // In ms
 /**
  * The main grid component which abstracts all the grid handling logic and renders it for you.
@@ -42,7 +41,7 @@ export class RtkGrid {
         /** Gap between participants */
         this.gap = 8;
         /** Config object */
-        this.config = defaultConfig;
+        this.config = createDefaultConfig();
         /** Icon pack */
         this.iconPack = defaultIconPack;
         /** Language */
@@ -73,7 +72,7 @@ export class RtkGrid {
             return participants;
         };
         this.onViewModeChanged = () => {
-            if (this.meeting == null)
+            if (!this.meeting)
                 return;
             this.updateActiveParticipants();
         };
@@ -145,7 +144,7 @@ export class RtkGrid {
     }
     disconnectMeeting(meeting) {
         var _a;
-        if (meeting == null)
+        if (!meeting)
             return;
         this.participants = [];
         this.plugins = [];
@@ -227,24 +226,24 @@ export class RtkGrid {
     }
     screenShareParticipantsChanged(participants) {
         const activeScreenShare = participants.length > 0;
-        if (!!uiState.states.activeScreenShare === activeScreenShare)
+        if (!!this.states.activeScreenShare === activeScreenShare)
             return;
         this.stateUpdate.emit({ activeScreenShare });
-        uiState.states.activeScreenShare = activeScreenShare;
+        this.states.activeScreenShare = activeScreenShare;
     }
     pluginsChanged(plugins) {
         const activePlugin = plugins.length > 0;
-        if (!!uiState.states.activePlugin === activePlugin)
+        if (!!this.states.activePlugin === activePlugin)
             return;
         this.stateUpdate.emit({ activePlugin });
-        uiState.states.activePlugin = activePlugin;
+        this.states.activePlugin = activePlugin;
     }
     pinnedParticipantsChanged(participants) {
         const activeSpotlight = participants.length > 0;
-        if (!!uiState.states.activeSpotlight === activeSpotlight)
+        if (!!this.states.activeSpotlight === activeSpotlight)
             return;
         this.stateUpdate.emit({ activeSpotlight });
-        uiState.states.activeSpotlight = activeSpotlight;
+        this.states.activeSpotlight = activeSpotlight;
     }
     updateActiveParticipants() {
         var _a;
@@ -504,7 +503,7 @@ export class RtkGrid {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "defaultConfig"
+                "defaultValue": "createDefaultConfig()"
             },
             "iconPack": {
                 "type": "unknown",
@@ -670,6 +669,9 @@ __decorate([
 __decorate([
     SyncWithStore()
 ], RtkGrid.prototype, "states", void 0);
+__decorate([
+    SyncWithStore()
+], RtkGrid.prototype, "config", void 0);
 __decorate([
     SyncWithStore()
 ], RtkGrid.prototype, "iconPack", void 0);

package/dist/collection/components/rtk-grid-pagination/rtk-grid-pagination.js

@@ -63,7 +63,7 @@ export class RtkGridPagination {
             this.toggleGridPagination();
         }, MASS_ACTIONS_DEBOUNCE_TIMER);
         this.prevPage = () => {
-            if (this.meeting == null)
+            if (!this.meeting)
                 return;
             const { participants } = this.meeting;
             if (this.page > 1) {
@@ -74,7 +74,7 @@ export class RtkGridPagination {
             }
         };
         this.nextPage = () => {
-            if (this.meeting == null)
+            if (!this.meeting)
                 return;
             const { participants } = this.meeting;
             if (this.page > 0 && this.page < this.pageCount) {
@@ -90,7 +90,7 @@ export class RtkGridPagination {
         this.sizeChanged();
     }
     disconnectedCallback() {
-        if (this.meeting == null)
+        if (!this.meeting)
             return;
         const { participants, stage } = this.meeting;
         participants.removeListener('pageChanged', this.onPageChanged);
@@ -120,6 +120,8 @@ export class RtkGridPagination {
         this.toggleGridPagination();
     }
     render() {
+        if (!this.meeting)
+            return null;
         const { meta } = this.meeting;
         const isAudioRoom = (meta === null || meta === void 0 ? void 0 : meta.viewType) === 'AUDIO_ROOM';
         if (isAudioRoom || !this.showPagination) {

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

@@ -9,7 +9,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { Host, h } from "@stencil/core";
-import { defaultConfig, defaultIconPack } from "../../exports";
+import { createDefaultConfig, defaultIconPack } from "../../exports";
 import { useLanguage } from "../../lib/lang";
 import { Render } from "../../lib/render";
 import { SyncWithStore } from "../../utils/sync-with-store";
@@ -25,7 +25,7 @@ export class RtkHeader {
         /** Whether to render the default UI */
         this.disableRender = false;
         /** Config */
-        this.config = defaultConfig;
+        this.config = createDefaultConfig();
         /** Icon Pack */
         this.iconPack = defaultIconPack;
         /** Language */
@@ -40,7 +40,7 @@ export class RtkHeader {
             iconPack: this.iconPack,
             size: this.size,
         };
-        return (h(Host, { key: '0b3c18e3927465e198c26f79d810dadc31ebb74b' }, !this.disableRender && h(Render, { key: '480d2f17a6d831dabb3d39abceb33fbc1aa6d78d', element: "rtk-header", defaults: defaults, onlyChildren: true }), h("slot", { key: '67f89c4a3574ba22976d3aa57268aabe4ce78d2a' })));
+        return (h(Host, { key: '783db656f391fc45ab6f59770a18506d2f0f83de' }, !this.disableRender && h(Render, { key: '9f5f954191c34e6d117fc9c53a0708bfe4e2e392', element: "rtk-header", defaults: defaults, onlyChildren: true }), h("slot", { key: '0dd3257b0a4702c96582139d03f59b154264b438' })));
     }
     static get is() { return "rtk-header"; }
     static get encapsulation() { return "shadow"; }
@@ -141,7 +141,7 @@ export class RtkHeader {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "defaultConfig"
+                "defaultValue": "createDefaultConfig()"
             },
             "states": {
                 "type": "unknown",
@@ -245,6 +245,9 @@ export class RtkHeader {
 __decorate([
     SyncWithStore()
 ], RtkHeader.prototype, "meeting", void 0);
+__decorate([
+    SyncWithStore()
+], RtkHeader.prototype, "config", void 0);
 __decorate([
     SyncWithStore()
 ], RtkHeader.prototype, "states", void 0);