@cloudflare/realtimekit-ui 1.1.0-staging.9 → 1.1.1-staging.1

package/dist/esm/{ui-store-12132d9c.js → ui-store-644e4cb0.js}

@@ -1,14 +1,12 @@
-import { g as getRenderingRef, f as forceUpdate } from './index-c1fb98bb.js';
+import { S as StencilCore } from './index-55463a54.js';
 
 const FlagsmithFeatureFlags = {
     PLAY_PARTICIPANT_TILE_VIDEO_ON_PAUSE: 'play_participant_tile_video_on_pause',
     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',
-    PINNED_MESSAGES: 'pinned_msgs',
 };
 const isBreakoutRoomsEnabled = (meeting) => meeting.connectedMeetings.supportsConnectedMeetings;
 const disableSettingSinkId = (meeting) => {
@@ -3093,12 +3091,13 @@ function getLivestreamViewerAllowedQualityLevels({ meeting, hlsLevels, }) {
 }
 
 const appendToMap = (map, propName, value) => {
-    const items = map.get(propName);
-    if (!items) {
-        map.set(propName, [value]);
+    let refs = map.get(propName);
+    if (!refs) {
+        refs = [];
+        map.set(propName, refs);
     }
-    else if (!items.includes(value)) {
-        items.push(value);
+    if (!refs.some((ref) => ref.deref() === value)) {
+        refs.push(new WeakRef(value));
     }
 };
 const debounce = (fn, ms) => {
@@ -3126,33 +3125,54 @@ const debounce = (fn, ms) => {
 const isConnected = (maybeElement) => !('isConnected' in maybeElement) || maybeElement.isConnected;
 const cleanupElements = debounce((map) => {
     for (let key of map.keys()) {
-        map.set(key, map.get(key).filter(isConnected));
+        const refs = map.get(key).filter((ref) => {
+            const elm = ref.deref();
+            return elm && isConnected(elm);
+        });
+        map.set(key, refs);
     }
 }, 2_000);
+const core = StencilCore;
+const forceUpdate = core.forceUpdate;
+const getRenderingRef = core.getRenderingRef;
 const stencilSubscription = () => {
-    if (typeof getRenderingRef !== 'function') {
+    if (typeof getRenderingRef !== 'function' || typeof forceUpdate !== 'function') {
         // If we are not in a stencil project, we do nothing.
         // This function is not really exported by @stencil/core.
         return {};
     }
+    const ensureForceUpdate = forceUpdate;
+    const ensureGetRenderingRef = getRenderingRef;
     const elmsToUpdate = new Map();
     return {
         dispose: () => elmsToUpdate.clear(),
         get: (propName) => {
-            const elm = getRenderingRef();
+            const elm = ensureGetRenderingRef();
             if (elm) {
                 appendToMap(elmsToUpdate, propName, elm);
             }
         },
         set: (propName) => {
-            const elements = elmsToUpdate.get(propName);
-            if (elements) {
-                elmsToUpdate.set(propName, elements.filter(forceUpdate));
+            const refs = elmsToUpdate.get(propName);
+            if (refs) {
+                const nextRefs = refs.filter((ref) => {
+                    const elm = ref.deref();
+                    if (!elm)
+                        return false;
+                    return ensureForceUpdate(elm);
+                });
+                elmsToUpdate.set(propName, nextRefs);
             }
             cleanupElements(elmsToUpdate);
         },
         reset: () => {
-            elmsToUpdate.forEach((elms) => elms.forEach(forceUpdate));
+            elmsToUpdate.forEach((refs) => {
+                refs.forEach((ref) => {
+                    const elm = ref.deref();
+                    if (elm)
+                        ensureForceUpdate(elm);
+                });
+            });
             cleanupElements(elmsToUpdate);
         },
     };
@@ -3160,18 +3180,26 @@ const stencilSubscription = () => {
 
 const unwrap = (val) => (typeof val === 'function' ? val() : val);
 const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) => {
-    const unwrappedState = unwrap(defaultState);
-    let states = new Map(Object.entries(unwrappedState ?? {}));
+    const resolveDefaultState = () => (unwrap(defaultState) ?? {});
+    const initialState = resolveDefaultState();
+    let states = new Map(Object.entries(initialState));
+    const proxyAvailable = typeof Proxy !== 'undefined';
+    const plainState = proxyAvailable ? null : {};
     const handlers = {
         dispose: [],
         get: [],
         set: [],
         reset: [],
     };
+    // Track onChange listeners to enable removeListener functionality
+    const changeListeners = new Map();
     const reset = () => {
         // When resetting the state, the default state may be a function - unwrap it to invoke it.
         // otherwise, the state won't be properly reset
-        states = new Map(Object.entries(unwrap(defaultState) ?? {}));
+        states = new Map(Object.entries(resolveDefaultState()));
+        if (!proxyAvailable) {
+            syncPlainStateKeys();
+        }
         handlers.reset.forEach((cb) => cb());
     };
     const dispose = () => {
@@ -3188,12 +3216,14 @@ const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) =>
         const oldValue = states.get(propName);
         if (shouldUpdate(value, oldValue, propName)) {
             states.set(propName, value);
+            if (!proxyAvailable) {
+                ensurePlainProperty(propName);
+            }
             handlers.set.forEach((cb) => cb(propName, value, oldValue));
         }
     };
-    const state = (typeof Proxy === 'undefined'
-        ? {}
-        : new Proxy(unwrappedState, {
+    const state = (proxyAvailable
+        ? new Proxy(initialState, {
             get(_, propName) {
                 return get(propName);
             },
@@ -3213,7 +3243,11 @@ const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) =>
                 set(propName, value);
                 return true;
             },
-        }));
+        })
+        : (() => {
+            syncPlainStateKeys();
+            return plainState;
+        })());
     const on = (eventName, callback) => {
         handlers[eventName].push(callback);
         return () => {
@@ -3221,17 +3255,24 @@ const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) =>
         };
     };
     const onChange = (propName, cb) => {
-        const unSet = on('set', (key, newValue) => {
+        const setHandler = (key, newValue) => {
             if (key === propName) {
                 cb(newValue);
             }
-        });
-        // We need to unwrap the defaultState because it might be a function.
-        // Otherwise we might not be sending the right reset value.
-        const unReset = on('reset', () => cb(unwrap(defaultState)[propName]));
+        };
+        const resetHandler = () => {
+            const snapshot = resolveDefaultState();
+            cb(snapshot[propName]);
+        };
+        // Register the handlers
+        const unSet = on('set', setHandler);
+        const unReset = on('reset', resetHandler);
+        // Track the relationship between the user callback and internal handlers
+        changeListeners.set(cb, { setHandler, resetHandler, propName });
         return () => {
             unSet();
             unReset();
+            changeListeners.delete(cb);
         };
     };
     const use = (...subscriptions) => {
@@ -3256,6 +3297,47 @@ const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) =>
         const oldValue = states.get(key);
         handlers.set.forEach((cb) => cb(key, oldValue, oldValue));
     };
+    const removeListener = (propName, listener) => {
+        const listenerInfo = changeListeners.get(listener);
+        if (listenerInfo && listenerInfo.propName === propName) {
+            // Remove the specific handlers that were created for this listener
+            removeFromArray(handlers.set, listenerInfo.setHandler);
+            removeFromArray(handlers.reset, listenerInfo.resetHandler);
+            changeListeners.delete(listener);
+        }
+    };
+    function ensurePlainProperty(key) {
+        if (proxyAvailable || !plainState) {
+            return;
+        }
+        if (Object.prototype.hasOwnProperty.call(plainState, key)) {
+            return;
+        }
+        Object.defineProperty(plainState, key, {
+            configurable: true,
+            enumerable: true,
+            get() {
+                return get(key);
+            },
+            set(value) {
+                set(key, value);
+            },
+        });
+    }
+    function syncPlainStateKeys() {
+        if (proxyAvailable || !plainState) {
+            return;
+        }
+        const knownKeys = new Set(states.keys());
+        for (const key of Object.keys(plainState)) {
+            if (!knownKeys.has(key)) {
+                delete plainState[key];
+            }
+        }
+        for (const key of knownKeys) {
+            ensurePlainProperty(key);
+        }
+    }
     return {
         state,
         get,
@@ -3266,6 +3348,7 @@ const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) =>
         dispose,
         reset,
         forceUpdate,
+        removeListener,
     };
 };
 const removeFromArray = (array, item) => {
@@ -3592,8 +3675,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',
@@ -3604,7 +3685,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.",
@@ -3616,10 +3696,10 @@ 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',
+    'chat.everyone': 'Everyone',
     'chat.pinned_msgs': 'Pinned messages',
     'chat.toggle_pinned_msgs': 'Toggle pinned messages',
     'date.today': 'Today',
@@ -3790,8 +3870,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>',
@@ -3845,6 +3923,7 @@ const chatUnreadTimestamps = {};
  */
 const defaultOverrides = {
     disableEmojiPicker: false,
+    disablePrivateChat: false,
 };
 
 const getInitialStates = (peerId) => ({
@@ -3966,4 +4045,4 @@ function removeElement(propName, element, targetStore = uiStore) {
     }
 }
 
-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 };
+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, 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, FlagsmithFeatureFlags 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-25c4d10f.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-25c4d10f.js";export{p as provideRtkDesignSystem}from"./p-cd0c5440.js";import{g as s}from"./p-d3e520e5.js";export{e as extendConfig,g as generateConfig}from"./p-d3e520e5.js";export{R as RtkNotificationsAudio}from"./p-afa7211c.js";export{g as generateChatGroupKey,a as getChatGroups,c as getParticipantUserId,b as getUnreadChatCounts}from"./p-a5900df2.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 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 n=r[o];return void 0===n&&(r[o]={},n=r[o]),new m(n,this.config,o)}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}
+import{c as t}from"./p-8fc79c56.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-8fc79c56.js";export{p as provideRtkDesignSystem}from"./p-f6fdb3c3.js";import{g as s}from"./p-ddcb6b8b.js";export{e as extendConfig,g as generateConfig}from"./p-ddcb6b8b.js";export{R as RtkNotificationsAudio}from"./p-2ff77d78.js";export{g as generateChatGroupKey,a as getChatGroups,c as getParticipantUserId,b as getUnreadChatCounts}from"./p-b5e5e206.js";import"./p-a599f720.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 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 n=r[o];return void 0===n&&(r[o]={},n=r[o]),new m(n,this.config,o)}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-01ef7b4d.entry.js

@@ -0,0 +1 @@
+import{r as t,d as r,h as i,a}from"./p-a599f720.js";import{c as s,e,i as o}from"./p-8fc79c56.js";import{S as n}from"./p-315cd380.js";import{d as p}from"./p-d6126ff7.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-0511529f.entry.js

@@ -0,0 +1 @@
+import{r as n,d as t,e,h as a,a as i,g as r}from"./p-a599f720.js";import{e as o,i as s}from"./p-8fc79c56.js";import{i as c,r as d,e as l,a as p}from"./p-02f19345.js";import{S as h}from"./p-315cd380.js";var f=function(n,t,e,a){var i,r=arguments.length,o=r<3?t:null===a?a=Object.getOwnPropertyDescriptor(t,e):a;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(n,t,e,a);else for(var s=n.length-1;s>=0;s--)(i=n[s])&&(o=(r<3?i(o):r>3?i(t,e,o):i(t,e))||o);return r>3&&o&&Object.defineProperty(t,e,o),o};const g=class{constructor(e){n(this,e),this.stateUpdate=t(this,"rtkStateUpdate",7),this.play=t(this,"screensharePlay",7),this.fullScreenListener=()=>{this.isFullScreen=c()},this.participantScreenshareUpdate=n=>{n.id===this.participant.id&&this.screenShareListener(n)},this.hideFullScreenButton=!1,this.nameTagPosition="bottom-left",this.variant="solid",this.iconPack=o,this.t=s(),this.videoExpanded=!1,this.screenShareEnabled=!1,this.isFullScreen=!1,this.toggleFullScreen=()=>{this.isFullScreen?(l(),this.isFullScreen=!1):(d(this.host),this.isFullScreen=!0)}}connectedCallback(){null===window||void 0===window||window.addEventListener("fullscreenchange",this.fullScreenListener),null===window||void 0===window||window.addEventListener("webkitfullscreenchange",this.fullScreenListener)}componentDidLoad(){this.participantChanged(this.participant)}disconnectedCallback(){if(!this.meeting)return;const{self:n}=this.meeting;this.participant.id===n.id&&this.screenShareListener?this.participant.removeListener("screenShareUpdate",this.screenShareListener):this.meeting.participants.joined.removeListener("screenShareUpdate",this.participantScreenshareUpdate),null===window||void 0===window||window.removeEventListener("fullscreenchange",this.fullScreenListener),null===window||void 0===window||window.removeEventListener("webkitfullscreenchange",this.fullScreenListener)}participantChanged(n){if(null!=n&&this.meeting){const{self:t}=this.meeting;this.screenShareListener=({screenShareEnabled:n,screenShareTracks:t})=>{const a=n&&null!=t.video;if(e((()=>{this.screenShareEnabled=a})),a){const n=new MediaStream;n.addTrack(t.video),null!=this.videoEl&&(this.videoEl.srcObject=n,this.videoEl.play())}else null!=this.videoEl&&(this.videoEl.srcObject=void 0)},this.screenShareListener(n),n.id===t.id?n.addListener("screenShareUpdate",this.screenShareListener):this.meeting.participants.joined.addListener("screenShareUpdate",this.participantScreenshareUpdate)}}render(){var n,t;const e=(null===(n=this.participant)||void 0===n?void 0:n.id)===(null===(t=this.meeting)||void 0===t?void 0:t.self.id),r=this.t(this.isFullScreen?"full_screen.exit":"full_screen"),o=this.isFullScreen?this.iconPack.full_screen_minimize:this.iconPack.full_screen_maximize;return a(i,{key:"9ee4407d83a5b437f91813eedec6fd0836620a8c",class:{isSelf:e}},a("div",{key:"video-container",id:"video-container",class:{expand:this.videoExpanded}},a("video",{key:"bfbee68ee2700aba43d1aae85a8456c40dc55244",ref:n=>this.videoEl=n,class:{visible:this.screenShareEnabled,"fit-in-container":this.participant.supportsRemoteControl},playsInline:!0,onPlay:()=>{this.play.emit({screenshareParticipant:this.participant,participant:this.meeting.self})},autoPlay:!0,muted:!0,id:`screen-share-video-${this.participant.id}`})),a("div",{id:"controls",key:"controls"},!this.hideFullScreenButton&&!e&&p()&&a("rtk-tooltip",{key:"25d8a59dae9afe875761f4ecaaae6d8f0c12792c",label:r},a("rtk-button",{key:"9b294b9b0a987c8e54f6bca1ab3edc3e1a5238f9",id:"full-screen-btn",kind:"icon",onClick:this.toggleFullScreen,title:r},a("rtk-icon",{key:"d768caec415a0b75f42d39cfb15f3821264046da",icon:o,"aria-hidden":!0,tabIndex:-1})))),e&&a("div",{id:"self-message",key:"self-message"},a("h3",{key:"7f4802409d87bb07dedac257e75f3e1d23ca4757"},this.t("screenshare.shared")),a("div",{key:"acd80c0b62e14b88c1a0c717814dcdc49c1c5a40",class:"actions"},null!=this.meeting&&a("rtk-button",{key:"721fc83372b3a9752b06fbffa61072f88aa9e1b0",variant:"danger",onClick:()=>{this.meeting.self.disableScreenShare()}},a("rtk-icon",{key:"7aa2e4a597a1411e000209c6db95babf9c7f0366",icon:this.iconPack.share_screen_stop,slot:"start"}),this.t("screenshare.stop")),a("rtk-button",{key:"4243b29230fc663db287f7db50dd4b5a8345a9bd",variant:"secondary",id:"expand-btn",onClick:()=>{this.videoExpanded=!this.videoExpanded}},a("rtk-icon",{key:"09c4a34f83662e5d1749e1dfd449d25da92c9976",icon:this.videoExpanded?this.iconPack.full_screen_minimize:this.iconPack.full_screen_maximize,slot:"start"}),this.t(this.videoExpanded?"screenshare.min_preview":"screenshare.max_preview")))),a("slot",{key:"a2046aecd50bc6fc0b8fb94a781bdd25c1d491ea"}))}get host(){return r(this)}static get watchers(){return{participant:["participantChanged"]}}};f([h()],g.prototype,"meeting",void 0),f([h()],g.prototype,"iconPack",void 0),f([h()],g.prototype,"t",void 0),g.style=":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";export{g as rtk_screenshare_view}

package/dist/realtimekit-ui/p-06dcd55e.entry.js

@@ -0,0 +1 @@
+import{r as t,d as i,h as s,a as o}from"./p-a599f720.js";import{e,i as a,M as r}from"./p-8fc79c56.js";import{S as n}from"./p-315cd380.js";var l=function(t,i,s,o){var e,a=arguments.length,r=a<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,s):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,i,s,o);else for(var n=t.length-1;n>=0;n--)(e=t[n])&&(r=(a<3?e(r):a>3?e(i,s,r):e(i,s))||r);return a>3&&r&&Object.defineProperty(i,s,r),r};const c=class{constructor(s){t(this,s),this.stateUpdate=i(this,"rtkStateUpdate",7),this.variant="button",this.iconPack=e,this.t=a(),this.canToggle=!1,this.permissionsUpdateListener=()=>{this.canToggle=r(this.meeting)},this.breakoutRoomToggle=()=>{var t,i;this.stateUpdate.emit({activeBreakoutRoomsManager:{active:!(null===(i=null===(t=this.states)||void 0===t?void 0:t.activeBreakoutRoomsManager)||void 0===i?void 0:i.active),mode:this.meeting.connectedMeetings.isActive?"view":"create"}})}}connectedCallback(){this.meetingChanged(this.meeting)}disconnectedCallback(){var t,i,s;null===(s=null===(i=null===(t=this.meeting)||void 0===t?void 0:t.self)||void 0===i?void 0:i.permissions)||void 0===s||s.off("permissionsUpdate",this.permissionsUpdateListener)}meetingChanged(t){t&&(this.canToggle=r(t),t.self.permissions.on("permissionsUpdate",this.permissionsUpdateListener))}render(){return this.meeting?this.canToggle?s(o,{title:this.t("breakout_rooms")},s("rtk-controlbar-button",{part:"controlbar-button",size:this.size,iconPack:this.iconPack,onClick:this.breakoutRoomToggle,icon:this.iconPack.breakout_rooms,label:this.t("breakout_rooms"),variant:this.variant})):void 0:null}static get watchers(){return{meeting:["meetingChanged"]}}};l([n()],c.prototype,"meeting",void 0),l([n()],c.prototype,"states",void 0),l([n()],c.prototype,"iconPack",void 0),l([n()],c.prototype,"t",void 0),c.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{display:block}";export{c as rtk_breakout_rooms_toggle}

package/dist/realtimekit-ui/{p-a1408db4.entry.js → p-07860158.entry.js}

@@ -1 +1 @@
-import{r as t,w as s,h as i}from"./p-0ee570cd.js";import{e as r}from"./p-25c4d10f.js";import{S as e}from"./p-9b550ec4.js";import{d as h}from"./p-45f90b95.js";const a=class{constructor(i){t(this,i),this.visibleItemsCount=20,this.estimateItemSize=100,this.iconPack=r,this.isFetching=!1,this.autoScroll=!0,this.totalHeight=0,this.sizes=new Map,this.lastScrollTop=0,this.scrollToBottomRetries=0,this.elementObserver=(()=>{let t=null;const s=()=>t||("undefined"!=typeof ResizeObserver?t=new ResizeObserver((t=>{t.forEach((t=>{this.measureElement(t.target,t)}))})):null);return{disconnect:()=>{var t;return null===(t=s())||void 0===t?void 0:t.disconnect()},observe:t=>{var i;return null===(i=s())||void 0===i?void 0:i.observe(t,{box:"border-box"})},unobserve:t=>{var i;return null===(i=s())||void 0===i?void 0:i.unobserve(t)}}})(),this.measureElement=(t,s)=>{if(!t)return;const i=t.dataset.id;if(this.sizes.has(i))return void this.elementObserver.unobserve(t);if(s){const r=s.borderBoxSize[0];if(r&&r.blockSize>0)return this.saveItemSize(i,r.blockSize),void this.elementObserver.unobserve(t)}const r=t.getBoundingClientRect();r.height>0&&this.saveItemSize(i,r.height)},this.getVisibleItems=()=>this.messages.slice(this.range.start,this.range.end+1),this.updateVisibleItems=(t,s)=>{const i=this.messages.length;let r=t,e=s;i<=this.visibleItemsCount?(r=0,e=i-1):s-t<this.visibleItemsCount-1&&(r=this.range.end-this.visibleItemsCount+1),this.range.start!==r&&(this.range={start:r,end:e},this.totalHeight=this.getRangeSize(0,i))},this.getEstimatedItemSize=()=>this.estimateItemSize,this.getRangeSize=(t,s)=>{let i=0,r=0;for(let e=t;e<s;e++)r=this.sizes.get(this.messages[e].id),i+=r||this.getEstimatedItemSize();return i},this.getScrollTop=()=>this.$listRef?Math.ceil(this.$listRef.scrollTop):0,this.getClientHeight=()=>this.$listRef?Math.ceil(this.$listRef.clientHeight):0,this.getScrollHeight=()=>this.$listRef?Math.ceil(this.$listRef.scrollHeight):0,this.getItemsScrolled=()=>{const t=this.lastScrollTop;if(t<=0)return 0;let s=0,i=0,r=0,e=this.messages.length;for(;s<=e;){if(i=s+e>>>1,r=this.getRangeSize(0,i),r===t)return i;r<t?s=i+1:r>t&&(e=i-1)}return s>0?--s:0},this.getEndByStart=t=>Math.min(t+this.visibleItemsCount,this.messages.length-1),this.scrollToOffset=t=>{this.$listRef&&(this.$listRef.scrollTop=t)},this.scrollToIndex=t=>{if(t>=this.messages.length-1)this.scrollToBottom();else{const s=t<1?0:this.getRangeSize(0,t);this.scrollToOffset(s)}},this.scrollToBottom=()=>{this.$listEndRef&&s((()=>{this.$listEndRef.scrollIntoView(),this.getScrollHeight()-(this.getScrollTop()+this.getClientHeight())>0&&this.scrollToBottomRetries<10?setTimeout((()=>{this.scrollToBottom()}),1e3/60):(this.scrollToBottomRetries=0,this.autoScroll=!0)}))},this.handleScroll=async()=>{if(this.isFetching)return;const t=this.getScrollTop(),s=t<this.lastScrollTop||0===t?"UP":"DOWN";if(this.lastScrollTop=t,this.loadMore&&0===t&&"UP"===s&&!1===this.isFetching){this.isFetching=!0;const t=await this.loadMore(this.messages[0]);t&&t.length&&(this.messages=[...t,...this.messages]),this.isFetching=!1}"UP"===s?this.handleTop():"DOWN"===s&&this.handleBottom()},this.handleTop=()=>{const t=this.getItemsScrolled();if(t<=this.range.end-5&&(this.autoScroll=!1),t>this.range.start+5)return;const s=Math.max(this.range.start-5,0);this.updateVisibleItems(s,this.getEndByStart(s))},this.handleBottom=()=>{if(this.getItemsScrolled()<this.range.start+5)return;const t=this.range.start+5,s=this.getEndByStart(t);this.updateVisibleItems(s===this.messages.length-1?s-this.visibleItemsCount:t,s)},this.updateTotalHeight=h((()=>{this.totalHeight=this.getRangeSize(0,this.messages.length)}),1e3/30,{leading:!0}),this.rendererInternal=(t,s,i)=>{if(!t)return;if(t.dataset.id===s.id)return;const r=this.renderer(s,i);t.hasChildNodes&&(t.innerHTML=""),this.elementObserver.observe(t),t.dataset.id=s.id,t.appendChild(r)}}connectedCallback(){const t=this.messages.length-1;this.range={start:t-this.visibleItemsCount,end:t},this.updateVisibleItems(this.range.start,this.range.end),this.totalHeight=this.getRangeSize(0,t)}componentDidLoad(){this.autoScroll&&this.scrollToBottom()}messagesUpdated(t,s){if(t.length>s.length){const i=t.length-s.length;this.updateVisibleItems(i,this.getEndByStart(i)),this.scrollToIndex(this.range.start)}}saveItemSize(t,s){this.sizes.set(t,Math.round(s)),this.updateTotalHeight()}render(){return i("div",{key:"17ccb3852a89ddb77e5799413f8ee0ef0ac7c132",class:"scrollbar content-wrapper",ref:t=>this.$listRef=t,onScroll:this.handleScroll},i("div",{key:"044af22a10ae312a46d90f29dc9a793d86540fb8",class:"scroller"},i("div",{key:"15a2b213883f210a44081c05c317f9da7a58380c",style:{height:`${this.totalHeight}px`}}),i("div",{key:"918071c6d3aed045814c1c2b3908572edae480ac",class:"smallest-dom-element",id:"list-end",ref:t=>this.$listEndRef=t})),i("div",{key:"19b2f45794fa73f44d54b9b91ef1cab0df6c4aae",class:"content",style:{transform:`translateY(${this.getRangeSize(0,this.range.start)}px)`}},this.isFetching&&i("div",{key:"1a05d8ec0a4a11812afef413226c472d797e7ebe",class:"loader"},i("rtk-spinner",{key:"29f275642f8f8be5d9cbe12ff0eeedba48e1b4c1",size:"md"})),this.getVisibleItems().map(((t,s)=>i("div",{key:t.id,ref:i=>this.rendererInternal(i,t,s)})))))}static get watchers(){return{messages:["messagesUpdated"]}}};(function(t,s,i,r){var e,h=arguments.length,a=h<3?s:null===r?r=Object.getOwnPropertyDescriptor(s,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,s,i,r);else for(var o=t.length-1;o>=0;o--)(e=t[o])&&(a=(h<3?e(a):h>3?e(s,i,a):e(s,i))||a);h>3&&a&&Object.defineProperty(s,i,a)})([e()],a.prototype,"iconPack",void 0),a.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)))}.loading{cursor:wait}.content-wrapper{height:100%;overflow-y:auto;position:relative;contain:strict}.scroller{width:1px;opacity:0}.content{position:absolute;top:0;width:100%}.smallest-dom-element{width:100%;height:2px;background:red}.loader{margin-top:var(--rtk-space-2, 8px);margin-bottom:var(--rtk-space-2, 8px);display:flex;justify-content:center}";export{a as rtk_message_list_view}
+import{r as t,e as s,h as i}from"./p-a599f720.js";import{e as r}from"./p-8fc79c56.js";import{S as e}from"./p-315cd380.js";import{d as h}from"./p-d6126ff7.js";const a=class{constructor(i){t(this,i),this.visibleItemsCount=20,this.estimateItemSize=100,this.iconPack=r,this.isFetching=!1,this.autoScroll=!0,this.totalHeight=0,this.sizes=new Map,this.lastScrollTop=0,this.scrollToBottomRetries=0,this.elementObserver=(()=>{let t=null;const s=()=>t||("undefined"!=typeof ResizeObserver?t=new ResizeObserver((t=>{t.forEach((t=>{this.measureElement(t.target,t)}))})):null);return{disconnect:()=>{var t;return null===(t=s())||void 0===t?void 0:t.disconnect()},observe:t=>{var i;return null===(i=s())||void 0===i?void 0:i.observe(t,{box:"border-box"})},unobserve:t=>{var i;return null===(i=s())||void 0===i?void 0:i.unobserve(t)}}})(),this.measureElement=(t,s)=>{if(!t)return;const i=t.dataset.id;if(this.sizes.has(i))return void this.elementObserver.unobserve(t);if(s){const r=s.borderBoxSize[0];if(r&&r.blockSize>0)return this.saveItemSize(i,r.blockSize),void this.elementObserver.unobserve(t)}const r=t.getBoundingClientRect();r.height>0&&this.saveItemSize(i,r.height)},this.getVisibleItems=()=>this.messages.slice(this.range.start,this.range.end+1),this.updateVisibleItems=(t,s)=>{const i=this.messages.length;let r=t,e=s;i<=this.visibleItemsCount?(r=0,e=i-1):s-t<this.visibleItemsCount-1&&(r=this.range.end-this.visibleItemsCount+1),this.range.start!==r&&(this.range={start:r,end:e},this.totalHeight=this.getRangeSize(0,i))},this.getEstimatedItemSize=()=>this.estimateItemSize,this.getRangeSize=(t,s)=>{let i=0,r=0;for(let e=t;e<s;e++)r=this.sizes.get(this.messages[e].id),i+=r||this.getEstimatedItemSize();return i},this.getScrollTop=()=>this.$listRef?Math.ceil(this.$listRef.scrollTop):0,this.getClientHeight=()=>this.$listRef?Math.ceil(this.$listRef.clientHeight):0,this.getScrollHeight=()=>this.$listRef?Math.ceil(this.$listRef.scrollHeight):0,this.getItemsScrolled=()=>{const t=this.lastScrollTop;if(t<=0)return 0;let s=0,i=0,r=0,e=this.messages.length;for(;s<=e;){if(i=s+e>>>1,r=this.getRangeSize(0,i),r===t)return i;r<t?s=i+1:r>t&&(e=i-1)}return s>0?--s:0},this.getEndByStart=t=>Math.min(t+this.visibleItemsCount,this.messages.length-1),this.scrollToOffset=t=>{this.$listRef&&(this.$listRef.scrollTop=t)},this.scrollToIndex=t=>{if(t>=this.messages.length-1)this.scrollToBottom();else{const s=t<1?0:this.getRangeSize(0,t);this.scrollToOffset(s)}},this.scrollToBottom=()=>{this.$listEndRef&&s((()=>{this.$listEndRef.scrollIntoView(),this.getScrollHeight()-(this.getScrollTop()+this.getClientHeight())>0&&this.scrollToBottomRetries<10?setTimeout((()=>{this.scrollToBottom()}),1e3/60):(this.scrollToBottomRetries=0,this.autoScroll=!0)}))},this.handleScroll=async()=>{if(this.isFetching)return;const t=this.getScrollTop(),s=t<this.lastScrollTop||0===t?"UP":"DOWN";if(this.lastScrollTop=t,this.loadMore&&0===t&&"UP"===s&&!1===this.isFetching){this.isFetching=!0;const t=await this.loadMore(this.messages[0]);t&&t.length&&(this.messages=[...t,...this.messages]),this.isFetching=!1}"UP"===s?this.handleTop():"DOWN"===s&&this.handleBottom()},this.handleTop=()=>{const t=this.getItemsScrolled();if(t<=this.range.end-5&&(this.autoScroll=!1),t>this.range.start+5)return;const s=Math.max(this.range.start-5,0);this.updateVisibleItems(s,this.getEndByStart(s))},this.handleBottom=()=>{if(this.getItemsScrolled()<this.range.start+5)return;const t=this.range.start+5,s=this.getEndByStart(t);this.updateVisibleItems(s===this.messages.length-1?s-this.visibleItemsCount:t,s)},this.updateTotalHeight=h((()=>{this.totalHeight=this.getRangeSize(0,this.messages.length)}),1e3/30,{leading:!0}),this.rendererInternal=(t,s,i)=>{if(!t)return;if(t.dataset.id===s.id)return;const r=this.renderer(s,i);t.hasChildNodes&&(t.innerHTML=""),this.elementObserver.observe(t),t.dataset.id=s.id,t.appendChild(r)}}connectedCallback(){const t=this.messages.length-1;this.range={start:t-this.visibleItemsCount,end:t},this.updateVisibleItems(this.range.start,this.range.end),this.totalHeight=this.getRangeSize(0,t)}componentDidLoad(){this.autoScroll&&this.scrollToBottom()}messagesUpdated(t,s){if(t.length>s.length){const i=t.length-s.length;this.updateVisibleItems(i,this.getEndByStart(i)),this.scrollToIndex(this.range.start)}}saveItemSize(t,s){this.sizes.set(t,Math.round(s)),this.updateTotalHeight()}render(){return i("div",{key:"9c8a4073886acf540a8beeea0ac31f865231f771",class:"scrollbar content-wrapper",ref:t=>this.$listRef=t,onScroll:this.handleScroll},i("div",{key:"c64abddfc09ec7c88305b732df889f9de0597b53",class:"scroller"},i("div",{key:"c3e94f33890509b22f2b89022a76865f6776b217",style:{height:`${this.totalHeight}px`}}),i("div",{key:"f8c95faa0af4b1f31465a113707f0e4f753dadad",class:"smallest-dom-element",id:"list-end",ref:t=>this.$listEndRef=t})),i("div",{key:"02d045f8c54072388c3c7df52ff4c92f2438a545",class:"content",style:{transform:`translateY(${this.getRangeSize(0,this.range.start)}px)`}},this.isFetching&&i("div",{key:"7ba90240987e1ecfb553d69bd7465cb20bb86274",class:"loader"},i("rtk-spinner",{key:"2fa19c46da125e4c5280625aefdf555f09ce2faa",size:"md"})),this.getVisibleItems().map(((t,s)=>i("div",{key:t.id,ref:i=>this.rendererInternal(i,t,s)})))))}static get watchers(){return{messages:["messagesUpdated"]}}};(function(t,s,i,r){var e,h=arguments.length,a=h<3?s:null===r?r=Object.getOwnPropertyDescriptor(s,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,s,i,r);else for(var o=t.length-1;o>=0;o--)(e=t[o])&&(a=(h<3?e(a):h>3?e(s,i,a):e(s,i))||a);h>3&&a&&Object.defineProperty(s,i,a)})([e()],a.prototype,"iconPack",void 0),a.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)))}.loading{cursor:wait}.content-wrapper{height:100%;overflow-y:auto;position:relative;contain:strict}.scroller{width:1px;opacity:0}.content{position:absolute;top:0;width:100%}.smallest-dom-element{width:100%;height:2px;background:red}.loader{margin-top:var(--rtk-space-2, 8px);margin-bottom:var(--rtk-space-2, 8px);display:flex;justify-content:center}";export{a as rtk_message_list_view}