import { p as proxyCustomElement, H, w as writeTask, h, c as Host } from './p-ae373651.js';
import { c as createDefaultConfig, i as useLanguage, F as clone } from './p-5b3a7f00.js';
import './p-a83ccdbd.js';
import { S as SyncWithStore } from './p-070aa695.js';
import { d as defineCustomElement$2 } from './p-ecb802ad.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;

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 RtkTranscripts$1 = /*@__PURE__*/ proxyCustomElement(class RtkTranscripts extends H {
    constructor() {
        super();
        this.__registerHost();
        this.__attachShadow();
        /** Config object */
        this.config = createDefaultConfig();
        /** Language */
        this.t = useLanguage();
        this.transcripts = [];
        this.listenerAttached = false;
        this.onTranscript = (transcript) => {
            if (transcript.transcript) {
                this.add(transcript);
            }
        };
    }
    connectedCallback() {
        this.meetingChanged(this.meeting);
    }
    addListener(meeting) {
        var _a;
        (_a = meeting === null || meeting === void 0 ? void 0 : meeting.ai) === null || _a === void 0 ? void 0 : _a.addListener('transcript', this.onTranscript);
        this.listenerAttached = true;
    }
    clearListeners(meeting) {
        var _a;
        this.onTranscript && ((_a = meeting === null || meeting === void 0 ? void 0 : meeting.ai) === null || _a === void 0 ? void 0 : _a.removeListener('transcript', this.onTranscript));
        this.listenerAttached = false;
        clearTimeout(this.disconnectTimeout);
        this.transcripts = [];
    }
    disconnectedCallback() {
        if (!this.meeting)
            return;
        this.clearListeners(this.meeting);
    }
    meetingChanged(meeting, oldMeeting) {
        clearTimeout(this.disconnectTimeout);
        if (oldMeeting)
            this.clearListeners(oldMeeting);
        if (!meeting)
            return;
        if (this.states.activeCaptions) {
            this.addListener(meeting);
        }
    }
    statesChanged(states) {
        if (!states)
            return;
        if (states.activeCaptions && !this.listenerAttached) {
            this.addListener(this.meeting);
        }
        if (!states.activeCaptions && this.listenerAttached) {
            this.clearListeners(this.meeting);
        }
    }
    transcriptionsReducer(acc, t) {
        if (!acc.length) {
            return [t];
        }
        let lastElement = acc[acc.length - 1];
        if (lastElement.peerId !== t.peerId) {
            return acc.concat(t);
        }
        if (lastElement.id === t.id) {
            lastElement.transcript = t.transcript;
            acc.pop();
            return acc.concat(clone(lastElement));
        }
        return acc.concat(t);
    }
    add(transcript) {
        // show transcripts only if tab is in focus and a maximum of 3 at a time
        // this.transcripts.splice(0, this.transcripts.length - 2);
        this.transcripts = this.transcriptionsReducer(this.transcripts, transcript);
    }
    remove(renderedId) {
        this.transcripts = this.transcripts.filter((transcript) => transcript.renderedId !== renderedId);
    }
    handleDismiss(e) {
        e.stopPropagation();
        const { id, renderedId } = e.detail;
        const el = this.host.shadowRoot.querySelector(`[data-id="${id}"]`);
        // exit animation
        el === null || el === void 0 ? void 0 : el.classList.add('exit');
        setTimeout(() => {
            writeTask(() => {
                this.remove(renderedId);
            });
        }, 400);
    }
    renderTranscripts() {
        const renderedTranscripts = [];
        this.transcripts.forEach((transcript) => {
            const t = {
                name: transcript.name,
                date: transcript.date,
                peerId: transcript.peerId,
                transcript: transcript.transcript,
                id: transcript.id,
                renderedId: transcript.id,
            };
            if (!renderedTranscripts.length) {
                transcript.renderedId = t.renderedId;
                renderedTranscripts.push(t);
                return;
            }
            const lastTranscript = renderedTranscripts[renderedTranscripts.length - 1];
            const maxTranscriptLength = 400;
            if (lastTranscript.transcript.length + t.transcript.length > maxTranscriptLength ||
                lastTranscript.peerId !== transcript.peerId) {
                transcript.renderedId = t.renderedId;
                renderedTranscripts.push(t);
                return;
            }
            lastTranscript.transcript += ' ' + transcript.transcript;
            transcript.renderedId = lastTranscript.renderedId;
        });
        renderedTranscripts.splice(0, renderedTranscripts.length - 2);
        return renderedTranscripts === null || renderedTranscripts === void 0 ? void 0 : renderedTranscripts.map((transcript) => (h("rtk-transcript", { key: transcript.id, "data-id": transcript.id, transcript: transcript, onRtkTranscriptDismiss: (e) => this.handleDismiss(e), t: this.t })));
    }
    render() {
        if (!this.states.activeCaptions)
            return;
        return h(Host, null, this.renderTranscripts());
    }
    get host() { return this; }
    static get watchers() { return {
        "meeting": ["meetingChanged"],
        "states": ["statesChanged"]
    }; }
    static get style() { return RtkTranscriptsStyle0; }
}, [1, "rtk-transcripts", {
        "meeting": [16],
        "states": [16],
        "config": [16],
        "t": [16],
        "transcripts": [32],
        "listenerAttached": [32]
    }, undefined, {
        "meeting": ["meetingChanged"],
        "states": ["statesChanged"]
    }]);
__decorate([
    SyncWithStore()
], RtkTranscripts$1.prototype, "meeting", void 0);
__decorate([
    SyncWithStore()
], RtkTranscripts$1.prototype, "states", void 0);
__decorate([
    SyncWithStore()
], RtkTranscripts$1.prototype, "config", void 0);
__decorate([
    SyncWithStore()
], RtkTranscripts$1.prototype, "t", void 0);
function defineCustomElement$1() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["rtk-transcripts", "rtk-transcript"];
    components.forEach(tagName => { switch (tagName) {
        case "rtk-transcripts":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, RtkTranscripts$1);
            }
            break;
        case "rtk-transcript":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
    } });
}
defineCustomElement$1();

const RtkTranscripts = RtkTranscripts$1;
const defineCustomElement = defineCustomElement$1;

export { RtkTranscripts, defineCustomElement };
