@cloudflare/realtimekit-ui 1.0.0-staging.6 → 1.0.0-staging.8

package/dist/components/rtk-message-list-view.js

@@ -1,9 +1,9 @@
-import { p as proxyCustomElement, H, w as writeTask, h } from './p-3bfd5b6d.js';
-import { a as defaultIconPack } from './p-53b020e2.js';
+import { p as proxyCustomElement, H, w as writeTask, h } from './p-c3592601.js';
+import { a as defaultIconPack } from './p-e6d09c50.js';
 import './p-a83ccdbd.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$3 } from './p-bed2e1b5.js';
-import { d as defineCustomElement$2 } from './p-efc19d8d.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$3 } from './p-2f2fb96d.js';
+import { d as defineCustomElement$2 } from './p-1947c106.js';
 import { d as debounce } from './p-a08b5a59.js';
 
 const rtkMessageListViewCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}.scrollbar{scrollbar-width:thin;scrollbar-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))\n    var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar{height:var(--rtk-space-1\\.5, 6px);width:var(--rtk-space-1\\.5, 6px);border-radius:9999px;background-color:var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar-thumb{border-radius:9999px;background-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))}.loading{cursor:wait}.content-wrapper{height:100%;overflow-y:auto;position:relative;contain:strict}.scroller{width:1px;opacity:0}.content{position:absolute;top:0;width:100%}.smallest-dom-element{width:100%;height:2px;background:red}.loader{margin-top:var(--rtk-space-2, 8px);margin-bottom:var(--rtk-space-2, 8px);display:flex;justify-content:center}";

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

@@ -1,4 +1,4 @@
-import { R as RtkMessageView$1, d as defineCustomElement$1 } from './p-46ff9ad9.js';
+import { R as RtkMessageView$1, d as defineCustomElement$1 } from './p-00649ab8.js';
 
 const RtkMessageView = RtkMessageView$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-mic-toggle.js

@@ -1,10 +1,10 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-3bfd5b6d.js';
-import { a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$5 } from './p-7ad5bf75.js';
-import { d as defineCustomElement$4 } from './p-bed2e1b5.js';
-import { d as defineCustomElement$3 } from './p-efc19d8d.js';
-import { d as defineCustomElement$2 } from './p-bffc1ba5.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
+import { a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$5 } from './p-dc23e204.js';
+import { d as defineCustomElement$4 } from './p-2f2fb96d.js';
+import { d as defineCustomElement$3 } from './p-1947c106.js';
+import { d as defineCustomElement$2 } from './p-e3b59650.js';
 
 const rtkMicToggleCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:block}:host([data-hidden]){display:none}:host(.audioDisabled) :slotted(rtk-icon){--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}";
 const RtkMicToggleStyle0 = rtkMicToggleCss;

package/dist/components/rtk-microphone-selector.js

@@ -1,4 +1,4 @@
-import { R as RtkMicrophoneSelector$1, d as defineCustomElement$1 } from './p-2f01fa36.js';
+import { R as RtkMicrophoneSelector$1, d as defineCustomElement$1 } from './p-a41e1b94.js';
 
 const RtkMicrophoneSelector = RtkMicrophoneSelector$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,14 +1,14 @@
-import { p as proxyCustomElement, H, h, e as Host } from './p-3bfd5b6d.js';
-import { d as defaultConfig, a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
+import { p as proxyCustomElement, H, h, e as Host } from './p-c3592601.js';
+import { d as defaultConfig, a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
 import { d as defaultGridSize } from './p-b13ddb7d.js';
-import { R as Render } from './p-de7f1269.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$7 } from './p-ba1a0ebf.js';
-import { d as defineCustomElement$6 } from './p-bed2e1b5.js';
-import { d as defineCustomElement$5 } from './p-25969351.js';
-import { d as defineCustomElement$4 } from './p-a4182a97.js';
-import { d as defineCustomElement$3 } from './p-bb4322af.js';
-import { d as defineCustomElement$2 } from './p-bffc1ba5.js';
+import { R as Render } from './p-60fdbd75.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$7 } from './p-4cc0e9a5.js';
+import { d as defineCustomElement$6 } from './p-2f2fb96d.js';
+import { d as defineCustomElement$5 } from './p-e2b78972.js';
+import { d as defineCustomElement$4 } from './p-a24309fd.js';
+import { d as defineCustomElement$3 } from './p-260b86da.js';
+import { d as defineCustomElement$2 } from './p-e3b59650.js';
 
 const rtkMixedGridCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:block;height:100%;width:100%;display:flex}main{display:flex;flex:1 1 0%;padding-left:var(--rtk-space-4, 16px)}:host([layout='column']) main{padding-left:var(--rtk-space-4, 16px);padding-right:var(--rtk-space-4, 16px)}main rtk-tab-bar{margin-right:var(--rtk-space-4, 16px);box-sizing:border-box;display:flex;height:100%;width:var(--rtk-space-16, 64px);flex-direction:column}main #tabs{height:100%;flex:1 1 0%}rtk-button{z-index:10}.grid-width-sm{width:25%}.grid-width-md{width:50%}.grid-width-lg{width:66.666667%}.col{display:flex;flex-direction:column;align-items:center}.tab{display:flex;height:var(--rtk-space-16, 64px);width:var(--rtk-space-16, 64px);align-items:center;justify-content:center;margin-bottom:var(--rtk-space-2, 8px);font-size:12px;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity))}.tab.active{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity))}.tab img{height:var(--rtk-space-7, 28px);width:var(--rtk-space-7, 28px);border-radius:var(--rtk-border-radius-sm, 4px)}:host([size='sm']){flex-direction:column}:host([size='sm']) .grid-width-lg,:host([size='sm']) .grid-width-md{height:50%;width:100%;max-width:100%}:host([size='sm']) .grid-width-sm{height:33.333333%;width:100%;max-width:100%}:host([size='sm']) main{display:flex;flex:1 1 0%;flex-direction:column;padding-left:var(--rtk-space-4, 16px);padding-right:var(--rtk-space-4, 16px)}:host([size='sm']) rtk-tab-bar{height:var(--rtk-space-12, 48px);width:100%;flex-direction:row}:host([size='sm']) #tabs{flex:1 1 0%}:host([size='sm']) .tab{margin:var(--rtk-space-0, 0px);margin-right:var(--rtk-space-2, 8px)}:host([layout='column']){flex-direction:column}:host([layout='column']) main{display:flex;flex:1 1 0%}:host([layout='column']) .grid-width-lg,:host([layout='column']) .grid-width-md{height:50%;max-width:100%;width:100%}:host([layout='column']) .grid-width-sm{height:33.333333%;max-width:100%;width:100%}@media (orientation: portrait){:host{flex-direction:column}:host .grid-width-lg{height:50%;width:100%;max-width:100%}:host .grid-width-md{height:33.333333%;width:100%;max-width:100%}:host .grid-width-sm{height:25%;width:100%;max-width:100%}:host main{flex:1 1 0%;flex-direction:column;padding-left:var(--rtk-space-4, 16px);padding-right:var(--rtk-space-4, 16px)}:host([size='md']) main{flex:1 1 0%;flex-direction:column;padding-left:var(--rtk-space-4, 16px);padding-right:var(--rtk-space-4, 16px)}:host rtk-tab-bar{height:var(--rtk-space-16, 64px);width:100%;flex-direction:row}:host #tabs{flex:1 1 0%}:host .tab{margin:var(--rtk-space-0, 0px);margin-right:var(--rtk-space-2, 8px)}}@media (orientation: landscape){:host{flex-direction:row}:host([size='sm']){flex-direction:row}:host .grid-width-lg{height:50%;width:100%;max-width:100%}:host([size='sm']) .grid-width-sm{height:100%;max-height:100%;width:16.666667%}:host([size='sm']) main{flex:1 1 0%;flex-direction:row;padding-left:var(--rtk-space-2, 8px);padding-right:var(--rtk-space-2, 8px)}:host([size='md']) main{flex:1 1 0%;flex-direction:row;padding-left:var(--rtk-space-4, 16px);padding-right:var(--rtk-space-4, 16px)}:host([size='sm']) rtk-tab-bar{margin-right:var(--rtk-space-2, 8px);height:100%;width:var(--rtk-space-12, 48px);flex-direction:column}:host #tabs{flex:1 1 0%}:host .tab{margin:var(--rtk-space-0, 0px);margin-right:var(--rtk-space-2, 8px)}}";
 const RtkMixedGridStyle0 = rtkMixedGridCss;

package/dist/components/rtk-more-toggle.js

@@ -1,9 +1,9 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-3bfd5b6d.js';
-import { a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$4 } from './p-7ad5bf75.js';
-import { d as defineCustomElement$3 } from './p-bed2e1b5.js';
-import { d as defineCustomElement$2 } from './p-efc19d8d.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
+import { a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$4 } from './p-dc23e204.js';
+import { d as defineCustomElement$3 } from './p-2f2fb96d.js';
+import { d as defineCustomElement$2 } from './p-1947c106.js';
 
 const rtkMoreToggleCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{position:relative;display:flex;flex-direction:column;overflow:visible}.more-menu{position:absolute;right:calc(var(--rtk-space-24, 96px) * -1);bottom:var(--rtk-space-16, 64px);z-index:50;margin-bottom:var(--rtk-space-3, 12px);box-sizing:border-box;max-height:60vh;width:var(--rtk-space-64, 256px);overflow:auto;border-radius:var(--rtk-border-radius-md, 8px);border-width:var(--rtk-border-width-sm, 1px);border-style:solid;--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity));outline:2px solid transparent;outline-offset:2px;display:flex;flex-direction:column;align-items:stretch}:host([size='sm']) .more-menu{bottom:var(--rtk-space-10, 40px)}.more-menu::-webkit-scrollbar{height:var(--rtk-space-0, 0px);width:var(--rtk-space-1\\.5, 6px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-900, 26 26 26) / var(--tw-bg-opacity))}.more-menu::-webkit-scrollbar-thumb{border-radius:var(--rtk-border-radius-sm, 4px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity))}";
 const RtkMoreToggleStyle0 = rtkMoreToggleCss;

package/dist/components/rtk-mute-all-button.js

@@ -1,11 +1,11 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-3bfd5b6d.js';
-import { a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
+import { a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
 import './p-a83ccdbd.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$5 } from './p-7ad5bf75.js';
-import { d as defineCustomElement$4 } from './p-bed2e1b5.js';
-import { d as defineCustomElement$3 } from './p-efc19d8d.js';
-import { d as defineCustomElement$2 } from './p-bffc1ba5.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$5 } from './p-dc23e204.js';
+import { d as defineCustomElement$4 } from './p-2f2fb96d.js';
+import { d as defineCustomElement$3 } from './p-1947c106.js';
+import { d as defineCustomElement$2 } from './p-e3b59650.js';
 
 const rtkMuteAllButtonCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:block}";
 const RtkMuteAllButtonStyle0 = rtkMuteAllButtonCss;

package/dist/components/rtk-mute-all-confirmation.js

@@ -1,4 +1,4 @@
-import { R as RtkMuteAllConfirmation$1, d as defineCustomElement$1 } from './p-906cb5bf.js';
+import { R as RtkMuteAllConfirmation$1, d as defineCustomElement$1 } from './p-135d5d2f.js';
 
 const RtkMuteAllConfirmation = RtkMuteAllConfirmation$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-name-tag.js

@@ -1,4 +1,4 @@
-import { R as RtkNameTag$1, d as defineCustomElement$1 } from './p-212ce4b8.js';
+import { R as RtkNameTag$1, d as defineCustomElement$1 } from './p-10759cad.js';
 
 const RtkNameTag = RtkNameTag$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-network-indicator.js

@@ -1,8 +1,8 @@
-import { p as proxyCustomElement, H, h, e as Host } from './p-3bfd5b6d.js';
-import { a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
+import { p as proxyCustomElement, H, h, e as Host } from './p-c3592601.js';
+import { a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
 import './p-a83ccdbd.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$2 } from './p-bed2e1b5.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$2 } from './p-2f2fb96d.js';
 
 const rtkNetworkIndicatorCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{position:relative;display:block;height:var(--rtk-space-7, 28px);width:var(--rtk-space-7, 28px)}rtk-icon{position:absolute;top:var(--rtk-space-0, 0px);right:var(--rtk-space-0, 0px);bottom:var(--rtk-space-0, 0px);left:var(--rtk-space-0, 0px);z-index:10;height:100%;width:100%;--tw-text-opacity:1;color:rgba(var(--rtk-colors-success, 98 165 4) / var(--tw-text-opacity))}rtk-icon.good{--tw-text-opacity:1;color:rgba(var(--rtk-colors-success, 98 165 4) / var(--tw-text-opacity))}rtk-icon.poor{--tw-text-opacity:1;color:rgba(var(--rtk-colors-warning, 255 205 7) / var(--tw-text-opacity))}rtk-icon.poorest{--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}:host([size='md']){height:var(--rtk-space-6, 24px);width:var(--rtk-space-6, 24px)}:host([size='sm']){height:var(--rtk-space-5, 20px);width:var(--rtk-space-5, 20px)}.bg-signal{position:absolute;top:var(--rtk-space-0, 0px);right:var(--rtk-space-0, 0px);bottom:var(--rtk-space-0, 0px);left:var(--rtk-space-0, 0px);z-index:0;color:rgb(var(--rtk-colors-text-600, 255 255 255 / 0.52))}";
 const RtkNetworkIndicatorStyle0 = rtkNetworkIndicatorCss;

package/dist/components/rtk-notification.js

@@ -1,4 +1,4 @@
-import { R as RtkNotification$1, d as defineCustomElement$1 } from './p-aec1ab2d.js';
+import { R as RtkNotification$1, d as defineCustomElement$1 } from './p-20354866.js';
 
 const RtkNotification = RtkNotification$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-notifications.js

@@ -1,4 +1,4 @@
-import { R as RtkNotifications$1, d as defineCustomElement$1 } from './p-963d619f.js';
+import { R as RtkNotifications$1, d as defineCustomElement$1 } from './p-caf8596c.js';
 
 const RtkNotifications = RtkNotifications$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-overlay-modal.js

@@ -1,4 +1,4 @@
-import { R as RtkOverlayModal$1, d as defineCustomElement$1 } from './p-ae1931dd.js';
+import { R as RtkOverlayModal$1, d as defineCustomElement$1 } from './p-0f937441.js';
 
 const RtkOverlayModal = RtkOverlayModal$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-paginated-list.js

@@ -1,4 +1,4 @@
-import { R as RtkPaginatedList$1, d as defineCustomElement$1 } from './p-613b7d98.js';
+import { R as RtkPaginatedList$1, d as defineCustomElement$1 } from './p-7d26c3e0.js';
 
 const RtkPaginatedList = RtkPaginatedList$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-participant-count.js

@@ -1,9 +1,9 @@
-import { p as proxyCustomElement, H, h, e as Host } from './p-3bfd5b6d.js';
-import { a as defaultIconPack, c as useLanguage, m as isLiveStreamViewer } from './p-53b020e2.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$2 } from './p-bed2e1b5.js';
+import { p as proxyCustomElement, H, h, e as Host } from './p-c3592601.js';
+import { a as defaultIconPack, c as useLanguage, m as isLiveStreamViewer } from './p-e6d09c50.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$2 } from './p-2f2fb96d.js';
 
-const rtkParticipantCountCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{margin-left:var(--rtk-space-2, 8px);margin-right:var(--rtk-space-2, 8px);display:inline-flex;height:var(--rtk-space-10, 40px);-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center}:host([size='sm']){margin-left:var(--rtk-space-1, 4px);margin-right:var(--rtk-space-1, 4px);font-size:12px}rtk-icon{margin-right:var(--rtk-space-1, 4px);height:var(--rtk-space-5, 20px);width:var(--rtk-space-5, 20px)}:host([size='sm']) rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px)}";
+const rtkParticipantCountCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:inline-flex;height:var(--rtk-space-10, 40px);-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center}:host([data-hidden]){display:none}:host([size='sm']){font-size:12px}rtk-icon{margin-right:var(--rtk-space-1, 4px);height:var(--rtk-space-5, 20px);width:var(--rtk-space-5, 20px)}:host([size='sm']) rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px)}";
 const RtkParticipantCountStyle0 = rtkParticipantCountCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -66,7 +66,7 @@ const RtkParticipantCount$1 = /*@__PURE__*/ proxyCustomElement(class RtkParticip
     }
     render() {
         if (this.isViewer)
-            return null;
+            return h(Host, { "data-hidden": true });
         return (h(Host, { tabIndex: 0, role: "log", "aria-label": `${this.participantCount} ${this.t('participants')}` }, h("rtk-icon", { icon: this.iconPack.people, tabIndex: -1, "aria-hidden": true, part: "icon" }), this.participantCount));
     }
     static get watchers() { return {

package/dist/components/rtk-participant-setup.js

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, h, e as Host } from './p-3bfd5b6d.js';
-import { d as defaultConfig, a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
+import { p as proxyCustomElement, H, h, e as Host } from './p-c3592601.js';
+import { d as defaultConfig, a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
 import './p-a83ccdbd.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
+import { S as SyncWithStore } from './p-d5791958.js';
 
 const rtkParticipantSetupCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:16 / 9;height:var(--rtk-space-56, 224px);overflow:hidden;border-radius:var(--rtk-border-radius-lg, 12px);-webkit-user-select:none;-moz-user-select:none;user-select:none;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-video-bg, 24 24 24) / var(--tw-bg-opacity));transition-property:var(--rtk-transition-property, all);transition-duration:150ms}@media (prefers-reduced-motion){:host{--rtk-transition-property:none}}:host([size='sm'][variant='solid']) ::slotted(rtk-name-tag){left:var(--rtk-space-2, 8px);bottom:var(--rtk-space-2, 8px);height:var(--rtk-space-4, 16px)}video{display:none;position:absolute;height:100%;width:100%;border-radius:var(--rtk-border-radius-lg, 12px)}video.contain{-o-object-fit:contain;object-fit:contain}video.cover{-o-object-fit:cover;object-fit:cover}video.visible{display:block}video::-webkit-media-controls{display:none !important}:host([variant='gradient']) ::slotted(rtk-audio-visualizer){position:absolute;top:var(--rtk-space-2, 8px);right:var(--rtk-space-2, 8px);border-radius:9999px;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity));padding:var(--rtk-space-2, 8px)}:host([variant='gradient']) ::slotted(rtk-name-tag){bottom:var(--rtk-space-0, 0px);left:var(--rtk-space-0, 0px);display:flex;width:100%;align-items:center;justify-content:center;text-align:center;background-color:transparent;background-image:linear-gradient(to top, var(--tw-gradient-stops));--tw-gradient-from:rgb(var(--rtk-colors-background-1000, 8 8 8));--tw-gradient-to:rgba(var(--rtk-colors-background-1000, 8 8 8) / 0);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to);--tw-gradient-to:transparent}video.mirror{transform:scaleX(-1)}@media (orientation: portrait){:host{height:var(--rtk-space-44, 176px)}}";
 const RtkParticipantSetupStyle0 = rtkParticipantSetupCss;

package/dist/components/rtk-participant-tile.js

@@ -1,4 +1,4 @@
-import { R as RtkParticipantTile$1, d as defineCustomElement$1 } from './p-df1632fd.js';
+import { R as RtkParticipantTile$1, d as defineCustomElement$1 } from './p-0e13b6ee.js';
 
 const RtkParticipantTile = RtkParticipantTile$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-participant.js

@@ -1,4 +1,4 @@
-import { R as RtkParticipant$1, d as defineCustomElement$1 } from './p-eebae590.js';
+import { R as RtkParticipant$1, d as defineCustomElement$1 } from './p-d262b31f.js';
 
 const RtkParticipant = RtkParticipant$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-participants-audio.js

@@ -1,10 +1,10 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-3bfd5b6d.js';
-import { e as disableSettingSinkId, a as defaultIconPack, c as useLanguage, m as isLiveStreamViewer } from './p-53b020e2.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
+import { e as disableSettingSinkId, a as defaultIconPack, c as useLanguage, m as isLiveStreamViewer } from './p-e6d09c50.js';
 import { l as logger } from './p-5605a420.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$4 } from './p-ba1a0ebf.js';
-import { d as defineCustomElement$3 } from './p-71133697.js';
-import { d as defineCustomElement$2 } from './p-bed2e1b5.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$4 } from './p-4cc0e9a5.js';
+import { d as defineCustomElement$3 } from './p-bd9a0ef8.js';
+import { d as defineCustomElement$2 } from './p-2f2fb96d.js';
 
 /**
  * Handles audio from participants in a meeting

package/dist/components/rtk-participants-stage-list.js

@@ -1,4 +1,4 @@
-import { R as RtkParticipants, d as defineCustomElement$1 } from './p-12aa04c2.js';
+import { R as RtkParticipants, d as defineCustomElement$1 } from './p-664f872d.js';
 
 const RtkParticipantsStageList = RtkParticipants;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-participants-stage-queue.js

@@ -1,4 +1,4 @@
-import { R as RtkParticipantsStaged, d as defineCustomElement$1 } from './p-46ab4375.js';
+import { R as RtkParticipantsStaged, d as defineCustomElement$1 } from './p-c00de10a.js';
 
 const RtkParticipantsStageQueue = RtkParticipantsStaged;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-participants-toggle.js

@@ -1,10 +1,10 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-3bfd5b6d.js';
-import { a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
-import { a as canViewParticipants } from './p-94443423.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$4 } from './p-7ad5bf75.js';
-import { d as defineCustomElement$3 } from './p-bed2e1b5.js';
-import { d as defineCustomElement$2 } from './p-efc19d8d.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
+import { a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
+import { a as canViewParticipants } from './p-c11b2f37.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$4 } from './p-dc23e204.js';
+import { d as defineCustomElement$3 } from './p-2f2fb96d.js';
+import { d as defineCustomElement$2 } from './p-1947c106.js';
 
 const rtkParticipantsToggleCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{position:relative;display:block}:host([data-hidden]){display:none}.waiting-participants-count{position:absolute;right:var(--rtk-space-3, 12px);box-sizing:border-box;padding:var(--rtk-space-0\\.5, 2px);-webkit-user-select:none;-moz-user-select:none;user-select:none;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity));font-size:12px;display:flex;height:var(--rtk-space-5, 20px);min-width:var(--rtk-space-5, 20px);align-items:center;justify-content:center;border-radius:9999px;z-index:1}:host([variant='horizontal']) .waiting-participants-count{right:var(--rtk-space-4, 16px);top:50%;--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}";
 const RtkParticipantsToggleStyle0 = rtkParticipantsToggleCss;
@@ -113,16 +113,22 @@ const RtkParticipantsToggle$1 = /*@__PURE__*/ proxyCustomElement(class RtkPartic
             activeAI: false,
         });
     }
+    handleParticipantsActiveChange() {
+        // Participants sidebar closed without opening a different sidebar
+        if (!this.participantsActive && !this.states.activeSidebar) {
+            this.buttonEl.focus();
+        }
+    }
     render() {
         if (!this.canViewParticipants)
             return h(Host, { "data-hidden": true });
         const text = this.t('participants');
-        // const badgeCount = this.waitlistedParticipants.length + this.stageRequestedParticipants.length;
-        return (h(Host, { title: text }, this.badgeCount !== 0 && !this.participantsActive && (h("div", { class: "waiting-participants-count", part: "waiting-participants-count" }, h("span", null, this.badgeCount <= 100 ? this.badgeCount : '99+'))), h("rtk-controlbar-button", { part: "controlbar-button", size: this.size, iconPack: this.iconPack, class: { active: this.participantsActive }, onClick: () => this.toggleParticipantsTab(), icon: this.iconPack.participants, label: text, variant: this.variant })));
+        return (h(Host, { title: text }, this.badgeCount !== 0 && !this.participantsActive && (h("div", { class: "waiting-participants-count", part: "waiting-participants-count" }, h("span", null, this.badgeCount <= 100 ? this.badgeCount : '99+'))), h("rtk-controlbar-button", { ref: (el) => (this.buttonEl = el), part: "controlbar-button", size: this.size, iconPack: this.iconPack, class: { active: this.participantsActive }, onClick: () => this.toggleParticipantsTab(), icon: this.iconPack.participants, label: text, variant: this.variant })));
     }
     static get watchers() { return {
         "meeting": ["meetingChanged"],
-        "states": ["statesChanged"]
+        "states": ["statesChanged"],
+        "participantsActive": ["handleParticipantsActiveChange"]
     }; }
     static get style() { return RtkParticipantsToggleStyle0; }
 }, [1, "rtk-participants-toggle", {
@@ -139,7 +145,8 @@ const RtkParticipantsToggle$1 = /*@__PURE__*/ proxyCustomElement(class RtkPartic
         "canViewParticipants": [32]
     }, undefined, {
         "meeting": ["meetingChanged"],
-        "states": ["statesChanged"]
+        "states": ["statesChanged"],
+        "participantsActive": ["handleParticipantsActiveChange"]
     }]);
 __decorate([
     SyncWithStore()

package/dist/components/rtk-participants-viewer-list.js

@@ -1,4 +1,4 @@
-import { R as RtkParticipantsViewers, d as defineCustomElement$1 } from './p-90bd27de.js';
+import { R as RtkParticipantsViewers, d as defineCustomElement$1 } from './p-56586bc8.js';
 
 const RtkParticipantsViewerList = RtkParticipantsViewers;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-participants-waiting-list.js

@@ -1,4 +1,4 @@
-import { R as RtkParticipantsWaitlisted, d as defineCustomElement$1 } from './p-c4482ff1.js';
+import { R as RtkParticipantsWaitlisted, d as defineCustomElement$1 } from './p-78444f97.js';
 
 const RtkParticipantsWaitingList = RtkParticipantsWaitlisted;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-participants.js

@@ -1,21 +1,21 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-3bfd5b6d.js';
-import { d as defaultConfig, a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
+import { d as defaultConfig, a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
 import './p-a83ccdbd.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$f } from './p-6fa3c2fa.js';
-import { d as defineCustomElement$e } from './p-ba1a0ebf.js';
-import { d as defineCustomElement$d } from './p-bed2e1b5.js';
-import { d as defineCustomElement$c } from './p-641ba920.js';
-import { d as defineCustomElement$b } from './p-1d055d3f.js';
-import { d as defineCustomElement$a } from './p-eebae590.js';
-import { d as defineCustomElement$9 } from './p-12aa04c2.js';
-import { d as defineCustomElement$8 } from './p-46ab4375.js';
-import { d as defineCustomElement$7 } from './p-90bd27de.js';
-import { d as defineCustomElement$6 } from './p-c4482ff1.js';
-import { d as defineCustomElement$5 } from './p-1dcb723e.js';
-import { d as defineCustomElement$4 } from './p-efc19d8d.js';
-import { d as defineCustomElement$3 } from './p-bffc1ba5.js';
-import { d as defineCustomElement$2 } from './p-51b56b52.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$f } from './p-7373cc7e.js';
+import { d as defineCustomElement$e } from './p-4cc0e9a5.js';
+import { d as defineCustomElement$d } from './p-2f2fb96d.js';
+import { d as defineCustomElement$c } from './p-10182034.js';
+import { d as defineCustomElement$b } from './p-c7dcb441.js';
+import { d as defineCustomElement$a } from './p-d262b31f.js';
+import { d as defineCustomElement$9 } from './p-664f872d.js';
+import { d as defineCustomElement$8 } from './p-c00de10a.js';
+import { d as defineCustomElement$7 } from './p-56586bc8.js';
+import { d as defineCustomElement$6 } from './p-78444f97.js';
+import { d as defineCustomElement$5 } from './p-59ea0ce1.js';
+import { d as defineCustomElement$4 } from './p-1947c106.js';
+import { d as defineCustomElement$3 } from './p-e3b59650.js';
+import { d as defineCustomElement$2 } from './p-2973e211.js';
 import { d as debounce } from './p-a08b5a59.js';
 
 const rtkParticipantsCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}.scrollbar{scrollbar-width:thin;scrollbar-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))\n    var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar{height:var(--rtk-space-1\\.5, 6px);width:var(--rtk-space-1\\.5, 6px);border-radius:9999px;background-color:var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar-thumb{border-radius:9999px;background-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))}:host{display:flex;height:100%;width:100%;flex-direction:column;font-size:14px}*{box-sizing:border-box}.ctr{margin-top:var(--rtk-space-2, 8px);margin-bottom:var(--rtk-space-2, 8px);box-sizing:border-box;padding-left:var(--rtk-space-3, 12px);padding-right:var(--rtk-space-3, 12px);padding-top:var(--rtk-space-0, 0px);padding-bottom:var(--rtk-space-0, 0px);overflow-y:auto;flex-grow:1;flex-basis:0}.ctr.virtualised{overflow-y:hidden}.search{position:sticky;box-sizing:border-box;display:flex;align-items:center;border-radius:var(--rtk-border-radius-sm, 4px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity));margin-left:var(--rtk-space-3, 12px);margin-right:var(--rtk-space-3, 12px);margin-top:var(--rtk-space-0, 0px);margin-bottom:var(--rtk-space-0, 0px)}.search rtk-icon{margin-left:var(--rtk-space-2, 8px);margin-right:var(--rtk-space-2, 8px);height:var(--rtk-space-5, 20px);width:var(--rtk-space-5, 20px);color:rgb(var(--rtk-colors-text-600, 255 255 255 / 0.52))}.search input{box-sizing:border-box;height:var(--rtk-space-9, 36px);width:100%;padding-right:var(--rtk-space-2, 8px);border-width:var(--rtk-border-width-none, 0);border-style:none;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-1000, 255 255 255));outline:2px solid transparent;outline-offset:2px;border-radius:var(--rtk-border-radius-sm, 4px);font-size:14px}.search input::-moz-placeholder{color:rgb(var(--rtk-colors-text-800, 255 255 255 / 0.76))}.search input::placeholder{color:rgb(var(--rtk-colors-text-800, 255 255 255 / 0.76))}:host([size='md']) .search{margin-top:var(--rtk-space-4, 16px) !important;margin-bottom:var(--rtk-space-4, 16px) !important}:host([size='sm']) .search{margin-top:var(--rtk-space-4, 16px) !important;margin-bottom:var(--rtk-space-4, 16px) !important}.no-pending-requests{margin-top:var(--rtk-space-4, 16px);margin-bottom:var(--rtk-space-4, 16px);text-align:center;font-size:12px;color:rgb(var(--rtk-colors-text-700, 255 255 255 / 0.64))}";

package/dist/components/rtk-permissions-message.js

@@ -1,4 +1,4 @@
-import { R as RtkPermissionsMessage$1, d as defineCustomElement$1 } from './p-d17beb97.js';
+import { R as RtkPermissionsMessage$1, d as defineCustomElement$1 } from './p-d3ca55ba.js';
 
 const RtkPermissionsMessage = RtkPermissionsMessage$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-pip-toggle.js

@@ -1,10 +1,10 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-3bfd5b6d.js';
-import { d as defaultConfig, a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
+import { d as defaultConfig, a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
 import './p-a83ccdbd.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$4 } from './p-7ad5bf75.js';
-import { d as defineCustomElement$3 } from './p-bed2e1b5.js';
-import { d as defineCustomElement$2 } from './p-efc19d8d.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$4 } from './p-dc23e204.js';
+import { d as defineCustomElement$3 } from './p-2f2fb96d.js';
+import { d as defineCustomElement$2 } from './p-1947c106.js';
 
 const rtkPipToggleCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:block}:host([data-hidden]){display:none}";
 const RtkPipToggleStyle0 = rtkPipToggleCss;

package/dist/components/rtk-plugin-main.js

@@ -1,4 +1,4 @@
-import { R as RtkPluginMain$1, d as defineCustomElement$1 } from './p-25969351.js';
+import { R as RtkPluginMain$1, d as defineCustomElement$1 } from './p-e2b78972.js';
 
 const RtkPluginMain = RtkPluginMain$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-plugins-toggle.js

@@ -1,10 +1,10 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-3bfd5b6d.js';
-import { a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
-import { b as canViewPlugins } from './p-94443423.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$4 } from './p-7ad5bf75.js';
-import { d as defineCustomElement$3 } from './p-bed2e1b5.js';
-import { d as defineCustomElement$2 } from './p-efc19d8d.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
+import { a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
+import { b as canViewPlugins } from './p-c11b2f37.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$4 } from './p-dc23e204.js';
+import { d as defineCustomElement$3 } from './p-2f2fb96d.js';
+import { d as defineCustomElement$2 } from './p-1947c106.js';
 
 const rtkPluginsToggleCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:block}:host([data-hidden]){display:none}";
 const RtkPluginsToggleStyle0 = rtkPluginsToggleCss;
@@ -69,15 +69,22 @@ const RtkPluginsToggle$1 = /*@__PURE__*/ proxyCustomElement(class RtkPluginsTogg
             activeAI: false,
         });
     }
+    handlePluginsActiveChange() {
+        // Plugins sidebar closed without opening a different sidebar
+        if (!this.pluginsActive && !this.states.activeSidebar) {
+            this.buttonEl.focus();
+        }
+    }
     render() {
         if (!this.canViewPlugins)
             return h(Host, { "data-hidden": true });
         const text = this.t('plugins');
-        return (h(Host, { title: text }, h("rtk-controlbar-button", { part: "controlbar-button", size: this.size, iconPack: this.iconPack, class: { active: this.pluginsActive }, onClick: () => this.togglePlugins(), icon: this.iconPack.rocket, label: text, variant: this.variant })));
+        return (h(Host, { title: text }, h("rtk-controlbar-button", { ref: (el) => (this.buttonEl = el), part: "controlbar-button", size: this.size, iconPack: this.iconPack, class: { active: this.pluginsActive }, onClick: () => this.togglePlugins(), icon: this.iconPack.rocket, label: text, variant: this.variant })));
     }
     static get watchers() { return {
         "meeting": ["meetingChanged"],
-        "states": ["statesChanged"]
+        "states": ["statesChanged"],
+        "pluginsActive": ["handlePluginsActiveChange"]
     }; }
     static get style() { return RtkPluginsToggleStyle0; }
 }, [1, "rtk-plugins-toggle", {
@@ -91,7 +98,8 @@ const RtkPluginsToggle$1 = /*@__PURE__*/ proxyCustomElement(class RtkPluginsTogg
         "canViewPlugins": [32]
     }, undefined, {
         "meeting": ["meetingChanged"],
-        "states": ["statesChanged"]
+        "states": ["statesChanged"],
+        "pluginsActive": ["handlePluginsActiveChange"]
     }]);
 __decorate([
     SyncWithStore()

package/dist/components/rtk-plugins.js

@@ -1,4 +1,4 @@
-import { R as RtkPlugins$1, d as defineCustomElement$1 } from './p-d978ca76.js';
+import { R as RtkPlugins$1, d as defineCustomElement$1 } from './p-3dbc09e4.js';
 
 const RtkPlugins = RtkPlugins$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-poll-form.js

@@ -1,4 +1,4 @@
-import { R as RtkPoll, d as defineCustomElement$1 } from './p-baea3e90.js';
+import { R as RtkPoll, d as defineCustomElement$1 } from './p-8ca0d44f.js';
 
 const RtkPollForm = RtkPoll;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-poll.js

@@ -1,4 +1,4 @@
-import { R as RtkPolls, d as defineCustomElement$1 } from './p-98ae3e41.js';
+import { R as RtkPolls, d as defineCustomElement$1 } from './p-91cb38a3.js';
 
 const RtkPoll = RtkPolls;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-polls-toggle.js

@@ -1,10 +1,10 @@
-import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-3bfd5b6d.js';
-import { a as defaultIconPack, c as useLanguage } from './p-53b020e2.js';
-import { d as canViewPolls } from './p-94443423.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$4 } from './p-7ad5bf75.js';
-import { d as defineCustomElement$3 } from './p-bed2e1b5.js';
-import { d as defineCustomElement$2 } from './p-efc19d8d.js';
+import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-c3592601.js';
+import { a as defaultIconPack, c as useLanguage } from './p-e6d09c50.js';
+import { d as canViewPolls } from './p-c11b2f37.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$4 } from './p-dc23e204.js';
+import { d as defineCustomElement$3 } from './p-2f2fb96d.js';
+import { d as defineCustomElement$2 } from './p-1947c106.js';
 
 const rtkPollsToggleCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{position:relative;display:block}:host([data-hidden]){display:none}.unread-count{position:absolute;right:var(--rtk-space-3, 12px);box-sizing:border-box;padding:var(--rtk-space-0\\.5, 2px);-webkit-user-select:none;-moz-user-select:none;user-select:none;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity));font-size:12px;color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)));display:flex;height:var(--rtk-space-5, 20px);min-width:var(--rtk-space-5, 20px);align-items:center;justify-content:center;border-radius:9999px;z-index:1}:host([variant='horizontal']) .unread-count{right:var(--rtk-space-4, 16px);top:50%;--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}";
 const RtkPollsToggleStyle0 = rtkPollsToggleCss;
@@ -78,17 +78,24 @@ const RtkPollsToggle$1 = /*@__PURE__*/ proxyCustomElement(class RtkPollsToggle e
             activeAI: false,
         });
     }
+    handlePollsActiveChange() {
+        // Polls sidebar closed without opening a different sidebar
+        if (!this.pollsActive && !this.states.activeSidebar) {
+            this.buttonEl.focus();
+        }
+    }
     render() {
         if (!this.canViewPolls)
             return h(Host, { "data-hidden": true });
         const text = this.t('polls');
         // TODO(callmetarush): Just showing polls for all V2 users irrespective of themes
         // untill we get ui theme for V2.
-        return (h(Host, { title: text }, this.unreadPollsCount !== 0 && !this.pollsActive && (h("div", { class: "unread-count", part: "unread-count" }, h("span", null, this.unreadPollsCount <= 100 ? this.unreadPollsCount : '99+'))), h("rtk-controlbar-button", { part: "controlbar-button", size: this.size, iconPack: this.iconPack, class: { active: this.pollsActive }, onClick: () => this.togglePollsTab(), icon: this.iconPack.poll, label: text, variant: this.variant })));
+        return (h(Host, { title: text }, this.unreadPollsCount !== 0 && !this.pollsActive && (h("div", { class: "unread-count", part: "unread-count" }, h("span", null, this.unreadPollsCount <= 100 ? this.unreadPollsCount : '99+'))), h("rtk-controlbar-button", { ref: (el) => (this.buttonEl = el), part: "controlbar-button", size: this.size, iconPack: this.iconPack, class: { active: this.pollsActive }, onClick: () => this.togglePollsTab(), icon: this.iconPack.poll, label: text, variant: this.variant })));
     }
     static get watchers() { return {
         "meeting": ["meetingChanged"],
-        "states": ["statesChanged"]
+        "states": ["statesChanged"],
+        "pollsActive": ["handlePollsActiveChange"]
     }; }
     static get style() { return RtkPollsToggleStyle0; }
 }, [1, "rtk-polls-toggle", {
@@ -103,7 +110,8 @@ const RtkPollsToggle$1 = /*@__PURE__*/ proxyCustomElement(class RtkPollsToggle e
         "canViewPolls": [32]
     }, undefined, {
         "meeting": ["meetingChanged"],
-        "states": ["statesChanged"]
+        "states": ["statesChanged"],
+        "pollsActive": ["handlePollsActiveChange"]
     }]);
 __decorate([
     SyncWithStore()

package/dist/components/rtk-polls.js

@@ -1,4 +1,4 @@
-import { R as RtkPolls$1, d as defineCustomElement$1 } from './p-512c3bef.js';
+import { R as RtkPolls$1, d as defineCustomElement$1 } from './p-db1e56e8.js';
 
 const RtkPolls = RtkPolls$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-recording-indicator.js

@@ -1,9 +1,9 @@
-import { p as proxyCustomElement, H, h, e as Host } from './p-3bfd5b6d.js';
-import { c as useLanguage, a as defaultIconPack } from './p-53b020e2.js';
-import { S as SyncWithStore } from './p-df6f9a3f.js';
-import { d as defineCustomElement$2 } from './p-bed2e1b5.js';
+import { p as proxyCustomElement, H, h, e as Host } from './p-c3592601.js';
+import { c as useLanguage, a as defaultIconPack } from './p-e6d09c50.js';
+import { S as SyncWithStore } from './p-d5791958.js';
+import { d as defineCustomElement$2 } from './p-2f2fb96d.js';
 
-const rtkRecordingIndicatorCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{margin-left:var(--rtk-space-2, 8px);margin-right:var(--rtk-space-2, 8px);display:block}:host[size='sm']{margin-left:var(--rtk-space-1, 4px);margin-right:var(--rtk-space-1, 4px)}.indicator{display:flex;flex-direction:row;align-items:center;font-size:14px;--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}rtk-icon{margin-right:var(--rtk-space-1, 4px);height:var(--rtk-space-5, 20px);width:var(--rtk-space-5, 20px);animation:blink 4s linear infinite}:host([size='sm']) rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px)}:host([size='sm']) .indicator span{display:none}@keyframes blink{0%,10%{opacity:0}11%,100%{opacity:1}}";
+const rtkRecordingIndicatorCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:block}:host([data-hidden]){display:none}:host[size='sm']{margin-left:var(--rtk-space-1, 4px);margin-right:var(--rtk-space-1, 4px)}.indicator{display:flex;flex-direction:row;align-items:center;font-size:14px;--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}rtk-icon{margin-right:var(--rtk-space-1, 4px);height:var(--rtk-space-5, 20px);width:var(--rtk-space-5, 20px);animation:blink 4s linear infinite}:host([size='sm']) rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px)}:host([size='sm']) .indicator span{display:none}@keyframes blink{0%,10%{opacity:0}11%,100%{opacity:1}}";
 const RtkRecordingIndicatorStyle0 = rtkRecordingIndicatorCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -46,7 +46,7 @@ const RtkRecordingIndicator$1 = /*@__PURE__*/ proxyCustomElement(class RtkRecord
         }
     }
     render() {
-        return (h(Host, { key: 'b08cb38ca93d2db33679ac266e18063c4a2756cf' }, this.isRecording && (h("div", { key: '5ba29ae19d2b338f32ec07ec2ef2662c61a7b5f9', class: "indicator", "aria-label": this.t('recording.indicator'), part: "indicator" }, h("rtk-icon", { key: '6ed9ed4a1191ee245f4d1315fcf9f9a6c958687e', icon: this.iconPack.recording, "aria-hidden": true, tabIndex: -1, part: "icon" }), h("span", { key: 'c7bb79757e0b9ce8b4637645efbef75fb22e2a33' }, this.t('recording.label'))))));
+        return (h(Host, { key: 'b76ca6a6d3dea0df7318e8882055dcd04dbd7a46', "data-hidden": !this.isRecording }, this.isRecording && (h("div", { key: '32d34242dbeb17c11067f51c5fbf0b1ebd7ef541', class: "indicator", "aria-label": this.t('recording.indicator'), part: "indicator" }, h("rtk-icon", { key: 'fb7851e4bb57e4193afc05edbfe9b24122a5b743', icon: this.iconPack.recording, "aria-hidden": true, tabIndex: -1, part: "icon" }), h("span", { key: 'de677e81dc576b9188b896ecbb458a62b5bd74dc' }, this.t('recording.label'))))));
     }
     static get watchers() { return {
         "meeting": ["meetingChanged"]