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

package/dist/esm/rtk-screen-share-toggle.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-c1fb98bb.js';
-import { e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkScreenShareToggleCss = ":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 RtkScreenShareToggleStyle0 = rtkScreenShareToggleCss;

package/dist/esm/rtk-screenshare-view.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, w as writeTask, h, H as Host, a as getElement } from './index-c1fb98bb.js';
-import { e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
+import { e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
 import { i as isFullScreenEnabled, r as requestFullScreen, e as exitFullSreen, a as isFullScreenSupported } from './full-screen-1f58c594.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkScreenshareViewCss = ":host {\n  line-height: initial;\n  font-family: var(--rtk-font-family, sans-serif);\n\n  font-feature-settings: normal;\n  font-variation-settings: normal;\n}\n\np {\n  margin: var(--rtk-space-0, 0px);\n  padding: var(--rtk-space-0, 0px);\n}\n\n\n:host {\n  height: 100%;\n  width: 100%;\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n  border-radius: var(--rtk-border-radius-lg, 12px);\n  --tw-bg-opacity: 1;\n  background-color: rgba(var(--rtk-colors-video-bg, 24 24 24) / var(--tw-bg-opacity));\n  container-type: inline-size;\n  container-name: screentile;\n}\n\n::slotted(rtk-name-tag) {\n  position: absolute;\n  left: var(--rtk-space-3, 12px);\n  bottom: var(--rtk-space-3, 12px);\n  opacity: 0.8;\n}\n\n#video-container {\n  position: absolute;\n  display: block;\n  height: 100%;\n  width: 100%;\n}\n\n#video-container .fit-in-container {\n  -o-object-fit: fill;\n     object-fit: fill;\n}\n\nvideo {\n  height: 100%;\n  width: 100%;\n  -o-object-fit: contain;\n     object-fit: contain;\n}\n\n:host([variant='gradient']) ::slotted(rtk-audio-visualizer) {\n  position: absolute;\n  top: var(--rtk-space-2, 8px);\n  right: var(--rtk-space-2, 8px);\n  border-radius: 9999px;\n  --tw-bg-opacity: 1;\n  background-color: rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity));\n  padding: var(--rtk-space-2, 8px);\n}\n\n:host([variant='gradient']) ::slotted(rtk-name-tag) {\n  bottom: var(--rtk-space-0, 0px);\n  left: var(--rtk-space-0, 0px);\n  display: flex;\n  width: 100%;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  background-color: transparent;\n  background-image: linear-gradient(to top, var(--tw-gradient-stops));\n  --tw-gradient-from: rgb(var(--rtk-colors-background-1000, 8 8 8));\n  --tw-gradient-to: rgba(var(--rtk-colors-background-1000, 8 8 8) / 0);\n  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n  --tw-gradient-to: transparent;\n}\n\n:host([size='sm'][variant='gradient']) ::slotted(rtk-audio-visualizer) {\n  height: var(--rtk-space-5, 20px);\n  width: var(--rtk-space-5, 20px);\n}\n\nvideo.visible {\n  animation: video-fadein 0.4s ease;\n}\n\n#controls {\n  display: none;\n  position: absolute;\n  top: var(--rtk-space-3, 12px);\n  right: var(--rtk-space-3, 12px);\n  align-items: center;\n  justify-content: flex-end;\n  gap: var(--rtk-space-2, 8px);\n}\n\n:host(:hover) #controls, \n:host(:active) #controls, \n:host(:focus-visible) #controls {\n  display: flex;\n}\n\n#full-screen-btn {\n  --tw-bg-opacity: 1;\n  background-color: rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity));\n}\n\n/** For self view */\n\nh3 {\n  margin-top: var(--rtk-space-10, 40px);\n  margin-bottom: var(--rtk-space-6, 24px);\n  text-align: center;\n  font-size: 20px;\n  font-weight: 500;\n}\n\n:host([size='sm']) h3 {\n  font-size: 16px;\n}\n\n#self-message {\n  padding-left: var(--rtk-space-4, 16px);\n  padding-right: var(--rtk-space-4, 16px);\n}\n\n:host(.isSelf) #self-view {\n  flex: 1 1 0%;\n}\n\n:host(.isSelf) #video-container {\n  position: static;\n  aspect-ratio: auto;\n  height: auto;\n  width: 50%;\n  max-width: var(--rtk-space-96, 384px);\n  border-radius: var(--rtk-border-radius-md, 8px);\n  transition: 0.6s ease;\n}\n\n:host(.isSelf) #video-container.expand {\n  width: 60%;\n  max-width: 100%;\n}\n\n.actions {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--rtk-space-2, 8px);\n}\n\n:host([size='sm'].isSelf) #video-container,\n:host([size='md'].isSelf) #video-container,\n:host([size='sm'].isSelf) #expand-btn,\n:host([size='md'].isSelf) #expand-btn {\n  /** Hide video, fullscreen buttons in sm and md breakpoints */\n  display: none;\n}\n\n/** Remote control */\n\np {\n  margin: var(--rtk-space-0, 0px);\n  padding: var(--rtk-space-0, 0px);\n}\n\n.remote-control {\n  z-index: 10;\n  height: 100%;\n  max-height: 100%;\n  flex: 0 1 auto;\n}\n\n#remote-control-self {\n  position: absolute;\n  top: var(--rtk-space-0, 0px);\n  left: 50%;\n  z-index: 10;\n  width: -moz-max-content;\n  width: max-content;\n  max-width: 100%;\n  box-sizing: border-box;\n  display: flex;\n  height: var(--rtk-space-8, 32px);\n  align-items: center;\n  overflow: hidden;\n  border-radius: var(--rtk-border-radius-sm, 4px);\n  --tw-bg-opacity: 1;\n  background-color: rgba(var(--rtk-colors-warning, 255 205 7) / var(--tw-bg-opacity));\n  font-size: 12px;\n  color: rgb(var(--rtk-colors-text-1000, 255 255 255));\n  transform: translateX(-50%);\n}\n\n#remote-control-self p {\n  padding-left: var(--rtk-space-3, 12px);\n  padding-right: var(--rtk-space-3, 12px);\n  padding-top: var(--rtk-space-2, 8px);\n  padding-bottom: var(--rtk-space-2, 8px);\n}\n\n#remote-control-self rtk-button {\n  height: 100%;\n  border-radius: var(--rtk-border-radius-none, 0);\n  --tw-bg-opacity: 1;\n  background-color: rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-bg-opacity));\n  font-size: 12px;\n}\n\n:host([size='sm']) #remote-control-self {\n  height: auto;\n  flex-direction: column;\n}\n\n:host([size='sm']) #remote-control-self rtk-button {\n  width: 100%;\n  padding-top: var(--rtk-space-1, 4px);\n  padding-bottom: var(--rtk-space-1, 4px);\n}\n\n/** Name tag positions */\n\n:host([name-tag-position='bottom-right']) ::slotted(rtk-name-tag) {\n  left: auto;\n  right: var(--rtk-space-3, 12px);\n}\n\n:host([name-tag-position='bottom-center']) ::slotted(rtk-name-tag) {\n  left: auto;\n  right: auto;\n}\n\n:host([name-tag-position='top-left']) ::slotted(rtk-name-tag) {\n  top: var(--rtk-space-3, 12px);\n  bottom: auto;\n}\n\n:host([name-tag-position='top-right']) ::slotted(rtk-name-tag) {\n  top: var(--rtk-space-3, 12px);\n  right: var(--rtk-space-3, 12px);\n  left: auto;\n  bottom: auto;\n}\n\n:host([name-tag-position='top-center']) ::slotted(rtk-name-tag) {\n  left: auto;\n  right: auto;\n  bottom: auto;\n  top: var(--rtk-space-3, 12px);\n}\n\n/** Keyframes */\n\n@keyframes video-fadein {\n  0% {\n    opacity: 0;\n    transform: scale(1.4) translateY(20px);\n  }\n\n  100% {\n    opacity: 1;\n    transform: scale(1) translateY(0);\n  }\n}\n\n::slotted(rtk-network-indicator) {\n  position: absolute;\n  right: var(--rtk-space-3, 12px);\n  bottom: var(--rtk-space-3, 12px);\n}\n\n@media only screen and (max-height: 480px) and (orientation: landscape) {\n    :host([size='sm'][variant='solid']) ::slotted(rtk-name-tag), \n    :host([size='sm'][variant='solid']) rtk-name-tag {\n    left: var(--rtk-space-0, 0px);\n    bottom: var(--rtk-space-0, 0px);\n    border-radius: var(--rtk-border-radius-none, 0);\n      transform-origin: 0% 110%;\n      transform: scale(0.6);\n  }\n}\n\n@container screentile (max-width: 400px) {\n  ::slotted(rtk-name-tag) {\n    transform-origin: 0 130%;\n    transform: scale(0.7);\n  }\n}\n";
 const RtkScreenshareViewStyle0 = rtkScreenshareViewCss;
@@ -105,7 +105,7 @@ const RtkScreenshareView = class {
         const icon = this.isFullScreen
             ? this.iconPack.full_screen_minimize
             : this.iconPack.full_screen_maximize;
-        return (h(Host, { key: '895838fc56a74007fe02299ee30de45c28604101', class: { isSelf } }, h("div", { key: "video-container", id: "video-container", class: { expand: this.videoExpanded } }, h("video", { key: 'e5c48b3f240b44580e3693ba16b93e56c1c91099', ref: (el) => (this.videoEl = el), class: {
+        return (h(Host, { key: 'b86926b816256b0dd272a452e6a7ad18f4e6d6b0', class: { isSelf } }, h("div", { key: "video-container", id: "video-container", class: { expand: this.videoExpanded } }, h("video", { key: '72628ce3b221369a73e78b33a1f4320cf63648ea', ref: (el) => (this.videoEl = el), class: {
                 visible: this.screenShareEnabled,
                 'fit-in-container': this.participant.supportsRemoteControl,
             }, playsInline: true, onPlay: () => {
@@ -113,15 +113,15 @@ const RtkScreenshareView = class {
                     screenshareParticipant: this.participant,
                     participant: this.meeting.self,
                 });
-            }, autoPlay: true, muted: true, id: `screen-share-video-${this.participant.id}` })), h("div", { id: "controls", key: "controls" }, !this.hideFullScreenButton && !isSelf && isFullScreenSupported() && (h("rtk-tooltip", { key: 'af1a9ab34f7eafdadd905fe6cc420f80bba9df0e', label: text }, h("rtk-button", { key: '39e85a27f31ab4341e8ea909538eee9c2fa64eea', id: "full-screen-btn", kind: "icon", onClick: this.toggleFullScreen, title: text }, h("rtk-icon", { key: '24d224601e90c39581b9b58253cc1a9afa8debb1', icon: icon, "aria-hidden": true, tabIndex: -1 }))))), isSelf && (h("div", { id: "self-message", key: "self-message" }, h("h3", { key: '5b86a4393bc13986edef699d41e9840beba7afaf' }, this.t('screenshare.shared')), h("div", { key: '0a8956428dda78bf4802aedb37c67a11726d383a', class: "actions" }, this.meeting != null && (h("rtk-button", { key: '29332a805aaeb97dd1c82e764a84e99e0bb6778e', variant: "danger", onClick: () => {
+            }, autoPlay: true, muted: true, id: `screen-share-video-${this.participant.id}` })), h("div", { id: "controls", key: "controls" }, !this.hideFullScreenButton && !isSelf && isFullScreenSupported() && (h("rtk-tooltip", { key: '524beb4b642f092f710b06b5d798dcbcb0dfb362', label: text }, h("rtk-button", { key: '7c9c19cd8bac4f06354bd1b5c029409b29a54ee1', id: "full-screen-btn", kind: "icon", onClick: this.toggleFullScreen, title: text }, h("rtk-icon", { key: '2736d1382fb4784b17af53d7f2d5d56d9072605c', icon: icon, "aria-hidden": true, tabIndex: -1 }))))), isSelf && (h("div", { id: "self-message", key: "self-message" }, h("h3", { key: 'ae15c676616941b4542c651b86523bd9a42abd57' }, this.t('screenshare.shared')), h("div", { key: '118b64e4428938ff59831039f1f5da3a58c75d78', class: "actions" }, this.meeting != null && (h("rtk-button", { key: '8639da3abb32bad8168ca19396b6fd4a42ab4c27', variant: "danger", onClick: () => {
                 this.meeting.self.disableScreenShare();
-            } }, h("rtk-icon", { key: '1a56a38c437b82b2b948963709770c78044d2fb9', icon: this.iconPack.share_screen_stop, slot: "start" }), this.t('screenshare.stop'))), h("rtk-button", { key: '4447983e29864ad5f3af891ee5949faf3bb28760', variant: "secondary", id: "expand-btn", onClick: () => {
+            } }, h("rtk-icon", { key: 'ecf9cdbd39b4931635f8289e02a50d04deec888e', icon: this.iconPack.share_screen_stop, slot: "start" }), this.t('screenshare.stop'))), h("rtk-button", { key: 'e26439bf59435ae8c25e8836a43c61505a912ee1', variant: "secondary", id: "expand-btn", onClick: () => {
                 this.videoExpanded = !this.videoExpanded;
-            } }, h("rtk-icon", { key: '922dcb884d37077859b6c4171ef3f66d84d4f365', icon: this.videoExpanded
+            } }, h("rtk-icon", { key: 'cd812aaba94913e3183938528dee719da83e0883', icon: this.videoExpanded
                 ? this.iconPack.full_screen_minimize
                 : this.iconPack.full_screen_maximize, slot: "start" }), this.videoExpanded
             ? this.t('screenshare.min_preview')
-            : this.t('screenshare.max_preview'))))), h("slot", { key: '832760ef28dac2cbace7aa76769b8f6db323deda' })));
+            : this.t('screenshare.max_preview'))))), h("slot", { key: 'c033d7199a6a8e7d75ec4773e65d974e35643776' })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/rtk-settings-audio_2.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-c1fb98bb.js';
-import { e as defaultIconPack, h as useLanguage, V as getPreference, W as setPreference } from './ui-store-9e486e1b.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { e as defaultIconPack, i as useLanguage, W as getPreference, X as setPreference } from './ui-store-5a66fa71.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkSettingsAudioCss = ":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:flex;width:100%;flex-direction:column}audio{visibility:hidden}.group{margin-top:var(--rtk-space-2, 8px);margin-bottom:var(--rtk-space-2, 8px)}.group>*{margin-bottom:var(--rtk-space-2, 8px)}.group>*:last-child{margin-bottom:var(--rtk-space-0, 0px)}.group select{flex:1 1 0%}.row{display:flex;align-items:center;justify-content:space-between;gap:var(--rtk-space-3, 12px)}rtk-audio-visualizer{flex-shrink:0}rtk-button{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));--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}rtk-button rtk-icon{margin-right:var(--rtk-space-2, 8px)}";
 const RtkSettingsAudioStyle0 = rtkSettingsAudioCss;

package/dist/esm/rtk-settings-toggle.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-c1fb98bb.js';
-import { e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkSettingsToggleCss = ":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 RtkSettingsToggleStyle0 = rtkSettingsToggleCss;
@@ -33,7 +33,7 @@ const RtkSettingsToggle = class {
     }
     render() {
         const text = this.t('settings');
-        return (h(Host, { key: '2304f4ea95e5fb5e44665130cd744e0ebafb3ce2', title: text }, h("rtk-controlbar-button", { key: '4a648720e88dfee6b8ab84f6486fc0277e5f9345', part: "controlbar-button", size: this.size, iconPack: this.iconPack, onClick: () => this.toggleSettings(), icon: this.iconPack.settings, label: text, variant: this.variant })));
+        return (h(Host, { key: 'a4f7dceea9249ee9e35b92f32ea57bf654246ca1', title: text }, h("rtk-controlbar-button", { key: 'e76994804c2405982770aaf3999e81bdbbd94250', part: "controlbar-button", size: this.size, iconPack: this.iconPack, onClick: () => this.toggleSettings(), icon: this.iconPack.settings, label: text, variant: this.variant })));
     }
 };
 __decorate([

package/dist/esm/rtk-settings.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-c1fb98bb.js';
-import { e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkSettingsCss = ":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{position:relative;display:flex;overflow:hidden;border-radius:var(--rtk-border-radius-md, 8px);width:100%;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-1000, 255 255 255))}header{display:flex;align-items:center;justify-content:space-between;padding-left:var(--rtk-space-4, 16px);padding-right:var(--rtk-space-4, 16px)}.title{font-size:20px;line-height:1}.back-btn,.dismiss-btn{border-radius:var(--rtk-border-radius-sm, 4px);background-color:transparent;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.back-btn:hover,.dismiss-btn:hover{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity))}aside{box-sizing:border-box;display:flex;min-width:var(--rtk-space-56, 224px);flex-direction:column;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-900, 26 26 26) / var(--tw-bg-opacity));padding-left:var(--rtk-space-2, 8px)}aside button{margin-top:var(--rtk-space-4, 16px);box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:space-between;border-top-left-radius:var(--rtk-border-radius-sm, 4px);border-bottom-left-radius:var(--rtk-border-radius-sm, 4px);padding-left:var(--rtk-space-4, 16px);padding-right:var(--rtk-space-4, 16px);padding-top:var(--rtk-space-3, 12px);padding-bottom:var(--rtk-space-3, 12px);background-color:transparent;color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));cursor:default;font-size:16px;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);border-width:var(--rtk-border-width-none, 0);border-style:none;outline:2px solid transparent;outline-offset:2px}aside button .right{display:flex;align-items:center}aside button .right rtk-icon{height:var(--rtk-space-6, 24px);width:var(--rtk-space-6, 24px)}aside button .right rtk-icon:last-child{margin-left:var(--rtk-space-4, 16px)}aside button[type='button']{cursor:pointer;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}aside button[type='button']:hover{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity))}aside button[type='button']{border-right:var(--rtk-border-width-md, 2px) solid transparent}aside button.active{--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-border-opacity));background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / 0.2)}aside button.active:hover{background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / 0.2)}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))}rtk-icon.good{--tw-text-opacity:1;color:rgba(var(--rtk-colors-success, 98 165 4) / var(--tw-text-opacity))}main{display:flex;flex:1 1 0%;align-items:center;justify-content:center;padding-left:var(--rtk-space-6, 24px);padding-right:var(--rtk-space-6, 24px);box-sizing:border-box;width:100%;max-width:calc(100% - var(--rtk-space-56, 224px))}.dismiss-btn{position:absolute;top:var(--rtk-space-3, 12px);right:var(--rtk-space-3, 12px);height:var(--rtk-space-6, 24px);width:var(--rtk-space-6, 24px)}:host([size='sm']) aside{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity))}:host([size='sm']) .dismiss-btn{top:var(--rtk-space-5, 20px);right:var(--rtk-space-4, 16px)}:host([size='sm']) aside{width:100%;padding-left:var(--rtk-space-0, 0px)}:host([size='sm']) aside button{border-radius:var(--rtk-border-radius-none, 0)}:host([size='sm']) aside button.active{border-width:var(--rtk-border-width-none, 0);border-style:none;background-color:transparent}:host([size='sm']) aside button.active:hover{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity))}:host([size='sm']) aside.hide{display:none}:host([size='sm']) main{display:none;max-width:100%;overflow-y:auto;padding-left:var(--rtk-space-4, 16px);padding-right:var(--rtk-space-4, 16px)}:host([size='sm']) main header{justify-content:center}:host([size='sm']) main header rtk-button{position:absolute;left:var(--rtk-space-4, 16px)}:host([size='sm']) main.active{display:block}";
 const RtkSettingsStyle0 = rtkSettingsCss;

package/dist/esm/rtk-setup-screen.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host } from './index-c1fb98bb.js';
 import { a as shorten } from './string-068ce30a.js';
-import { c as createDefaultConfig, e as defaultIconPack, h as useLanguage, I as gracefulStorage } from './ui-store-9e486e1b.js';
+import { c as createDefaultConfig, e as defaultIconPack, i as useLanguage, J as gracefulStorage } from './ui-store-5a66fa71.js';
 import { R as Render } from './index-d31a2e33.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkSetupScreenCss = ":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{box-sizing:border-box;padding:var(--rtk-space-4, 16px);height:100%;min-height:100%;width:100%;display:flex;place-items:center;justify-content:center;--rtk-controlbar-button-background-color:rgb(var(--rtk-colors-background-700, 44 44 44))}.container{width:100%;max-width:1080px;display:flex;align-items:center;justify-content:space-evenly;gap:var(--rtk-space-4, 16px)}.container-tile{display:flex;height:100%;width:100%;max-width:584px;flex-direction:column;gap:var(--rtk-space-2, 8px)}.metadata{display:flex;width:100%;max-width:var(--rtk-space-80, 320px);flex-direction:column;align-items:center;text-align:center}.meeting-title{margin-bottom:var(--rtk-space-4, 16px);text-align:center;font-size:24px;font-weight:500}.join-as{margin:var(--rtk-space-0, 0px);margin-bottom:var(--rtk-space-4, 16px);text-align:center;font-size:16px;letter-spacing:-0.025em;color:rgb(var(--rtk-colors-text-600, 255 255 255 / 0.52));overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.uneditable-name{margin-bottom:var(--rtk-space-6, 24px)}.uneditable-name .text,.uneditable-name .name{display:inline-block}.uneditable-name .name{font-size:16px;font-weight:500}input{margin-bottom:var(--rtk-space-6, 24px);display:block;height:var(--rtk-space-10, 40px);width:100%;max-width:var(--rtk-space-80, 320px);border-radius:var(--rtk-border-radius-sm, 4px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity));padding-left:var(--rtk-space-3, 12px);padding-right:var(--rtk-space-3, 12px);color:rgb(var(--rtk-colors-text-1000, 255 255 255));box-sizing:border-box;font-size:16px;outline:2px solid transparent;outline-offset:2px;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}input::-moz-placeholder{color:rgb(var(--rtk-colors-text-600, 255 255 255 / 0.52))}input::placeholder{color:rgb(var(--rtk-colors-text-600, 255 255 255 / 0.52))}input{border:var(--rtk-border-width-sm, 1px) solid rgb(var(--rtk-colors-background-600, 60 60 60))}input:focus{--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-border-opacity))}rtk-spinner{color:rgb(var(--rtk-colors-text-1000, 255 255 255));--icon-size:var(--rtk-space-8, 32px)}:host([size='sm']) .container,:host([size='md']) .container{height:100%;flex-direction:column;justify-content:space-evenly}:host([size='sm']) .container-tile,:host([size='md']) .container-tile{height:-moz-min-content;height:min-content;flex-direction:column;justify-content:center}rtk-participant-tile{height:auto;width:100%;max-width:584px}.media-selectors{display:flex;flex-direction:column;justify-content:space-between}.media-selectors .row{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr))}.no-network-badge{margin-top:var(--rtk-space-2, 8px);display:flex;width:100%;flex-direction:row;align-items:center;justify-content:flex-start;border-radius:var(--rtk-border-radius-sm, 4px);--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-danger, 255 45 45) / 0.1);padding-top:var(--rtk-space-1, 4px);padding-bottom:var(--rtk-space-1, 4px);font-size:12px;color:rgba(var(--rtk-colors-danger, 255 45 45) / 0.75)}.no-network-badge rtk-icon{margin-left:var(--rtk-space-2, 8px);margin-right:var(--rtk-space-2, 8px)}";
 const RtkSetupScreenStyle0 = rtkSetupScreenCss;

package/dist/esm/rtk-sidebar-ui.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-c1fb98bb.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
-import { e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
+import { e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
 
 const rtkSidebarUiCss = ":host {\n  line-height: initial;\n  font-family: var(--rtk-font-family, sans-serif);\n\n  font-feature-settings: normal;\n  font-variation-settings: normal;\n}\n\np {\n  margin: var(--rtk-space-0, 0px);\n  padding: var(--rtk-space-0, 0px);\n}\n\n\n:host {\n  position: relative;\n  height: 100%;\n  width: 100%;\n  font-family: var(--rtk-font-family, sans-serif);\n  z-index: 50;\n  display: flex;\n  flex-direction: column;\n\n  container-type: size;\n  container-name: sidebarui;\n}\n\n@container sidebarui (height < 370px) {\n  .main-header {\n    height: var(--rtk-space-8, 32px) !important;\n  }\n  .close {\n    top: var(--rtk-space-0\\.5, 2px) !important;\n    left: var(--rtk-space-0, 0px) !important;\n    color: rgba(var(--rtk-colors-danger, 255 45 45) / 0.6);\n  }\n}\n\n:host([view='sidebar']) {\n  --tw-bg-opacity: 1;\n  background-color: rgba(var(--rtk-colors-background-900, 26 26 26) / var(--tw-bg-opacity));\n}\n\n:host([view='full-screen']) {\n  position: absolute;\n  top: var(--rtk-space-0, 0px);\n  right: var(--rtk-space-0, 0px);\n  bottom: var(--rtk-space-0, 0px);\n  left: var(--rtk-space-0, 0px);\n  max-width: 100%;\n  border: none;\n}\n\n::slotted(*) {\n  flex-grow: 1;\n}\n\n.close {\n  position: absolute;\n  top: var(--rtk-space-2, 8px);\n  left: var(--rtk-space-2, 8px);\n  z-index: 10;\n}\n\n.main-header {\n  position: relative;\n  display: flex;\n  height: var(--rtk-space-12, 48px);\n  place-items: center;\n  justify-content: center;\n}\n\n.main-header, \n.mobile-tabs {\n  flex-shrink: 0;\n}\n\n.mobile-tabs {\n  display: flex;\n  place-items: center;\n  justify-content: space-evenly;\n  border-bottom: 1px solid rgb(var(--rtk-colors-background-700, 44 44 44));\n}\n\n.mobile-tabs button {\n  margin: var(--rtk-space-0, 0px);\n  border-width: var(--rtk-border-width-none, 0);\n  border-style: none;\n  background-color: transparent;\n  padding: var(--rtk-space-0, 0px);\n  color: rgb(var(--rtk-colors-text-600, 255 255 255 / 0.52));\n  height: var(--rtk-space-10, 40px);\n  cursor: pointer;\n  padding-left: var(--rtk-space-4, 16px);\n  padding-right: var(--rtk-space-4, 16px);\n  font-weight: 500;\n  border-bottom: 1px solid transparent;\n}\n\n.mobile-tabs button.active {\n  --tw-border-opacity: 1;\n  border-color: rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-border-opacity));\n  --tw-text-opacity: 1;\n  color: rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-text-opacity));\n}\n\nheader h3 {\n  font-size: 14px;\n  font-weight: 500;\n}\n\n@media only screen and (max-device-height: 480px) and (orientation: landscape) {\n  .main-header {\n    display: none !important;\n  }\n}\n\n.tab-participant-count-badge {\n  display: inline-block;\n  padding: 2px 5px;\n  border-radius: 9999px;\n  --tw-bg-opacity: 1;\n  background-color: rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity));\n  font-size: 12px;\n  color: rgb(var(--rtk-colors-text-700, 255 255 255 / 0.64));\n}\n\n.tab-participant-count-badge:not(.selected-tab) {\n  --tw-bg-opacity: 1;\n  background-color: rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity));\n}\n\n.tab-participant-count-badge.requests-pending{\n  background-color: rgba(var(--rtk-colors-danger));\n}\n";
 const RtkSidebarUiStyle0 = rtkSidebarUiCss;
@@ -69,11 +69,11 @@ const RtkSidebarUi = class {
     render() {
         const isFullScreen = this.view === 'full-screen';
         const activeTab = this.tabs.find((tab) => tab.id === this.currentTab);
-        return (h(Host, { key: 'bc9969254516bb334f0bbc6216432121d675a83e', ref: (el) => (this.hostEl = el), class: this.view }, !this.hideCloseAction && (h("rtk-button", { key: 'ce9dabf448e0914fa516c717825ee00ad476d412', ref: (el) => (this.closeButton = el), variant: "ghost", kind: "icon", class: "close", onClick: this.onClose, "aria-label": this.t('close') }, h("rtk-icon", { key: '5966e4c6a7bbdea25fa64e197c47fcded0625754', icon: this.iconPack.dismiss }))), activeTab && !this.hideHeader && (h("header", { key: '3b7109ba37e019a3da3a0aeb07b54fcf28e869b4', class: "main-header" }, h("h3", { key: 'c57a8719fe6dca4ed092fbb21733c0d0ac074dc3' }, activeTab.name), h("slot", { key: 'f95589b898e0b4a8001d45d5b4c833576fab4fd8', name: "pinned-state" }))), isFullScreen && (h("header", { key: '72cd52ea2a27caf4dc826d4222738325853281c8', class: "mobile-tabs" }, this.tabs.map((tab) => (h("button", { onClick: () => {
+        return (h(Host, { key: 'c82b2c0115417c6da59813f5dda1f306cf8ddba6', ref: (el) => (this.hostEl = el), class: this.view }, !this.hideCloseAction && (h("rtk-button", { key: '3edc83cd51bc361031bc3a6ef6790c8f8158c696', ref: (el) => (this.closeButton = el), variant: "ghost", kind: "icon", class: "close", onClick: this.onClose, "aria-label": this.t('close') }, h("rtk-icon", { key: 'd519be5840e46b9b0ca594fb7783f4432ee2df2a', icon: this.iconPack.dismiss }))), activeTab && !this.hideHeader && (h("header", { key: '097e785b39dd9fdc678e7029638faa7b897878b1', class: "main-header" }, h("h3", { key: 'bf75453843c0fe9ec2df142cfc08e9e1767768a6' }, activeTab.name), h("slot", { key: 'fadc034a7574c72cba40f1e1a365b044622b9ebb', name: "pinned-state" }))), isFullScreen && (h("header", { key: 'd75a18fc3bf34d462e036d0ffd235a3cdd59cc22', class: "mobile-tabs" }, this.tabs.map((tab) => (h("button", { onClick: () => {
                 this.tabChange.emit(tab.id);
             }, class: {
                 active: this.currentTab === tab.id,
-            } }, tab.name))))), h("slot", { key: '266ec59a2d04803b2d035f7929394e66e92aa542', name: this.currentTab })));
+            } }, tab.name))))), h("slot", { key: 'b11a84e677553f44e51b0f0b7209ddc769a8094e', name: this.currentTab })));
     }
     static get watchers() { return {
         "currentTab": ["handleFocusCloseButton"]

package/dist/esm/rtk-sidebar.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-c1fb98bb.js';
-import { c as createDefaultConfig, e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
-import { c as canViewChat, d as canViewPolls, a as canViewParticipants, b as canViewPlugins } from './sidebar-030fff49.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { c as createDefaultConfig, e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
+import { c as canViewChat, d as canViewPolls, a as canViewParticipants, b as canViewPlugins } from './sidebar-dd9a38aa.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 import { R as Render } from './index-d31a2e33.js';
 
 const rtkSidebarCss = ":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-right:var(--rtk-space-0, 0px);height:100%;width:100%;max-width:var(--rtk-space-96, 384px);box-sizing:border-box;display:flex;flex-direction:column;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity));border-width:var(--rtk-border-width-sm, 1px);border-style:solid;--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-border-opacity))}:host([view='sidebar']){right:var(--rtk-space-2, 8px);margin-right:var(--rtk-space-4, 16px);overflow:clip;border-radius:var(--rtk-border-radius-lg, 12px);--tw-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);--tw-shadow-color:rgb(var(--rtk-colors-background-900, 26 26 26));--tw-shadow:var(--tw-shadow-colored)}:host([view='full-screen']){top:var(--rtk-space-0, 0px);right:var(--rtk-space-0, 0px);bottom:var(--rtk-space-0, 0px);left:var(--rtk-space-0, 0px);max-width:100%}:host(.floating){position:absolute !important;top:var(--rtk-space-0, 0px);right:var(--rtk-space-0, 0px);bottom:var(--rtk-space-0, 0px);left:var(--rtk-space-0, 0px);left:auto;z-index:50}.pinned-state{position:absolute;right:var(--rtk-space-1, 4px);display:inline-flex;width:var(--rtk-space-2, 8px);justify-content:flex-end}";

package/dist/esm/rtk-simple-grid.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, h, H as Host, a as getElement } from './index-c1fb98bb.js';
-import { c as createDefaultConfig, e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
+import { c as createDefaultConfig, e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
 import { R as Render } from './index-d31a2e33.js';
 import { u as useGrid } from './grid-a3ca5a3e.js';
 import { i as index } from './ResizeObserver.es-02979d4e.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkSimpleGridCss = ":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:100%;width:100%}";
 const RtkSimpleGridStyle0 = rtkSimpleGridCss;

package/dist/esm/rtk-spotlight-grid.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, h, H as Host, a as getElement } from './index-c1fb98bb.js';
-import { c as createDefaultConfig, e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
+import { c as createDefaultConfig, e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
 import { d as defaultGridSize } from './grid-a3ca5a3e.js';
 import { R as Render } from './index-d31a2e33.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkSpotlightGridCss = ":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:flex;height:100%;width:100%}main{flex:1 1 0%}.grid-width-sm{width:25%}.grid-width-md{width:50%}.grid-width-lg{width:66.666667%}:host([size='sm']),:host([size='md']){flex-direction:column}:host([size='md']) aside{max-height:var(--rtk-space-96, 384px);width:100%;max-width:100%}:host([size='md']) .grid-width-sm{height:25%}:host([size='md']) .grid-width-md{height:50%}:host([size='md']) .grid-width-lg{height:66.666667%}:host([size='sm']) aside{max-height:var(--rtk-space-96, 384px);width:100%;max-width:100%}:host([size='sm']) .grid-width-sm,:host([size='sm']) .grid-width-md,:host([size='sm']) .grid-width-lg{height:50%}:host([size='xl']) .grid-width-sm,:host([size='xl']) .grid-width-md,:host([size='xl']) .grid-width-lg{width:400px}:host([layout='column']){flex-direction:column}:host([layout='column']) main{flex:4}:host([layout='column']) aside{flex:2;max-width:100%;width:100%}";
 const RtkSpotlightGridStyle0 = rtkSpotlightGridCss;
@@ -67,13 +67,13 @@ const RtkSpotlightGrid = class {
             t: this.t,
         };
         const nonPinnedParticipants = this.participants.filter((p) => this.pinnedParticipants.some((pt) => pt.id != p.id));
-        return (h(Host, { key: 'e59d2ac514c625655e956290435cf75115d28680' }, h("main", { key: '3a6ce7465092914937ccc0a4011313889ff8b215', part: "main" }, h(Render, { key: 'ed21c2595f58f4b430b1d42b7329c6e3a7952552', element: "rtk-simple-grid", defaults: defaults, props: {
+        return (h(Host, { key: 'fc4f0a4bef7965a6ce9d2eb07f771dd41ac0815a' }, h("main", { key: '23f86ea4a235e84073a956661011b723ad8d09f4', part: "main" }, h(Render, { key: '5bd1b8e8013f8fe51e142d42504cf3e673656912', element: "rtk-simple-grid", defaults: defaults, props: {
                 part: 'main-grid',
                 participants: this.pinnedParticipants,
                 aspectRatio: this.aspectRatio,
                 gap: this.gap,
                 size: this.getAdaptiveSize(this.pinnedParticipants.length),
-            } })), nonPinnedParticipants.length > 0 && (h("aside", { key: '52d3ab791766e9107b034de5328c72d63729db1c', part: "aside", class: this.gridSize.spotlight ? `grid-width-${this.gridSize.spotlight}` : 'grid-width-md' }, h(Render, { key: '58ca609909a390092527ae999195e7d0c46a4feb', element: "rtk-simple-grid", defaults: defaults, props: {
+            } })), nonPinnedParticipants.length > 0 && (h("aside", { key: '8e50b91a5781df1371ed2f87e7697f1de1ae4d56', part: "aside", class: this.gridSize.spotlight ? `grid-width-${this.gridSize.spotlight}` : 'grid-width-md' }, h(Render, { key: '7a3e66a76e0a5e951cfc0c9c5ed6eed4d3a598f0', element: "rtk-simple-grid", defaults: defaults, props: {
                 part: 'aside-grid',
                 participants: nonPinnedParticipants,
                 aspectRatio: this.aspectRatio,

package/dist/esm/rtk-spotlight-indicator.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-c1fb98bb.js';
-import { e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkSpotlightIndicatorCss = ":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{font-size:12px}#sync-button{flex-direction:row;border-radius:var(--rtk-border-radius-sm, 4px);padding-left:var(--rtk-space-1, 4px);display:flex;align-items:center;justify-content:center;margin-bottom:var(--rtk-space-1, 4px);font-size:12px;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity))}:host([size='sm']) rtk-tooltip,:host([size='md']) rtk-tooltip{width:100%}:host([size='sm'])>#sync-button{height:var(--rtk-space-8, 32px);width:var(--rtk-space-16, 64px);padding-left:var(--rtk-space-0, 0px)}:host([size='md'])>#sync-button{height:var(--rtk-space-8, 32px);width:var(--rtk-space-16, 64px)}:host([size='lg'])>#sync-button{flex-direction:row;height:var(--rtk-space-8, 32px);width:var(--rtk-space-16, 64px)}@media (orientation: portrait){:host([size='lg']) #sync-button{flex-direction:column-reverse;height:var(--rtk-space-16, 64px);width:var(--rtk-space-16, 64px)}:host([size='md']) #sync-button{height:var(--rtk-space-16, 64px);width:var(--rtk-space-16, 64px)}:host([size='sm']) #sync-button{height:var(--rtk-space-10, 40px);width:var(--rtk-space-16, 64px);flex-direction:row}}#sync-button>rtk-icon{max-height:14px}#sync-button rtk-icon{--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}:host([size='sm']) #sync-button>rtk-icon{width:auto}#sync-button.active rtk-icon{color:rgb(var(--rtk-colors-text-1000, 255 255 255))}div{align-content:center;line-height:2rem}rtk-icon{height:var(--rtk-space-6, 24px);width:var(--rtk-space-8, 32px)}#sync-button.active{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-success, 98 165 4) / var(--tw-bg-opacity))}";
 const RtkSpotlightIndicatorStyle0 = rtkSpotlightIndicatorCss;

package/dist/esm/rtk-stage-toggle.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-c1fb98bb.js';
-import { e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const canJoinStage = (meeting) => {
     var _a, _b;

package/dist/esm/rtk-stage.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-c1fb98bb.js';
-import { e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkStageCss = ":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;position:relative;overflow:hidden}";
 const RtkStageStyle0 = rtkStageCss;
@@ -25,7 +25,7 @@ const RtkStage = class {
         this.t = useLanguage();
     }
     render() {
-        return (h(Host, { key: 'a8869602eda342c0c2de8682ab0b68cf68b4883e' }, h("slot", { key: 'f2c477f44bed9ac574795d934db9f72920b73180' })));
+        return (h(Host, { key: '5368323635d0a3262bdecf9ac75a33db78bc1553' }, h("slot", { key: 'f0b07507a8a299e12c251fbb056ae30cf1302554' })));
     }
 };
 __decorate([

package/dist/esm/rtk-transcript.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-c1fb98bb.js';
-import { h as useLanguage } from './ui-store-9e486e1b.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { i as useLanguage } from './ui-store-5a66fa71.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkTranscriptCss = ":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{pointer-events:none;display:block;color:rgb(var(--rtk-colors-text-1000, 255 255 255));display:flex;justify-content:center;vertical-align:middle;animation:show 0.4s ease;transition:0.4s;z-index:5;width:100%}.ctr{box-sizing:border-box;display:inline-flex;height:100%;align-items:center;padding-left:var(--rtk-space-3, 12px);padding-right:var(--rtk-space-3, 12px);-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:var(--rtk-border-radius-md, 8px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity));--tw-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);--tw-shadow-color:rgb(var(--rtk-colors-background-1000, 8 8 8));--tw-shadow:var(--tw-shadow-colored);pointer-events:auto;padding:var(--rtk-space-3, 12px);overflow:auto;max-width:50%}.message{margin:var(--rtk-space-0, 0px);display:inline-block;justify-content:center;max-width:100%;text-wrap:wrap;line-height:1.5rem}.message .name{font-weight:bold}:host(.exit){animation:exit 0.4s ease}@keyframes show{0%{opacity:0;transform:translateY(120px)}100%{opacity:1;transform:translateY(0px)}}@keyframes exit{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-120px)}}:host([size='sm']){font-size:14px}";
 const RtkTranscriptStyle0 = rtkTranscriptCss;
@@ -40,7 +40,7 @@ const RtkTranscript = class {
         }, 10000);
     }
     render() {
-        return (h(Host, { key: 'ef273b9fcb4646120b31fce89d9c2cc5d4f2c811' }, h("div", { key: '68ec72f68aa52761f1b29c021a9babbe72ed0fd6', class: "ctr" }, h("p", { key: 'db08ea2b280f097b700163954ce8f7893f312919', class: "message" }, h("span", { key: '06fd5928dd075d4edc35bc09859ad51c6b2ec54f', class: "name" }, this.transcript.name), ": ", this.transcript.transcript))));
+        return (h(Host, { key: '1f1b1df183a375365bc978637305a9485603ba06' }, h("div", { key: '81424af54263199079b796559efaecc0e9a476df', class: "ctr" }, h("p", { key: '1d2d0eb2c17eb508eea0fe3260828982a03848a8', class: "message" }, h("span", { key: '895dc32dbc3bb8e6f97a4c1efb750e5f539dad70', class: "name" }, this.transcript.name), ": ", this.transcript.transcript))));
     }
     static get watchers() { return {
         "transcript": ["transcriptChanged"]

package/dist/esm/rtk-transcripts.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, w as writeTask, h, H as Host, a as getElement } from './index-c1fb98bb.js';
-import { c as createDefaultConfig, h as useLanguage, P as clone } from './ui-store-9e486e1b.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { c as createDefaultConfig, i as useLanguage, Q as clone } from './ui-store-5a66fa71.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkTranscriptsCss = ":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:absolute;top:var(--rtk-space-4, 16px);right:var(--rtk-space-4, 16px);bottom:var(--rtk-space-4, 16px);left:var(--rtk-space-4, 16px);top:auto;display:flex;flex-direction:column;pointer-events:none;justify-content:center;width:100%;z-index:5}rtk-transcript{margin-top:var(--rtk-space-2, 8px)}";
 const RtkTranscriptsStyle0 = rtkTranscriptsCss;

package/dist/esm/rtk-ui-provider.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-c1fb98bb.js';
-import { e as defaultIconPack, h as useLanguage, c as createDefaultConfig, u as uiStore, b as createPeerStore } from './ui-store-9e486e1b.js';
-import { d as deepMerge, p as provideRtkDesignSystem } from './merge-7ffc04b3.js';
+import { e as defaultIconPack, i as useLanguage, c as createDefaultConfig, f as defaultOverrides, u as uiStore, b as createPeerStore } from './ui-store-5a66fa71.js';
+import { d as deepMerge, p as provideRtkDesignSystem } from './merge-88832ad1.js';
 
 const rtkUiProviderCss = ":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{box-sizing:border-box;display:flex;flex-direction:column;--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));overflow:hidden;position:fixed;top:var(--rtk-space-0, 0px);right:var(--rtk-space-0, 0px);bottom:var(--rtk-space-0, 0px);left:var(--rtk-space-0, 0px);height:100%;width:100%}:host([mode='fill']){position:relative}";
 const RtkUiProviderStyle0 = rtkUiProviderCss;
@@ -24,6 +24,8 @@ const RtkUiProvider = class {
         this.mode = 'fixed';
         /** Whether to show setup screen or not */
         this.showSetupScreen = false;
+        /** UI Kit Overrides */
+        this.overrides = defaultOverrides;
         this.roomJoinedListener = () => {
             this.updateStates({ meeting: 'joined' });
         };
@@ -76,6 +78,7 @@ const RtkUiProvider = class {
         this.iconPackChanged(this.iconPack);
         this.tChanged(this.t);
         this.configChanged(this.config);
+        this.overridesChanged(this.overrides);
     }
     disconnectedCallback() {
         window.removeEventListener('rtkError', this.authErrorListener);
@@ -148,6 +151,7 @@ const RtkUiProvider = class {
                 iconPack: this.iconPack,
                 t: this.t,
                 providerId: this.providerId,
+                overrides: deepMerge(Object.assign({}, defaultOverrides), this.overrides),
             });
             // Notify components that peer specific store is now available
             document.dispatchEvent(new CustomEvent('rtkPeerStoreReady', {
@@ -204,6 +208,11 @@ const RtkUiProvider = class {
             provideRtkDesignSystem(document.documentElement, config.designTokens);
         }
     }
+    overridesChanged(overrides) {
+        if (this.peerStore) {
+            this.peerStore.state.overrides = deepMerge(Object.assign({}, defaultOverrides), overrides);
+        }
+    }
     render() {
         // Don't render children until meeting is properly initialized
         if (!this.meeting) {
@@ -216,7 +225,8 @@ const RtkUiProvider = class {
         "meeting": ["meetingChanged"],
         "iconPack": ["iconPackChanged"],
         "t": ["tChanged"],
-        "config": ["configChanged"]
+        "config": ["configChanged"],
+        "overrides": ["overridesChanged"]
     }; }
 };
 RtkUiProvider.style = RtkUiProviderStyle0;

package/dist/esm/rtk-waiting-screen.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-c1fb98bb.js';
-import { c as createDefaultConfig, e as defaultIconPack, h as useLanguage } from './ui-store-9e486e1b.js';
-import { S as SyncWithStore } from './index-e65afca5.js';
+import { c as createDefaultConfig, e as defaultIconPack, i as useLanguage } from './ui-store-5a66fa71.js';
+import { S as SyncWithStore } from './index-d08145ca.js';
 
 const rtkWaitingScreenCss = ":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{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.centered{display:flex;flex-direction:column;align-items:center}rtk-logo{margin-bottom:var(--rtk-space-8, 32px);height:var(--rtk-space-12, 48px)}p{font-size:16px;border-radius:var(--rtk-border-radius-lg, 12px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));padding-left:var(--rtk-space-8, 32px);padding-right:var(--rtk-space-8, 32px);padding-top:var(--rtk-space-4, 16px);padding-bottom:var(--rtk-space-4, 16px);color:rgb(var(--rtk-colors-text-1000, 255 255 255))}";
 const RtkWaitingScreenStyle0 = rtkWaitingScreenCss;
@@ -26,7 +26,7 @@ const RtkWaitingScreen = class {
         this.t = useLanguage();
     }
     render() {
-        return (h(Host, { key: '1b65c6ea9a3747fca54e10ae22de1f66f0b5095e' }, h("slot", { key: '1291fd61658c377b46a19a48972bd9fd718a6452' }, h("div", { key: '72d460d5cfaa8aa5ef03a97466a5ea1810c661a6', class: "centered", part: "content" }, h("rtk-logo", { key: 'd9f65cf1ca150090051a7f832eccff954231a53f', meeting: this.meeting, config: this.config, part: "logo", t: this.t }), h("p", { key: '2bf23f63b9bb3aea03c880ea70c2911f919fc299' }, this.t('waitlist.body_text'))))));
+        return (h(Host, { key: '15475bc2dd42d1b89d1dfcf63d1d05b693671c0b' }, h("slot", { key: 'a5d705095658274aa2abd361dab9890e3270272d' }, h("div", { key: '8f04de506a3bd89737958f49603a0d8c17f0f9b9', class: "centered", part: "content" }, h("rtk-logo", { key: '613fe16d55a7a6a0c093565fad53c0b2d8f19905', meeting: this.meeting, config: this.config, part: "logo", t: this.t }), h("p", { key: '0bc93fa5b94608311be92e0fab3e2657964a1220' }, this.t('waitlist.body_text'))))));
     }
 };
 __decorate([

package/dist/esm/{sidebar-030fff49.js → sidebar-dd9a38aa.js}

@@ -1,4 +1,4 @@
-import { N as isLiveStreamViewer } from './ui-store-9e486e1b.js';
+import { O as isLiveStreamViewer } from './ui-store-5a66fa71.js';
 
 const canViewChat = (meeting) => {
     if (meeting && !meeting.chat)

package/dist/esm/{ui-store-9e486e1b.js → ui-store-5a66fa71.js}

@@ -2,10 +2,8 @@ import { g as getRenderingRef, f as forceUpdate } from './index-c1fb98bb.js';
 
 const FlagsmithFeatureFlags = {
     PLAY_PARTICIPANT_TILE_VIDEO_ON_PAUSE: 'play_participant_tile_video_on_pause',
-    DISABLE_EMOJI_PICKER: 'disable_emoji_picker',
     FEAT_PAGINATED_CHAT: 'feat_paginated_chat',
     LOG_PLAYING_FAILURES: 'log_playing_failures',
-    FEAT_CHANNEL_CHAT: 'feat_channel_chat',
     DISABLE_KICKING: 'disable_kicking',
     ADMIN_CANTREMOVE_ADMIN: 'admin_cantremove_admin',
     CANTINVITE_VIEWER: 'cantinvite_viewer',
@@ -3593,8 +3591,6 @@ const defaultLanguage = {
     'chat.new': 'New',
     'chat.max_limit_warning': 'Max Character Limit',
     'chat.rate_limit_error': 'Please wait before you can send another message',
-    'chat.new_channel': 'Create new channel',
-    'chat.channel_name': 'Enter channel name',
     'chat.member_name': 'Enter member name',
     'chat.add_members': 'Add members',
     'chat.delete_msg': 'Delete',
@@ -3605,7 +3601,6 @@ const defaultLanguage = {
     'chat.send_file': 'Send a file',
     'chat.send_emoji': 'Send an emoji',
     'chat.update_msg': 'Update message',
-    'chat.channel_members': 'Channel Members',
     'chat.img.loading': 'Loading image',
     'chat.error.img_not_found': 'Image not found',
     'chat.error.empty_results': "Couldn't find a member with the specified name.",
@@ -3617,7 +3612,7 @@ const defaultLanguage = {
     'chat.search_conversations': 'Search conversations',
     'chat.start_conversation': 'Start a conversation..',
     'chat.empty_search': 'No messages found',
-    'chat.empty_channel': 'Send a message to get started',
+    'chat.empty_chat': 'Send a message to get started',
     'chat.cancel_upload': 'Cancel upload',
     'chat.view_chats': 'View chats',
     'chat.everyone': 'everyone',
@@ -3791,8 +3786,6 @@ const defaultIconPack = {
     horizontal_dots: '<svg fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M8 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0ZM14 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0ZM18 14a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z" fill="currentColor"/></svg>',
     ai_sparkle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 49 48" fill="none"><path fill="#F13E1B" d="m30.023 15.96.07.016a1.362 1.362 0 0 1 .657 2.068c-.163.23-.392.403-.658.497l-3.444 1.118a7.095 7.095 0 0 0-4.495 4.492l-1.12 3.442a1.357 1.357 0 0 1-1.267.907h-.016a1.361 1.361 0 0 1-1.283-.907l-1.12-3.442a7.091 7.091 0 0 0-4.495-4.509l-3.444-1.119a1.36 1.36 0 0 1 0-2.564l3.444-1.118a7.097 7.097 0 0 0 4.427-4.492l1.119-3.442a1.36 1.36 0 0 1 2.566 0l1.12 3.442a7.09 7.09 0 0 0 4.495 4.492l3.444 1.118Zm9.195 16.007-2.755-.894a5.678 5.678 0 0 1-3.596-3.594l-.896-2.753a1.087 1.087 0 0 0-2.053 0l-.895 2.753a5.672 5.672 0 0 1-3.541 3.594l-2.756.894a1.088 1.088 0 0 0 0 2.052l2.756.895a5.675 5.675 0 0 1 3.596 3.607l.896 2.753a1.088 1.088 0 0 0 2.052 0l.896-2.753a5.672 5.672 0 0 1 3.596-3.594l2.756-.894a1.088 1.088 0 0 0 0-2.052l-.056-.014Z"/><path fill="#2160FD" d="m39.218 31.967-2.755-.894a5.677 5.677 0 0 1-3.596-3.594l-.896-2.753a1.087 1.087 0 0 0-2.053 0l-.895 2.753a5.672 5.672 0 0 1-3.541 3.594l-2.756.894a1.088 1.088 0 0 0 0 2.052l2.756.895a5.675 5.675 0 0 1 3.596 3.607l.896 2.753a1.088 1.088 0 0 0 2.052 0l.896-2.753a5.672 5.672 0 0 1 3.596-3.594l2.756-.894a1.088 1.088 0 0 0 0-2.052l-.056-.014Z"/></svg>',
     meeting_ai: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28" fill="none"><path fill="#F13E1B" d="M9.111 12.888a4.98 4.98 0 0 0-1.075-.8l-.04.048a4.651 4.651 0 0 0-.903-.424l-2.446-.8a.963.963 0 0 1-.467-.356.953.953 0 0 1 0-1.116.955.955 0 0 1 .467-.352l2.446-.8A5.088 5.088 0 0 0 9.04 7.06a5.048 5.048 0 0 0 1.2-1.904l.02-.064.799-2.444A.97.97 0 0 1 11.969 2a.97.97 0 0 1 .91.648l.8 2.444a5.147 5.147 0 0 0 1.219 1.976 5.042 5.042 0 0 0 1.974 1.2l2.45.8h.048c.188.067.351.19.468.352.115.164.176.36.175.56.001.2-.06.396-.175.56a1 1 0 0 1-.468.352l-2.446.8a5.067 5.067 0 0 0-1.978 1.2 5.096 5.096 0 0 0-1.199 1.976l-.8 2.448-.023.06a1.02 1.02 0 0 1-.184.284.967.967 0 0 1-.703.3 1 1 0 0 1-.927-.644l-.8-2.448a5.11 5.11 0 0 0-.799-1.508 5.16 5.16 0 0 0-.4-.472Zm10.434 5.396a.492.492 0 0 1 .176-.236.473.473 0 0 1 .1-.048.466.466 0 0 1 .168-.04c.1 0 .197.031.28.088l.091.072a.456.456 0 0 1 .096.164l.4 1.224c.124.372.332.71.607.988.278.276.616.484.987.608l1.223.4h.028l.084.04a.536.536 0 0 1 .148.136c.056.082.087.18.088.28a.484.484 0 0 1-.32.456l-1.227.4a2.528 2.528 0 0 0-1.595 1.6l-.399 1.224a.46.46 0 0 1-.176.232.464.464 0 0 1-.28.088.475.475 0 0 1-.455-.32l-.4-1.224a2.507 2.507 0 0 0-.611-.992 2.487 2.487 0 0 0-.987-.612l-1.223-.4a.48.48 0 0 1 0-.908l1.223-.4c.367-.128.7-.337.975-.612.137-.142.257-.3.36-.468.1-.162.18-.335.24-.516l.399-1.224Z"/><path fill="currentColor" d="M19.545 18.284a.492.492 0 0 1 .176-.236.469.469 0 0 1 .1-.048.466.466 0 0 1 .168-.04c.1 0 .197.031.28.088l.091.072a.456.456 0 0 1 .096.164l.4 1.224c.124.372.332.71.607.988.279.276.616.484.988.608l1.222.4h.028l.084.04a.534.534 0 0 1 .148.136c.057.082.087.18.088.28a.484.484 0 0 1-.32.456l-1.227.4a2.528 2.528 0 0 0-1.595 1.6l-.399 1.224a.46.46 0 0 1-.175.232.464.464 0 0 1-.28.088.475.475 0 0 1-.456-.32l-.4-1.224a2.509 2.509 0 0 0-.61-.992 2.487 2.487 0 0 0-.988-.612l-1.223-.4a.48.48 0 0 1 0-.908l1.223-.4c.367-.128.7-.337.975-.612a2.7 2.7 0 0 0 .36-.468c.1-.162.18-.335.24-.516l.4-1.224Z"/></svg>',
-    create_channel: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path fill="currentColor" d="M2 14.75A3.25 3.25 0 0 0 5.25 18H6v2.75a1.25 1.25 0 0 0 1.999 1l2.125-1.59.396-1.583c.071-.286.177-.56.312-.82L7.5 20.252 7.499 16.5H5.25a1.75 1.75 0 0 1-1.75-1.75v-8.5c0-.966.784-1.75 1.75-1.75h13.5c.966 0 1.75.784 1.75 1.75v3.845a3.27 3.27 0 0 1 1.5.83V6.25A3.25 3.25 0 0 0 18.75 3H5.25A3.25 3.25 0 0 0 2 6.25v8.5Z"/><path fill="currentColor" d="m18.098 11.67-5.902 5.902a2.684 2.684 0 0 0-.707 1.247l-.458 1.831a1.087 1.087 0 0 0 1.319 1.318l1.83-.457a2.685 2.685 0 0 0 1.248-.707l5.902-5.902a2.285 2.285 0 1 0-3.232-3.232Z"/></svg>',
-    create_channel_illustration: '<svg width="503" height="362" viewBox="0 0 503 362" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M93.3477 192.893C93.3477 190.684 95.1385 188.893 97.3477 188.893H476C478.209 188.893 480 190.684 480 192.893V311.824C480 314.033 478.209 315.824 476 315.824H469.354C467.145 315.824 465.354 317.615 465.354 319.824V339.364C465.354 342.928 461.045 344.712 458.525 342.193L433.328 316.996C432.578 316.245 431.561 315.824 430.5 315.824H97.3477C95.1385 315.824 93.3477 314.033 93.3477 311.824V192.893Z" fill="#282828"/> <path d="M306.606 230.9H136.121C134.648 230.9 133.453 232.095 133.453 233.568C133.453 235.041 134.648 236.236 136.121 236.236H306.606C308.079 236.236 309.274 235.041 309.274 233.568C309.274 232.095 308.079 230.9 306.606 230.9Z" fill="#2160FD"/> <path d="M437.226 249.358H136.121C134.648 249.358 133.453 250.553 133.453 252.026C133.453 253.499 134.648 254.694 136.121 254.694H437.226C438.7 254.694 439.894 253.499 439.894 252.026C439.894 250.553 438.7 249.358 437.226 249.358Z" fill="#5C5C5C"/> <path d="M436.926 267.816H136.121C134.648 267.816 133.453 269.011 133.453 270.484C133.453 271.957 134.648 273.152 136.121 273.152H436.926C438.4 273.152 439.594 271.957 439.594 270.484C439.594 269.011 438.399 267.816 436.926 267.816Z" fill="#5C5C5C"/> <path d="M411.652 23C411.652 20.7909 409.861 19 407.652 19H29C26.7909 19 25 20.7909 25 23V141.931C25 144.14 26.7909 145.931 29 145.931H35.646C37.8551 145.931 39.646 147.722 39.646 149.931V169.472C39.646 173.036 43.9546 174.82 46.4745 172.3L71.6714 147.103C72.4216 146.352 73.439 145.931 74.4999 145.931H407.652C409.861 145.931 411.652 144.14 411.652 141.931V23Z" fill="#282828"/> <path d="M241.188 61.9839H70.703C69.2296 61.9839 68.0352 63.1783 68.0352 64.6517C68.0352 66.1252 69.2296 67.3196 70.703 67.3196H241.188C242.662 67.3196 243.856 66.1252 243.856 64.6517C243.856 63.1783 242.662 61.9839 241.188 61.9839Z" fill="#2160FD"/> <path d="M371.808 80.4419H70.703C69.2296 80.4419 68.0352 81.6363 68.0352 83.1098C68.0352 84.5832 69.2296 85.7776 70.703 85.7776H371.808C373.282 85.7776 374.476 84.5832 374.476 83.1098C374.476 81.6363 373.282 80.4419 371.808 80.4419Z" fill="#5C5C5C"/> <path d="M371.508 98.8999H70.703C69.2296 98.8999 68.0352 100.094 68.0352 101.568C68.0352 103.041 69.2296 104.236 70.703 104.236H371.508C372.982 104.236 374.176 103.041 374.176 101.568C374.176 100.094 372.982 98.8999 371.508 98.8999Z" fill="#5C5C5C"/> </svg>',
     captionsOn: '<svg width="24" height="24" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M18.75 4A3.25 3.25 0 0 1 22 7.25v9.505a3.25 3.25 0 0 1-3.25 3.25H5.25A3.25 3.25 0 0 1 2 16.755V7.25a3.25 3.25 0 0 1 3.066-3.245L5.25 4h13.5Zm0 1.5H5.25l-.144.006A1.75 1.75 0 0 0 3.5 7.25v9.505c0 .966.784 1.75 1.75 1.75h13.5a1.75 1.75 0 0 0 1.75-1.75V7.25a1.75 1.75 0 0 0-1.75-1.75ZM5.5 12c0-3.146 2.713-4.775 5.122-3.401A.75.75 0 0 1 9.878 9.9C8.481 9.104 7 9.994 7 12c0 2.005 1.484 2.896 2.88 2.103a.75.75 0 0 1 .74 1.304C8.216 16.775 5.5 15.143 5.5 12Zm7.5 0c0-3.146 2.713-4.775 5.122-3.401a.75.75 0 0 1-.744 1.302C15.981 9.104 14.5 9.994 14.5 12c0 2.005 1.484 2.896 2.88 2.103a.75.75 0 0 1 .74 1.304C15.716 16.775 13 15.143 13 12Z" fill="currentColor"/></svg>',
     captionsOff: '<svg width="24" height="24" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M3.28 2.22a.75.75 0 0 0-1.06 1.06l1.25 1.25A3.247 3.247 0 0 0 2 7.25v9.505a3.25 3.25 0 0 0 3.25 3.25h13.5c.063 0 .126-.002.188-.006l1.781 1.781a.75.75 0 0 0 1.061-1.06L3.28 2.22Zm14.164 16.284H5.25a1.75 1.75 0 0 1-1.75-1.75V7.25c0-.727.443-1.35 1.074-1.615l2.828 2.828C6.292 9.043 5.5 10.3 5.5 12c0 3.143 2.715 4.775 5.12 3.406a.75.75 0 0 0-.74-1.303C8.483 14.896 7 14.005 7 12c0-1.37.69-2.22 1.573-2.366l8.87 8.87Zm2.986-1.256c.045-.157.07-.322.07-.494V7.25a1.75 1.75 0 0 0-1.75-1.75H8.682L7.182 4H18.75A3.25 3.25 0 0 1 22 7.25v9.505c0 .593-.159 1.148-.436 1.627l-1.134-1.134Zm-5.877-5.877-1.197-1.197c.813-1.888 2.882-2.65 4.766-1.575a.75.75 0 0 1-.744 1.302c-1.241-.708-2.549-.085-2.825 1.47Z" fill="currentColor"/></svg>',
     play: '<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M8 5v14l11-7z" /></svg>',
@@ -3841,6 +3834,13 @@ const getUserPreferences = () => {
 };
 const chatUnreadTimestamps = {};
 
+/**
+ * Default UI Kit Overrides
+ */
+const defaultOverrides = {
+    disableEmojiPicker: false,
+};
+
 const getInitialStates = (peerId) => ({
     meeting: 'idle',
     prefs: getUserPreferences(),
@@ -3855,6 +3855,7 @@ const uiStore = createStore({
     peerId: 'global',
     storeType: 'global',
     storeId: 'store-global',
+    overrides: defaultOverrides,
 });
 const elementsMap = new Map();
 // Attach elementsMap to global store for consistency
@@ -3878,7 +3879,7 @@ uiStore.use({
 });
 const uiState = uiStore.state;
 // Function to create a new store instance for peer-specific stores
-function createPeerStore({ meeting, config, providerId, iconPack, t }) {
+function createPeerStore({ meeting, config, providerId, iconPack, t, overrides, }) {
     const store = createStore({
         meeting: meeting,
         t,
@@ -3889,6 +3890,7 @@ function createPeerStore({ meeting, config, providerId, iconPack, t }) {
         storeType: 'peer',
         // Use provider id's numeric portion as store id for easier debugging
         storeId: 'store-' + providerId.replace('provider-', ''),
+        overrides: overrides,
     });
     const peerElementsMap = new Map();
     // Attach elementsMap to store so appendElement/removeElement can access it
@@ -3958,4 +3960,4 @@ function removeElement(propName, element, targetStore = uiStore) {
     }
 }
 
-export { isArguments$1 as A, BreakoutRoomsManager as B, isFunction as C, initCloneObject as D, isLiveStreamHost as E, disableSettingSinkId as F, chatUnreadTimestamps as G, FlagsmithFeatureFlags as H, gracefulStorage$1 as I, appendElement as J, removeElement as K, root$1 as L, canToggleBreakout as M, isLiveStreamViewer as N, showLivestream as O, clone as P, resetRoomCount as Q, participantIdentifier as R, Stack as S, PlayerState as T, getLivestreamViewerAllowedQualityLevels as U, getPreference as V, setPreference as W, getAllConnectedParticipants as X, uiState as a, createPeerStore as b, createDefaultConfig as c, defaultConfig as d, defaultIconPack as e, defaultLanguage as f, getInitialStates as g, useLanguage as h, defineProperty$1 as i, isObject as j, isArrayLike as k, isIndex as l, eq as m, isObjectLike as n, baseGetTag as o, getPrototype$1 as p, baseAssignValue as q, copyObject as r, keysIn as s, isArray$1 as t, uiStore as u, isBuffer$1 as v, isTypedArray$1 as w, copyArray as x, cloneBuffer as y, cloneTypedArray as z };
+export { cloneTypedArray as A, BreakoutRoomsManager as B, isArguments$1 as C, isFunction as D, initCloneObject as E, isLiveStreamHost as F, disableSettingSinkId as G, chatUnreadTimestamps as H, FlagsmithFeatureFlags as I, gracefulStorage$1 as J, appendElement as K, removeElement as L, root$1 as M, canToggleBreakout as N, isLiveStreamViewer as O, showLivestream as P, clone as Q, resetRoomCount as R, Stack as S, participantIdentifier as T, PlayerState as U, getLivestreamViewerAllowedQualityLevels as V, getPreference as W, setPreference as X, getAllConnectedParticipants as Y, uiState as a, createPeerStore as b, createDefaultConfig as c, defaultConfig as d, defaultIconPack as e, defaultOverrides as f, getInitialStates as g, defaultLanguage as h, useLanguage as i, defineProperty$1 as j, isObject as k, isArrayLike as l, isIndex as m, eq as n, isObjectLike as o, baseGetTag as p, getPrototype$1 as q, baseAssignValue as r, copyObject as s, keysIn as t, uiStore as u, isArray$1 as v, isBuffer$1 as w, isTypedArray$1 as x, copyArray as y, cloneBuffer as z };

package/dist/realtimekit-ui/index.esm.js

@@ -1 +1 @@
-import{c as t}from"./p-e87928f7.js";export{B as BreakoutRoomsManager,c as createDefaultConfig,b as createPeerStore,d as defaultConfig,e as defaultIconPack,f as defaultLanguage,g as getInitialStates,a as uiState,u as uiStore,h as useLanguage}from"./p-e87928f7.js";export{p as provideRtkDesignSystem}from"./p-91fd286c.js";import{g as s}from"./p-93b84c22.js";export{e as extendConfig,g as generateConfig}from"./p-93b84c22.js";export{R as RtkNotificationsAudio}from"./p-6a45f305.js";export{g as generateChatGroupKey,a as getChatGroups,c as getParticipantUserId,b as getUnreadChatCounts}from"./p-084b6f30.js";import"./p-0ee570cd.js";const i=(t,e)=>{if("undefined"==typeof document)return!1;const s=new CustomEvent("rtkNotification",{detail:Object.assign(Object.assign({},t),{playSound:e}),composed:!0});return document.dispatchEvent(s)};function r(t){return e=>Array.isArray(e)?e[0]===t:e===t}function o(t){return e=>Array.isArray(e)?e[0]!==t:e!==t}function n(t){return t.replace(/([a-z])([A-Z])/g,(t=>`${t[0]}-${t[1]}`.toLowerCase()))}class l{constructor(t,e,s){this.elem=t,this.config=e,this.keyString=s}add(t,e={}){var s;let i=t=n(t);return Object.keys(e).length>0&&(i=[t,e]),Array.isArray(this.elem)?this.elem.push(i):"children"in this.elem&&Array.isArray(this.elem.children)?this.elem.children=[...this.elem.children,i]:"remove"in this.elem&&Array.isArray(this.elem.remove)&&this.elem.remove.find(r(t))?this.elem.remove=this.elem.remove.filter(o(t)):("add"in this.elem||(this.elem.add=[]),null===(s=this.elem.add)||void 0===s||s.push(i)),this}remove(t){var e;if(t=n(t),Array.isArray(this.elem)){const e=this.elem.findIndex(r(t));e>-1&&this.elem.splice(e,1)}else"children"in this.elem&&Array.isArray(this.elem.children)?this.elem.children=this.elem.children.filter(o(t)):"add"in this.elem&&Array.isArray(this.elem.add)&&this.elem.add.find((e=>e===t))?this.elem.add=this.elem.add.filter(o(t)):("remove"in this.elem||(this.elem.remove=[]),null===(e=this.elem.remove)||void 0===e||e.push(t));return this}set style(t){console.log(t)}setChildrenProps(t,e){console.log(this.keyString,t,e)}getChildrenProps(t){return console.log(this.keyString,t),{}}replace(t){console.log(this.config,t)}}class m{constructor(e){this.config=e||t()}find(t,e={}){t=n(t);const s=[],i=[];Object.keys(e||{}).forEach((t=>{"boolean"==typeof e[t]?s.push(t):i.push([t,e[t]])})),s.sort();const r=this.config.root;if(void 0===r)return;let o=t,a="";s.length>0&&(a=`.${s.join(".")}`,o=`${t}${a}`,Array.isArray(r[t])&&(r[t]={states:[],children:r[t]}),void 0===r[t].states&&(r[t].states=[]),s.forEach((e=>{var s,i;-1===(null===(s=r[t].states)||void 0===s?void 0:s.indexOf(e))&&(null===(i=r[t].states)||void 0===i||i.push(e))}))),i.length>0&&i.forEach((e=>{o=`${t}[${e[0]}=${e[1]}]${a}`,Array.isArray(r[t])&&(r[t]={state:e[0],children:r[t]})}));let h=r[o];return void 0===h&&(r[o]={},h=r[o]),new l(h,this.config,o)}build(){return this.config}}function v(t,e,i){if(!i){const t=s(e.self.config,e);i=t.config}return t.map((t=>{i=t.register(i,e,(t=>new m(t)))})),i}export{m as RtkUiBuilder,v as registerAddons,i as sendNotification}
+import{c as t}from"./p-ae9de69a.js";export{B as BreakoutRoomsManager,c as createDefaultConfig,b as createPeerStore,d as defaultConfig,e as defaultIconPack,h as defaultLanguage,f as defaultOverrides,g as getInitialStates,a as uiState,u as uiStore,i as useLanguage}from"./p-ae9de69a.js";export{p as provideRtkDesignSystem}from"./p-0e513482.js";import{g as s}from"./p-79731cb6.js";export{e as extendConfig,g as generateConfig}from"./p-79731cb6.js";export{R as RtkNotificationsAudio}from"./p-3a14da51.js";export{g as generateChatGroupKey,a as getChatGroups,c as getParticipantUserId,b as getUnreadChatCounts}from"./p-f89bb70f.js";import"./p-0ee570cd.js";const r=(t,e)=>{if("undefined"==typeof document)return!1;const s=new CustomEvent("rtkNotification",{detail:Object.assign(Object.assign({},t),{playSound:e}),composed:!0});return document.dispatchEvent(s)};function o(t){return e=>Array.isArray(e)?e[0]===t:e===t}function n(t){return e=>Array.isArray(e)?e[0]!==t:e!==t}function l(t){return t.replace(/([a-z])([A-Z])/g,(t=>`${t[0]}-${t[1]}`.toLowerCase()))}class m{constructor(t,e,s){this.elem=t,this.config=e,this.keyString=s}add(t,e={}){var s;let i=t=l(t);return Object.keys(e).length>0&&(i=[t,e]),Array.isArray(this.elem)?this.elem.push(i):"children"in this.elem&&Array.isArray(this.elem.children)?this.elem.children=[...this.elem.children,i]:"remove"in this.elem&&Array.isArray(this.elem.remove)&&this.elem.remove.find(o(t))?this.elem.remove=this.elem.remove.filter(n(t)):("add"in this.elem||(this.elem.add=[]),null===(s=this.elem.add)||void 0===s||s.push(i)),this}remove(t){var e;if(t=l(t),Array.isArray(this.elem)){const e=this.elem.findIndex(o(t));e>-1&&this.elem.splice(e,1)}else"children"in this.elem&&Array.isArray(this.elem.children)?this.elem.children=this.elem.children.filter(n(t)):"add"in this.elem&&Array.isArray(this.elem.add)&&this.elem.add.find((e=>e===t))?this.elem.add=this.elem.add.filter(n(t)):("remove"in this.elem||(this.elem.remove=[]),null===(e=this.elem.remove)||void 0===e||e.push(t));return this}set style(t){console.log(t)}setChildrenProps(t,e){console.log(this.keyString,t,e)}getChildrenProps(t){return console.log(this.keyString,t),{}}replace(t){console.log(this.config,t)}}class v{constructor(e){this.config=e||t()}find(t,e={}){t=l(t);const s=[],i=[];Object.keys(e||{}).forEach((t=>{"boolean"==typeof e[t]?s.push(t):i.push([t,e[t]])})),s.sort();const r=this.config.root;if(void 0===r)return;let a=t,o="";s.length>0&&(o=`.${s.join(".")}`,a=`${t}${o}`,Array.isArray(r[t])&&(r[t]={states:[],children:r[t]}),void 0===r[t].states&&(r[t].states=[]),s.forEach((e=>{var s,i;-1===(null===(s=r[t].states)||void 0===s?void 0:s.indexOf(e))&&(null===(i=r[t].states)||void 0===i||i.push(e))}))),i.length>0&&i.forEach((e=>{a=`${t}[${e[0]}=${e[1]}]${o}`,Array.isArray(r[t])&&(r[t]={state:e[0],children:r[t]})}));let n=r[a];return void 0===n&&(r[a]={},n=r[a]),new m(n,this.config,a)}build(){return this.config}}function y(t,e,i){if(!i){const t=s(e.self.config,e);i=t.config}return t.map((t=>{i=t.register(i,e,(t=>new v(t)))})),i}export{v as RtkUiBuilder,y as registerAddons,r as sendNotification}

package/dist/realtimekit-ui/{p-a9dd63ef.entry.js → p-00fbc77d.entry.js}

@@ -1 +1 @@
-import{r as t,c as r,h as i,H as s}from"./p-0ee570cd.js";import{c as a,e,h as o}from"./p-e87928f7.js";import{S as n}from"./p-80c856cd.js";import{d as p}from"./p-e720b51e.js";var c=function(t,r,i,s){var a,e=arguments.length,o=e<3?r:null===s?s=Object.getOwnPropertyDescriptor(r,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(t,r,i,s);else for(var n=t.length-1;n>=0;n--)(a=t[n])&&(o=(e<3?a(o):e>3?a(r,i,o):a(r,i))||o);return e>3&&o&&Object.defineProperty(r,i,o),o};const h=class{constructor(s){t(this,s),this.stateUpdate=r(this,"rtkStateUpdate",7),this.config=a(),this.iconPack=e,this.defaultParticipantsTabId="stage-list",this.t=o(),this.currentParticipantsTabId=this.defaultParticipantsTabId,this.tabs=[],this.hasRequests=!1,this.search="",this.updateParticipantCountsInTabs=p((()=>{var t;let r=(null===(t=this.meeting.participants.waitlisted)||void 0===t?void 0:t.size)||0,s=0,a=0;this.meeting.participants.joined.toArray().forEach((t=>{"ON_STAGE"===t.stageStatus&&s++,"OFF_STAGE"===t.stageStatus&&a++,"REQUESTED_TO_JOIN_STAGE"===t.stageStatus&&(r++,a++),"ACCEPTED_TO_JOIN_STAGE"===t.stageStatus&&a++})),"ON_STAGE"===this.meeting.self.stageStatus&&s++,"OFF_STAGE"===this.meeting.self.stageStatus&&a++,"REQUESTED_TO_JOIN_STAGE"===this.meeting.self.stageStatus&&(r++,a++),"ACCEPTED_TO_JOIN_STAGE"===this.meeting.self.stageStatus&&a++;const e=[];this.shouldShowRequestsTab()&&e.push({id:"requests",name:i("span",null,this.t("requests")," ",i("span",{class:`tab-participant-count-badge ${r>0?"requests-pending":""} ${"requests"===this.currentParticipantsTabId?"selected-tab":""}`},r))}),e.push({id:"stage-list",name:i("span",null,this.t("participants")," ",i("span",{class:"tab-participant-count-badge "+("stage-list"===this.currentParticipantsTabId?"selected-tab":"")},s))}),this.shouldShowViewersTab()&&e.push({id:"viewer-list",name:i("span",null,this.t("viewers")," ",i("span",{class:"tab-participant-count-badge "+("viewer-list"===this.currentParticipantsTabId?"selected-tab":"")},a))}),this.tabs=e,this.hasRequests=r>0})),this.onSearchInput=t=>{this.search=t.target.value},this.shouldShowViewersTab=()=>{var t,r,i;return null===(i=null===(r=null===(t=this.meeting)||void 0===t?void 0:t.self)||void 0===r?void 0:r.permissions)||void 0===i?void 0:i.stageEnabled},this.shouldShowRequestsTab=()=>{var t;let r=!1;return r="LIVESTREAM"!==this.meeting.meta.viewType&&(null===(t=this.meeting.self.config.waitingRoom)||void 0===t?void 0:t.isEnabled)&&this.meeting.self.permissions.acceptWaitingRequests,this.meeting.self.permissions.stageEnabled&&this.meeting.self.permissions.acceptStageRequests||r},this.viewSection=t=>{this.currentParticipantsTabId=t}}connectedCallback(){this.meetingChanged(this.meeting)}disconnectedCallback(){this.meeting&&(this.meeting.participants.joined.off("participantJoined",this.updateParticipantCountsInTabs),this.meeting.participants.joined.off("participantsUpdate",this.updateParticipantCountsInTabs),this.meeting.participants.joined.off("participantLeft",this.updateParticipantCountsInTabs),this.meeting.participants.joined.off("stageStatusUpdate",this.updateParticipantCountsInTabs),this.meeting.stage.off("stageStatusUpdate",this.updateParticipantCountsInTabs),this.meeting.participants.waitlisted.off("participantJoined",this.updateParticipantCountsInTabs),this.meeting.participants.waitlisted.off("participantLeft",this.updateParticipantCountsInTabs),this.meeting.participants.waitlisted.off("stageStatusUpdate",this.updateParticipantCountsInTabs))}meetingChanged(t){t&&(t.participants.joined.on("participantJoined",this.updateParticipantCountsInTabs),t.participants.joined.on("participantsUpdate",this.updateParticipantCountsInTabs),t.participants.joined.on("participantLeft",this.updateParticipantCountsInTabs),t.participants.joined.on("stageStatusUpdate",this.updateParticipantCountsInTabs),t.stage.on("stageStatusUpdate",this.updateParticipantCountsInTabs),t.participants.waitlisted.on("participantJoined",this.updateParticipantCountsInTabs),t.participants.waitlisted.on("participantLeft",this.updateParticipantCountsInTabs),t.participants.waitlisted.on("stageStatusUpdate",this.updateParticipantCountsInTabs),this.updateParticipantCountsInTabs())}currentParticipantsTabIdChanged(){this.stateUpdate.emit({participantsTabId:this.currentParticipantsTabId}),this.updateParticipantCountsInTabs()}render(){if(!this.meeting)return null;const t={meeting:this.meeting,states:this.states,config:this.config,size:this.size,iconPack:this.iconPack,t:this.t};return i(s,null,i("div",{class:"search",part:"search"},i("rtk-icon",{icon:this.iconPack.search,part:"search-icon"}),i("input",{type:"search",autocomplete:"off",placeholder:this.t("search"),onInput:this.onSearchInput,part:"search-input"})),i("slot",{name:"start"}),i("div",{class:"ctr scrollbar "+("requests"!==this.currentParticipantsTabId?"virtualised":""),part:"container"},i("rtk-sidebar-ui",{tabs:this.tabs,currentTab:this.currentParticipantsTabId,view:"full-screen",hideHeader:!0,hideCloseAction:!0,style:{position:"relative"},onTabChange:t=>{this.viewSection(t.detail),t.stopPropagation()}},(!this.currentParticipantsTabId||"stage-list"===this.currentParticipantsTabId)&&i("div",{slot:"stage-list",style:{marginTop:"10px",height:"100%"}},i("rtk-participants-stage-list",Object.assign({},t,{search:this.search,hideHeader:!0}))),"requests"===this.currentParticipantsTabId&&i("div",{slot:"requests",style:{marginTop:"10px",height:"100%"}},!this.hasRequests&&i("div",{class:"no-pending-requests"},this.t("participants.no_pending_requests")),i("rtk-participants-stage-queue",Object.assign({},t)),i("rtk-participants-waiting-list",Object.assign({},t))),"viewer-list"===this.currentParticipantsTabId&&i("div",{slot:"viewer-list",style:{marginTop:"10px",height:"100%"}},i("rtk-participants-viewer-list",Object.assign({},t,{search:this.search,hideHeader:!0}))))),i("slot",{name:"end"}))}static get watchers(){return{meeting:["meetingChanged"],currentParticipantsTabId:["currentParticipantsTabIdChanged"]}}};c([n()],h.prototype,"meeting",void 0),c([n()],h.prototype,"states",void 0),c([n()],h.prototype,"config",void 0),c([n()],h.prototype,"iconPack",void 0),c([n()],h.prototype,"t",void 0),h.style=":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))}";export{h as rtk_participants}
+import{r as t,c as r,h as i,H as a}from"./p-0ee570cd.js";import{c as s,e,i as o}from"./p-ae9de69a.js";import{S as n}from"./p-1ff96b0f.js";import{d as p}from"./p-328d53bd.js";var c=function(t,r,i,a){var s,e=arguments.length,o=e<3?r:null===a?a=Object.getOwnPropertyDescriptor(r,i):a;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(t,r,i,a);else for(var n=t.length-1;n>=0;n--)(s=t[n])&&(o=(e<3?s(o):e>3?s(r,i,o):s(r,i))||o);return e>3&&o&&Object.defineProperty(r,i,o),o};const h=class{constructor(a){t(this,a),this.stateUpdate=r(this,"rtkStateUpdate",7),this.config=s(),this.iconPack=e,this.defaultParticipantsTabId="stage-list",this.t=o(),this.currentParticipantsTabId=this.defaultParticipantsTabId,this.tabs=[],this.hasRequests=!1,this.search="",this.updateParticipantCountsInTabs=p((()=>{var t;let r=(null===(t=this.meeting.participants.waitlisted)||void 0===t?void 0:t.size)||0,a=0,s=0;this.meeting.participants.joined.toArray().forEach((t=>{"ON_STAGE"===t.stageStatus&&a++,"OFF_STAGE"===t.stageStatus&&s++,"REQUESTED_TO_JOIN_STAGE"===t.stageStatus&&(r++,s++),"ACCEPTED_TO_JOIN_STAGE"===t.stageStatus&&s++})),"ON_STAGE"===this.meeting.self.stageStatus&&a++,"OFF_STAGE"===this.meeting.self.stageStatus&&s++,"REQUESTED_TO_JOIN_STAGE"===this.meeting.self.stageStatus&&(r++,s++),"ACCEPTED_TO_JOIN_STAGE"===this.meeting.self.stageStatus&&s++;const e=[];this.shouldShowRequestsTab()&&e.push({id:"requests",name:i("span",null,this.t("requests")," ",i("span",{class:`tab-participant-count-badge ${r>0?"requests-pending":""} ${"requests"===this.currentParticipantsTabId?"selected-tab":""}`},r))}),e.push({id:"stage-list",name:i("span",null,this.t("participants")," ",i("span",{class:"tab-participant-count-badge "+("stage-list"===this.currentParticipantsTabId?"selected-tab":"")},a))}),this.shouldShowViewersTab()&&e.push({id:"viewer-list",name:i("span",null,this.t("viewers")," ",i("span",{class:"tab-participant-count-badge "+("viewer-list"===this.currentParticipantsTabId?"selected-tab":"")},s))}),this.tabs=e,this.hasRequests=r>0})),this.onSearchInput=t=>{this.search=t.target.value},this.shouldShowViewersTab=()=>{var t,r,i;return null===(i=null===(r=null===(t=this.meeting)||void 0===t?void 0:t.self)||void 0===r?void 0:r.permissions)||void 0===i?void 0:i.stageEnabled},this.shouldShowRequestsTab=()=>{var t;let r=!1;return r="LIVESTREAM"!==this.meeting.meta.viewType&&(null===(t=this.meeting.self.config.waitingRoom)||void 0===t?void 0:t.isEnabled)&&this.meeting.self.permissions.acceptWaitingRequests,this.meeting.self.permissions.stageEnabled&&this.meeting.self.permissions.acceptStageRequests||r},this.viewSection=t=>{this.currentParticipantsTabId=t}}connectedCallback(){this.meetingChanged(this.meeting)}disconnectedCallback(){this.meeting&&(this.meeting.participants.joined.off("participantJoined",this.updateParticipantCountsInTabs),this.meeting.participants.joined.off("participantsUpdate",this.updateParticipantCountsInTabs),this.meeting.participants.joined.off("participantLeft",this.updateParticipantCountsInTabs),this.meeting.participants.joined.off("stageStatusUpdate",this.updateParticipantCountsInTabs),this.meeting.stage.off("stageStatusUpdate",this.updateParticipantCountsInTabs),this.meeting.participants.waitlisted.off("participantJoined",this.updateParticipantCountsInTabs),this.meeting.participants.waitlisted.off("participantLeft",this.updateParticipantCountsInTabs),this.meeting.participants.waitlisted.off("stageStatusUpdate",this.updateParticipantCountsInTabs))}meetingChanged(t){t&&(t.participants.joined.on("participantJoined",this.updateParticipantCountsInTabs),t.participants.joined.on("participantsUpdate",this.updateParticipantCountsInTabs),t.participants.joined.on("participantLeft",this.updateParticipantCountsInTabs),t.participants.joined.on("stageStatusUpdate",this.updateParticipantCountsInTabs),t.stage.on("stageStatusUpdate",this.updateParticipantCountsInTabs),t.participants.waitlisted.on("participantJoined",this.updateParticipantCountsInTabs),t.participants.waitlisted.on("participantLeft",this.updateParticipantCountsInTabs),t.participants.waitlisted.on("stageStatusUpdate",this.updateParticipantCountsInTabs),this.updateParticipantCountsInTabs())}currentParticipantsTabIdChanged(){this.stateUpdate.emit({participantsTabId:this.currentParticipantsTabId}),this.updateParticipantCountsInTabs()}render(){if(!this.meeting)return null;const t={meeting:this.meeting,states:this.states,config:this.config,size:this.size,iconPack:this.iconPack,t:this.t};return i(a,null,i("div",{class:"search",part:"search"},i("rtk-icon",{icon:this.iconPack.search,part:"search-icon"}),i("input",{type:"search",autocomplete:"off",placeholder:this.t("search"),onInput:this.onSearchInput,part:"search-input"})),i("slot",{name:"start"}),i("div",{class:"ctr scrollbar "+("requests"!==this.currentParticipantsTabId?"virtualised":""),part:"container"},i("rtk-sidebar-ui",{tabs:this.tabs,currentTab:this.currentParticipantsTabId,view:"full-screen",hideHeader:!0,hideCloseAction:!0,style:{position:"relative"},onTabChange:t=>{this.viewSection(t.detail),t.stopPropagation()}},(!this.currentParticipantsTabId||"stage-list"===this.currentParticipantsTabId)&&i("div",{slot:"stage-list",style:{marginTop:"10px",height:"100%"}},i("rtk-participants-stage-list",Object.assign({},t,{search:this.search,hideHeader:!0}))),"requests"===this.currentParticipantsTabId&&i("div",{slot:"requests",style:{marginTop:"10px",height:"100%"}},!this.hasRequests&&i("div",{class:"no-pending-requests"},this.t("participants.no_pending_requests")),i("rtk-participants-stage-queue",Object.assign({},t)),i("rtk-participants-waiting-list",Object.assign({},t))),"viewer-list"===this.currentParticipantsTabId&&i("div",{slot:"viewer-list",style:{marginTop:"10px",height:"100%"}},i("rtk-participants-viewer-list",Object.assign({},t,{search:this.search,hideHeader:!0}))))),i("slot",{name:"end"}))}static get watchers(){return{meeting:["meetingChanged"],currentParticipantsTabId:["currentParticipantsTabIdChanged"]}}};c([n()],h.prototype,"meeting",void 0),c([n()],h.prototype,"states",void 0),c([n()],h.prototype,"config",void 0),c([n()],h.prototype,"iconPack",void 0),c([n()],h.prototype,"t",void 0),h.style=":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))}";export{h as rtk_participants}

package/dist/realtimekit-ui/p-085b70ca.entry.js

@@ -0,0 +1 @@
+import{r as e,h as t,H as r}from"./p-0ee570cd.js";import{c as a,e as i,i as c}from"./p-ae9de69a.js";import{S as o}from"./p-1ff96b0f.js";var n=function(e,t,r,a){var i,c=arguments.length,o=c<3?t:null===a?a=Object.getOwnPropertyDescriptor(t,r):a;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(e,t,r,a);else for(var n=e.length-1;n>=0;n--)(i=e[n])&&(o=(c<3?i(o):c>3?i(t,r,o):i(t,r))||o);return c>3&&o&&Object.defineProperty(t,r,o),o};const s=class{constructor(t){e(this,t),this.config=a(),this.iconPack=i,this.t=c()}render(){return t(r,{key:"2c7dbc07182f0e69d8db6ecc150437159a5f6dee"},t("slot",{key:"e88c792048e732744ff7cd7d4184b57b5972128e"},t("div",{key:"9dd2b7be22bf1666a68d7d7c05e4b7599be7f2df",class:"ctr",part:"container"},t("rtk-logo",{key:"10965784b3e5a398363b08ca9201dc99922a6ca8",meeting:this.meeting,config:this.config,t:this.t,part:"logo"}),t("rtk-spinner",{key:"13980cf39fe4d3528b46fec3616e62f4f5d53111","aria-label":"Idle, waiting for meeting data",part:"spinner",iconPack:this.iconPack}))))}};n([o()],s.prototype,"meeting",void 0),n([o()],s.prototype,"config",void 0),n([o()],s.prototype,"iconPack",void 0),n([o()],s.prototype,"t",void 0),s.style=":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{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.ctr{display:flex;flex-direction:column;align-items:center;gap:var(--rtk-space-8, 32px)}rtk-logo.loaded{height:var(--rtk-space-12, 48px)}rtk-spinner{height:var(--rtk-space-12, 48px);width:var(--rtk-space-12, 48px);--tw-text-opacity:1;color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-text-opacity))}";export{s as rtk_idle_screen}