import { p as proxyCustomElement, H, h, c as Host } from './p-ae373651.js';
import { e as defaultIconPack, i as useLanguage } from './p-5b3a7f00.js';
import './p-a83ccdbd.js';
import { S as SyncWithStore } from './p-070aa695.js';
import { g as getBitrateVerdict, a as getPacketLossVerdict, b as getJitterVerdict, c as getNetworkBasedMediaHealth } from './p-0e02697c.js';

const rtkDebuggerAudioCss = ":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;flex-direction:column;overflow:hidden;height:100%;width:100%;color:rgb(var(--rtk-colors-text-1000, 255 255 255));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity))}.tab-body::-webkit-scrollbar{width:var(--rtk-space-1\\.5, 6px);border-radius:var(--rtk-border-radius-md, 8px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity))}.tab-body::-webkit-scrollbar-thumb{border-radius:var(--rtk-border-radius-md, 8px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity))}h3{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px);font-size:16px;font-weight:600}#header{margin-top:var(--rtk-space-2, 8px);margin-bottom:var(--rtk-space-5, 20px);display:flex;align-items:center;justify-content:space-evenly}.tab-body{margin:var(--rtk-space-4, 16px);display:flex;height:100%;flex-direction:column;justify-content:space-between;overflow-y:auto}.status-container{border:var(--rtk-border-width-sm, 1px) solid rgb(var(--rtk-colors-background-600, 60 60 60));border-radius:8px;padding:16px}.status-section{margin-bottom:12px}.section-header{display:flex;justify-content:space-between;align-items:center;font-weight:bold;padding:8px 0}.section-header.only-child{justify-content:center}.section-body.missing-stats{display:flex;text-align:center;justify-content:center}.section-header .status{color:rgba(var(--rtk-colors-success));font-weight:bold}.section-header .arrow{font-size:14px}.network-table{border:var(--rtk-border-width-sm, 1px) solid rgb(var(--rtk-colors-background-600, 60 60 60));border-radius:8px;margin-top:8px;overflow:hidden}.network-row{display:flex;justify-content:space-between;padding:12px;border-bottom:var(--rtk-border-width-sm, 1px) solid rgb(var(--rtk-colors-background-600, 60 60 60))}.network-row:last-child{border-bottom:none}.network-cell{display:flex;flex-direction:column}.network-cell.label strong{font-size:14px}.network-cell.label .description{font-size:12px;color:rgb(var(--rtk-colors-text-700, 255 255 255 / 0.64));margin-top:4px}.network-cell.value{text-align:right}.status.good{color:rgba(var(--rtk-colors-success))}.status.average{color:rgba(var(--rtk-colors-warning))}.status.poor{color:rgba(var(--rtk-colors-danger))}.value{font-size:14px;color:rgb(var(--rtk-colors-text-700, 255 255 255 / 0.64));margin-top:4px}rtk-settings-audio{display:flex;flex-direction:column}";
const RtkDebuggerAudioStyle0 = rtkDebuggerAudioCss;

var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
        r = Reflect.decorate(decorators, target, key, desc);
    else
        for (var i = decorators.length - 1; i >= 0; i--)
            if (d = decorators[i])
                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
const RtkDebuggerAudio = /*@__PURE__*/ proxyCustomElement(class RtkDebuggerAudio extends H {
    constructor() {
        super();
        this.__registerHost();
        this.__attachShadow();
        /** Icon pack */
        this.iconPack = defaultIconPack;
        /** Language */
        this.t = useLanguage();
        /** Is Network section expanded */
        this.isNetworkOpen = true;
        /** Is Devices section expanded */
        this.isDevicesOpen = false;
        /** Stats as formatted array to display */
        this.audioProducerFormattedStats = [];
        /** Last raw audio score stats obj */
        this.audioProducerScoreStats = null;
        /** Summarised health of network stats */
        this.networkBasedMediaHealth = null;
        /** Summarised health of devices */
        this.devicesHealth = null;
        // private toggleSection(section: string) {
        //   if (section === 'network') this.isNetworkOpen = !this.isNetworkOpen;
        //   else if (section === 'devices') this.isDevicesOpen = !this.isDevicesOpen;
        // }
        this.mediaScoreUpdateListener = ({ kind, isScreenshare, scoreStats, }) => {
            if (kind === 'audio' && !isScreenshare) {
                this.audioProducerScoreStats = scoreStats;
            }
        };
        this.deviceListUpdateListener = async () => {
            const audioDevices = await this.meeting.self.getAudioDevices();
            this.devicesHealth = (audioDevices === null || audioDevices === void 0 ? void 0 : audioDevices.length) > 0 ? 'Good' : 'Poor';
        };
        this.audioUpdateListener = () => {
            if (!this.meeting.self.audioEnabled) {
                this.audioProducerScoreStats = null;
            }
        };
    }
    async audioProducerScoreStatsChanged(newAudioProducerScoreStats) {
        if (!newAudioProducerScoreStats) {
            this.audioProducerFormattedStats = [];
            return;
        }
        const statsObj = newAudioProducerScoreStats;
        const newStatsList = [];
        newStatsList.push({
            name: this.t('debugger.stats.bitrate.label'),
            value: `${Math.round(statsObj.bitrate / 1024)} kbps`,
            description: this.t('debugger.stats.bitrate.description'),
            verdict: getBitrateVerdict({
                bitrate: statsObj.bitrate,
                kind: 'audio',
                isScreenshare: false,
            }),
        });
        newStatsList.push({
            name: this.t('debugger.stats.packet_loss.label'),
            value: `${statsObj.packetsLostPercentage}%`,
            description: this.t('debugger.stats.packet_loss.description'),
            verdict: getPacketLossVerdict({ packetLossPercentage: statsObj.packetsLostPercentage }),
        });
        newStatsList.push({
            name: this.t('debugger.stats.jitter.label'),
            value: `${Math.round(statsObj.jitter * 1000)} ms`,
            description: this.t('debugger.stats.jitter.description'),
            verdict: getJitterVerdict({ jitterInMS: statsObj.jitter * 1000 }),
        });
        this.audioProducerFormattedStats = newStatsList;
        this.networkBasedMediaHealth = getNetworkBasedMediaHealth({
            kind: 'audio',
            isScreenshare: false,
            stats: newStatsList,
        });
    }
    connectedCallback() {
        this.meetingChanged(this.meeting);
    }
    disconnectedCallback() {
        if (!this.meeting) {
            return;
        }
        this.meeting.self.off('mediaScoreUpdate', this.mediaScoreUpdateListener);
        this.meeting.self.off('audioUpdate', this.audioUpdateListener);
        this.meeting.self.off('deviceListUpdate', this.deviceListUpdateListener);
    }
    async meetingChanged(meeting) {
        if (!meeting)
            return;
        meeting.self.on('mediaScoreUpdate', this.mediaScoreUpdateListener);
        meeting.self.on('audioUpdate', this.audioUpdateListener);
        meeting.self.on('deviceListUpdate', this.deviceListUpdateListener);
        await this.deviceListUpdateListener();
    }
    render() {
        var _a, _b;
        if (!this.meeting) {
            return;
        }
        // const defaults = {
        //   meeting: this.meeting,
        //   states: this.states || storeState,
        //   iconPack: this.iconPack,
        //   t: this.t,
        // };
        return (h(Host, null, h("div", { id: "header" }), h("div", { class: "tab-body" }, h("div", { class: "status-container" }, h("div", { class: "status-section" }, h("div", { class: `section-header ${!this.networkBasedMediaHealth ? 'only-child' : ''}` }, h("span", null, this.t('debugger.audio.sections.network_media')), this.networkBasedMediaHealth && (h("span", { class: `status ${(_a = this.networkBasedMediaHealth) === null || _a === void 0 ? void 0 : _a.toLowerCase()}` }, this.t(`debugger.quality.${(_b = this.networkBasedMediaHealth) === null || _b === void 0 ? void 0 : _b.toLowerCase()}`)))), this.isNetworkOpen && !this.audioProducerFormattedStats.length && (h("div", { class: "section-body missing-stats" }, this.meeting.self.audioEnabled ? (h("span", null, this.t('debugger.audio.messages.generating_report'))) : (h("span", null, this.t('debugger.audio.messages.enable_media'))))), this.isNetworkOpen && !!this.audioProducerFormattedStats.length && (h("div", { class: "section-body network-table" }, this.audioProducerFormattedStats.map((formattedStatsObj) => {
            var _a, _b;
            return (h("div", { class: "network-row" }, h("div", { class: "network-cell label" }, h("strong", null, formattedStatsObj.name), h("span", { class: "description" }, formattedStatsObj.description)), h("div", { class: "network-cell value" }, h("span", { class: `status ${(_a = formattedStatsObj.verdict) === null || _a === void 0 ? void 0 : _a.toLowerCase()}` }, this.t(`debugger.quality.${(_b = formattedStatsObj.verdict) === null || _b === void 0 ? void 0 : _b.toLowerCase()}`)), h("span", { class: "value" }, formattedStatsObj.value))));
        }))))))));
    }
    static get watchers() { return {
        "audioProducerScoreStats": ["audioProducerScoreStatsChanged"],
        "meeting": ["meetingChanged"]
    }; }
    static get style() { return RtkDebuggerAudioStyle0; }
}, [1, "rtk-debugger-audio", {
        "meeting": [16],
        "states": [16],
        "size": [513],
        "iconPack": [16],
        "t": [16],
        "isNetworkOpen": [32],
        "isDevicesOpen": [32],
        "audioProducerFormattedStats": [32],
        "audioProducerScoreStats": [32],
        "networkBasedMediaHealth": [32],
        "devicesHealth": [32]
    }, undefined, {
        "audioProducerScoreStats": ["audioProducerScoreStatsChanged"],
        "meeting": ["meetingChanged"]
    }]);
__decorate([
    SyncWithStore()
], RtkDebuggerAudio.prototype, "meeting", void 0);
__decorate([
    SyncWithStore()
], RtkDebuggerAudio.prototype, "states", void 0);
__decorate([
    SyncWithStore()
], RtkDebuggerAudio.prototype, "iconPack", void 0);
__decorate([
    SyncWithStore()
], RtkDebuggerAudio.prototype, "t", void 0);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["rtk-debugger-audio"];
    components.forEach(tagName => { switch (tagName) {
        case "rtk-debugger-audio":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, RtkDebuggerAudio);
            }
            break;
    } });
}
defineCustomElement();

export { RtkDebuggerAudio as R, defineCustomElement as d };
