uapp-communication-sdk 1.0.0-dev.54

package/rtk-audio-visualizer_4.entry-CBLhyoKj.js

@@ -0,0 +1,274 @@
+import { $ as e, G as t, J as n, Q as r, Y as i, Z as a, g as o } from "./ui-store-4fbabb78-B6WDMKSM.js";
+import { t as s } from "./index-8be19fcf-BppFp8rx.js";
+import { t as c } from "./hark-6327d91e-BC3gpCxb.js";
+import { t as l } from "./browser-24d8ab3e-NtKNY0W9.js";
+//#region node_modules/@cloudflare/realtimekit-ui/dist/esm/rtk-audio-visualizer_4.entry.js
+var u = (e, t) => {
+	if (e == null) return;
+	let n = [...[
+		,
+		,
+		,
+	]].map((e, n) => {
+		let r = n;
+		return r > 1 && (r = 3 - r - 1), Math.round((r + 1) / 3 * t);
+	}), { width: r, height: i } = e, a = e.getContext("2d"), o = 2, s = r * 1 / n.length, c = s - 4;
+	a.clearRect(0, 0, r, i), a.fillStyle = "rgb(0,0,0,0.0)", a.fillRect(0, 0, r, i);
+	let l = getComputedStyle(e).getPropertyValue("color");
+	a.fillStyle = l, a.strokeStyle = l, a.lineCap = "round", a.lineWidth = 4, a.beginPath();
+	for (let e of n) {
+		let t = Math.min(-Math.abs(e * 1.2 / 10 * i) + i / 2, i / 2 - 2.5), n = Math.max((i / 2 - t) * 2, 5);
+		a.moveTo(o + c / 2, t), a.lineTo(o + c / 2, t + n), o += s;
+	}
+	a.stroke();
+}, d = ":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;width:-moz-fit-content;width:fit-content}.audioActivePadding{padding:var(--rtk-space-1, 4px)}canvas,rtk-icon{height:var(--rtk-space-6, 24px);width:var(--rtk-space-6, 24px)}:host([size='sm']){transform:scale(0.9)}canvas{display:none}canvas.visible{display:block}canvas.bars{--tw-text-opacity:1;color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-text-opacity))}", f = function(e, t, n, r) {
+	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
+	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
+	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
+	return i > 3 && a && Object.defineProperty(t, n, a), a;
+}, p = class {
+	constructor(e) {
+		r(this, e), this.variant = "bars", this.iconPack = o, this.t = t(), this.hideMuted = !1, this.isScreenShare = !1, this.volume = 0;
+	}
+	connectedCallback() {
+		this.participantChanged(this.participant);
+	}
+	componentDidLoad() {
+		u(this.visualizer, 0);
+	}
+	disconnectedCallback() {
+		var e, t, n;
+		(e = this.hark) == null || e.stop(), this.audioUpdateListener && ((t = this.participant) == null || t.removeListener("audioUpdate", this.audioUpdateListener)), this.screenShareUpdateListener && ((n = this.participant) == null || n.removeListener("screenShareUpdate", this.screenShareUpdateListener));
+	}
+	participantChanged(e) {
+		e != null && (this.audioUpdateListener = ({ audioEnabled: e, audioTrack: t }) => {
+			var n;
+			if ((n = this.hark) == null || n.stop(), e && t != null) {
+				this.audioEnabled = !0;
+				let e = new MediaStream();
+				e.addTrack(t), this.calcVolume(e), u(this.visualizer, 0);
+			} else this.volume = 0, this.audioEnabled = !1;
+		}, this.isScreenShare ? (this.screenShareUpdateListener = ({ screenShareEnabled: e, screenShareTracks: t }) => {
+			this.audioUpdateListener({
+				audioEnabled: e && t.audio != null,
+				audioTrack: t.audio
+			});
+		}, this.screenShareUpdateListener({
+			screenShareEnabled: e.screenShareEnabled,
+			screenShareTracks: {
+				audio: e.screenShareTracks.audio,
+				video: e.screenShareTracks.video
+			}
+		}), e.addListener("screenShareUpdate", this.screenShareUpdateListener)) : (this.audioUpdateListener(e), e.addListener("audioUpdate", this.audioUpdateListener)));
+	}
+	calcVolume(e) {
+		this.hark = c(e, {
+			play: !1,
+			interval: 1e3 / 10
+		}), this.hark.on("volume_change", (e) => {
+			let t = this.volume, n = Math.round(10 ** (e / 115) * 10);
+			n < 3 && (n = 0);
+			let r = Math.round((t * 2 + n) / 3);
+			t !== r && (this.volume = r, u(this.visualizer, this.volume));
+		});
+	}
+	render() {
+		return this.hideMuted && !this.audioEnabled ? null : a(n, null, a("div", { class: { audioActivePadding: this.hideMuted && this.audioEnabled } }, a("canvas", {
+			width: "24",
+			height: "24",
+			class: {
+				bars: !0,
+				visible: this.audioEnabled
+			},
+			ref: (e) => this.visualizer = e,
+			part: "canvas"
+		}), !this.isScreenShare && !this.audioEnabled && a("rtk-icon", {
+			icon: this.iconPack.mic_off,
+			part: "mic-off-icon"
+		})));
+	}
+	static get watchers() {
+		return { participant: ["participantChanged"] };
+	}
+};
+f([s()], p.prototype, "iconPack", void 0), f([s()], p.prototype, "t", void 0), p.style = d;
+var m = ".rtk-select{--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))}.rtk-select:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.rtk-select{display:block;border-radius:var(--rtk-border-radius-sm, 4px);border-width:var(--rtk-border-width-none, 0);border-style:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:var(--rtk-space-3, 12px);font-size:16px;--icon-size:var(--rtk-select-chevron-size, var(--rtk-space-6, 24px));--icon-right-position:var(--rtk-select-chevron-right-position, var(--rtk-space-2, 8px));background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e\");background-position:right var(--icon-right-position) center;background-repeat:no-repeat;background-size:var(--icon-size) var(--icon-size);padding-right:calc(var(--icon-right-position) * 5);width:100%;max-width:100%;text-overflow:ellipsis}.inline .rtk-select{margin-top:var(--rtk-space-1, 4px);width:100%;padding-top:var(--rtk-space-1, 4px);padding-bottom:var(--rtk-space-1, 4px);padding-left:var(--rtk-space-1\\.5, 6px);padding-right:var(--rtk-space-1\\.5, 6px);padding-right:var(--rtk-space-8, 32px);font-size:14px}.row{margin-bottom:var(--rtk-space-2, 8px);display:flex;width:100%;align-items:center;justify-content:space-between;gap:var(--rtk-space-3, 12px)}.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%}.inline.group{margin-top:var(--rtk-space-0, 0px);margin-bottom:var(--rtk-space-0\\.5, 2px)}.inline.group>*{margin-bottom:var(--rtk-space-0, 0px)}label{display:flex;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;gap:var(--rtk-space-1, 4px);font-size:14px}.inline.container{display:flex;align-items:center;justify-content:flex-start;gap:var(--rtk-space-2, 8px);padding-left:var(--rtk-space-2, 8px);padding-right:var(--rtk-space-2, 8px)}", h = function(e, t, n, r) {
+	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
+	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
+	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
+	return i > 3 && a && Object.defineProperty(t, n, a), a;
+}, g = class {
+	constructor(e) {
+		r(this, e), this.iconPack = o, this.variant = "full", this.t = t(), this.audioinputDevices = [], this.canProduceAudio = !0, this.currentDevices = { audio: void 0 }, this.stageStateListener = () => {
+			this.canProduceAudio = this.meeting.self.permissions.canProduceAudio === "ALLOWED";
+		}, this.deviceListUpdateListener = async () => {
+			let e = await this.meeting.self.getAudioDevices();
+			this.audioinputDevices = e;
+		}, this.deviceUpdateListener = ({ device: e }) => {
+			e.kind === "audioinput" && (this.currentDevices = { audio: e });
+		}, this.mediaPermissionUpdateListener = async ({ kind: e, message: t }) => {
+			this.meeting && e === "audio" && t === "ACCEPTED" && (this.audioinputDevices = await this.meeting.self.getAudioDevices());
+		};
+	}
+	connectedCallback() {
+		this.meetingChanged(this.meeting);
+	}
+	disconnectedCallback() {
+		var e, t, n, r;
+		(e = this.meeting?.stage) == null || e.removeListener("stageStatusUpdate", this.stageStateListener), (t = this.meeting) == null || t.self.removeListener("deviceListUpdate", this.deviceListUpdateListener), (n = this.meeting) == null || n.self.removeListener("deviceUpdate", this.deviceUpdateListener), (r = this.meeting) == null || r.self.removeListener("mediaPermissionUpdate", this.mediaPermissionUpdateListener);
+	}
+	meetingChanged(t) {
+		t && e(async () => {
+			let { self: e, stage: n } = t, r = await t.self.getAudioDevices(), i = t.self.getCurrentDevices()?.audio;
+			this.currentDevices = { audio: i }, this.canProduceAudio = t.self.permissions.canProduceAudio === "ALLOWED", n?.addListener("stageStatusUpdate", this.stageStateListener), e.addListener("deviceListUpdate", this.deviceListUpdateListener), e.addListener("deviceUpdate", this.deviceUpdateListener), e.addListener("mediaPermissionUpdate", this.mediaPermissionUpdateListener), i == null ? this.audioinputDevices = r : this.audioinputDevices = [r.find((e) => e.deviceId === i.deviceId) ?? i, ...r.filter((e) => e.deviceId !== i.deviceId)];
+		});
+	}
+	setDevice(e) {
+		var t;
+		if (l(this.meeting)) return;
+		let n = this.audioinputDevices.find((t) => t.deviceId === e);
+		n != null && (this.currentDevices = { audio: n }, (t = this.meeting) == null || t.self.setDevice(n));
+	}
+	render() {
+		if (!this.meeting) return null;
+		let e = 0;
+		return a(n, null, this.canProduceAudio && a("div", {
+			part: "microphone-selection",
+			class: "group container " + this.variant
+		}, a("label", { slot: "label" }, this.variant !== "inline" && this.t("settings.microphone_input"), a("rtk-icon", {
+			icon: this.iconPack.mic_on,
+			size: "sm"
+		})), a("div", { class: "row" }, a("select", {
+			class: "rtk-select",
+			onChange: (e) => this.setDevice(e.target.value)
+		}, this.audioinputDevices.map(({ deviceId: t, label: n }) => a("option", {
+			value: t,
+			selected: this.currentDevices.audio?.deviceId === t
+		}, n || `Microphone ${++e}`))), a("slot", { name: "indicator" }))));
+	}
+	static get watchers() {
+		return { meeting: ["meetingChanged"] };
+	}
+};
+h([s()], g.prototype, "meeting", void 0), h([s()], g.prototype, "iconPack", void 0), h([s()], g.prototype, "t", void 0), g.style = m;
+var _ = ".rtk-select{--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))}.rtk-select:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.rtk-select{display:block;border-radius:var(--rtk-border-radius-sm, 4px);border-width:var(--rtk-border-width-none, 0);border-style:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:var(--rtk-space-3, 12px);font-size:16px;--icon-size:var(--rtk-select-chevron-size, var(--rtk-space-6, 24px));--icon-right-position:var(--rtk-select-chevron-right-position, var(--rtk-space-2, 8px));background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e\");background-position:right var(--icon-right-position) center;background-repeat:no-repeat;background-size:var(--icon-size) var(--icon-size);padding-right:calc(var(--icon-right-position) * 5);width:100%;max-width:100%;text-overflow:ellipsis}.inline .rtk-select{margin-top:var(--rtk-space-1, 4px);width:100%;padding-top:var(--rtk-space-1, 4px);padding-bottom:var(--rtk-space-1, 4px);padding-left:var(--rtk-space-1\\.5, 6px);padding-right:var(--rtk-space-1\\.5, 6px);padding-right:var(--rtk-space-8, 32px);font-size:14px}.row{display:flex;width:100%;align-items:center;justify-content:space-between;gap:var(--rtk-space-3, 12px)}.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%}.inline.group{margin-top:var(--rtk-space-0, 0px);margin-bottom:var(--rtk-space-0\\.5, 2px)}.inline.group>*{margin-bottom:var(--rtk-space-0, 0px)}label{display:flex;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;gap:var(--rtk-space-1, 4px);font-size:14px}.inline .container{display:flex;align-items:center;justify-content:flex-start;gap:var(--rtk-space-2, 8px);padding-left:var(--rtk-space-2, 8px);padding-right:var(--rtk-space-2, 8px)}", v = function(e, t, n, r) {
+	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
+	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
+	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
+	return i > 3 && a && Object.defineProperty(t, n, a), a;
+}, y = class {
+	constructor(e) {
+		r(this, e), this.variant = "full", this.iconPack = o, this.t = t(), this.speakerDevices = [], this.currentDevices = { speaker: void 0 }, this.deviceListUpdateListener = async () => {
+			let e = await this.meeting.self.getSpeakerDevices();
+			this.speakerDevices = e;
+		}, this.deviceUpdateListener = ({ device: e }) => {
+			e.kind === "audiooutput" && (this.currentDevices = { speaker: e });
+		}, this.mediaPermissionUpdate = async ({ kind: e, message: t }) => {
+			this.meeting && e === "audio" && t === "ACCEPTED" && (this.speakerDevices = await this.meeting.self.getSpeakerDevices());
+		};
+	}
+	connectedCallback() {
+		this.meetingChanged(this.meeting);
+	}
+	disconnectedCallback() {
+		var e, t, n;
+		(e = this.meeting) == null || e.self.removeListener("deviceListUpdate", this.deviceListUpdateListener), (t = this.meeting) == null || t.self.removeListener("deviceUpdate", this.deviceUpdateListener), (n = this.meeting) == null || n.self.addListener("mediaPermissionUpdate", this.mediaPermissionUpdate);
+	}
+	meetingChanged(t) {
+		t && e(async () => {
+			let { self: e } = t, n = await t.self.getSpeakerDevices(), r = t.self.getCurrentDevices()?.speaker;
+			this.currentDevices = { speaker: r }, e.addListener("deviceListUpdate", this.deviceListUpdateListener), e.addListener("deviceUpdate", this.deviceUpdateListener), e.addListener("mediaPermissionUpdate", this.mediaPermissionUpdate), r == null ? this.speakerDevices = n : this.speakerDevices = [n.find((e) => e.deviceId === r.deviceId) ?? r, ...n.filter((e) => e.deviceId !== r.deviceId)];
+		});
+	}
+	testAudio() {
+		var e;
+		(e = this.testAudioEl) == null || e.play();
+	}
+	setDevice(e) {
+		var t, n;
+		if (l(this.meeting)) return;
+		let r = this.speakerDevices.find((t) => t.deviceId === e);
+		this.currentDevices = { speaker: r }, r != null && ((t = this.meeting) == null || t.self.setDevice(r), (n = this.testAudioEl) == null || n.setSinkId(r.deviceId));
+	}
+	render() {
+		if (!this.meeting) return null;
+		let e = 0;
+		return a(n, null, a("audio", {
+			preload: "auto",
+			src: "https://rtk-assets.realtime.cloudflare.com/ui-kit/speaker-test.mp3",
+			ref: (e) => this.testAudioEl = e
+		}), a("div", {
+			class: "group " + this.variant,
+			part: "speaker-selection"
+		}, this.speakerDevices.length > 0 && !l(this.meeting) && a("div", { class: "container" }, a("label", null, this.variant !== "inline" && this.t("settings.speaker_output"), a("rtk-icon", {
+			icon: this.iconPack.speaker,
+			size: "sm"
+		})), a("div", { class: "row" }, a("select", {
+			class: "rtk-select",
+			onChange: (e) => this.setDevice(e.target.value)
+		}, this.speakerDevices.map(({ deviceId: t, label: n }) => a("option", {
+			value: t,
+			selected: this.currentDevices.speaker?.deviceId === t
+		}, n || `Speaker ${++e}`))))), this.variant === "full" && a("rtk-button", {
+			variant: "secondary",
+			onClick: () => this.testAudio()
+		}, a("rtk-icon", {
+			icon: this.iconPack.speaker,
+			slot: "start"
+		}), this.t("test"))));
+	}
+	static get watchers() {
+		return { meeting: ["meetingChanged"] };
+	}
+};
+v([s()], y.prototype, "meeting", void 0), v([s()], y.prototype, "states", void 0), v([s()], y.prototype, "iconPack", void 0), v([s()], y.prototype, "t", void 0), y.style = _;
+var b = ":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:inline-flex;height:var(--rtk-space-6, 24px);width:var(--rtk-space-10, 40px);align-items:center;padding:var(--rtk-space-1, 4px);border-radius:9999px;background-color:rgb(var(--rtk-colors-text-600, 255 255 255 / 0.52));cursor:pointer}.switch{box-sizing:border-box;height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px);background-color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)));border-radius:9999px;transition-property:var(--rtk-transition-property, all);transition-duration:200ms}:host(.checked){--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity))}:host(.checked) .switch{transform:translateX(100%)}:host([readonly]),:host([disabled]){cursor:not-allowed;opacity:0.6}", x = function(e, t, n, r) {
+	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
+	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
+	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
+	return i > 3 && a && Object.defineProperty(t, n, a), a;
+}, S = class {
+	constructor(e) {
+		r(this, e), this.onChange = i(this, "rtkChange", 4), this.checked = !1, this.readonly = !1, this.disabled = !1, this.iconPack = o, this.t = t(), this.onClick = () => {
+			!this.readonly && !this.disabled && (this.checked = !this.checked);
+		}, this.onKeyPress = (e) => {
+			if (!this.readonly) switch (e.key) {
+				case "Enter":
+				case " ":
+					this.checked = !this.checked;
+					break;
+			}
+		};
+	}
+	connectedCallback() {
+		this.checkedChange(this.checked);
+	}
+	checkedChange(e) {
+		this.checked = e, this.onChange.emit(e);
+	}
+	render() {
+		return a(n, {
+			key: "af0bcf0202cda77f3ec27510b867ed149c478bdf",
+			role: "switch",
+			tabIndex: this.disabled && 0,
+			"aria-readonly": this.readonly,
+			"aria-checked": this.checked,
+			"aria-disabled": this.disabled,
+			class: { checked: this.checked },
+			onClick: this.onClick,
+			onKeyPress: this.onKeyPress
+		}, a("div", {
+			key: "e6f5eeb8acf33e9f058b029423eddc099033053c",
+			class: "switch",
+			part: "switch"
+		}));
+	}
+	static get watchers() {
+		return { checked: ["checkedChange"] };
+	}
+};
+x([s()], S.prototype, "iconPack", void 0), x([s()], S.prototype, "t", void 0), S.style = b;
+//#endregion
+export { p as rtk_audio_visualizer, g as rtk_microphone_selector, y as rtk_speaker_selector, S as rtk_switch };
+
+//# sourceMappingURL=rtk-audio-visualizer_4.entry-CBLhyoKj.js.map

package/rtk-audio-visualizer_4.entry-F-ix_WGT.cjs

@@ -0,0 +1,2 @@
+require("./jsx-runtime-VQ627FC0.cjs");const e=require("./ui-store-4fbabb78-BZ6xmQIE.cjs"),t=require("./index-8be19fcf-CdLnDVXY.cjs"),n=require("./hark-6327d91e-Myicfflm.cjs"),r=require("./browser-24d8ab3e-Dc1oiNSF.cjs");var i=(e,t)=>{if(e==null)return;let n=[...[,,,]].map((e,n)=>{let r=n;return r>1&&(r=3-r-1),Math.round((r+1)/3*t)}),{width:r,height:i}=e,a=e.getContext(`2d`),o=2,s=r*1/n.length,c=s-4;a.clearRect(0,0,r,i),a.fillStyle=`rgb(0,0,0,0.0)`,a.fillRect(0,0,r,i);let l=getComputedStyle(e).getPropertyValue(`color`);a.fillStyle=l,a.strokeStyle=l,a.lineCap=`round`,a.lineWidth=4,a.beginPath();for(let e of n){let t=Math.min(-Math.abs(e*1.2/10*i)+i/2,i/2-2.5),n=Math.max((i/2-t)*2,5);a.moveTo(o+c/2,t),a.lineTo(o+c/2,t+n),o+=s}a.stroke()},a=`: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;width:-moz-fit-content;width:fit-content}.audioActivePadding{padding:var(--rtk-space-1, 4px)}canvas,rtk-icon{height:var(--rtk-space-6, 24px);width:var(--rtk-space-6, 24px)}:host([size='sm']){transform:scale(0.9)}canvas{display:none}canvas.visible{display:block}canvas.bars{--tw-text-opacity:1;color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-text-opacity))}`,o=function(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a},s=class{constructor(t){e.Q(this,t),this.variant=`bars`,this.iconPack=e.g,this.t=e.G(),this.hideMuted=!1,this.isScreenShare=!1,this.volume=0}connectedCallback(){this.participantChanged(this.participant)}componentDidLoad(){i(this.visualizer,0)}disconnectedCallback(){var e,t,n;(e=this.hark)==null||e.stop(),this.audioUpdateListener&&((t=this.participant)==null||t.removeListener(`audioUpdate`,this.audioUpdateListener)),this.screenShareUpdateListener&&((n=this.participant)==null||n.removeListener(`screenShareUpdate`,this.screenShareUpdateListener))}participantChanged(e){e!=null&&(this.audioUpdateListener=({audioEnabled:e,audioTrack:t})=>{var n;if((n=this.hark)==null||n.stop(),e&&t!=null){this.audioEnabled=!0;let e=new MediaStream;e.addTrack(t),this.calcVolume(e),i(this.visualizer,0)}else this.volume=0,this.audioEnabled=!1},this.isScreenShare?(this.screenShareUpdateListener=({screenShareEnabled:e,screenShareTracks:t})=>{this.audioUpdateListener({audioEnabled:e&&t.audio!=null,audioTrack:t.audio})},this.screenShareUpdateListener({screenShareEnabled:e.screenShareEnabled,screenShareTracks:{audio:e.screenShareTracks.audio,video:e.screenShareTracks.video}}),e.addListener(`screenShareUpdate`,this.screenShareUpdateListener)):(this.audioUpdateListener(e),e.addListener(`audioUpdate`,this.audioUpdateListener)))}calcVolume(e){this.hark=n.t(e,{play:!1,interval:1e3/10}),this.hark.on(`volume_change`,e=>{let t=this.volume,n=Math.round(10**(e/115)*10);n<3&&(n=0);let r=Math.round((t*2+n)/3);t!==r&&(this.volume=r,i(this.visualizer,this.volume))})}render(){return this.hideMuted&&!this.audioEnabled?null:e.Z(e.J,null,e.Z(`div`,{class:{audioActivePadding:this.hideMuted&&this.audioEnabled}},e.Z(`canvas`,{width:`24`,height:`24`,class:{bars:!0,visible:this.audioEnabled},ref:e=>this.visualizer=e,part:`canvas`}),!this.isScreenShare&&!this.audioEnabled&&e.Z(`rtk-icon`,{icon:this.iconPack.mic_off,part:`mic-off-icon`})))}static get watchers(){return{participant:[`participantChanged`]}}};o([t.t()],s.prototype,`iconPack`,void 0),o([t.t()],s.prototype,`t`,void 0),s.style=a;var c=`.rtk-select{--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))}.rtk-select:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.rtk-select{display:block;border-radius:var(--rtk-border-radius-sm, 4px);border-width:var(--rtk-border-width-none, 0);border-style:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:var(--rtk-space-3, 12px);font-size:16px;--icon-size:var(--rtk-select-chevron-size, var(--rtk-space-6, 24px));--icon-right-position:var(--rtk-select-chevron-right-position, var(--rtk-space-2, 8px));background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right var(--icon-right-position) center;background-repeat:no-repeat;background-size:var(--icon-size) var(--icon-size);padding-right:calc(var(--icon-right-position) * 5);width:100%;max-width:100%;text-overflow:ellipsis}.inline .rtk-select{margin-top:var(--rtk-space-1, 4px);width:100%;padding-top:var(--rtk-space-1, 4px);padding-bottom:var(--rtk-space-1, 4px);padding-left:var(--rtk-space-1\\.5, 6px);padding-right:var(--rtk-space-1\\.5, 6px);padding-right:var(--rtk-space-8, 32px);font-size:14px}.row{margin-bottom:var(--rtk-space-2, 8px);display:flex;width:100%;align-items:center;justify-content:space-between;gap:var(--rtk-space-3, 12px)}.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%}.inline.group{margin-top:var(--rtk-space-0, 0px);margin-bottom:var(--rtk-space-0\\.5, 2px)}.inline.group>*{margin-bottom:var(--rtk-space-0, 0px)}label{display:flex;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;gap:var(--rtk-space-1, 4px);font-size:14px}.inline.container{display:flex;align-items:center;justify-content:flex-start;gap:var(--rtk-space-2, 8px);padding-left:var(--rtk-space-2, 8px);padding-right:var(--rtk-space-2, 8px)}`,l=function(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a},u=class{constructor(t){e.Q(this,t),this.iconPack=e.g,this.variant=`full`,this.t=e.G(),this.audioinputDevices=[],this.canProduceAudio=!0,this.currentDevices={audio:void 0},this.stageStateListener=()=>{this.canProduceAudio=this.meeting.self.permissions.canProduceAudio===`ALLOWED`},this.deviceListUpdateListener=async()=>{let e=await this.meeting.self.getAudioDevices();this.audioinputDevices=e},this.deviceUpdateListener=({device:e})=>{e.kind===`audioinput`&&(this.currentDevices={audio:e})},this.mediaPermissionUpdateListener=async({kind:e,message:t})=>{this.meeting&&e===`audio`&&t===`ACCEPTED`&&(this.audioinputDevices=await this.meeting.self.getAudioDevices())}}connectedCallback(){this.meetingChanged(this.meeting)}disconnectedCallback(){var e,t,n,r;(e=this.meeting?.stage)==null||e.removeListener(`stageStatusUpdate`,this.stageStateListener),(t=this.meeting)==null||t.self.removeListener(`deviceListUpdate`,this.deviceListUpdateListener),(n=this.meeting)==null||n.self.removeListener(`deviceUpdate`,this.deviceUpdateListener),(r=this.meeting)==null||r.self.removeListener(`mediaPermissionUpdate`,this.mediaPermissionUpdateListener)}meetingChanged(t){t&&e.$(async()=>{let{self:e,stage:n}=t,r=await t.self.getAudioDevices(),i=t.self.getCurrentDevices()?.audio;this.currentDevices={audio:i},this.canProduceAudio=t.self.permissions.canProduceAudio===`ALLOWED`,n?.addListener(`stageStatusUpdate`,this.stageStateListener),e.addListener(`deviceListUpdate`,this.deviceListUpdateListener),e.addListener(`deviceUpdate`,this.deviceUpdateListener),e.addListener(`mediaPermissionUpdate`,this.mediaPermissionUpdateListener),i==null?this.audioinputDevices=r:this.audioinputDevices=[r.find(e=>e.deviceId===i.deviceId)??i,...r.filter(e=>e.deviceId!==i.deviceId)]})}setDevice(e){var t;if(r.t(this.meeting))return;let n=this.audioinputDevices.find(t=>t.deviceId===e);n!=null&&(this.currentDevices={audio:n},(t=this.meeting)==null||t.self.setDevice(n))}render(){if(!this.meeting)return null;let t=0;return e.Z(e.J,null,this.canProduceAudio&&e.Z(`div`,{part:`microphone-selection`,class:`group container `+this.variant},e.Z(`label`,{slot:`label`},this.variant!==`inline`&&this.t(`settings.microphone_input`),e.Z(`rtk-icon`,{icon:this.iconPack.mic_on,size:`sm`})),e.Z(`div`,{class:`row`},e.Z(`select`,{class:`rtk-select`,onChange:e=>this.setDevice(e.target.value)},this.audioinputDevices.map(({deviceId:n,label:r})=>e.Z(`option`,{value:n,selected:this.currentDevices.audio?.deviceId===n},r||`Microphone ${++t}`))),e.Z(`slot`,{name:`indicator`}))))}static get watchers(){return{meeting:[`meetingChanged`]}}};l([t.t()],u.prototype,`meeting`,void 0),l([t.t()],u.prototype,`iconPack`,void 0),l([t.t()],u.prototype,`t`,void 0),u.style=c;var d=`.rtk-select{--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))}.rtk-select:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.rtk-select{display:block;border-radius:var(--rtk-border-radius-sm, 4px);border-width:var(--rtk-border-width-none, 0);border-style:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:var(--rtk-space-3, 12px);font-size:16px;--icon-size:var(--rtk-select-chevron-size, var(--rtk-space-6, 24px));--icon-right-position:var(--rtk-select-chevron-right-position, var(--rtk-space-2, 8px));background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right var(--icon-right-position) center;background-repeat:no-repeat;background-size:var(--icon-size) var(--icon-size);padding-right:calc(var(--icon-right-position) * 5);width:100%;max-width:100%;text-overflow:ellipsis}.inline .rtk-select{margin-top:var(--rtk-space-1, 4px);width:100%;padding-top:var(--rtk-space-1, 4px);padding-bottom:var(--rtk-space-1, 4px);padding-left:var(--rtk-space-1\\.5, 6px);padding-right:var(--rtk-space-1\\.5, 6px);padding-right:var(--rtk-space-8, 32px);font-size:14px}.row{display:flex;width:100%;align-items:center;justify-content:space-between;gap:var(--rtk-space-3, 12px)}.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%}.inline.group{margin-top:var(--rtk-space-0, 0px);margin-bottom:var(--rtk-space-0\\.5, 2px)}.inline.group>*{margin-bottom:var(--rtk-space-0, 0px)}label{display:flex;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;gap:var(--rtk-space-1, 4px);font-size:14px}.inline .container{display:flex;align-items:center;justify-content:flex-start;gap:var(--rtk-space-2, 8px);padding-left:var(--rtk-space-2, 8px);padding-right:var(--rtk-space-2, 8px)}`,f=function(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a},p=class{constructor(t){e.Q(this,t),this.variant=`full`,this.iconPack=e.g,this.t=e.G(),this.speakerDevices=[],this.currentDevices={speaker:void 0},this.deviceListUpdateListener=async()=>{let e=await this.meeting.self.getSpeakerDevices();this.speakerDevices=e},this.deviceUpdateListener=({device:e})=>{e.kind===`audiooutput`&&(this.currentDevices={speaker:e})},this.mediaPermissionUpdate=async({kind:e,message:t})=>{this.meeting&&e===`audio`&&t===`ACCEPTED`&&(this.speakerDevices=await this.meeting.self.getSpeakerDevices())}}connectedCallback(){this.meetingChanged(this.meeting)}disconnectedCallback(){var e,t,n;(e=this.meeting)==null||e.self.removeListener(`deviceListUpdate`,this.deviceListUpdateListener),(t=this.meeting)==null||t.self.removeListener(`deviceUpdate`,this.deviceUpdateListener),(n=this.meeting)==null||n.self.addListener(`mediaPermissionUpdate`,this.mediaPermissionUpdate)}meetingChanged(t){t&&e.$(async()=>{let{self:e}=t,n=await t.self.getSpeakerDevices(),r=t.self.getCurrentDevices()?.speaker;this.currentDevices={speaker:r},e.addListener(`deviceListUpdate`,this.deviceListUpdateListener),e.addListener(`deviceUpdate`,this.deviceUpdateListener),e.addListener(`mediaPermissionUpdate`,this.mediaPermissionUpdate),r==null?this.speakerDevices=n:this.speakerDevices=[n.find(e=>e.deviceId===r.deviceId)??r,...n.filter(e=>e.deviceId!==r.deviceId)]})}testAudio(){var e;(e=this.testAudioEl)==null||e.play()}setDevice(e){var t,n;if(r.t(this.meeting))return;let i=this.speakerDevices.find(t=>t.deviceId===e);this.currentDevices={speaker:i},i!=null&&((t=this.meeting)==null||t.self.setDevice(i),(n=this.testAudioEl)==null||n.setSinkId(i.deviceId))}render(){if(!this.meeting)return null;let t=0;return e.Z(e.J,null,e.Z(`audio`,{preload:`auto`,src:`https://rtk-assets.realtime.cloudflare.com/ui-kit/speaker-test.mp3`,ref:e=>this.testAudioEl=e}),e.Z(`div`,{class:`group `+this.variant,part:`speaker-selection`},this.speakerDevices.length>0&&!r.t(this.meeting)&&e.Z(`div`,{class:`container`},e.Z(`label`,null,this.variant!==`inline`&&this.t(`settings.speaker_output`),e.Z(`rtk-icon`,{icon:this.iconPack.speaker,size:`sm`})),e.Z(`div`,{class:`row`},e.Z(`select`,{class:`rtk-select`,onChange:e=>this.setDevice(e.target.value)},this.speakerDevices.map(({deviceId:n,label:r})=>e.Z(`option`,{value:n,selected:this.currentDevices.speaker?.deviceId===n},r||`Speaker ${++t}`))))),this.variant===`full`&&e.Z(`rtk-button`,{variant:`secondary`,onClick:()=>this.testAudio()},e.Z(`rtk-icon`,{icon:this.iconPack.speaker,slot:`start`}),this.t(`test`))))}static get watchers(){return{meeting:[`meetingChanged`]}}};f([t.t()],p.prototype,`meeting`,void 0),f([t.t()],p.prototype,`states`,void 0),f([t.t()],p.prototype,`iconPack`,void 0),f([t.t()],p.prototype,`t`,void 0),p.style=d;var m=`: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:inline-flex;height:var(--rtk-space-6, 24px);width:var(--rtk-space-10, 40px);align-items:center;padding:var(--rtk-space-1, 4px);border-radius:9999px;background-color:rgb(var(--rtk-colors-text-600, 255 255 255 / 0.52));cursor:pointer}.switch{box-sizing:border-box;height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px);background-color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)));border-radius:9999px;transition-property:var(--rtk-transition-property, all);transition-duration:200ms}:host(.checked){--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity))}:host(.checked) .switch{transform:translateX(100%)}:host([readonly]),:host([disabled]){cursor:not-allowed;opacity:0.6}`,h=function(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a},g=class{constructor(t){e.Q(this,t),this.onChange=e.Y(this,`rtkChange`,4),this.checked=!1,this.readonly=!1,this.disabled=!1,this.iconPack=e.g,this.t=e.G(),this.onClick=()=>{!this.readonly&&!this.disabled&&(this.checked=!this.checked)},this.onKeyPress=e=>{if(!this.readonly)switch(e.key){case`Enter`:case` `:this.checked=!this.checked;break}}}connectedCallback(){this.checkedChange(this.checked)}checkedChange(e){this.checked=e,this.onChange.emit(e)}render(){return e.Z(e.J,{key:`af0bcf0202cda77f3ec27510b867ed149c478bdf`,role:`switch`,tabIndex:this.disabled&&0,"aria-readonly":this.readonly,"aria-checked":this.checked,"aria-disabled":this.disabled,class:{checked:this.checked},onClick:this.onClick,onKeyPress:this.onKeyPress},e.Z(`div`,{key:`e6f5eeb8acf33e9f058b029423eddc099033053c`,class:`switch`,part:`switch`}))}static get watchers(){return{checked:[`checkedChange`]}}};h([t.t()],g.prototype,`iconPack`,void 0),h([t.t()],g.prototype,`t`,void 0),g.style=m,exports.rtk_audio_visualizer=s,exports.rtk_microphone_selector=u,exports.rtk_speaker_selector=p,exports.rtk_switch=g;
+//# sourceMappingURL=rtk-audio-visualizer_4.entry-F-ix_WGT.cjs.map