@mediquo/elements 0.0.0-pr-383-20261029152148

package/dist/chunks/mq-videocall-CcRWCujw.js

@@ -0,0 +1,870 @@
+import{_ as e,c as t}from"./custom-element-D2ziPxYE.js";import{i,E as o,x as s,a as n,T as r,r as a}from"./lit-element-B5-nYi7k.js";import{n as l}from"./property-C1CmBSnw.js";import{e as d}from"./provide-BwI4DDGF.js";import{c}from"./consume-CovVqBjI.js";import{h}from"./task-BYPV1iNw.js";import{A as p}from"./api-client-context-BXGqBAlO.js";import{l as u}from"./chunk-S5RWG6G2-CQJ38pW6.js";import{t as m,u as v,w as g,x as b,y as f}from"./telemetry-client-DA2_SZBC.js";import{f as y,A as w,i as x,C as k,c as $,n as q}from"./api-chat-client-CcYgqPdC.js";import{r as S}from"./state-Br45Av8Z.js";import{n as C}from"./create-context-DqP79qjF.js";import{g as E,p as D,a as T}from"./chunk-NIAGR3ZC-BDlNUZa1.js";import{env as z}from"../env.js";import{m as I,s as O}from"./runtime-Bg1WXVCx.js";import{l as A}from"./localized-decorator-BlOuLhym.js";import"../ui/mq-button.js";import{l as M,r as L,e as R,a as V}from"./index-xi0bxKot.js";import{e as P,i as _,t as N}from"./directive-DrycXrFV.js";import{f as j,m as U}from"./directive-helpers-m2qHStQ1.js";import{o as F}from"./style-map-MoXKugLp.js";import{l as W}from"./chunk-FUCSYDW7-Duj5hy8S.js";import{getLocale as B}from"../i18n.js";import{alertCircleIcon as H}from"../ui/icons/alert-circle-icon.js";import{calendarIcon as K}from"../ui/icons/calendar-icon.js";import{checkCircleIcon as Y}from"../ui/icons/check-circle-icon.js";import{clockIcon as G}from"../ui/icons/clock-icon.js";import{infoCircleOutineIcon as Z}from"../ui/icons/info-circle-outine-icon.js";import{micIcon as X}from"../ui/icons/mic-icon.js";import{micOffIcon as J}from"../ui/icons/mic-off-icon.js";import{refreshCcwIcon as Q}from"../ui/icons/refresh-ccw-icon.js";import{spinnerIcon as ee}from"../ui/icons/spinner-icon.js";import{videoIcon as te}from"../ui/icons/video-icon.js";import{videoOffIcon as ie}from"../ui/icons/video-off-icon.js";import{volumeIcon as oe}from"../ui/icons/volume-icon.js";import{e as se,t as ne}from"./custom-element-CiOhPWP1-DPpsGZrV.js";import{m as re,e as ae,T as le,d as de,u as ce,a as he,h as pe,l as ue,y as me,p as ve,F as ge,c as be,f as fe}from"./index-Cp5_a_ei.js";import{checkIcon as ye}from"../ui/icons/check-icon.js";import{refreshIcon as we}from"../ui/icons/refresh-icon.js";import{settingsIcon as xe}from"../ui/icons/settings-icon.js";import"../ui/mq-avatar.js";import"../ui/mq-callout.js";import"../ui/mq-skeleton.js";import"../ui/mq-text-button.js";import{a as ke}from"./addSeconds-fO5orJrt.js";import"../ui/mq-page-title.js";import"./professional-overview-yVZgXRCU.js";import{MqViewAppointmentsEvent as $e}from"../events.js";import"./documentation-view-CAU1T5j3.js";import{i as qe}from"./keyed-c1C5T7e_.js";import{arrowNarrowLeftIcon as Se}from"../ui/icons/arrow-narrow-left-icon.js";import{messageSquareIcon as Ce}from"../ui/icons/message-square-icon.js";import"../ui/mq-badge.js";import{chevronDownIcon as Ee}from"../ui/icons/chevron-down-icon.js";import{helpCircleIcon as De}from"../ui/icons/help-circle-icon.js";import"../ui/mq-unread-badge.js";import{e as Te}from"./query-CeeutdfT.js";import{messageBubbleIcon as ze}from"../ui/icons/message-bubble-icon.js";import{M as Ie}from"./mutation-controller-CR2qcqhH.js";import"../ui/mq-rating.js";import{heartBeatIcon as Oe}from"../ui/icons/heartbeat-icon.js";import{timeLeftIcon as Ae}from"../ui/icons/time-left-icon.js";import"./mq-layout-qMP-lpxw.js";class InvalidTokenError extends Error{}function Me(e){let t=e.replace(/-/g,"+").replace(/_/g,"/");switch(t.length%4){case 0:break;case 2:t+="==";break;case 3:t+="=";break;default:throw new Error("base64 string is not of the correct length")}try{return function(e){return decodeURIComponent(atob(e).replace(/(.)/g,(e,t)=>{let i=t.charCodeAt(0).toString(16).toUpperCase();return i.length<2&&(i="0"+i),"%"+i}))}(t)}catch(e){return atob(t)}}InvalidTokenError.prototype.name="InvalidTokenError";const Le=C(Symbol("opentok-service")),Re=C(Symbol("params"));class ToggleAudioEvent extends Event{static{this.eventName="toggle-audio"}constructor(e){super(ToggleAudioEvent.eventName,{bubbles:!0,composed:!0}),this.isAudioOn=e}}class ToggleVideoEvent extends Event{static{this.eventName="toggle-video"}constructor(e){super(ToggleVideoEvent.eventName,{bubbles:!0,composed:!0}),this.isVideoOn=e}}class ToggleChatEvent extends Event{static{this.eventName="toggle-chat"}constructor(e){super(ToggleChatEvent.eventName,{bubbles:!0,composed:!0}),this.isChatOpen=e}}class OpenChatEvent extends Event{static{this.eventName="open-chat"}constructor(){super(OpenChatEvent.eventName,{bubbles:!0,composed:!0})}}class ViewDocumentationEvent extends Event{static{this.eventName="view-documentation"}constructor(){super(ViewDocumentationEvent.eventName,{bubbles:!0,composed:!0})}}class DownloadFileEvent extends Event{static{this.eventName="download-file"}constructor(e,t){super(DownloadFileEvent.eventName,{bubbles:!0,composed:!0}),this.url=e,this.filename=t}}class RequestPermissionsEvent extends Event{static{this.eventName="request-permissions"}constructor(){super(RequestPermissionsEvent.eventName,{bubbles:!0,composed:!0})}}class EnterWaitingRoomEvent extends Event{static{this.eventName="enter-waiting-room"}constructor(e){super(EnterWaitingRoomEvent.eventName,{bubbles:!0,composed:!0}),this.devices=e}}class SelectDeviceEvent extends Event{static{this.eventName="select-device"}constructor(e,t){super(SelectDeviceEvent.eventName,{bubbles:!0,composed:!0}),this.kind=e,this.deviceId=t}}class FlipCameraEvent extends Event{static{this.eventName="flip-camera"}constructor(){super(FlipCameraEvent.eventName,{bubbles:!0,composed:!0})}}class ReenterCallEvent extends Event{static{this.eventName="reenter-call"}constructor(){super(ReenterCallEvent.eventName,{bubbles:!0,composed:!0})}}class DoctorConnectionEvent extends Event{static{this.eventName="doctor-connection"}constructor(e){super(DoctorConnectionEvent.eventName,{bubbles:!0,composed:!0}),this.unstable=e}}class OpenHelpEvent extends Event{static{this.eventName="open-help"}constructor(){super(OpenHelpEvent.eventName,{bubbles:!0,composed:!0})}}class CallSessionEvent extends Event{static{this.eventName="call-session"}constructor(e){super(CallSessionEvent.eventName,{bubbles:!0,composed:!0}),this.session=e}}class CallStartedEvent extends Event{static{this.eventName="call-started"}constructor(){super(CallStartedEvent.eventName,{bubbles:!0,composed:!0})}}class CallFinishedEvent extends Event{static{this.eventName="call-finished"}constructor(){super(CallFinishedEvent.eventName,{bubbles:!0,composed:!0})}}class DevicesPermissionEvent extends Event{static{this.eventName="devices-permission"}constructor(e){super(DevicesPermissionEvent.eventName,{bubbles:!0,composed:!0}),this.granted=e}}class OpenTokService{static{this.URL="https://static.opentok.com/v2/js/opentok.min.js"}_ensureLoaded(){if(!window.OT)throw new Error("OpenTok SDK is not loaded");return window.OT}load(){return new Promise((e,t)=>{if(window.OT)return void e();const i=document.createElement("script");i.src=OpenTokService.URL,i.onload=()=>{e()},i.onerror=t,document.head.appendChild(i)})}initSession(e,t){return this._ensureLoaded().initSession(e,t)}initPublisher(e,t,i){return this._ensureLoaded().initPublisher(e,t,i)}setAudioOutputDevice(e){return this._ensureLoaded().setAudioOutputDevice(e)}subscribe(e,t,i,o,s){return e.subscribe(t,i,o,s)}}const Ve="device-check",Pe="waiting-room",_e="videocall",Ne="documentation",je="not-time-yet",Ue="review";const Fe=i`
+  .swap {
+    display: grid;
+    grid-template: minmax(0, 1fr) / minmax(0, 1fr);
+    height: 100%;
+  }
+
+  .view,
+  .ghost {
+    grid-area: 1 / 1;
+    min-width: 0;
+    min-height: 0;
+  }
+
+  .ghost {
+    pointer-events: none;
+    animation: crossfade-out ${300}ms cubic-bezier(0.23, 1, 0.32, 1)
+      forwards;
+  }
+
+  .fading .view {
+    animation: crossfade-in ${300}ms cubic-bezier(0.23, 1, 0.32, 1);
+  }
+
+  @keyframes crossfade-out {
+    to {
+      opacity: 0;
+    }
+  }
+
+  @keyframes crossfade-in {
+    from {
+      opacity: 0;
+    }
+  }
+`;class Crossfade{constructor(e){this.host=e,e.addController(this)}hostDisconnected(){clearTimeout(this.timer),this.fading=void 0}wrap(e,t){return t?this.fading=void 0:this.shown&&!globalThis.matchMedia?.("(prefers-reduced-motion: reduce)").matches&&(this.fading=this.shown,clearTimeout(this.timer),this.timer=setTimeout(()=>{this.fading=void 0,this.host.requestUpdate()},300)),this.shown=t,s`<div class="swap ${this.fading?"fading":""}">
+      <div class="view">${e}</div>
+      ${this.fading?s`<div class="ghost" aria-hidden="true">${this.fading}</div>`:o}
+    </div>`}}class OpenTokController{constructor(e,t,i,o,s,n,r){this.isLoading=!0,this.isSessionReady=!1,this.isReconnecting=!1,this.connectionLost=!1,this.errorMessage="",this.session=null,this.streams=[],this.destroyedStreamIds=new Set,this.openTokService=new OpenTokService,this.session_token=null,this.hasLeftWaitingRoom=!1,this.hasReentered=!1,this.host=e,this.apiClient=t,e.addController(this),this.appointment=i,this.token=o,this.onCallStarted=s,this.onCallFinished=n,this.onSession=r,this._loadOpentok()}async _loadOpentok(){try{await this.openTokService.load(),this._initializeSession()}catch{this.isLoading=!1,this.errorMessage="Failed to load OpenTok script",this.host.requestUpdate()}}async _getSessionAndToken(){const e=await this.apiClient.flash.joinCall({callId:this.appointment.call_id});return this.session_token=e.session_token,[e.session_id,e.session_token]}async _initializeSession(){try{const[e,t]=await this._getSessionAndToken();this.session=this.openTokService.initSession(z.OPENTOK_API_KEY,e),this.onSession?.(this.session),this.session.on("sessionConnected",()=>{this.isLoading=!1,this.isSessionReady=!0,this.host.requestUpdate()}),this.session.on("sessionDisconnected",e=>{if(this.isSessionReady=!1,"networkDisconnected"===e.reason)return this.isReconnecting=!1,this.connectionLost=!0,void this.host.requestUpdate();this._leaveWaitingRoom(),setTimeout(()=>{this.onCallFinished(),this.host.requestUpdate()},1e3),this.host.requestUpdate()}),this.session.on("sessionReconnecting",()=>{this.isReconnecting=!0,this.host.requestUpdate()}),this.session.on("sessionReconnected",()=>{this.isReconnecting=!1;const e=this.streams.filter(e=>!this.destroyedStreamIds.has(e.streamId));this.streams=[],this.host.requestUpdate(),requestAnimationFrame(()=>{this.streams=e.filter(e=>!this.destroyedStreamIds.has(e.streamId)),this.host.requestUpdate()})}),this.session.on("streamCreated",e=>{this.streams=[...this.streams,e.stream],this.onCallStarted(),this.host.requestUpdate()}),this.session.on("streamDestroyed",e=>{e.stream?.streamId&&this.destroyedStreamIds.add(e.stream.streamId),setTimeout(()=>{this.streams=this.streams.filter(t=>t.streamId!==e.stream?.streamId),"networkDisconnected"!==e.reason?(this._leaveWaitingRoom(),this.onCallFinished(),this.host.requestUpdate()):this.host.requestUpdate()},1e3)}),this.session.connect(t,e=>{e&&this._fail(`Failed to connect to session: ${e.message}`)}),this.apiClient.flash.setReady({professional_hash:this.appointment.from.hash,consultation_id:this.appointment.id,consultation_type:"appointment"})}catch(e){this._fail(`Error initializing session: ${e instanceof Error?e.message:"Unknown error"}`)}}_fail(e){this.isLoading=!1,this.hasReentered?this.connectionLost=!0:this.errorMessage=e,this.host.requestUpdate()}reconnect(){return this.session?.off(),this.connectionLost=!1,this.hasReentered=!0,this.isLoading=!0,this.streams=[],this.destroyedStreamIds.clear(),this.hasLeftWaitingRoom=!1,this.host.requestUpdate(),this._initializeSession()}_leaveWaitingRoom(){this.hasLeftWaitingRoom||(this.hasLeftWaitingRoom=!0,this.apiClient.flash.leaveWaitingRoom({professional_hash:this.appointment.from.hash,consultation_id:this.appointment.id,consultation_type:"appointment"}))}hostDisconnected(){this._leaveWaitingRoom(),this.session&&(this.session.disconnect(),this.session.off("streamCreated"),this.session.off("streamDestroyed"),this.session.off("sessionConnected"),this.session.off("sessionDisconnected"),this.session.off("sessionReconnecting"),this.session.off("sessionReconnected"))}}const We=["pointerdown","keydown"];let Be=class ConnectionLostDialog extends n{constructor(){super(...arguments),this.open=!1,this.inCall=!1,this.aside=!1,this.back=()=>{this.aside=!1,this.waiting?.abort()}}static{this.styles=i`:host{display:contents}mq-dialog{--dialog-max-width:30rem;--dialog-padding-inline:var(--sp-6);--dialog-padding-block:var(--sp-4)}mq-dialog::part(close){display:none}mq-dialog::part(header){min-height:0;padding:var(--sp-6) var(--sp-6) 0;background:0 0}mq-dialog::part(heading){font-size:var(--text-xl);line-height:1.35;color:var(--color-text-icons--primary)}mq-dialog::part(footer){padding:0 var(--sp-6) var(--sp-6);border-top:none}p{margin:0;font-size:var(--text-base);line-height:1.5;color:var(--color-text-icons--secondary)}`}openChat(){this.aside=!0,this.waiting=new AbortController;for(const e of We)this.getRootNode().addEventListener(e,this.back,{signal:this.waiting.signal});this.dispatchEvent(new OpenChatEvent)}disconnectedCallback(){this.waiting?.abort(),super.disconnectedCallback()}copy(e){return this.inCall?I(e?"No hemos podido volver a conectar con tu médico. Pulsa «Volver a entrar» para intentarlo de nuevo, o escríbele por el chat.":"No hemos podido volver a conectar con tu médico. Pulsa «Volver a entrar» para intentarlo de nuevo."):I(e?"No hemos podido volver a conectar. Tu cita sigue en pie: pulsa «Volver a la sala» para intentarlo de nuevo, o escribe a tu médico por el chat.":"No hemos podido volver a conectar. Tu cita sigue en pie: pulsa «Volver a la sala» para intentarlo de nuevo.")}render(){const e=!0===this.appointment?.has_chat_in_appointment,t=this.inCall?I("Volver a entrar"):I("Volver a la sala");return s`<mq-dialog .open="${this.open&&!this.aside}" .dismissable="${!1}" alert><h2 slot="heading">${I("Se ha perdido la conexión")}</h2><p>${this.copy(e)}</p>${e?s`<mq-button slot="footer" variant="outline" @click="${this.openChat}">${I("Abrir chat")}</mq-button>`:o}<mq-button slot="footer" variant="primary" @click="${()=>this.dispatchEvent(new ReenterCallEvent)}">${t}</mq-button></mq-dialog>`}};e([l({type:Boolean,reflect:!0})],Be.prototype,"open",void 0),e([l({type:Object})],Be.prototype,"appointment",void 0),e([l({type:Boolean,attribute:"in-call"})],Be.prototype,"inCall",void 0),e([S()],Be.prototype,"aside",void 0),Be=e([A(),t("connection-lost-dialog")],Be);const He={},Ke=P(class extends _{constructor(){super(...arguments),this.ot=He}render(e,t){return t()}update(e,[t,i]){if(Array.isArray(t)){if(Array.isArray(this.ot)&&this.ot.length===t.length&&t.every((e,t)=>e===this.ot[t]))return r}else if(this.ot===t)return r;return this.ot=Array.isArray(t)?Array.from(t):t,this.render(t,i)}}),Ye=P(class extends _{constructor(e){if(super(e),e.type!==N.PROPERTY&&e.type!==N.ATTRIBUTE&&e.type!==N.BOOLEAN_ATTRIBUTE)throw Error("The `live` directive is not allowed on child or event bindings");if(!j(e))throw Error("`live` bindings can only contain a single expression")}render(e){return e}update(e,[t]){if(t===r||t===o)return t;const i=e.element,s=e.name;if(e.type===N.PROPERTY){if(t===i[s])return r}else if(e.type===N.BOOLEAN_ATTRIBUTE){if(!!t===i.hasAttribute(s))return r}else if(e.type===N.ATTRIBUTE&&i.getAttribute(s)===t+"")return r;return U(e),t}});function Ge(e){const t=e?.name;return"NotAllowedError"===t||"SecurityError"===t?"denied":"NotFoundError"===t||"OverconstrainedError"===t?"not-found":"NotReadableError"===t||"TrackStartError"===t||"AbortError"===t?"busy":"unknown"}function Ze(e,t,i,o=1e-4){if(t>o)return{silentSince:void 0,silent:!1};const s=e??i;return{silentSince:s,silent:i-s>=5e3}}function Xe(e,t){return t.some(t=>e.groupId?t.groupId===e.groupId:t.deviceId===e.deviceId)}function Je(e){const t=e.getCapabilities?.().facingMode;return t?.includes("user")?"user":t?.includes("environment")?"environment":/\b(front|frontal|delantera|user|selfie)\b/i.test(e.label)?"user":/\b(back|rear|trasera|posterior|environment)\b/i.test(e.label)?"environment":void 0}function Qe(e,t){const i=e.find(e=>e.deviceId===t),o="environment"===(i?Je(i):void 0)?"user":"environment";return e.find(e=>e.deviceId!==t&&Je(e)===o)}function et(e){const t=e.filter(e=>"default"!==e.deviceId&&"communications"!==e.deviceId);if(0===t.length)return e;const i=e.find(e=>"default"===e.deviceId)?.groupId;return[...t.filter(e=>i&&e.groupId===i),...t.filter(e=>!i||e.groupId!==i)]}async function tt(){const e=await navigator.mediaDevices.enumerateDevices(),t=t=>e.filter(e=>e.kind===t);return{audioInputs:et(t("audioinput")),videoInputs:t("videoinput"),audioOutputs:et(t("audiooutput"))}}function it(e,t){const i=new AudioContext,o=i.createAnalyser();i.createMediaStreamSource(new MediaStream([e])).connect(o);const s=new Float32Array(o.fftSize),n=setInterval(()=>{"running"===i.state?(o.getFloatTimeDomainData(s),t(s.reduce((e,t)=>Math.max(e,Math.abs(t)),0))):i.resume()},100);let r=!1;return()=>{r||(r=!0,clearInterval(n),i.close())}}const ot=e=>e?{deviceId:{exact:e}}:{};class DevicesController{constructor(e){this.host=e,this.permission="checking",this.audioInputs=[],this.videoInputs=[],this.audioOutputs=[],this.audioOn=!0,this.videoOn=!0,this.audioFailed=!1,this.level=0,this.silent=!1,this.facing="user",this.stopMeter=()=>{},this.refresh=async()=>{({audioInputs:this.audioInputs,videoInputs:this.videoInputs,audioOutputs:this.audioOutputs}=await tt()),this.speakerId??=(this.audioOutputs.find(e=>"default"===e.deviceId)??this.audioOutputs[0])?.deviceId,!this.videoStream&&"not-found"===this.videoError&&this.videoInputs.length>0&&await this.startVideo(),this.host.requestUpdate()},e.addController(this)}get micSilent(){return this.audioOn&&(this.audioFailed||!this.audioTrack||this.audioTrack.muted||this.silent)}get canPickSpeaker(){return"setSinkId"in HTMLMediaElement.prototype&&this.audioOutputs.length>0}get selection(){return{audioSource:this.audioDeviceId,videoSource:this.videoDeviceId??null,audioOn:this.audioOn,videoOn:this.videoOn,speakerId:this.canPickSpeaker?this.speakerId:void 0}}async hostConnected(){navigator.mediaDevices?.addEventListener("devicechange",this.refresh),this.permission=await async function(){try{const[e,t]=await Promise.all(["microphone","camera"].map(e=>navigator.permissions.query({name:e})));return"denied"===e?.state?"denied":"granted"===e?.state&&"granted"===t?.state?"granted":"prompt"}catch{return"prompt"}}(),"granted"===this.permission&&await this.start(),this.host.requestUpdate()}hostDisconnected(){navigator.mediaDevices?.removeEventListener("devicechange",this.refresh),this.stop()}stop(){this.stopMeter(),this.audioTrack?.stop(),this.audioTrack=void 0,this.stopVideo()}async start(){"prompt"===this.permission&&(this.permission="requesting",this.host.requestUpdate());try{const e=await navigator.mediaDevices.getUserMedia({audio:!0,video:!0});this.setAudio(e.getAudioTracks()[0]),this.setVideo(e.getVideoTracks()[0])}catch(e){if("denied"===Ge(e))return this.permission="denied",void this.host.requestUpdate();if(await this.startAudio(),"denied"===this.permission)return;await this.startVideo()}await this.refresh(),this.permission="granted",this.host.requestUpdate()}async startAudio(e){try{const t=await navigator.mediaDevices.getUserMedia({audio:ot(e)});this.setAudio(t.getAudioTracks()[0])}catch(e){this.audioFailed=!0,"denied"===Ge(e)&&(this.permission="denied")}this.host.requestUpdate()}async startVideo(e,t){this.stopVideo();try{const i=await navigator.mediaDevices.getUserMedia({video:{...ot(e),...t?{facingMode:{ideal:t}}:{}}});this.setVideo(i.getVideoTracks()[0])}catch(e){this.videoError=Ge(e),this.videoOn=!1}this.host.requestUpdate()}selectAudio(e){return this.startAudio(e)}selectVideo(e){return this.startVideo(e)}selectSpeaker(e){this.speakerId=e,this.host.requestUpdate()}toggleAudio(){this.audioOn=!this.audioOn,this.silent=!1,this.silentSince=void 0,this.audioTrack&&(this.audioTrack.enabled=this.audioOn),this.host.requestUpdate()}async toggleVideo(){if(!this.videoStream)return this.startVideo(this.videoDeviceId);this.stopVideo(),this.videoOn=!1,this.host.requestUpdate()}flipCamera(){return this.facing="user"===this.facing?"environment":"user",this.videoStream?this.startVideo(void 0,this.facing):(this.videoDeviceId=Qe(this.videoInputs,this.videoDeviceId)?.deviceId??this.videoDeviceId,void this.host.requestUpdate())}stopVideo(){for(const e of this.videoStream?.getTracks()??[])e.stop();this.videoStream=void 0}setAudio(e){e&&(this.stopMeter(),this.audioTrack?.stop(),this.audioTrack=e,this.audioFailed=!1,this.audioDeviceId=e.getSettings().deviceId,e.enabled=this.audioOn,e.onmute=e.onunmute=()=>this.host.requestUpdate(),e.onended=()=>{this.startAudio()},this.watchLevel(e))}setVideo(e){e&&(this.videoStream=new MediaStream([e]),this.videoError=void 0,this.videoOn=!0,this.videoDeviceId=e.getSettings().deviceId,e.onended=()=>{this.startVideo()})}watchLevel(e){this.stopMeter=it(e,e=>{({silentSince:this.silentSince,silent:this.silent}=Ze(this.silentSince,e,Date.now())),this.level=Math.min(1,4*e),this.host.requestUpdate()})}}const st=["audioOnly","unstable","doctorUnstable"],nt=["audioOnly","doctorUnstable"],rt=e=>st.includes(e),at=e=>rt(e)&&"doctorUnstable"!==e;function lt(e){if(0===e.length)return;const t={timestamp:0,packetsSent:0,packetsLost:0,videoBytes:0,limited:!1};for(const{rtcStatsReport:i}of e)i.forEach(e=>{"outbound-rtp"===e.type?(t.timestamp=Math.max(t.timestamp,e.timestamp),t.packetsSent+=e.packetsSent??0,"video"===e.kind&&(t.videoBytes+=e.bytesSent??0,t.limited||="none"!==e.qualityLimitationReason)):"remote-inbound-rtp"===e.type&&(t.packetsLost+=Math.max(0,e.packetsLost??0),void 0!==e.roundTripTime&&(t.rttMs=Math.max(t.rttMs??0,1e3*e.roundTripTime)))});return t}function dt(e,t,i){const o=(t.timestamp-e.timestamp)/1e3,s=t.packetsSent-e.packetsSent;return o<=0||s<0?{lossPct:0}:{lossPct:s>0?100*(t.packetsLost-e.packetsLost)/s:0,videoKbps:i&&t.limited?8*(t.videoBytes-e.videoBytes)/o/1e3:void 0,rttMs:t.rttMs}}function ct({lossPct:e,videoKbps:t,rttMs:i}){return e>5||void 0!==t&&t<150?"bad":e>3||(i??0)>300?"unstable":"good"}const ht=e=>new Promise(t=>setTimeout(t,e)),pt=e=>new Promise((t,i)=>e(e=>e?i(e):t()));class NetworkTestController{constructor(e){this.host=e,this.state="idle",this.runId=0,this.cleanup=()=>{},e.addController(this)}hostDisconnected(){this.stop()}stop(){this.runId++,this.cleanup()}async run({api:e,ot:t},i){this.stop();const o=this.runId,s=()=>o!==this.runId,n=[];this.cleanup=()=>{for(;n.length;)n.pop()?.()},this.set("checking");try{const[o]=await Promise.all([e.flash.createNetworkTest(),t.load()]);if(s())return;const r=t.initSession(o.api_key,o.session_id);if(n.push(()=>r.disconnect()),await pt(e=>r.connect(o.session_token,e)),s())return;const a=i.audio?.clone(),l=i.video?.clone();let d;if(n.push(()=>{a?.stop(),l?.stop()}),await pt(e=>{d=t.initPublisher(void 0,{insertDefaultUI:!1,audioSource:a??!1,videoSource:l??!1},e),n.push(()=>d.destroy())}),s())return;if(await pt(e=>r.publish(d,e)),await ht(2e3),s())return;const c=lt(await d.getRtcStatsReport());if(await ht(4e3),s())return;const h=lt(await d.getRtcStatsReport());if(s())return;this.set(function(e,t,i){if(e&&t&&!(t.packetsSent<=e.packetsSent))return"good"===ct(dt(e,t,i))?"good":"slow"}(c,h,void 0!==l)??"idle")}catch(e){if(s())return;W.warn("network test did not run",e),this.set(x(e)&&429===e.response?.status?"limited":"idle")}finally{s()||this.cleanup()}}set(e){this.state=e,this.host.requestUpdate()}}const ut={surface:a("var(--mq-surface-surface, var(--color-neutrals-background-extraWeak, #ffffff))"),border:a("var(--mq-border-default, var(--color-border, #edecf1))"),text:a("var(--mq-text-primary, var(--color-neutrals-text-default, #0a0a23))"),textMedium:a("var(--color-neutrals-text-medium, color-mix(in srgb, var(--mq-text-primary, #0a0a23) 64%, transparent))"),brand:a("var(--mq-text-brand, var(--color-primary, #4a1ea7))"),highlight:a("var(--mq-surface-surface-raised, var(--color-muted, #f8f7fa))"),focus:a("var(--mq-border-focus, var(--color-primary, #4a1ea7))")},mt=i`
+  @keyframes mq-popup-enter {
+    from {
+      opacity: 0;
+      transform: translate(var(--_slide-x, 0), var(--_slide-y, 0)) scale(0.95);
+    }
+  }
+
+  @keyframes mq-popup-exit {
+    to {
+      opacity: 0;
+      transform: scale(0.95);
+    }
+  }
+`,vt="0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",gt={height:"2.5rem",radius:re.lg,minWidth:"9rem",shadow:vt,animationDuration:ae.duration[150]},bt=(e,t)=>a(`var(--select-${e}, ${t})`),ft=bt("height",gt.height),yt=bt("radius",gt.radius),wt=a(`max(0px, calc(${yt} - var(--mq-spacing-1, 0.25rem)))`),xt=bt("min-width",gt.minWidth),kt=bt("shadow",gt.shadow),$t=bt("animation-duration",gt.animationDuration),qt=i`
+  :host {
+    display: inline-flex;
+    vertical-align: middle;
+    font-family: var(--mq-typography-family-sans, system-ui, sans-serif);
+  }
+
+  :host([hidden]) {
+    display: none;
+  }
+
+  /* The console's SelectTrigger. */
+  .trigger {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--mq-spacing-1-5, 0.375rem);
+    box-sizing: border-box;
+    width: 100%;
+    height: ${ft};
+    margin: 0;
+    padding: var(--mq-spacing-2, 0.5rem) var(--mq-spacing-3, 0.75rem);
+    border: var(--mq-size-border-default, 1px) solid ${bt("border",ut.border.cssText)};
+    border-radius: ${yt};
+    background: ${ut.surface};
+    color: ${ut.text};
+    font: inherit;
+    font-size: var(--mq-typography-size-sm, 0.875rem);
+    line-height: 1.25rem;
+    white-space: nowrap;
+    user-select: none;
+    outline: none;
+    transition: border-color var(--mq-motion-duration-150, 150ms)
+      var(--mq-motion-easing-default, cubic-bezier(0.4, 0, 0.2, 1));
+  }
+
+  .trigger:focus-visible {
+    border-color: ${ut.focus};
+  }
+
+  .trigger:disabled {
+    cursor: not-allowed;
+    opacity: 0.5;
+  }
+
+  .value {
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    pointer-events: none;
+  }
+
+  /* The console's placeholder:text-secondary never matched its button, but
+     it is plainly the intent. */
+  .trigger[data-placeholder] .value,
+  .chevron {
+    color: ${ut.textMedium};
+  }
+
+  .chevron {
+    flex-shrink: 0;
+    width: var(--mq-size-icon-sm, 1rem);
+    height: var(--mq-size-icon-sm, 1rem);
+    pointer-events: none;
+  }
+
+  /* The console's SelectContent (popper) with its p-1 viewport. Radix Select
+     has no exit animation: it closes at once. */
+  .listbox {
+    position: fixed;
+    inset: auto;
+    top: 0;
+    left: 0;
+    /* Only matters without the Popover API; the top layer ignores it. */
+    z-index: var(--mq-z-index-50, 50);
+    box-sizing: border-box;
+    min-width: max(${xt}, var(--mq-popup-anchor-width, 0px));
+    max-height: var(--mq-popup-available-height, none);
+    margin: 0;
+    overflow-x: hidden;
+    overflow-y: auto;
+    padding: var(--mq-spacing-1, 0.25rem);
+    border: var(--mq-size-border-default, 1px) solid ${ut.border};
+    border-radius: ${yt};
+    background: ${ut.surface};
+    color: ${ut.text};
+    box-shadow: ${kt};
+    font-family: var(--mq-typography-family-sans, system-ui, sans-serif);
+    outline: none;
+  }
+
+  .listbox:not([data-state]) {
+    display: none;
+  }
+
+  /* :focus-visible cannot tell: the options take focus from the mouse too. */
+  .listbox[data-keyboard] {
+    --_item-ring: ${ut.focus};
+  }
+
+  .listbox[data-side="bottom"] {
+    --_slide-y: calc(-1 * var(--mq-spacing-2, 0.5rem));
+  }
+
+  .listbox[data-side="top"] {
+    --_slide-y: var(--mq-spacing-2, 0.5rem);
+  }
+
+  .listbox[data-state="open"] {
+    animation: mq-popup-enter ${$t} ease;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .listbox[data-state="open"],
+    .trigger {
+      animation: none;
+      transition: none;
+    }
+  }
+
+  @media (forced-colors: active) {
+    .listbox {
+      border-color: CanvasText;
+    }
+  }
+`,St=i`
+  .item {
+    position: relative;
+    display: flex;
+    align-items: center;
+    gap: var(--mq-spacing-1-5, 0.375rem);
+    padding: var(--mq-spacing-1-5, 0.375rem) var(--mq-spacing-8, 2rem)
+      var(--mq-spacing-1-5, 0.375rem) var(--mq-spacing-2, 0.5rem);
+  }
+
+  :host {
+    display: block;
+    border-radius: ${wt};
+    color: ${ut.text};
+    font-size: var(--mq-typography-size-sm, 0.875rem);
+    line-height: 1.25rem;
+    cursor: default;
+    user-select: none;
+    outline: none;
+  }
+
+  :host([hidden]) {
+    display: none;
+  }
+
+  :host(:focus) {
+    background: ${ut.highlight};
+  }
+
+  /* The console only tints the background, too faint to find from the
+     keyboard: the popup sets --_item-ring while the keyboard drives it. */
+  :host(:focus) {
+    outline: 2px solid var(--_item-ring, transparent);
+    outline-offset: -2px;
+  }
+
+  :host([disabled]) {
+    pointer-events: none;
+    opacity: 0.5;
+  }
+
+  .indicator {
+    position: absolute;
+    inset-inline-end: var(--mq-spacing-2, 0.5rem);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: var(--mq-size-icon-sm, 1rem);
+    height: var(--mq-size-icon-sm, 1rem);
+    color: ${ut.brand};
+    pointer-events: none;
+  }
+
+  .indicator svg {
+    width: 100%;
+    height: 100%;
+  }
+
+  :host(:not([aria-selected="true"])) .indicator {
+    display: none;
+  }
+
+  @media (forced-colors: active) {
+    :host(:focus) {
+      outline: 2px solid Highlight;
+      outline-offset: -2px;
+    }
+
+    .indicator {
+      color: CanvasText;
+    }
+  }
+`;class MqSelectValueChangeEvent extends Event{static{this.eventName="onvaluechange"}constructor(e){super(MqSelectValueChangeEvent.eventName,{bubbles:!0,composed:!0}),this.value=e}}const Ct=["Enter"," ","ArrowDown","ArrowUp"],Et=s`<svg viewBox="0 0 16 16" fill="none" aria-hidden="true">
+  <path
+    d="M3 8L6.5 11.5L13 4.5"
+    stroke="currentColor"
+    stroke-width="1.75"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+  />
+</svg>`,Dt=s`<svg
+  class="chevron"
+  part="chevron"
+  viewBox="0 0 24 24"
+  fill="none"
+  aria-hidden="true"
+>
+  <path
+    d="M6 9L12 15L18 9"
+    stroke="currentColor"
+    stroke-width="2"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+  />
+</svg>`;let Tt=class MqSelectMenu extends n{constructor(){super(...arguments),this.value="",this.placeholder="",this.label="",this.disabled=!1,this.open=!1,this.typeahead=new le,this.stopTracking=null,this.lastPointerType="",this.observer=new MutationObserver(()=>this.requestUpdate()),this.onDocumentPointerDown=e=>{e.composedPath().includes(this)||this.closeList()},this.onFocusOut=e=>{const t=e.relatedTarget;this.open&&t&&t!==this&&!this.contains(t)&&this.closeList()},this.onTriggerPointerDown=e=>{this.lastPointerType=e.pointerType,this.listbox?.removeAttribute("data-keyboard"),"mouse"===e.pointerType&&(0!==e.button||e.ctrlKey||(e.preventDefault(),this.open?this.closeList():this.openList()))},this.onTriggerClick=e=>{0!==e.detail&&"mouse"===this.lastPointerType||(this.open?this.closeList():this.openList())},this.onTriggerKeyDown=e=>{this.listbox?.toggleAttribute("data-keyboard",!0)," "===e.key&&this.typeahead.active?(e.preventDefault(),this.selectByTypeahead(e.key)):Ct.includes(e.key)?(e.preventDefault(),this.openList()):de(e)&&this.selectByTypeahead(e.key)},this.onListKeyDown=e=>{this.listbox?.toggleAttribute("data-keyboard",!0);const t=this.enabledOptions,i=t.find(e=>e.matches(":focus"));"Escape"===e.key?(e.preventDefault(),this.closeList()):"Tab"===e.key?this.closeList():ce(e.key)?(e.preventDefault(),he(e.key,t,i)?.focus()):i&&("Enter"===e.key||" "===e.key&&!this.typeahead.active)?(e.preventDefault(),this.choose(i)):de(e)&&(" "===e.key&&e.preventDefault(),this.typeahead.match(e.key,t,i)?.focus())},this.onListClick=e=>{const t=e.composedPath().find(e=>e instanceof zt);t&&!t.disabled&&this.choose(t)},this.onListPointerMove=e=>{const t=this.listbox;if("mouse"!==e.pointerType||!t)return;t.removeAttribute("data-keyboard");const i=e.composedPath().find(e=>e instanceof zt),o=i&&!i.disabled?i:t;o.matches(":focus")||o.focus({preventScroll:!0})},this.onListPointerLeave=e=>{const t=this.listbox;"mouse"===e.pointerType&&t&&this.open&&(t.matches(":focus")||t.focus({preventScroll:!0}))}}static{this.styles=[mt,qt]}get trigger(){return this.renderRoot.querySelector(".trigger")}get listbox(){return this.renderRoot.querySelector(".listbox")}get options(){return Array.from(this.querySelectorAll(":scope > mq-select-item"))}get enabledOptions(){return this.options.filter(e=>!e.disabled)}get selected(){return this.options.find(e=>e.value===this.value)}connectedCallback(){super.connectedCallback(),this.observer.observe(this,{childList:!0,subtree:!0,characterData:!0,attributes:!0,attributeFilter:["value"]}),this.addEventListener("focusout",this.onFocusOut)}disconnectedCallback(){this.observer.disconnect(),this.removeEventListener("focusout",this.onFocusOut),this.closeList(),super.disconnectedCallback()}updated(){for(const e of this.options)e.setAttribute("aria-selected",String(e.value===this.value));this.disabled&&this.closeList()}openList(){const e=this.trigger,t=this.listbox;if(this.open||this.disabled||!e||!t)return;this.open=!0,t.dataset.side="bottom",t.dataset.state="open",pe(t);const{placed:i,stop:o}=ue(e,t,{side:"bottom",align:"start",sideOffset:4});this.stopTracking=o,document.addEventListener("pointerdown",this.onDocumentPointerDown,!0),i.then(()=>{if(!this.open)return;const e=this.enabledOptions;(e.find(e=>e.value===this.value)??e[0]??t).focus()})}closeList(){if(!this.open)return;this.open=!1,document.removeEventListener("pointerdown",this.onDocumentPointerDown,!0),this.typeahead.reset(),me(this)&&this.trigger?.focus(),this.stopTracking?.(),this.stopTracking=null;const e=this.listbox;e&&(delete e.dataset.state,ve(e))}setValue(e){e!==this.value&&(this.value=e,this.dispatchEvent(new MqSelectValueChangeEvent(e)))}choose(e){this.setValue(e.value),this.closeList()}selectByTypeahead(e){const t=this.typeahead.match(e,this.enabledOptions,this.selected);t&&this.setValue(t.value)}render(){const e=this.selected?.textContent?.trim()??"";return s`
+      <button
+        class="trigger"
+        part="trigger"
+        type="button"
+        role="combobox"
+        aria-label=${this.label||o}
+        aria-haspopup="listbox"
+        aria-expanded=${String(this.open)}
+        aria-controls="listbox"
+        aria-autocomplete="none"
+        data-state=${this.open?"open":"closed"}
+        ?data-placeholder=${!e}
+        ?disabled=${this.disabled}
+        @pointerdown=${this.onTriggerPointerDown}
+        @click=${this.onTriggerClick}
+        @keydown=${this.onTriggerKeyDown}
+      >
+        <span class="value" part="value">${e||this.placeholder}</span>
+        ${Dt}
+      </button>
+      <div
+        id="listbox"
+        class="listbox"
+        part="listbox"
+        role="listbox"
+        popover="manual"
+        tabindex="-1"
+        aria-label=${this.label||o}
+        @keydown=${this.onListKeyDown}
+        @click=${this.onListClick}
+        @pointermove=${this.onListPointerMove}
+        @pointerleave=${this.onListPointerLeave}
+      >
+        <slot></slot>
+      </div>
+    `}};se([l({type:String,reflect:!0})],Tt.prototype,"value",void 0),se([l({type:String})],Tt.prototype,"placeholder",void 0),se([l({type:String})],Tt.prototype,"label",void 0),se([l({type:Boolean,reflect:!0})],Tt.prototype,"disabled",void 0),se([S()],Tt.prototype,"open",void 0),Tt=se([ne("mq-select-menu")],Tt);let zt=class MqSelectItem extends n{constructor(){super(...arguments),this.value="",this.disabled=!1}static{this.styles=[St]}connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","option"),this.hasAttribute("tabindex")||(this.tabIndex=-1)}updated(){this.disabled?this.setAttribute("aria-disabled","true"):this.removeAttribute("aria-disabled")}render(){return s`<div class="item" part="item">
+      <span class="indicator" part="indicator">${Et}</span><slot></slot>
+    </div>`}};se([l({type:String,reflect:!0})],zt.prototype,"value",void 0),se([l({type:Boolean,reflect:!0})],zt.prototype,"disabled",void 0),zt=se([ne("mq-select-item")],zt);const It=i`:host{display:grid;width:min(100%,520px);font-family:var(--font-body);font-size:var(--text-sm);line-height:1.35;color:var(--color-text-icons--secondary)}.text{display:grid}h1{margin:0;font-family:var(--font-titles);font-size:var(--text-xl);font-weight:var(--font-weight-normal);line-height:1.2;color:var(--color-text-icons--primary)}p{margin:0}@media (min-width:768px){h1{font-size:var(--text-2xl)}}`;let Ot=class PermissionPromptView extends n{constructor(){super(...arguments),this.requesting=!1}static{this.styles=[It,i`:host{gap:var(--sp-5)}.icons{display:flex;gap:var(--sp-3)}.icon{display:grid;place-items:center;width:var(--size-12);height:var(--size-12);border-radius:var(--border-radius-lg);background-color:var(--color-primary-light);color:var(--color-primary)}.text{gap:var(--sp-4)}`]}render(){return s`<div class="icons"><span class="icon">${te()}</span> <span class="icon">${X()}</span></div><div class="text"><h1>${I("Se necesita acceso a la cámara y el micrófono para continuar")}</h1><p>${I("Es necesario que tu médico pueda verte y escucharte correctamente")}</p></div><mq-button fullwidth aria-busy="${this.requesting?"true":"false"}" @click="${()=>{this.requesting||this.dispatchEvent(new RequestPermissionsEvent)}}">${this.requesting?ee({size:20}):o} ${I("Solicitar permisos")}</mq-button>`}};e([l({type:Boolean})],Ot.prototype,"requesting",void 0),Ot=e([A(),t("permission-prompt-view")],Ot);let At=class PermissionsRequiredErrorView extends n{static{this.styles=[It,i`:host{gap:var(--sp-7)}.text{gap:var(--sp-2)}ol{display:grid;gap:var(--sp-3);margin:0;padding:0;list-style:none}li{display:flex;align-items:center;gap:var(--sp-2)}.step{display:grid;place-items:center;flex-shrink:0;width:var(--size-8);height:var(--size-8);border-radius:var(--border-radius-full);background-color:var(--color-primary-light);color:var(--color-primary)}`]}render(){const e=[[xe,I("Abre los ajustes de tu navegador")],[ye,I("Concede los permisos de cámara y micrófono")],[we,I("Recarga la página")]];return s`<div class="text"><h1>${I("Este servicio requiere permisos de cámara y micrófono")}</h1><p>${I("Has denegado los permisos de cámara y micrófono de tu dispositivo. Por favor, sigue la guía de tu navegador para activarlos.")}</p></div><ol>${e.map(([e,t])=>s`<li><span class="step">${e({size:16})}</span>${t}</li>`)}</ol><mq-button fullwidth @click="${()=>location.reload()}">${I("Recargar la página")}</mq-button>`}};At=e([A(),t("permissions-required-error-view")],At);let Mt=class DeviceCheck extends n{constructor(){super(...arguments),this.devices=new DevicesController(this),this.network=new NetworkTestController(this),this.networkStarted=!1}static{this.styles=[i`:host{display:block;height:100%;color:var(--color-text-icons--primary);font-family:var(--font-body)}.centered{box-sizing:border-box;display:grid;place-items:center;height:100%;min-height:var(--mq-container-min-height)}.page{box-sizing:border-box;display:grid;gap:var(--sp-4);align-content:center;min-height:100%;max-width:calc(1124px + 2 * var(--sp-6));margin:0 auto;padding:0 0 calc(var(--sp-32) + var(--mq-safe-bottom,0px))}h1,h2,p,ul{margin:0;padding:0}.title{display:grid;gap:var(--sp-2)}h1{font-family:var(--font-titles);font-size:var(--text-xl);font-weight:var(--font-weight-normal);line-height:1.2}.field-label,.note,.specialty,.subtitle{font-size:var(--text-sm);line-height:1.35;color:var(--color-text-icons--secondary)}.columns,.preview,.side{display:grid;gap:var(--sp-4);align-content:start}.preview{grid-template-columns:minmax(0,1fr)}.stage{position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:var(--size-3);background-color:var(--color-primary-dark)}video{display:block;width:100%;height:100%;object-fit:cover}.fill{position:absolute;inset:0}.appear,.camera-off,video{animation:appear .3s cubic-bezier(.23,1,.32,1)}@keyframes appear{from{opacity:0}}@media (prefers-reduced-motion:reduce){.appear,.camera-off,video{animation:none}}.camera-off{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);color:var(--color-gray-light);font-size:var(--text-xs);line-height:1.35}.camera-off mq-avatar{width:var(--size-10);height:var(--size-10);--mq-avatar-bg:var(--color-primary-light);--mq-avatar-color:var(--color-primary);--mq-avatar-font-size:var(--text-base)}.controls{position:absolute;right:0;bottom:var(--sp-4);left:0;display:flex;justify-content:center;gap:var(--sp-4)}.toggle{display:grid;place-items:center;width:var(--size-11);height:var(--size-11);padding:0;border:none;border-radius:var(--border-radius-xl);background-color:var(--color-white);color:var(--color-primary);cursor:pointer}.toggle:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}.toggle.off{background-color:var(--color-negative-dark);color:var(--color-white)}.toggle.mic{box-shadow:0 0 0 calc(var(--level,0) * 8px) color-mix(in srgb,var(--color-white) 45%,transparent);transition:box-shadow .1s linear}.selects{display:flex;gap:var(--sp-3)}.field{display:grid;grid-template-columns:minmax(0,1fr);flex:1 1 0;gap:calc(var(--spacing-unit) * 1.5);min-width:0}.control{position:relative;display:flex}.control>svg{position:absolute;top:50%;left:var(--sp-3);z-index:1;transform:translateY(-50%);pointer-events:none}mq-select-menu{flex:1;min-width:0;--select-radius:var(--border-radius-md)}mq-select-menu::part(trigger){padding-left:var(--sp-9);color:var(--color-text-icons--primary)}mq-select-item svg{flex-shrink:0;color:var(--color-text-icons--secondary)}.card{display:grid;gap:var(--sp-4);padding:var(--sp-4);border:1px solid var(--color-border-subtle);border-radius:var(--size-3);background-color:var(--color-card)}.doctor{display:flex;align-items:center;gap:var(--sp-4);min-width:0}.doctor mq-avatar{flex-shrink:0;width:var(--size-10);height:var(--size-10);border:1px solid var(--color-border-subtle)}.identity{display:grid;gap:var(--sp-0_5);min-width:0}.name{font-size:var(--text-base);font-weight:var(--font-weight-medium);line-height:1.5}.details{display:grid;gap:var(--sp-2);list-style:none}.details li{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--text-sm);font-weight:var(--font-weight-medium);line-height:1.35}.details svg{flex-shrink:0}.date::first-letter{text-transform:uppercase}mq-callout{overflow:hidden;border-radius:var(--border-radius-lg);--mq-callout-padding:var(--sp-4)}.notice{display:grid;justify-items:start;gap:var(--sp-1);font-size:var(--text-sm);line-height:1.35}.notice strong{font-weight:var(--font-weight-medium)}.check{display:flex;align-items:flex-start;gap:calc(var(--spacing-unit) * 1.5);font-size:var(--text-sm);line-height:1.35;color:var(--color-text-icons--secondary)}.check>svg{flex-shrink:0;margin-top:calc((1.35em - 16px)/ 2)}.check mq-text-button{margin-left:var(--sp-2)}.check.success{color:var(--color-feedback--success-text)}.check.warning{color:var(--color-feedback--warning-text)}.check.error{color:var(--color-negative-dark)}mq-text-button{font-weight:var(--font-weight-normal)}.status.desktop{display:none}@media (min-width:768px){.centered{padding:var(--sp-6)}.page{gap:var(--sp-6);padding:var(--sp-10) var(--sp-6)}h1{font-size:var(--text-2xl)}.columns{grid-template-columns:minmax(0,1fr) minmax(280px,380px);gap:var(--sp-6)}.stage{aspect-ratio:16/9;border-radius:var(--border-radius-xl)}.flip{display:none}.card{gap:var(--sp-5);padding:var(--sp-6)}.doctor mq-avatar{width:var(--size-14);height:var(--size-14)}.status.desktop{display:block}.status.mobile{display:none}}@media (max-width:767px){.camera-field{display:none}.cta{position:fixed;right:0;bottom:0;left:0;z-index:10;padding:var(--sp-3) var(--sp-6) calc(var(--sp-4) + var(--mq-safe-bottom,0px));background-color:var(--color-card);border-top:1px solid var(--color-border-subtle)}.status.mobile:not(:empty){margin-bottom:var(--sp-3)}}`]}updated(){const{permission:e,audioTrack:t,videoStream:i}=this.devices;"granted"!==e&&"denied"!==e||e===this.reportedPermission||(this.reportedPermission=e,this.dispatchEvent(new DevicesPermissionEvent("granted"===e))),this.networkStarted||"granted"!==e||(t||i)&&(this.networkStarted=!0,this.checkNetwork())}checkNetwork(){return this.network.run({api:this.apiClient,ot:this.openTokService},{audio:this.devices.audioTrack,video:this.devices.videoStream?.getTracks()[0]})}enter(){this.network.stop(),this.devices.stop(),this.dispatchEvent(new EnterWaitingRoomEvent(this.devices.selection))}renderSelect(e,t,i,o,n,r,a){const l=void 0!==a&&0===o.length;return s`<div class="field appear ${r}"><span class="field-label">${e}</span><div class="control">${t({size:16})}<mq-select-menu label="${e}" .value="${Ye(l?"none":i??o[0]?.deviceId??"")}" @onvaluechange="${e=>n(e.value)}">${l?s`<mq-select-item value="none" disabled="disabled">${a}</mq-select-item>`:o.map(e=>s`<mq-select-item value="${e.deviceId}">${t({size:16})}${e.label}</mq-select-item>`)}</mq-select-menu></div></div>`}renderFieldSkeleton(e){return s`<div class="field ${e}" aria-hidden="true"><mq-skeleton width="80px" height="16px"></mq-skeleton><mq-skeleton height="40px" border-radius="md"></mq-skeleton></div>`}openMicSelect(){const e=this.renderRoot.querySelector(".mic-field mq-select-menu");e?.scrollIntoView({block:"center"}),e?.shadowRoot?.querySelector(".trigger")?.click()}get status(){const{videoError:e,micSilent:t}=this.devices,i={label:I("Reintentar"),run:()=>this.devices.startVideo(this.devices.videoDeviceId)};if("busy"===e)return{tone:"error",line:I("Cámara ocupada"),action:i,banner:{title:I("Otra aplicación está usando tu cámara"),body:I("Cierra Teams, Zoom u otras apps con vídeo y pulsa Reintentar. También puedes entrar sin cámara."),action:i}};if(t)return{tone:"warning",line:I("Micrófono sin sonido"),action:{label:I("Cambiar micrófono"),run:()=>this.openMicSelect()},banner:{title:I("No detectamos sonido en tu micrófono"),body:I("Comprueba que no esté silenciado o elige otro micrófono en la lista. Puedes entrar igualmente.")}};if("denied"===e){const e=I("Has bloqueado la cámara");return{tone:"warning",line:e,banner:{title:e,body:I("Actívala en los ajustes de tu navegador o entra solo con audio.")}}}if("not-found"===e)return{tone:"neutral",line:I("Sin cámara · solo audio"),banner:{title:I("No encontramos ninguna cámara"),body:I("Puedes hacer la consulta solo con audio. Si tienes una cámara externa, conéctala y aparecerá aquí.")}};const o={label:I("Volver a comprobar"),run:()=>this.checkNetwork()};switch(this.network.state){case"checking":return{tone:"loading",line:I("Comprobando conexión…")};case"good":return{tone:"success",line:I("Conexión buena")};case"slow":return{tone:"warning",line:I("Tu conexión es lenta"),action:o,banner:{title:I("Tu conexión es lenta"),body:I("La imagen puede ir a saltos. Busca un sitio con mejor cobertura o cambia de red. Si empeora, seguiremos solo con audio."),action:o}};case"limited":return{tone:"neutral",line:I("Demasiadas comprobaciones seguidas. Inténtalo de nuevo en unos minutos."),action:o};default:return}}renderAction({label:e,run:t}){return s`<mq-text-button size="sm" underlined @click="${t}">${e}</mq-text-button>`}renderCheck({tone:e,line:t,action:i}){const n={loading:ee({size:16,color:"currentColor"}),success:Y({size:16}),warning:H({size:16}),error:H({size:16}),neutral:Z({size:16})}[e];return s`<div class="check ${e}">${n}<span>${t}${i?this.renderAction(i):o}</span></div>`}renderStatusDesktop(e){const{banner:t,tone:i}=e;if(!t)return this.renderCheck(e);const n="error"===i||"warning"===i?i:"info";return s`<mq-callout variant="${n}" background="${"info"===n?"primary":"default"}"><div class="notice"><strong>${t.title}</strong><p>${t.body}</p>${t.action?this.renderAction(t.action):o}</div></mq-callout>`}render(){const e=this.devices;if("prompt"===e.permission||"requesting"===e.permission)return s`<div class="centered"><permission-prompt-view ?requesting="${"requesting"===e.permission}" @request-permissions="${()=>e.start()}"></permission-prompt-view></div>`;if("denied"===e.permission)return s`<div class="centered"><permissions-required-error-view></permissions-required-error-view></div>`;const t="checking"===e.permission,i=t?void 0:this.status;return s`<div class="page"><div class="title"><h1>${I("Comprueba tu cámara y micrófono")}</h1><p class="subtitle">${I("Antes de entrar, asegúrate de que tu médico podrá verte y oírte bien.")}</p></div><div class="columns"><div class="preview"><div class="stage">${t?s`<mq-skeleton class="fill" height="100%" border-radius="none"></mq-skeleton>`:e.videoStream?s`<video autoplay muted playsinline .srcObject="${Ke([e.videoStream],()=>e.videoStream??null)}"></video>`:s`<div class="camera-off"><mq-avatar fallback="${this.loginToken.patient.name}"></mq-avatar>${"not-found"===e.videoError?I("Sin cámara"):I("Cámara apagada")}</div>`} ${t?o:this.renderControls()}</div><div class="selects">${t?s`${this.renderFieldSkeleton("mic-field")} ${this.renderFieldSkeleton("speaker-field")} ${this.renderFieldSkeleton("camera-field")}`:s`${this.renderSelect(I("Micrófono"),X,e.audioDeviceId,e.audioInputs,t=>e.selectAudio(t),"mic-field")} ${e.canPickSpeaker?this.renderSelect(I("Altavoz"),oe,e.speakerId,e.audioOutputs,t=>e.selectSpeaker(t),"speaker-field"):o} ${this.renderSelect(I("Cámara"),te,e.videoDeviceId,e.videoInputs,t=>e.selectVideo(t),"camera-field",I("No hay cámaras"))}`}</div></div><div class="side">${this.renderAppointment(i)}<div class="status desktop" role="status" aria-live="polite">${i?this.renderStatusDesktop(i):o}</div></div></div></div>`}renderControls(){const e=this.devices;return s`<div class="controls appear"><button type="button" class="toggle mic ${e.audioOn?"":"off"}" style="${F({"--level":String(e.level)})}" aria-label="${I("Micrófono")}" aria-pressed="${e.audioOn?"true":"false"}" @click="${()=>e.toggleAudio()}">${e.audioOn?X({size:20}):J({size:20})}</button> ${"not-found"===e.videoError?o:s`<button type="button" class="toggle ${e.videoOn?"":"off"}" aria-label="${I("Cámara")}" aria-pressed="${e.videoOn?"true":"false"}" @click="${()=>e.toggleVideo()}">${e.videoOn?te({size:20}):ie({size:20})}</button>`} ${e.videoInputs.length>1&&!e.videoError?s`<button type="button" class="toggle flip" aria-label="${I("Cambiar de cámara")}" @click="${()=>e.flipCamera()}">${Q({size:20})}</button>`:o}</div>`}renderAppointment(e){const{from:t,start_date:i}=this.appointment,n=E(this.loginToken.patient.timezone),r=n?{timeZone:n}:{},a=B().replace("_","-"),l=D(i),d=new Intl.DateTimeFormat(a,{weekday:"long",day:"numeric",month:"long",year:"numeric",...r}).format(l),c=new Intl.DateTimeFormat(a,{timeStyle:"short",hourCycle:"h23",...r}).format(l);return s`<article class="card"><div class="doctor"><mq-avatar src="${t.avatar??""}" fallback="${t.name??""}" alt="${t.name??""}"></mq-avatar><div class="identity"><h2 class="name">${t.name}</h2><p class="specialty">${t.speciality}</p></div></div><ul class="details"><li>${K({size:20})}<span class="date">${d}</span></li><li>${G({size:20})}${I(O`${c} h`)}</li><li>${te({size:20})}${I("Videoconsulta")}</li></ul><p class="note">${I("Al entrar, avisaremos a tu médico de que estás listo.")}</p><div class="cta"><div class="status mobile" role="status" aria-live="polite">${e?this.renderCheck(e):o}</div><mq-button fullwidth @click="${()=>this.enter()}">${I("Entrar a la sala de espera")}</mq-button></div></article>`}};e([l({type:Object})],Mt.prototype,"appointment",void 0),e([c({context:u})],Mt.prototype,"loginToken",void 0),e([c({context:p,subscribe:!0})],Mt.prototype,"apiClient",void 0),e([c({context:Le})],Mt.prototype,"openTokService",void 0),Mt=e([A(),t("device-check")],Mt);let Lt=class DeviceCheckSkeleton extends n{static{this.styles=i`:host{display:block;height:100%}.page{box-sizing:border-box;display:grid;gap:var(--sp-4);align-content:center;min-height:100%;max-width:calc(1124px + 2 * var(--sp-6));margin:0 auto;padding:0 0 calc(var(--sp-32) + var(--mq-safe-bottom,0px))}.columns,.preview,.side,.title{display:grid;gap:var(--sp-4);align-content:start;grid-template-columns:minmax(0,1fr)}.title{gap:var(--sp-2)}.stage{position:relative;box-sizing:border-box;display:grid;align-items:end;justify-content:center;aspect-ratio:3/4;padding-bottom:var(--sp-4);border-radius:var(--size-3);overflow:hidden}.stage>mq-skeleton{position:absolute;inset:0}.toggles{position:relative;display:flex;gap:var(--sp-4)}.toggles span{width:var(--size-11);height:var(--size-11);border-radius:var(--border-radius-xl);background-color:var(--color-white)}.selects{display:flex;gap:var(--sp-3)}.field{display:grid;flex:1 1 0;gap:var(--sp-2);min-width:0}.field.camera{display:none}.card{display:grid;gap:var(--sp-4);padding:var(--sp-4);border:1px solid var(--color-border-subtle);border-radius:var(--size-3);background-color:var(--color-card)}.doctor{display:flex;align-items:center;gap:var(--sp-3)}.doctor div{display:grid;flex:1;gap:var(--sp-2)}@media (min-width:768px){.page{gap:var(--sp-6);padding:var(--sp-10) var(--sp-6)}.columns{grid-template-columns:minmax(0,1fr) minmax(280px,380px);gap:var(--sp-6)}.stage{aspect-ratio:16/9;border-radius:var(--border-radius-xl)}.field.camera{display:grid}.card{gap:var(--sp-5);padding:var(--sp-6)}}`}field(e=""){return s`<div class="field ${e}"><mq-skeleton width="80px" height="16px"></mq-skeleton><mq-skeleton height="40px" border-radius="md"></mq-skeleton></div>`}render(){return s`<div class="page" aria-busy="true"><div class="title"><mq-skeleton width="min(320px, 80%)" height="28px" border-radius="md"></mq-skeleton><mq-skeleton width="min(440px, 100%)" height="16px"></mq-skeleton></div><div class="columns"><div class="preview"><div class="stage"><mq-skeleton height="100%" border-radius="none"></mq-skeleton><div class="toggles"><span></span><span></span></div></div><div class="selects">${this.field()} ${this.field()} ${this.field("camera")}</div></div><div class="side"><div class="card"><div class="doctor"><mq-skeleton width="56px" height="56px" border-radius="full"></mq-skeleton><div><mq-skeleton width="70%" height="18px"></mq-skeleton><mq-skeleton width="45%" height="14px"></mq-skeleton></div></div><mq-skeleton width="80%" height="16px"></mq-skeleton><mq-skeleton width="40%" height="16px"></mq-skeleton><mq-skeleton width="55%" height="16px"></mq-skeleton><mq-skeleton height="40px" border-radius="md"></mq-skeleton></div></div></div></div>`}};Lt=e([t("device-check-skeleton")],Lt);let Rt=class NotTimeYetView extends n{static{this.styles=[i`mq-page-title{margin-bottom:var(--size-3)}.description{font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm--line-height);color:var(--color-neutrals-text-default);font-weight:var(--font-weight-normal);margin:0;margin-bottom:var(--size-3)}.details-card{background-color:var(--color-background);border-radius:var(--border-radius-xl);padding:var(--size-6) var(--size-4);display:flex;min-width:0;flex-direction:column;gap:var(--size-6);margin-bottom:var(--size-6)}.details-card-title{padding:14px 0;font-size:var(--text-base);line-height:100%;font-weight:var(--font-weight-medium);color:var(--color-gray-darker);text-align:left}.details-rows{display:flex;flex-direction:column;gap:var(--size-3)}.details-row{display:flex;align-items:center;gap:var(--size-2);font-family:var(--font-body);font-size:var(--text-base);line-height:var(--text-base--line-height);color:var(--color-neutrals-text-default);font-weight:var(--font-weight-semibold)}.details-row span::first-letter{text-transform:uppercase}@media (min-width:768px){.description{font-size:var(--text-base);line-height:var(--text-base--line-height);margin-bottom:var(--sp-6)}}`]}firstUpdated(){m.track(v(this.loginToken.patient.hash,this.appointment.id??""))}render(){const e=B()?.replace("_","-")??"es-ES",t=E(this.loginToken.patient.timezone),i=new Intl.DateTimeFormat(e,{dateStyle:"full",...t?{timeZone:t}:{}}),n=new Intl.DateTimeFormat(e,{timeStyle:"short",...t?{timeZone:t}:{}}),r=D(this.appointment.start_date),a=ke(r,this.appointment.duration),l=t?T(t,r):"";return s`<mq-page-title .title="${I("¡Aún no es la hora!")}" back-label="${I("Salir")}" @mq-back="${e=>{e.stopPropagation(),this.dispatchEvent(new $e({tab:"next"}))}}"></mq-page-title><p class="description">${I("Cuando falten 10 minutos para tu consulta, podrás acceder a la videoconsulta")}</p><div class="details-card"><professional-overview .name="${this.appointment.from.name??""}" .specialtyName="${this.appointment.from.speciality??""}" .collegiateNumber="${this.appointment.from.collegiate_number??void 0}" .description="${this.appointment.from.description??""}" .languages="${this.appointment.from.languages}" .avatar="${this.appointment.from.avatar??""}"></professional-overview><div class="details-rows"><div class="details-row">${K({size:24})} <span>${i.format(r)}</span></div><div class="details-row">${G({size:24})} <span>${n.format(r)} - ${n.format(a)}${l?` (${l})`:""}</span></div></div></div>${!0===this.appointment.has_chat_in_appointment?s`<chat-cta .consultationId="${this.appointment.id}" .roomId="${Number(this.appointment.room_id)}" .professionalHash="${this.appointment.from.hash}" .text="${I("Utiliza el chat para enviar el motivo de consulta, documentos o imágenes")}" .onOpenChat="${()=>{m.track(g(this.loginToken.patient.hash,this.appointment.id??""))}}"></chat-cta>`:o}`}};e([l({type:Object})],Rt.prototype,"appointment",void 0),e([c({context:u})],Rt.prototype,"loginToken",void 0),Rt=e([A(),t("not-time-yet-view")],Rt);let Vt=class FlashStatusBanner extends n{constructor(){super(...arguments),this.state="inRoom",this.professionalName=""}static{this.styles=i`:host{display:block}.banner{display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-4) var(--sp-4) 14px;border:1px solid var(--color-border-subtle);border-radius:var(--size-4);background-color:var(--color-card);color:var(--color-text-icons--primary);font-family:var(--font-body);transition:border-color .4s}.banner.longDelay{border-color:color-mix(in srgb,var(--color-feedback--warning-text) 40%,transparent)}p{margin:0}.head{display:grid;gap:var(--sp-1)}.title{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--text-base);font-weight:var(--font-weight-medium);line-height:1.3;animation:swap .45s ease}.title svg{flex-shrink:0;color:var(--color-feedback--warning-text)}.text{font-size:var(--text-sm);line-height:1.35;color:var(--color-text-icons--secondary)}.stages{display:grid;gap:6px}.row{position:relative;display:flex;justify-content:space-between;align-items:center;height:40px}.step{position:relative;z-index:1;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background-color:var(--color-primary);color:var(--color-white);box-shadow:0 0 0 5px var(--color-card)}.step.told{animation:pop .35s .55s cubic-bezier(.3,1.6,.5,1) both}.line{position:absolute;top:50%;height:3px;margin-top:-1.5px;border-radius:3px}.line.done{left:11px;right:calc(50% + 9px);background-color:var(--color-primary);transform-origin:left center;animation:draw .7s cubic-bezier(.2,.7,.2,1) both}.line.go{left:calc(50% - 9px);right:20px;overflow:hidden;background-color:var(--color-primary-light)}.line.go::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:40%;border-radius:3px;background:linear-gradient(90deg,transparent,var(--color-primary));animation:comet 2.4s cubic-bezier(.45,0,.25,1) .9s infinite}.doctor{position:relative;z-index:1;width:40px;height:40px}.doctor mq-avatar{position:relative;z-index:1;width:40px;height:40px;border-radius:50%;box-shadow:0 0 0 2px var(--color-card),0 0 0 4px var(--color-primary)}.doctor::after,.doctor::before{content:"";position:absolute;inset:-2px;border:2px solid var(--color-primary);border-radius:50%;opacity:0;animation:ring 2.4s ease-out 2.5s infinite}.doctor::after{animation-delay:2.75s}.labels{display:grid;grid-template-columns:1fr auto 1fr;align-items:baseline;font-size:var(--text-xs);line-height:1.35;color:var(--color-text-icons--secondary);white-space:nowrap}.labels .told{justify-self:center;transform:translateX(-9px)}.labels .name{justify-self:end;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;color:var(--color-text-icons--primary);font-weight:var(--font-weight-medium)}@media (min-width:768px){.banner{gap:18px;padding:20px 22px 18px}.title{font-size:var(--text-lg)}}@media (prefers-reduced-motion:reduce){.doctor::after,.doctor::before,.line.done,.line.go::after,.step.told,.title{animation:none}}@keyframes swap{from{opacity:0;transform:translateY(4px)}}@keyframes draw{from{transform:scaleX(0)}}@keyframes pop{from{transform:scale(0)}}@keyframes comet{0%{left:-40%}100%,68%{left:100%}}@keyframes ring{0%{transform:scale(1);opacity:.55}100%,55%{transform:scale(1.6);opacity:0}}`}content(){const e=I("No cierres ni recargues la página: la llamada empezará sola.");switch(this.state){case"inRoom":return[I("Tu médico ya sabe que estás aquí"),e];case"delay":return[I("Tu médico va con un poco de retraso"),e];case"longDelay":return[I("Tu médico va con retraso"),`${I("Sentimos la espera.")} ${e}`]}}render(){const[e,t]=this.content(),i=this.professionalName;return s`<div class="banner ${this.state}"><div class="head" role="status" aria-live="polite" aria-atomic="true">${qe(this.state,s`<p class="title">${"longDelay"===this.state?G({size:18}):o}${e}</p>`)}<p class="text">${t}</p></div><div class="stages" role="img" aria-label="${I(O`Conectado y médico avisado. Esperando a que ${i} entre`)}"><div class="row"><span class="line done"></span> <span class="line go"></span> <span class="step">${ye({size:13})}</span> <span class="step told">${ye({size:13})}</span> <span class="doctor"><mq-avatar src="${this.professionalAvatar??""}" fallback="${i}" size="sm"></mq-avatar></span></div><div class="labels"><span>${I("Conectado")}</span> <span class="told">${I("Médico avisado")}</span> <span class="name">${i}</span></div></div></div>`}};e([l({type:String})],Vt.prototype,"state",void 0),e([l({type:String})],Vt.prototype,"professionalName",void 0),e([l({type:String})],Vt.prototype,"professionalAvatar",void 0),Vt=e([A(),t("flash-status-banner")],Vt);let Pt=class WaitingRoomLayout extends n{constructor(){super(...arguments),this.isWaitingRoom=!1,this.doctorIn=!1,this.now=Date.now()}static{this.styles=i`:host{display:block;height:100%}.content{display:flex;flex-direction:column;justify-content:center;gap:var(--sp-4);box-sizing:border-box;min-height:100%;max-width:720px;margin:0 auto;padding:0;font-family:var(--font-body)}header{position:relative;display:grid;gap:var(--sp-2)}.chat-line,header{text-align:center}.exit{position:absolute;top:0;left:0}h1{margin:0;font-family:var(--font-titles);font-size:var(--text-xl);font-weight:var(--font-weight-normal);line-height:1.2;color:var(--color-text-icons--primary)}.chat-line,header p{margin:0;font-size:var(--text-sm);line-height:1.35;color:var(--color-text-icons--secondary)}.video-container{position:relative;aspect-ratio:3/4;border-radius:12px;overflow:hidden}@media (min-width:768px){.content{gap:var(--sp-5);padding:var(--sp-6) 0}h1{font-size:var(--text-2xl)}.video-container{aspect-ratio:16/9;border-radius:var(--border-radius-xl)}}`}connectedCallback(){super.connectedCallback(),this.timer=setInterval(()=>{this.isWaitingRoom&&(this.now=Date.now())},1e4)}disconnectedCallback(){clearInterval(this.timer),super.disconnectedCallback()}firstUpdated(){this.isWaitingRoom&&m.track(b(this.loginToken.patient.hash,this.appointment.id??""))}render(){if(!this.isWaitingRoom)return s`<slot></slot>`;const e=B()?.replace("_","-")??"es-ES",t=E(this.loginToken.patient.timezone),i=t?{timeZone:t}:{},n=D(this.appointment.start_date),r=new Intl.DateTimeFormat(e,{day:"2-digit",month:"2-digit",year:"numeric",...i}).format(n),a=new Intl.DateTimeFormat(e,{hour:"2-digit",minute:"2-digit",hourCycle:"h23",...i}).format(n);return s`<div class="content"><header><mq-button class="exit" kind="circular" variant="light-filled" size="icon-md" aria-label="${I("Salir")}" @click="${()=>this.dispatchEvent(new $e({tab:"next"}))}">${Se({color:"var(--color-primary)",size:24})}</mq-button><h1>${I("Sala de espera")}</h1><p>${this.appointment.from.name}<br>${I(O`${r} - ${a}h`)}</p></header><div class="video-container"><slot></slot></div><flash-status-banner .state="${((e,t,i)=>{const o=t-e;return i||o<3e5?"inRoom":o<9e5?"delay":"longDelay"})(n.getTime(),this.now,this.doctorIn)}" .professionalName="${this.appointment.from.name??""}" .professionalAvatar="${this.appointment.from.avatar??void 0}"></flash-status-banner>${!0===this.appointment.has_chat_in_appointment?s`<p class="chat-line">${I("Mientras esperas, puedes contarle el motivo de tu consulta por chat.")}${" "}<mq-text-button size="sm" .fontWeight="${"normal"}" @click="${()=>this.dispatchEvent(new OpenChatEvent)}">${I("Abrir chat")}</mq-text-button></p>`:o}</div>`}};e([l({type:Object})],Pt.prototype,"appointment",void 0),e([l({type:Boolean,attribute:"is-waiting-room"})],Pt.prototype,"isWaitingRoom",void 0),e([l({type:Boolean,attribute:"doctor-in"})],Pt.prototype,"doctorIn",void 0),e([c({context:u})],Pt.prototype,"loginToken",void 0),e([S()],Pt.prototype,"now",void 0),Pt=e([A(),t("waiting-room-layout")],Pt);class AppointmentCounterController{constructor(e,t){this.startsAtGetter=t,this.formattedTime="--:--",this.interval=null,this.host=e,e.addController(this)}async hostConnected(){this.interval=setInterval(()=>{const e=new Date,t=this.startsAtGetter(),i=e.getTime()-t.getTime(),o=Math.floor(i/1e3),s=Math.floor(o/60),n=o%60;this.formattedTime=`${s}:${n.toString().padStart(2,"0")}`,this.host.requestUpdate()},1e3)}hostDisconnected(){this.interval&&clearInterval(this.interval)}}const _t={micDisconnected:()=>I("Micrófono conectado"),micSilent:()=>I("Micrófono funcionando"),camDisconnected:()=>I("Cámara conectada")};class PublisherHealthController{constructor(e){this.host=e,this.audioInputs=[],this.videoInputs=[],this.audioOutputs=[],this.quality="good",this.history=[],this.notices=new Set,this.lost={},this.stopMeter=()=>{},this.score=0,this.speaking=!1,this.recent=[],this.statsUnstable=!1,this.warning=!1,this.onPeak=e=>{if(this.intent?.audioOn()){this.score=0,this.speaking=!1;const{silentSince:t,silent:i}=Ze(this.silentSince,e,Date.now(),0);return this.silentSince=t,this.set("micSilent",i),void this.set("talkingMuted",!1)}this.silentSince=void 0,this.score=((e,t)=>t>.05?Math.min(e+1,16):Math.max(e-.5,0))(this.score,e),this.score>=8?this.speaking=!0:this.score<=2&&(this.speaking=!1),this.set("micSilent",!1),this.set("talkingMuted",this.speaking&&!0===this.intent?.inCall())},this.onDevices=()=>{this.refresh()},e.addController(this)}get active(){return e=this.notices,[...e].sort((e,t)=>Number(rt(e))-Number(rt(t))||Number(nt.includes(e))-Number(nt.includes(t)));var e}get notice(){return this.active[0]}get connectionAlert(){return this.active.some(at)}get cameraLost(){return void 0!==this.lost.video}get audioOnly(){return this.notices.has("audioOnly")}attach(e,t){this.publisher=e,this.intent=t,e.on("streamCreated",()=>{this.publishedAt=Date.now()}),e.on("mediaStreamAvailable",()=>{this.videoDeviceId=e.getVideoSource().deviceId??void 0,this.watchMic()}),e.on("audioInputDeviceChanged",({device:e})=>{this.micLabel=e.label??void 0,this.watchMic()}),e.on("mediaStopped",t=>{if(t.track)this.trackStopped(t.track);else if("visible"===document.visibilityState){t.preventDefault();for(const t of[e.getAudioSource(),e.getVideoSource().track])t&&this.trackStopped(t)}}),e.on("videoDisabled",({reason:e})=>{"quality"===e&&this.set("audioOnly",!0)}),e.on("videoEnabled",({reason:e})=>{"quality"===e&&this.set("audioOnly",!1)}),e.on("videoDisableWarning",()=>this.setWarning(!0)),e.on("videoDisableWarningLifted",()=>this.setWarning(!1)),navigator.mediaDevices?.addEventListener("devicechange",this.onDevices),navigator.permissions?.query({name:"microphone"}).then(e=>{this.micPermission=e,e.onchange=()=>{"granted"===e.state&&this.micGranted()}}).catch(()=>{}),this.timer=setInterval(()=>{this.poll()},2e3),this.refresh()}hostDisconnected(){clearInterval(this.timer),this.micPermission&&(this.micPermission.onchange=null),this.stopMeter(),navigator.mediaDevices?.removeEventListener("devicechange",this.onDevices)}async selectAudio(e){try{await(this.publisher?.setAudioSource(e))}catch(e){return void W.error("error switching the microphone",e)}this.lost.audio=void 0,this.set("micDisconnected",!1),this.watchMic()}async selectVideo(e){try{await(this.publisher?.setVideoSource(e))}catch(e){return W.error("error switching the camera",e),!1}return this.videoDeviceId=e,this.lost.video=void 0,this.set("camDisconnected",!1),!0}async flipCamera(){const e=Qe(this.videoInputs,this.videoDeviceId);try{if(e){if(!await this.selectVideo(e.deviceId))return}else{const{deviceId:e}=await(this.publisher?.cycleVideo())??{};this.videoDeviceId=e}ge.success(I("Cámara cambiada"),{duration:3e3,closeLabel:I("Cerrar")}),this.host.requestUpdate()}catch(e){W.error("error flipping the camera",e)}}set(e,t){if(this.notices.has(e)===t)return;const i=this.notice;if(t?this.notices.add(e):this.notices.delete(e),t||"micDisconnected"!==e||(this.micLabel=void 0),!t&&i===e){const t=_t[e];t&&ge.success(t(),{duration:3e3,closeLabel:I("Cerrar")})}this.host.requestUpdate()}setDoctorUnstable(e){this.set("doctorUnstable",e)}setWarning(e){this.warning=e,this.set("unstable",this.statsUnstable||this.warning)}watchMic(){this.stopMeter(),this.silentSince=void 0,this.score=0;const e=this.publisher?.getAudioSource();if(!e)return;this.audioDeviceId=e.getSettings().deviceId;const t=e.clone(),i=it(t,this.onPeak);this.stopMeter=()=>{i(),t.stop()},this.host.requestUpdate()}async trackStopped(e){const t=e.getSettings();await this.refresh();const i="audio"===e.kind?"audio":"video";Xe(t,"audio"===i?this.audioInputs:this.videoInputs)||(this.lost[i]=t,"audio"===i?this.set("micDisconnected",!0):(this.publisher?.publishVideo(!1),this.set("camDisconnected",!0)))}async micGranted(){const e=this.lost.audio;await this.refresh();const t=this.audioInputs.find(t=>e&&Xe(e,[t]))??this.audioInputs[0];t&&await this.selectAudio(t.deviceId)}async refresh(){({audioInputs:this.audioInputs,videoInputs:this.videoInputs,audioOutputs:this.audioOutputs}=await tt());const{audio:e,video:t}=this.lost;e&&Xe(e,this.audioInputs)&&(this.lost.audio=void 0,this.set("micDisconnected",!1));const i=t?this.videoInputs.find(e=>Xe(t,[e])):void 0;i&&await this.selectVideo(i.deviceId)&&this.publisher?.publishVideo(this.intent?.videoOn()??!0),this.host.requestUpdate()}async poll(){if(!this.publishedAt||Date.now()-this.publishedAt<6e3)return;let e;try{e=lt(await(this.publisher?.getRtcStatsReport())??[])}catch{return}const t=this.lastStats;if(this.lastStats=e,!t||!e)return;const i=(this.intent?.videoOn()??!0)&&!this.audioOnly&&!this.cameraLost;var o,s;this.quality=ct(dt(t,e,i)),this.history=(o=this.history,s=this.quality,[...o,s].slice(-60)),this.recent=[...this.recent,this.quality].slice(-2),this.recent.every(e=>"good"!==e)?this.statsUnstable=!0:this.recent.every(e=>"good"===e)&&(this.statsUnstable=!1),this.set("unstable",this.statsUnstable||this.warning),this.host.requestUpdate()}}const Nt="4px",jt="0.5rem",Ut="85dvh",Ft="3.75rem",Wt="1rem",Bt="1.25rem",Ht="0.625rem",Kt="500ms",Yt="cubic-bezier(0.32, 0.72, 0, 1)";const Gt=(e,t)=>a(`var(--drawer-${e}, ${t})`),Zt=Gt("underlay","rgb(0 0 0 / 0.5)"),Xt=Gt("underlay-blur",Nt),Jt=Gt("radius",jt),Qt=Gt("max-height",Ut),ei=Gt("header-height",Ft),ti=Gt("padding-inline",Wt),ii=Gt("padding-block",Bt),oi=Gt("actions-gap",Ht),si=Gt("transition-duration",Kt),ni=Gt("easing",Yt),ri=i`
+  :host {
+    display: contents;
+  }
+
+  [hidden] {
+    display: none !important;
+  }
+
+  dialog.root {
+    /* The native dialog is only the top-layer frame: the overlay and the
+       sheet inside it do the drawing. */
+    position: fixed;
+    inset: 0;
+    box-sizing: border-box;
+    width: 100%;
+    max-width: none;
+    height: 100%;
+    max-height: none;
+    margin: 0;
+    padding: 0;
+    border: none;
+    background: transparent;
+    overflow: hidden;
+    /* Not a scroll container: focus landing on the sheet while it is still
+       below the fold would scroll the frame up and make it jump. */
+    overflow: clip;
+  }
+
+  dialog.root:not([open]) {
+    display: none;
+  }
+
+  dialog.root::backdrop {
+    background: transparent;
+  }
+
+  .overlay {
+    position: absolute;
+    inset: 0;
+    background: ${Zt};
+    backdrop-filter: blur(${Xt});
+    opacity: 0;
+    touch-action: none;
+    transition: opacity ${si} ${ni};
+  }
+
+  .panel {
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    display: flex;
+    flex-direction: column;
+    box-sizing: border-box;
+    max-height: calc(${Qt} - var(--mq-safe-top, 0px));
+    padding-bottom: var(--mq-safe-bottom, env(safe-area-inset-bottom, 0px));
+    border-radius: ${Jt} ${Jt} 0 0;
+    background: var(
+      --mq-surface-surface,
+      var(--color-neutrals-background-extraWeak, #ffffff)
+    );
+    color: var(--mq-text-primary, var(--color-neutrals-text-default, #0a0a23));
+    font-family: var(--mq-typography-family-sans, var(--font-body, inherit));
+    outline: none;
+    /* The sheet takes every touch itself; only its scroll area pans natively. */
+    touch-action: none;
+    transform: translate3d(0, 100%, 0);
+    transition: transform ${si} ${ni};
+    will-change: transform;
+  }
+
+  /* Pulled up past its top, the sheet's colour carries on below it, so no
+     gap opens at the bottom edge. */
+  .panel::after {
+    content: "";
+    position: absolute;
+    top: 100%;
+    right: 0;
+    left: 0;
+    height: 100%;
+    background: inherit;
+  }
+
+  dialog.root.active .overlay {
+    opacity: 1;
+  }
+
+  dialog.root.active .panel {
+    transform: translate3d(0, 0, 0);
+  }
+
+  @media (prefers-reduced-motion: no-preference) {
+    /* Closing slides out from wherever a drag left it, over the drag's inline
+       offset. */
+    dialog.root:not(.active) .panel {
+      transform: translate3d(0, 100%, 0) !important;
+    }
+  }
+
+  dialog.root:not(.active) .overlay {
+    opacity: 0 !important;
+  }
+
+  /* A mouse drag moves the sheet instead of selecting its text, as in Vaul. */
+  @media (hover: hover) and (pointer: fine) {
+    .panel {
+      user-select: none;
+    }
+  }
+
+  .handle {
+    position: absolute;
+    top: var(--mq-spacing-2, 0.5rem);
+    left: 50%;
+    width: 2.25rem;
+    height: 0.25rem;
+    border-radius: var(--mq-radius-full, 9999px);
+    background: color-mix(
+      in srgb,
+      var(--mq-text-primary, #0a0a23) 20%,
+      transparent
+    );
+    transform: translateX(-50%);
+  }
+
+  .header {
+    display: flex;
+    flex-shrink: 0;
+    align-items: center;
+    gap: var(--mq-spacing-2, 0.5rem);
+    box-sizing: border-box;
+    min-height: ${ei};
+    padding: var(--mq-spacing-2, 0.5rem) ${ti};
+  }
+
+  .heading {
+    flex: 1;
+    min-width: 0;
+    font-size: var(--mq-typography-size-base, 1rem);
+    font-weight: var(--mq-typography-weight-medium, 500);
+    line-height: 1.25rem;
+    color: var(--mq-text-brand, var(--color-primary, #4a1ea7));
+  }
+
+  .heading ::slotted(*) {
+    margin: 0;
+    font-family: inherit;
+    font-size: inherit;
+    font-weight: inherit;
+    line-height: inherit;
+    color: inherit;
+  }
+
+  .scroll {
+    flex: 1;
+    min-height: 0;
+    overflow-y: auto;
+    /* Reaching the end does not hand the scroll over to the page behind. */
+    overscroll-behavior: contain;
+  }
+
+  .scroll:focus-visible {
+    outline: 2px solid var(--mq-border-focus, var(--color-primary, #4a1ea7));
+    outline-offset: -2px;
+  }
+
+  .body {
+    padding: 0 ${ti} ${ii};
+  }
+
+  .footer {
+    display: flex;
+    flex-wrap: wrap;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: flex-end;
+    gap: ${oi};
+    padding: var(--mq-spacing-3, 0.75rem) ${ti}
+      var(--mq-spacing-4, 1rem);
+    border-top: var(--mq-size-border-default, 1px) solid
+      var(--mq-border-default, var(--color-border, #edecf1));
+  }
+
+  .close-btn {
+    display: inline-flex;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: center;
+    box-sizing: border-box;
+    width: var(--mq-size-control-sm, 2rem);
+    height: var(--mq-size-control-sm, 2rem);
+    margin: 0;
+    padding: 0;
+    border: none;
+    border-radius: var(--mq-radius-md, 0.375rem);
+    background: transparent;
+    /* As mq-dialog's: --mq-text-secondary is under the 3:1 an icon needs. */
+    color: var(
+      --color-neutrals-text-medium,
+      color-mix(in srgb, var(--mq-text-primary, #0a0a23) 64%, transparent)
+    );
+    cursor: pointer;
+  }
+
+  .close-btn svg {
+    width: var(--mq-size-icon-lg, 1.5rem);
+    height: var(--mq-size-icon-lg, 1.5rem);
+    pointer-events: none;
+  }
+
+  .close-btn:hover {
+    background: rgb(0 0 0 / 0.05);
+  }
+
+  .close-btn:focus-visible {
+    outline: 2px solid var(--mq-border-focus, var(--color-primary, #4a1ea7));
+    outline-offset: 2px;
+  }
+
+  @media (forced-colors: active) {
+    .panel {
+      border: 1px solid CanvasText;
+      border-bottom: none;
+    }
+  }
+
+  /* No slide: it fades in and out where it is, and a drag let go snaps back. */
+  @media (prefers-reduced-motion: reduce) {
+    .panel {
+      transform: none;
+      opacity: 0;
+      transition: opacity 200ms ease;
+    }
+
+    .overlay {
+      transition: opacity 200ms ease;
+    }
+
+    dialog.root.active .panel {
+      opacity: 1;
+    }
+  }
+`;class MqDrawerCloseEvent extends Event{static{this.eventName="mq-close"}constructor(){super(MqDrawerCloseEvent.eventName,{bubbles:!0,composed:!0,cancelable:!0})}}class MqDrawerOpenChangeEvent extends Event{static{this.eventName="onopenchange"}constructor(e){super(MqDrawerOpenChangeEvent.eventName,{bubbles:!0,composed:!0}),this.open=e}}function ai(e){const{transform:t}=getComputedStyle(e);return t&&"none"!==t?new DOMMatrixReadOnly(t).m42:0}let li=class MqDrawer extends n{constructor(){super(...arguments),this.open=!1,this.label="",this.closeLabel="Close",this.hasHeading=!1,this.hasFooter=!1,this.isModal=!1,this.scrollable=!1,this.gesture=null,this.lastScroll=Number.NEGATIVE_INFINITY,this.closeTimer=null,this.lockedScroll=!1,this.readSlots=()=>{this.hasHeading=Array.from(this.querySelectorAll(':scope > [slot="heading"]')).some(e=>""!==(e.textContent??"").trim()),this.hasFooter=null!==this.querySelector(':scope > [slot="footer"]'),this.measureScroll()},this.onPointerDown=e=>{if(!this.open||!e.isPrimary||0!==e.button)return;const t=this.$(".scroll");e.target===t&&t&&e.offsetX>t.clientWidth||(this.gesture={pointerId:e.pointerId,x:e.clientX,y:e.clientY,time:e.timeStamp,path:e.composedPath(),dragging:!1,base:0,height:0,offset:0})},this.onPointerMove=e=>{const t=this.gesture,i=this.$(".panel");if(!t||e.pointerId!==t.pointerId||!i)return;const o=e.clientY-t.y;if(!t.dragging){const s=function(e,t){return Math.abs(e)<4&&Math.abs(t)<4?"undecided":Math.abs(e)>Math.abs(t)?"horizontal":"vertical"}(e.clientX-t.x,o);if("undecided"===s)return;if("horizontal"===s||!this.canDrag(t,o,i))return void(this.gesture=null);t.dragging=!0,t.base=ai(i),t.height=Math.min(i.offsetHeight,window.innerHeight),i.setPointerCapture(e.pointerId)}t.offset=function(e){return e>=0?e:-function(e){return Math.max(0,8*(Math.log(e+1)-2))}(-e)}(t.base+o),this.setDrag(t.offset,t.height)},this.onPointerUp=e=>{const t=this.gesture;t&&e.pointerId===t.pointerId&&(this.gesture=null,t.dragging&&(function({offset:e,height:t,distance:i,ms:o}){return!(i<=0)&&(i/Math.max(o,1)>.4||e>=.25*t)}({offset:t.offset,height:t.height,distance:e.clientY-t.y,ms:e.timeStamp-t.time})&&this.requestClose()||this.setDrag(null)))},this.onPointerCancel=e=>{e.pointerId===this.gesture?.pointerId&&(this.gesture.dragging&&this.setDrag(null),this.gesture=null)},this.touchMove={handleEvent:e=>{this.gesture?.dragging&&e.cancelable&&e.preventDefault()},passive:!1},this.scrolled={handleEvent:()=>{this.lastScroll=performance.now()},capture:!0},this.onCancel=e=>{e.preventDefault(),this.requestClose()},this.onNativeClose=()=>{this.isConnected&&!this.$("dialog")?.open&&(this.releaseScroll(),this.open&&(this.dispatchEvent(new MqDrawerCloseEvent),this.open=!1,this.dispatchEvent(new MqDrawerOpenChangeEvent(!1))))},this.onKeyDown=e=>{M(e,this.$(".panel"))}}static{this.styles=[ri]}$(e){return this.shadowRoot?.querySelector(e)??null}connectedCallback(){super.connectedCallback(),this.readSlots(),this.hasUpdated&&this.open&&this.show()}disconnectedCallback(){this.clearCloseTimer(),this.closeNative(),super.disconnectedCallback()}firstUpdated(){if("undefined"==typeof ResizeObserver)return;const e=new ResizeObserver(()=>this.measureScroll());for(const t of[this.$(".scroll"),this.$(".body")])t&&e.observe(t)}updated(e){e.has("open")&&(this.open?this.show():e.get("open")&&this.hide())}show(){const e=this.$("dialog"),t=this.$(".panel");e&&t&&(this.clearCloseTimer(),this.setDrag(null),e.open||("function"==typeof e.showModal?(e.showModal(),this.isModal=!0):(e.setAttribute("open",""),this.isModal=!1)),this.lockedScroll||(L(),this.lockedScroll=!0),this.measureScroll(),t.getBoundingClientRect(),e.classList.add("active"))}hide(){const e=this.$("dialog");if(this.gesture=null,e?.classList.remove("active"),e?.open){for(const e of[this.$(".panel"),this.$(".overlay")])e?.style.removeProperty("transition");this.clearCloseTimer(),this.closeTimer=window.setTimeout(()=>{this.closeTimer=null,this.closeNative()},R(this.$(".panel")))}else this.releaseScroll()}closeNative(){const e=this.$("dialog");e?.classList.remove("active"),e?.open&&("function"==typeof e.close?e.close():e.removeAttribute("open")),this.releaseScroll()}clearCloseTimer(){null!==this.closeTimer&&(window.clearTimeout(this.closeTimer),this.closeTimer=null)}releaseScroll(){this.lockedScroll&&(V(),this.lockedScroll=!1)}measureScroll(){const e=this.$(".scroll");e&&(this.scrollable=e.scrollHeight>e.clientHeight+1)}requestClose(){return!(!this.open||!this.dispatchEvent(new MqDrawerCloseEvent)||(this.open=!1,this.dispatchEvent(new MqDrawerOpenChangeEvent(!1)),0))}setDrag(e,t=0){const i=this.$(".panel"),o=this.$(".overlay");if(i&&o)if(null!==e)i.style.transition="none",o.style.transition="none",i.style.transform=`translate3d(0, ${e}px, 0)`,o.style.opacity=String(function(e,t){return t<=0?1:Math.min(1,Math.max(0,1-e/t))}(e,t));else for(const e of[i,o])e.style.removeProperty("transition"),e.style.removeProperty("transform"),e.style.removeProperty("opacity")}canDrag(e,t,i){const o=[];for(const t of e.path){if(t===i)break;if(!(t instanceof HTMLElement))continue;if(t.matches('input, textarea, select, [contenteditable]:not([contenteditable="false"])'))return!1;const{overflowY:e}=getComputedStyle(t);"auto"!==e&&"scroll"!==e||o.push(t)}return ai(i)>0||!window.getSelection()?.toString()&&!(performance.now()-this.lastScroll<100)&&!function(e,t){return e.some(e=>t>0?e.scrollTop>0:e.scrollTop+e.clientHeight<e.scrollHeight-1)}(o,t)}render(){const e=this.hasHeading;return s`
+      <dialog
+        class="root"
+        aria-modal=${this.isModal?"true":o}
+        aria-labelledby=${e?"drawer-heading":o}
+        aria-label=${!e&&this.label?this.label:o}
+        @cancel=${this.onCancel}
+        @close=${this.onNativeClose}
+        @keydown=${this.onKeyDown}
+      >
+        <div
+          class="overlay"
+          part="overlay"
+          @click=${()=>this.requestClose()}
+        ></div>
+        <div
+          class="panel"
+          part="panel"
+          @pointerdown=${this.onPointerDown}
+          @pointermove=${this.onPointerMove}
+          @pointerup=${this.onPointerUp}
+          @pointercancel=${this.onPointerCancel}
+          @touchmove=${this.touchMove}
+          @scroll=${this.scrolled}
+        >
+          <div class="handle" part="handle" aria-hidden="true"></div>
+          <div class="header" part="header">
+            <div class="heading" part="heading" id="drawer-heading">
+              <slot name="heading" @slotchange=${this.readSlots}></slot>
+            </div>
+            <button
+              class="close-btn"
+              part="close"
+              type="button"
+              aria-label=${this.closeLabel}
+              title=${this.closeLabel}
+              @click=${()=>this.requestClose()}
+            >
+              <svg
+                aria-hidden="true"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <path d="M18 6 6 18M6 6l12 12" />
+              </svg>
+            </button>
+          </div>
+          <div
+            class="scroll"
+            part="scroll"
+            tabindex=${this.scrollable?"0":o}
+            role=${this.scrollable?"region":o}
+            aria-labelledby=${this.scrollable&&e?"drawer-heading":o}
+            aria-label=${this.scrollable&&!e&&this.label?this.label:o}
+          >
+            <div class="body" part="body"><slot></slot></div>
+          </div>
+          <div class="footer" part="footer" ?hidden=${!this.hasFooter}>
+            <slot name="footer" @slotchange=${this.readSlots}></slot>
+          </div>
+        </div>
+      </dialog>
+    `}};se([l({type:Boolean,reflect:!0})],li.prototype,"open",void 0),se([l({type:String})],li.prototype,"label",void 0),se([l({type:String,attribute:"close-label"})],li.prototype,"closeLabel",void 0),se([S()],li.prototype,"hasHeading",void 0),se([S()],li.prototype,"hasFooter",void 0),se([S()],li.prototype,"isModal",void 0),se([S()],li.prototype,"scrollable",void 0),li=se([ne("mq-drawer")],li);let di=class FlashHelpPanel extends n{constructor(){super(...arguments),this.open=!1,this.history=[],this.unstable=!1,this.detected=[],this.videoOn=!1,this.hasChat=!1,this.speakers=[],this.phone=globalThis.matchMedia?.("(max-width: 767px)"),this.onViewportChange=()=>this.requestUpdate()}static{this.styles=i`:host{display:contents}mq-dialog{--dialog-max-width:32.5rem;--dialog-padding-inline:var(--sp-6);--dialog-header-height:5.5rem;--mq-size-icon-lg:1.25rem}mq-dialog::part(header){background:0 0}mq-dialog::part(heading),mq-drawer::part(heading){font-size:var(--text-lg);line-height:1.35;color:var(--color-text-icons--primary)}mq-dialog::part(close){top:var(--sp-6);right:var(--dialog-padding-inline);width:var(--size-10);height:var(--size-10)}mq-dialog::part(body){padding-top:0;padding-bottom:var(--sp-6)}mq-drawer{--drawer-padding-inline:var(--sp-4);--drawer-padding-block:var(--sp-6);--drawer-header-height:5.5rem;--mq-size-icon-lg:1.25rem}mq-drawer::part(close){width:var(--size-10);height:var(--size-10)}.panel{display:grid;gap:var(--sp-6);font-family:var(--font-body);font-size:var(--text-sm);line-height:1.35;color:var(--color-text-icons--primary)}section{display:grid;gap:var(--sp-3)}h3{margin:0;font-size:inherit;font-weight:var(--font-weight-normal)}.axis,.label,h3{color:var(--color-text-icons--secondary)}ul{display:grid;gap:var(--sp-3);margin:0;padding:0;list-style:none}li{display:flex;gap:var(--sp-2)}li svg{flex-shrink:0;margin-top:1px}.tips svg{color:var(--color-feedback--success-text)}.status{display:flex;align-items:center;gap:var(--sp-2)}.bars{display:flex;gap:2px;height:var(--sp-4)}.bar{flex:1;min-width:0;border-radius:2px;background-color:var(--color-border-subtle)}.bar.good{background-color:var(--color-feedback--success-text)}.bar.unstable{background-color:var(--color-feedback--warning-text)}.bar.bad{background-color:var(--color-negative-dark)}.axis{display:flex;justify-content:space-between}.field{display:grid;gap:6px}mq-select-menu{width:100%}@media (max-width:767px){.devices{display:none}}`}connectedCallback(){super.connectedCallback(),this.phone?.addEventListener("change",this.onViewportChange)}disconnectedCallback(){this.phone?.removeEventListener("change",this.onViewportChange),super.disconnectedCallback()}renderBars(){const e=60-this.history.length;return s`<div class="bars" aria-hidden="true">${Array.from({length:60},(t,i)=>s`<span class="bar ${this.history[i-e]??""}"></span>`)}</div>`}render(){const e=[I("Busca un sitio con mejor cobertura o cambia de red (wifi o datos móviles)."),I("Cierra otras apps o pestañas que usen internet."),I("Si sigue mal, desactiva tu vídeo: la voz necesita mucha menos conexión.")],t=s`<h2 slot="heading">${I("Ayuda con la llamada")}</h2><div class="panel"><section><h3>${I("Tu conexión")}</h3><div class="status"><mq-badge variant="${this.unstable?"warning":"success"}">${this.unstable?I("Inestable"):I("Estable")}</mq-badge>${this.unstable?s`<span>${I("La imagen puede ir a saltos.")}</span>`:o}</div>${this.renderBars()}<div class="axis"><span>${I("hace 2 min")}</span><span>${I("ahora")}</span></div></section>${this.detected.length?s`<section><h3>${I("Detectado")}</h3><ul>${this.detected.map(e=>s`<li>${e}</li>`)}</ul></section>`:o}<section><h3>${I("Prueba esto")}</h3><ul class="tips">${e.map(e=>s`<li>${Y({size:16,color:"currentColor"})}<span>${e}</span></li>`)}</ul></section>${this.videoOn||this.hasChat?s`<section><h3>${I("Acciones rápidas")}</h3>${this.videoOn?s`<mq-button variant="outline" fullwidth @click="${()=>this.dispatchEvent(new ToggleVideoEvent(!1))}">${ie({size:16})} ${I("Desactivar mi vídeo")}</mq-button>`:o} ${this.hasChat?s`<mq-button variant="outline" fullwidth @click="${()=>this.dispatchEvent(new OpenChatEvent)}">${Ce({size:16})} ${I("Escribir al médico por chat")}</mq-button>`:o}</section>`:o} ${this.speakers.length?s`<section class="devices"><h3>${I("Dispositivos")}</h3><div class="field"><span class="label" aria-hidden="true">${I("Altavoz")}</span><mq-select-menu label="${I("Altavoz")}" .value="${Ye(this.speakerId??"")}" @onvaluechange="${e=>this.dispatchEvent(new SelectDeviceEvent("speaker",e.value))}">${this.speakers.map(e=>s`<mq-select-item value="${e.deviceId}">${e.label}</mq-select-item>`)}</mq-select-menu></div></section>`:o}</div>`;return this.phone?.matches?s`<mq-drawer .open="${this.open}" .closeLabel="${I("Cerrar")}">${t}</mq-drawer>`:s`<mq-dialog .open="${this.open}" .closeLabel="${I("Cerrar")}">${t}</mq-dialog>`}};e([l({type:Boolean})],di.prototype,"open",void 0),e([l({type:Array})],di.prototype,"history",void 0),e([l({type:Boolean})],di.prototype,"unstable",void 0),e([l({type:Array})],di.prototype,"detected",void 0),e([l({type:Boolean})],di.prototype,"videoOn",void 0),e([l({type:Boolean})],di.prototype,"hasChat",void 0),e([l({type:Array})],di.prototype,"speakers",void 0),e([l({type:String})],di.prototype,"speakerId",void 0),di=e([A(),t("flash-help-panel")],di);const ci={minWidth:"12.5rem",radius:re.lg,shadow:vt,animationDuration:ae.duration[150]},hi=(e,t)=>a(`var(--dropdown-menu-${e}, ${t})`),pi=hi("min-width",ci.minWidth),ui=hi("radius",ci.radius),mi=a(`max(0px, calc(${ui} - var(--mq-spacing-1, 0.25rem)))`),vi=hi("shadow",ci.shadow),gi=hi("animation-duration",ci.animationDuration),bi=i`
+  /* The trigger keeps its place in the host's layout, e.g. a flex row of controls. */
+  :host {
+    display: contents;
+  }
+`,fi=i`
+  /* The positioned box. It resets the popover's UA box (centred, bordered);
+     the card is .content, so the animation never fights the positioning. */
+  :host {
+    position: fixed;
+    inset: auto;
+    top: 0;
+    left: 0;
+    /* Only matters without the Popover API; the top layer ignores it. */
+    z-index: var(--mq-z-index-50, 50);
+    margin: 0;
+    padding: 0;
+    border: 0;
+    background: transparent;
+    overflow: visible;
+    color: inherit;
+    outline: none;
+  }
+
+  :host(:not([data-state])) {
+    display: none;
+  }
+
+  /* :focus-visible cannot tell: the items take focus from the mouse too. */
+  :host([data-keyboard]) {
+    --_item-ring: ${ut.focus};
+  }
+
+  :host([data-side="bottom"]) {
+    --_slide-y: calc(-1 * var(--mq-spacing-2, 0.5rem));
+  }
+
+  :host([data-side="top"]) {
+    --_slide-y: var(--mq-spacing-2, 0.5rem);
+  }
+
+  :host([data-side="left"]) {
+    --_slide-x: var(--mq-spacing-2, 0.5rem);
+  }
+
+  :host([data-side="right"]) {
+    --_slide-x: calc(-1 * var(--mq-spacing-2, 0.5rem));
+  }
+
+  .content {
+    display: flex;
+    flex-direction: column;
+    gap: var(--mq-spacing-1, 0.25rem);
+    box-sizing: border-box;
+    min-width: ${pi};
+    max-height: var(--mq-popup-available-height, none);
+    overflow-x: hidden;
+    overflow-y: auto;
+    padding: var(--mq-spacing-2, 0.5rem) var(--mq-spacing-1, 0.25rem);
+    border: var(--mq-size-border-default, 1px) solid ${ut.border};
+    border-radius: ${ui};
+    background: ${ut.surface};
+    color: ${ut.textMedium};
+    box-shadow: ${vi};
+    font-family: var(--mq-typography-family-sans, system-ui, sans-serif);
+  }
+
+  :host([data-state="open"]) .content {
+    animation: mq-popup-enter ${gi} ease;
+  }
+
+  :host([data-state="closed"]) .content {
+    animation: mq-popup-exit ${gi} ease forwards;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    :host([data-state]) .content {
+      animation: none;
+    }
+  }
+
+  @media (forced-colors: active) {
+    .content {
+      border-color: CanvasText;
+    }
+  }
+`,yi=i`
+  :host {
+    display: block;
+    border-radius: ${mi};
+    font-size: var(--mq-typography-size-xs, 0.75rem);
+    line-height: 1rem;
+    cursor: pointer;
+    user-select: none;
+    outline: none;
+  }
+
+  :host([hidden]) {
+    display: none;
+  }
+
+  .item {
+    position: relative;
+    display: flex;
+    align-items: center;
+    padding: var(--mq-spacing-2, 0.5rem);
+  }
+
+  :host(:focus) {
+    background: ${ut.highlight};
+  }
+
+  /* The console only tints the background, too faint to find from the
+     keyboard: the popup sets --_item-ring while the keyboard drives it. */
+  :host(:focus) {
+    outline: 2px solid var(--_item-ring, transparent);
+    outline-offset: -2px;
+  }
+
+  :host([disabled]) {
+    pointer-events: none;
+    opacity: 0.5;
+  }
+
+  .indicator {
+    display: none;
+  }
+
+  @media (forced-colors: active) {
+    :host(:focus) {
+      outline: 2px solid Highlight;
+      outline-offset: -2px;
+    }
+  }
+`,wi=i`
+  :host {
+    border-radius: var(--mq-radius-sm, 0.125rem);
+    font-size: var(--mq-typography-size-sm, 0.875rem);
+    line-height: 1.25rem;
+    cursor: default;
+  }
+
+  .item {
+    gap: var(--mq-spacing-2, 0.5rem);
+    /* The end padding keeps the text clear of the check. */
+    padding: var(--mq-spacing-1-5, 0.375rem) var(--mq-spacing-8, 2rem)
+      var(--mq-spacing-1-5, 0.375rem) var(--mq-spacing-2, 0.5rem);
+  }
+
+  :host(:focus) {
+    background: ${ut.border};
+  }
+
+  .indicator {
+    position: absolute;
+    inset-inline-end: var(--mq-spacing-2, 0.5rem);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 0.875rem;
+    height: 0.875rem;
+    pointer-events: none;
+  }
+
+  .indicator svg {
+    width: var(--mq-size-icon-sm, 1rem);
+    height: var(--mq-size-icon-sm, 1rem);
+  }
+
+  :host(:not([checked])) .indicator {
+    display: none;
+  }
+`,xi=i`
+  .item {
+    justify-content: space-between;
+    gap: var(--mq-spacing-2, 0.5rem);
+  }
+
+  :host([aria-checked="true"]) {
+    color: ${ut.brand};
+    font-weight: var(--mq-typography-weight-medium, 500);
+  }
+
+  .label {
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  :host([aria-checked="true"]) .indicator {
+    display: block;
+    flex-shrink: 0;
+    width: 0.375rem;
+    height: 0.375rem;
+    border-radius: var(--mq-radius-full, 9999px);
+    background: currentColor;
+  }
+
+  @media (forced-colors: active) {
+    :host([aria-checked="true"]) .indicator {
+      background: CanvasText;
+    }
+  }
+`,ki=i`
+  :host {
+    display: block;
+    font-size: var(--mq-typography-size-xs, 0.75rem);
+    line-height: 1rem;
+    font-weight: var(--mq-typography-weight-semibold, 600);
+  }
+
+  .label {
+    padding: var(--mq-spacing-1, 0.25rem) var(--mq-spacing-2, 0.5rem);
+  }
+`,$i=i`
+  :host {
+    display: block;
+  }
+
+  /* -mx-1 to span the card's padding; with the card's gap, the console's
+     space-y-1 + my-1 spacing. */
+  .line {
+    height: 1px;
+    margin: 0 calc(-1 * var(--mq-spacing-1, 0.25rem))
+      var(--mq-spacing-1, 0.25rem);
+    background: ${ut.border};
+  }
+
+  @media (forced-colors: active) {
+    .line {
+      background: CanvasText;
+    }
+  }
+`,qi=i`
+  :host {
+    display: flex;
+    flex-direction: column;
+    gap: var(--mq-spacing-1, 0.25rem);
+  }
+`;function Si(e,t){e.hasAttribute("role")||e.setAttribute("role",t)}const Ci=e=>e.hasAttribute("disabled")||"true"===e.getAttribute("aria-disabled");class MqDropdownMenuOpenChangeEvent extends Event{static{this.eventName="onopenchange"}constructor(e){super(MqDropdownMenuOpenChangeEvent.eventName,{bubbles:!0,composed:!0}),this.open=e}}class MqDropdownMenuSelectEvent extends Event{static{this.eventName="onselect"}constructor(){super(MqDropdownMenuSelectEvent.eventName,{bubbles:!0,composed:!0,cancelable:!0})}}class MqDropdownMenuCheckedChangeEvent extends Event{static{this.eventName="oncheckedchange"}constructor(e){super(MqDropdownMenuCheckedChangeEvent.eventName,{bubbles:!0,composed:!0}),this.checked=e}}class MqDropdownMenuValueChangeEvent extends Event{static{this.eventName="onvaluechange"}constructor(e){super(MqDropdownMenuValueChangeEvent.eventName,{bubbles:!0,composed:!0}),this.value=e}}let Ei=class MqDropdownMenu extends n{constructor(){super(...arguments),this.open=!1,this.typeahead=new le,this.stopTracking=null,this.transition=0,this.focusFirstItem=!1,this.wire=()=>{const{trigger:e,content:t}=this;e&&t&&(t.id||(t.id=be("mq-dropdown-menu-content")),e.id||(e.id=be("mq-dropdown-menu-trigger")),e.setAttribute("aria-haspopup","menu"),e.setAttribute("aria-expanded",String(this.open)),e.dataset.state=this.open?"open":"closed",this.open?e.setAttribute("aria-controls",t.id):e.removeAttribute("aria-controls"),t.setAttribute("aria-labelledby",e.id))},this.onDocumentPointerDown=e=>{e.composedPath().includes(this)||this.setOpen(!1)},this.onPointerDown=e=>{const{trigger:t}=this;t&&e.composedPath().includes(t)&&(Ci(t)||0!==e.button||e.ctrlKey||(this.content?.removeAttribute("data-keyboard"),this.open||e.preventDefault(),this.setOpen(!this.open)))},this.onClick=e=>{const{trigger:t}=this;0===e.detail&&t&&!Ci(t)&&e.composedPath().includes(t)&&(this.open?this.setOpen(!1):this.openFromKeyboard())},this.onKeyDown=e=>{const{trigger:t,content:i}=this;if(!t||!i)return;i.toggleAttribute("data-keyboard",!0);const o=e.composedPath();if(o.includes(t)){if(Ci(t))return;return void("Enter"===e.key||" "===e.key?(e.preventDefault(),this.open?this.setOpen(!1):this.openFromKeyboard()):"ArrowDown"===e.key&&(e.preventDefault(),this.openFromKeyboard()))}if(!this.open||!o.includes(i))return;const s=this.items,n=s.find(e=>e.matches(":focus"));"Escape"===e.key?(e.preventDefault(),this.setOpen(!1)):"Tab"===e.key?this.setOpen(!1):ce(e.key)?(e.preventDefault(),he(e.key,s,n)?.focus()):n&&("Enter"===e.key||" "===e.key&&!this.typeahead.active)?(e.preventDefault(),n.click()):de(e)&&(" "===e.key&&e.preventDefault(),this.typeahead.match(e.key,s,n)?.focus())},this.onFocusOut=e=>{const t=e.relatedTarget;this.open&&t&&!this.contains(t)&&this.setOpen(!1)},this.onPointerMove=e=>{const{content:t}=this;if("mouse"!==e.pointerType||!this.open||!t)return;const i=e.composedPath();if(!i.includes(t))return;t.removeAttribute("data-keyboard");const o=i.find(e=>e instanceof MenuItemElement),s=o&&!o.disabled?o:t;s.matches(":focus")||s.focus({preventScroll:!0})},this.onPointerOut=e=>{const{content:t}=this;"mouse"===e.pointerType&&this.open&&t&&t.contains(e.target)&&(t.contains(e.relatedTarget)||t.matches(":focus")||t.focus({preventScroll:!0}))}}static{this.styles=[bi]}get trigger(){return this.querySelector(':scope > [slot="trigger"]')}get content(){return this.querySelector(":scope > mq-dropdown-menu-content")}get items(){const e=this.content?.querySelectorAll("mq-dropdown-menu-item, mq-dropdown-menu-checkbox-item, mq-dropdown-menu-radio-item")??[];return Array.from(e).filter(e=>!e.disabled)}connectedCallback(){super.connectedCallback(),this.addEventListener("pointerdown",this.onPointerDown),this.addEventListener("click",this.onClick),this.addEventListener("keydown",this.onKeyDown),this.addEventListener("focusout",this.onFocusOut),this.addEventListener("pointermove",this.onPointerMove),this.addEventListener("pointerout",this.onPointerOut),this.hasUpdated&&this.open&&this.show()}disconnectedCallback(){this.removeEventListener("pointerdown",this.onPointerDown),this.removeEventListener("click",this.onClick),this.removeEventListener("keydown",this.onKeyDown),this.removeEventListener("focusout",this.onFocusOut),this.removeEventListener("pointermove",this.onPointerMove),this.removeEventListener("pointerout",this.onPointerOut),document.removeEventListener("pointerdown",this.onDocumentPointerDown,!0),this.stopTracking?.(),this.stopTracking=null,super.disconnectedCallback()}updated(e){this.wire(),e.has("open")&&(this.open?this.show():void 0!==e.get("open")&&this.hide())}close(){this.setOpen(!1)}setOpen(e){this.open!==e&&(this.open=e,this.dispatchEvent(new MqDropdownMenuOpenChangeEvent(e)))}openFromKeyboard(){this.content?.toggleAttribute("data-keyboard",!0),this.open?this.items[0]?.focus():(this.focusFirstItem=!0,this.setOpen(!0))}async show(){const{trigger:e,content:t}=this;if(!e||!t)return;const i=++this.transition;this.stopTracking?.(),t.dataset.side=t.side,t.dataset.state="open",pe(t);const{placed:o,stop:s}=ue(e,t,{side:t.side,align:t.align,sideOffset:t.sideOffset});if(this.stopTracking=s,document.addEventListener("pointerdown",this.onDocumentPointerDown,!0),await o,i!==this.transition)return;const n=this.focusFirstItem?this.items[0]:void 0;this.focusFirstItem=!1,(n??t).focus()}async hide(){const{trigger:e,content:t}=this,i=++this.transition;document.removeEventListener("pointerdown",this.onDocumentPointerDown,!0),this.typeahead.reset(),t&&(me(t)&&e?.focus(),t.dataset.state="closed",await fe(t.renderRoot.querySelector(".content")),i===this.transition&&(delete t.dataset.state,ve(t),this.stopTracking?.(),this.stopTracking=null))}render(){return s`<slot name="trigger" @slotchange=${this.wire}></slot
+      ><slot @slotchange=${this.wire}></slot>`}};se([l({type:Boolean,reflect:!0})],Ei.prototype,"open",void 0),Ei=se([ne("mq-dropdown-menu")],Ei);let Di=class MqDropdownMenuContent extends n{constructor(){super(...arguments),this.side="bottom",this.align="center",this.sideOffset=4}static{this.styles=[mt,fi]}connectedCallback(){super.connectedCallback(),Si(this,"menu"),this.setAttribute("aria-orientation","vertical"),this.setAttribute("popover","manual"),this.hasAttribute("tabindex")||(this.tabIndex=-1)}render(){return s`<div class="content" part="content"><slot></slot></div>`}};se([l({type:String})],Di.prototype,"side",void 0),se([l({type:String})],Di.prototype,"align",void 0),se([l({type:Number,attribute:"side-offset"})],Di.prototype,"sideOffset",void 0),Di=se([ne("mq-dropdown-menu-content")],Di);class MenuItemElement extends n{constructor(){super(...arguments),this.disabled=!1,this.pressed=!1,this.onClick=()=>{if(this.disabled)return;const e=!this.dispatchEvent(new MqDropdownMenuSelectEvent);this.afterSelect(),e||this.closest("mq-dropdown-menu")?.close()},this.onPointerDown=()=>{this.pressed=!0},this.onPointerUp=()=>{this.pressed||this.click(),this.pressed=!1}}connectedCallback(){super.connectedCallback(),Si(this,this.itemRole),this.hasAttribute("tabindex")||(this.tabIndex=-1),this.addEventListener("click",this.onClick),this.addEventListener("pointerdown",this.onPointerDown),this.addEventListener("pointerup",this.onPointerUp)}disconnectedCallback(){this.removeEventListener("click",this.onClick),this.removeEventListener("pointerdown",this.onPointerDown),this.removeEventListener("pointerup",this.onPointerUp),super.disconnectedCallback()}updated(e){this.disabled?this.setAttribute("aria-disabled","true"):this.removeAttribute("aria-disabled")}afterSelect(){}}se([l({type:Boolean,reflect:!0})],MenuItemElement.prototype,"disabled",void 0);let Ti=class MqDropdownMenuItem extends MenuItemElement{static{this.styles=[yi]}get itemRole(){return"menuitem"}render(){return s`<div class="item" part="item"><slot></slot></div>`}};Ti=se([ne("mq-dropdown-menu-item")],Ti);const zi=s`<svg viewBox="0 0 12 9" fill="none" aria-hidden="true">
+  <path
+    d="M10.0417 0.19332L3.455 6.77999L1.135 4.46665C0.875 4.20665 0.455 4.20665 0.195 4.46665C-0.065 4.72665 -0.065 5.14665 0.195 5.40665L2.98167 8.19332C3.24167 8.45332 3.66167 8.45332 3.92167 8.19332L10.9817 1.13999C11.2417 0.879987 11.2417 0.459987 10.9817 0.199987H10.975C10.7217 -0.0666799 10.3017 -0.0666799 10.0417 0.19332Z"
+    fill="currentColor"
+  />
+</svg>`;let Ii=class MqDropdownMenuCheckboxItem extends MenuItemElement{constructor(){super(...arguments),this.checked=!1}static{this.styles=[yi,wi]}get itemRole(){return"menuitemcheckbox"}updated(e){super.updated(e),this.setAttribute("aria-checked",String(this.checked))}afterSelect(){this.checked=!this.checked,this.dispatchEvent(new MqDropdownMenuCheckedChangeEvent(this.checked))}render(){return s`<div class="item" part="item">
+      <slot></slot><span class="indicator" part="indicator">${zi}</span>
+    </div>`}};se([l({type:Boolean,reflect:!0})],Ii.prototype,"checked",void 0),Ii=se([ne("mq-dropdown-menu-checkbox-item")],Ii);let Oi=class MqDropdownMenuRadioItem extends MenuItemElement{constructor(){super(...arguments),this.value=""}static{this.styles=[yi,xi]}get group(){return this.closest("mq-dropdown-menu-radio-group")}get itemRole(){return"menuitemradio"}updated(e){super.updated(e);const t=this.group;this.setAttribute("aria-checked",String(!!t&&t.value===this.value))}afterSelect(){this.group?.choose(this.value)}render(){return s`<div class="item" part="item">
+      <span class="label" part="label"><slot></slot></span
+      ><span class="indicator" part="indicator"></span>
+    </div>`}};se([l({type:String,reflect:!0})],Oi.prototype,"value",void 0),Oi=se([ne("mq-dropdown-menu-radio-item")],Oi);let Ai=class MqDropdownMenuGroup extends n{static{this.styles=[qi]}connectedCallback(){super.connectedCallback(),Si(this,"group")}render(){return s`<slot></slot>`}};Ai=se([ne("mq-dropdown-menu-group")],Ai);let Mi=class MqDropdownMenuRadioGroup extends Ai{constructor(){super(...arguments),this.value=""}updated(){for(const e of this.querySelectorAll("mq-dropdown-menu-radio-item"))e.requestUpdate()}choose(e){e!==this.value&&(this.value=e,this.dispatchEvent(new MqDropdownMenuValueChangeEvent(e)))}};se([l({type:String,reflect:!0})],Mi.prototype,"value",void 0),Mi=se([ne("mq-dropdown-menu-radio-group")],Mi);let Li=class MqDropdownMenuLabel extends n{static{this.styles=[ki]}render(){return s`<div class="label" part="label"><slot></slot></div>`}};Li=se([ne("mq-dropdown-menu-label")],Li);let Ri=class MqDropdownMenuSeparator extends n{static{this.styles=[$i]}connectedCallback(){super.connectedCallback(),Si(this,"separator")}render(){return s`<div class="line" part="line"></div>`}};function Vi(e,t){switch(e){case"micDisconnected":return I(t?O`Se ha desconectado tu micrófono. Usamos «${t}»`:"Se ha desconectado tu micrófono");case"micSilent":return I("Tu micrófono no envía sonido");case"camDisconnected":return I("Se ha desconectado tu cámara. Sigues con audio");case"audioOnly":return I("Seguimos solo con audio por tu conexión. El vídeo volverá solo cuando mejore.");case"unstable":return I("Tu conexión es inestable");case"doctorUnstable":return I("La conexión de tu médico es inestable. No hace falta que hagas nada.");case"talkingMuted":return I("¿Estás hablando? Tienes el micrófono desactivado")}}Ri=se([ne("mq-dropdown-menu-separator")],Ri);let Pi=class PublisherControls extends n{constructor(){super(...arguments),this.isAudioOn=!1,this.isVideoOn=!0,this.isWaitingRoom=!1,this.hasCamera=!0,this.cameraLost=!1,this.audioInputs=[],this.videoInputs=[],this.helpDot=!1,this.onMenuChange=e=>{const{open:t,target:i}=e,o=i.dataset.kind;if(this.menu=t?o:void 0,t)return;const s=this.renderRoot.querySelector(`.${o} .arrow`);this.updateComplete.then(()=>{this.shadowRoot?.activeElement!==s||s?.offsetParent||this.renderRoot.querySelector(`.${o} .toggle`)?.focus()})}}static{this.styles=i`:host{position:relative;display:flex;justify-content:center;font-family:var(--font-body)}@media (max-width:767px){:host(:not([is-waiting-room])){justify-content:flex-start}}.controls{display:flex;gap:var(--sp-4)}.control-button,.device{position:relative;display:flex;height:var(--size-11);border-radius:var(--border-radius-xl);background-color:var(--color-white);color:var(--color-primary);transition:background-color .2s ease-in-out}.device.off{background-color:var(--color-negative-dark);color:var(--color-white)}.control-button:hover,.device:not(.off) button:hover{background-color:var(--color-gray-light)}button{display:flex;align-items:center;justify-content:center;width:var(--size-11);height:100%;padding:0;border:none;border-radius:inherit;background:0 0;color:inherit;cursor:pointer}button:focus-visible{outline:0;box-shadow:0 0 0 2px var(--color-primary-light)}.arrow{display:none;justify-content:flex-start;width:26px;padding-left:10px}.device.many .arrow,.device.open .arrow{display:flex}.device .arrow{border-radius:var(--border-radius-xl) 0 0 var(--border-radius-xl)}.device.many .toggle,.device.open .toggle{border-radius:0 var(--border-radius-xl) var(--border-radius-xl) 0}.arrow svg{transform:rotate(180deg)}@media (min-width:768px){.arrow{display:flex}.device .toggle{border-radius:0 var(--border-radius-xl) var(--border-radius-xl) 0}.flip{display:none}}mq-dropdown-menu-content::part(content){width:300px;max-width:calc(100vw - 2 * var(--sp-4))}mq-dropdown-menu-radio-item{font-size:var(--text-sm);line-height:1.35}mq-dropdown-menu-radio-item svg{margin-right:var(--sp-2);vertical-align:-3px}.dot{position:absolute;top:-3px;right:-3px;padding:2px;border-radius:50%;background-color:var(--color-white);line-height:0}.floating{position:absolute;right:0;bottom:calc(100% + var(--sp-3));left:0;display:flex;justify-content:center;pointer-events:none}.notice{display:flex;align-items:flex-start;gap:var(--sp-2);box-sizing:border-box;max-width:100%;padding:10px 20px 10px var(--sp-4);border-radius:999px;background-color:var(--color-white);color:var(--color-text-icons--primary);box-shadow:var(--shadow-lg);font-size:var(--text-sm);line-height:1.35;pointer-events:auto}.notice svg{flex-shrink:0;margin-top:1px}.notice mq-text-button{white-space:normal}@media (max-width:767px){.notice{width:100%;border-radius:var(--size-3)}}`}firstUpdated(){this.renderRoot.addEventListener(MqDropdownMenuOpenChangeEvent.eventName,this.onMenuChange)}openMenu(e){this.menu=e}toggleAudio(){this.dispatchEvent(new ToggleAudioEvent(!this.isAudioOn))}toggleVideo(){if(this.cameraLost)return this.openMenu("video");this.dispatchEvent(new ToggleVideoEvent(!this.isVideoOn))}openHelp(){this.renderRoot.querySelector(".help")?.focus(),this.dispatchEvent(new OpenHelpEvent)}renderDevice(e){const t="audio"===e,i=t?this.isAudioOn:this.isVideoOn,o=t?this.audioInputs:this.videoInputs,n=t?this.audioDeviceId:this.videoDeviceId,r=t?i?X:J:i?te:ie,a=t?X:te,l=I(t?i?"Desactivar micrófono":"Activar micrófono":i?"Desactivar cámara":"Activar cámara"),d=["device",e,i?"":"off",t&&o.length>1?"many":"",this.menu===e?"open":""].join(" ");return s`<div class="${d}"><mq-dropdown-menu data-kind="${e}" .open="${this.menu===e}"><button slot="trigger" type="button" class="arrow" aria-label="${I(t?"Elegir micrófono":"Elegir cámara")}">${Ee({size:16})}</button><mq-dropdown-menu-content side="top" align="start" .sideOffset="${8}"><mq-dropdown-menu-radio-group .value="${Ye(n??"")}" @onvaluechange="${t=>this.dispatchEvent(new SelectDeviceEvent(e,t.value))}">${o.map(e=>s`<mq-dropdown-menu-radio-item value="${e.deviceId}">${a({size:16})}${e.label}</mq-dropdown-menu-radio-item>`)}</mq-dropdown-menu-radio-group></mq-dropdown-menu-content></mq-dropdown-menu><button type="button" class="toggle" aria-label="${l}" aria-pressed="${i?"true":"false"}" @click="${t?this.toggleAudio:this.toggleVideo}">${r({size:20})}</button></div>`}noticeAction(e){switch(e){case"micDisconnected":return{label:I("Cambiar"),run:()=>this.openMenu("audio")};case"micSilent":return{label:I("Cambiar micrófono"),run:()=>this.openMenu("audio")};case"camDisconnected":return{label:I("Elegir cámara"),run:()=>this.openMenu("video")};case"unstable":return this.isWaitingRoom||!this.isVideoOn?{label:I("Ver ayuda"),run:()=>this.openHelp()}:{label:I("Desactivar mi vídeo"),run:()=>this.toggleVideo()};case"talkingMuted":return{label:I("Activar micrófono"),run:()=>this.toggleAudio()};case"audioOnly":case"doctorUnstable":return{}}}renderNotice(e){const{label:t,run:i}=this.noticeAction(e);return s`<div class="notice">${"talkingMuted"===e?Z({size:16,color:"var(--color-primary-icon-link)"}):H({size:16,color:"var(--color-feedback--warning-text)"})} <span>${Vi(e,this.micLabel)} ${t?s`<span aria-hidden="true">·</span><mq-text-button size="sm" underlined .fontWeight="${"normal"}" @click="${i}">${t}</mq-text-button>`:o}</span></div>`}render(){return s`<div class="floating" role="status" aria-live="polite">${!this.menu&&this.notice?this.renderNotice(this.notice):o}</div><div class="controls">${this.isWaitingRoom?o:s`<button type="button" class="control-button chat" aria-label="${I("Abrir chat")}" @click="${()=>this.dispatchEvent(new OpenChatEvent)}">${Ce({size:20})}</button>`} ${this.renderDevice("audio")} ${this.hasCamera?this.renderDevice("video"):o} ${this.hasCamera&&this.videoInputs.length>1?s`<button type="button" class="control-button flip" aria-label="${I("Cambiar de cámara")}" @click="${()=>this.dispatchEvent(new FlipCameraEvent)}">${Q({size:20})}</button>`:o} <button type="button" class="control-button help" aria-label="${this.helpDot?`${I("Ayuda")}. ${I("Aviso")}`:I("Ayuda")}" aria-haspopup="dialog" @click="${this.openHelp}">${De({size:20})} ${this.helpDot?s`<span class="dot" aria-hidden="true"><mq-unread-badge></mq-unread-badge></span>`:o}</button></div>`}};e([l({type:Boolean})],Pi.prototype,"isAudioOn",void 0),e([l({type:Boolean})],Pi.prototype,"isVideoOn",void 0),e([l({type:Boolean,reflect:!0,attribute:"is-waiting-room"})],Pi.prototype,"isWaitingRoom",void 0),e([l({type:Boolean})],Pi.prototype,"hasCamera",void 0),e([l({type:Boolean})],Pi.prototype,"cameraLost",void 0),e([l({type:Array})],Pi.prototype,"audioInputs",void 0),e([l({type:Array})],Pi.prototype,"videoInputs",void 0),e([l({type:String})],Pi.prototype,"audioDeviceId",void 0),e([l({type:String})],Pi.prototype,"videoDeviceId",void 0),e([l({type:String})],Pi.prototype,"notice",void 0),e([l({type:String})],Pi.prototype,"micLabel",void 0),e([l({type:Boolean})],Pi.prototype,"helpDot",void 0),e([S()],Pi.prototype,"menu",void 0),Pi=e([A(),t("publisher-controls")],Pi);let _i=class VideoPublisher extends n{constructor(){super(...arguments),this.isWaitingRoom=!1,this.hasChatInAppointment=!1,this.isReconnecting=!1,this.doctorUnstable=!1,this.health=new PublisherHealthController(this),this.appointmentCounterController=new AppointmentCounterController(this,()=>D(this.startsAt)),this.isAudioOn=!0,this.isVideoOn=!0,this.helpOpen=!1,this._handleVisibilityChange=()=>{"visible"===document.visibilityState&&this.publisher&&(this.publisher.publishAudio(!1),this.publisher.publishVideo(!1),setTimeout(()=>{this.publisher?.publishAudio(this.isAudioOn),this.publisher?.publishVideo(this.isVideoOn)},500))}}static{this.styles=i`:host{display:block;width:100%;height:100%;font-family:var(--font-body)}.OT_video-element{width:100%;height:100%}.OT_mute{display:none}.publisher-box{position:relative;width:100%;height:100%;overflow:hidden}#video-publisher{position:absolute;inset:0}:host(:not([is-waiting-room])) .publisher-box{flex-shrink:0;box-sizing:border-box;width:120px;height:200px;border:2px solid color-mix(in srgb,var(--color-white) 20%,transparent);border-radius:12px}.camera-off{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-2);background:var(--color-primary-dark);color:var(--color-white);font-size:var(--text-xs);line-height:1.35}.camera-off mq-avatar{--mq-avatar-bg:var(--color-primary-light);--mq-avatar-color:var(--color-primary);--mq-avatar-font-size:var(--text-base)}:host(:not([is-waiting-room])) .camera-off span{display:none}:host([is-waiting-room]) .top-items{position:absolute;inset:0}:host(:not([is-waiting-room])) .top-items{position:absolute;z-index:50;top:var(--sp-4);left:var(--sp-4);right:var(--sp-4);display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-1)}.labels{display:flex;flex-wrap:wrap;gap:var(--sp-1);min-width:0}.label{padding:var(--sp-1) var(--sp-2);border-radius:var(--border-radius-md);background-color:var(--color-primary);color:var(--color-white);font-size:var(--text-sm);font-weight:var(--font-weight-medium);line-height:1.35}.label[role=timer]{font-variant-numeric:tabular-nums}publisher-controls{position:absolute;z-index:50;bottom:var(--sp-4);left:var(--sp-4);right:var(--sp-4)}@media (min-width:768px){:host(:not([is-waiting-room])) .publisher-box{width:180px;height:120px}}`}willUpdate(){this.health.setDoctorUnstable(this.doctorUnstable&&!this.isWaitingRoom),this.hasUpdated||(this.isAudioOn=this.devices?.audioOn??!0,this.isVideoOn=this.devices?.videoOn??!0,this.speakerId=this.devices?.speakerId)}firstUpdated(e){super.firstUpdated(e),this.devices?.speakerId&&this.openTokService.setAudioOutputDevice(this.devices.speakerId).catch(e=>W.error("error setting the speaker",e)),this.publisher=this.openTokService.initPublisher(this.publisherEl,{fitMode:"cover",width:"100%",height:"100%",audioFallback:{publisher:!0,subscriber:!1},style:{videoDisabledDisplayMode:"off"},insertMode:"append",mirror:!1,audioSource:this.devices?.audioSource,videoSource:this.devices?.videoSource,publishAudio:this.isAudioOn,publishVideo:this.isVideoOn},e=>{e&&W.error("error initializing publisher",e),this.session.publish(this.publisher)}),this.health.attach(this.publisher,{audioOn:()=>this.isAudioOn,videoOn:()=>this.isVideoOn,inCall:()=>!this.isWaitingRoom}),document.addEventListener("visibilitychange",this._handleVisibilityChange)}disconnectedCallback(){document.removeEventListener("visibilitychange",this._handleVisibilityChange),super.disconnectedCallback(),this.publisher?.destroy()}async _handleToggleAudioEvent(e){this.isAudioOn=e.isAudioOn,this.publisher.publishAudio(e.isAudioOn)}async _handleToggleVideoEvent(e){this.isVideoOn=e.isVideoOn,this.publisher.publishVideo(e.isVideoOn)}async _handleSelectDevice({kind:e,deviceId:t}){return"audio"===e?this.health.selectAudio(t):"speaker"===e?(this.speakerId=t,this.openTokService.setAudioOutputDevice(t).catch(e=>W.error("error setting the speaker",e))):void(await this.health.selectVideo(t)&&(this.isVideoOn=!0,this.publisher.publishVideo(!0)))}render(){const{cameraLost:e,audioOnly:t,audioOutputs:i}=this.health,n=null!==this.devices?.videoSource,r="setSinkId"in HTMLMediaElement.prototype?i:[];return s`<div class="top-items">${this.isWaitingRoom?s`<div></div>`:s`<div class="labels"><span class="label">${this.professionalName}</span> <span class="label" role="timer">${this.appointmentCounterController.formattedTime}</span></div>`}<div class="publisher-box"><div id="video-publisher"></div>${!this.isVideoOn||e||t?s`<div class="camera-off"><mq-avatar fallback="${this.loginToken.patient.name}" size="sm"></mq-avatar><span>${n?e?I("Cámara no disponible"):this.isVideoOn?I("Solo audio"):I("Cámara apagada"):I("Sin cámara")}</span></div>`:o}</div></div><publisher-controls .isAudioOn="${this.isAudioOn}" .isVideoOn="${this.isVideoOn&&!e&&!t}" .hasCamera="${n}" .cameraLost="${e}" .audioInputs="${this.health.audioInputs}" .videoInputs="${this.health.videoInputs}" .audioDeviceId="${this.health.audioDeviceId}" .videoDeviceId="${this.health.videoDeviceId}" .notice="${this.isReconnecting?void 0:this.health.notice}" .micLabel="${this.health.micLabel}" .helpDot="${this.health.connectionAlert&&!this.helpOpen}" ?is-waiting-room="${this.isWaitingRoom}" @toggle-audio="${this._handleToggleAudioEvent}" @toggle-video="${this._handleToggleVideoEvent}" @select-device="${this._handleSelectDevice}" @flip-camera="${()=>this.health.flipCamera()}" @open-help="${()=>{this.helpOpen=!0}}"></publisher-controls><flash-help-panel .open="${this.helpOpen}" .history="${this.health.history}" .unstable="${this.health.connectionAlert}" .detected="${this.health.active.filter(e=>"unstable"!==e).map(e=>Vi(e,this.health.micLabel))}" .videoOn="${this.isVideoOn&&n&&!e&&!t}" .hasChat="${this.hasChatInAppointment}" .speakers="${r}" .speakerId="${this.speakerId??(r.find(e=>"default"===e.deviceId)??r[0])?.deviceId}" @mq-close="${()=>{this.helpOpen=!1}}" @toggle-video="${e=>{this.helpOpen=!1,this._handleToggleVideoEvent(e)}}" @open-chat="${()=>{this.helpOpen=!1}}" @select-device="${this._handleSelectDevice}"></flash-help-panel>`}};e([l({type:Object})],_i.prototype,"session",void 0),e([l({type:String})],_i.prototype,"professionalName",void 0),e([l({type:String})],_i.prototype,"startsAt",void 0),e([l({type:Boolean,reflect:!0,attribute:"is-waiting-room"})],_i.prototype,"isWaitingRoom",void 0),e([l({type:Boolean})],_i.prototype,"hasChatInAppointment",void 0),e([l({type:Boolean,attribute:"is-reconnecting"})],_i.prototype,"isReconnecting",void 0),e([l({type:Object})],_i.prototype,"devices",void 0),e([l({type:Boolean})],_i.prototype,"doctorUnstable",void 0),e([c({context:Le})],_i.prototype,"openTokService",void 0),e([c({context:u})],_i.prototype,"loginToken",void 0),e([Te("#video-publisher")],_i.prototype,"publisherEl",void 0),e([S()],_i.prototype,"isAudioOn",void 0),e([S()],_i.prototype,"isVideoOn",void 0),e([S()],_i.prototype,"helpOpen",void 0),e([S()],_i.prototype,"speakerId",void 0),_i=e([A(),t("video-publisher")],_i);class SubscriberHealthController{constructor(e,t){this.onChange=t,this.unstable=!1,this.subscribedAt=0,this.recent=[],e.addController(this)}attach(e){clearInterval(this.timer),this.subscriber=e,this.subscribedAt=Date.now(),this.lastStats=void 0,this.recent=[],this.timer=setInterval(()=>{this.poll()},2e3)}hostDisconnected(){clearInterval(this.timer),this.subscriber=void 0,this.set(!1)}set(e){this.unstable!==e&&(this.unstable=e,this.onChange(e))}async poll(){if(Date.now()-this.subscribedAt<6e3)return;let e;try{e=await(this.subscriber?.getStats())}catch{return}if(!e)return;const t=(({timestamp:e,audio:t,video:i})=>({timestamp:e,packetsReceived:t.packetsReceived+(i?.packetsReceived??0),packetsLost:t.packetsLost+(i?.packetsLost??0)}))(e),i=this.lastStats;if(this.lastStats=t,!i)return;const o=ct(function(e,t){const i=t.packetsReceived-e.packetsReceived,o=t.packetsLost-e.packetsLost;if(t.timestamp<=e.timestamp||i<0||o<0)return{lossPct:0};const s=i+o;return{lossPct:s>0?100*o/s:0}}(i,t));this.recent=[...this.recent,o].slice(-2),this.recent.length<2||(this.recent.every(e=>"good"!==e)?this.set(!0):this.recent.every(e=>"good"===e)&&this.set(!1))}}let Ni=class VideoSubscriber extends n{constructor(){super(...arguments),this.professionalName="",this.isVideoOn=!0,this.health=new SubscriberHealthController(this,e=>this.dispatchEvent(new DoctorConnectionEvent(e))),this._subscriberProperties={fitMode:"cover",insertMode:"append",width:"100%",height:"100%"},this._handleVisibilityChange=()=>{"visible"===document.visibilityState&&this.subscriber&&(this.subscriber.subscribeToAudio(!1),this.subscriber.subscribeToVideo(!1),setTimeout(()=>{this.subscriber?.subscribeToAudio(!0),this.subscriber?.subscribeToVideo(!0)},500),setTimeout(()=>this._resubscribe(),600))}}static{this.styles=i`:host{position:absolute;inset:0}.OT_subscriber{width:100%;height:100%;position:absolute;inset:0}video{width:100%;height:100%}.video-disabled{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-3);background:var(--color-primary-dark);color:var(--color-white);font-family:var(--font-body);font-size:var(--text-sm);line-height:1.35;text-align:center}.video-disabled mq-avatar{--mq-avatar-bg:var(--color-primary-light);--mq-avatar-color:var(--color-primary);--mq-avatar-font-size:var(--text-xl)}.video-disabled span:first-of-type{font-size:var(--text-base);font-weight:var(--font-weight-medium)}.video-disabled span:last-child{opacity:.8}.hidden{display:none}`}firstUpdated(){this._subscribe(),document.addEventListener("visibilitychange",this._handleVisibilityChange)}_subscribe(){this.subscriber=this.openTokService.subscribe(this.session,this.stream,this.subscriberEl,this._subscriberProperties,e=>{}),this._attachSubscriberEvents(),this.health.attach(this.subscriber)}_attachSubscriberEvents(){this.subscriber.on("connected",e=>{this.isVideoOn=e.target.stream?.hasVideo??!0}),this.subscriber.on("videoDisabled",()=>{this.isVideoOn=!1}),this.subscriber.on("videoEnabled",()=>{this.isVideoOn=!0}),this.subscriber.on("disconnected",()=>{this.isVideoOn=!1})}_resubscribe(){if(this.subscriber&&this.session&&this.subscriberEl){try{this.session.unsubscribe(this.subscriber)}catch{}this.subscriberEl.innerHTML="",this._subscribe()}}disconnectedCallback(){if(document.removeEventListener("visibilitychange",this._handleVisibilityChange),this.subscriber&&this.session)try{this.session.unsubscribe(this.subscriber)}catch{}super.disconnectedCallback()}render(){return s`<div id="video-subscriber" class="${this.isVideoOn?"":"hidden"}"></div>${this.isVideoOn?s``:s`<div class="video-disabled"><mq-avatar src="${this.professionalAvatar??""}" fallback="${this.professionalName}" alt="${this.professionalName}" size="md"></mq-avatar><span>${this.professionalName}</span> <span>${I("Solo audio")}</span></div>`}`}};e([l({type:Object})],Ni.prototype,"session",void 0),e([l({type:Object})],Ni.prototype,"stream",void 0),e([l({type:String})],Ni.prototype,"professionalName",void 0),e([l({type:String})],Ni.prototype,"professionalAvatar",void 0),e([S()],Ni.prototype,"isVideoOn",void 0),e([c({context:Le})],Ni.prototype,"openTokService",void 0),e([Te("#video-subscriber")],Ni.prototype,"subscriberEl",void 0),Ni=e([A(),t("video-subscriber")],Ni);let ji=class VideocallContent extends n{constructor(){super(...arguments),this.streams=[],this.doctorUnstable=!1,this.isWaitingRoom=!1,this.isReconnecting=!1}static{this.styles=i`:host{display:block;position:relative;width:100%;height:100%;background:var(--color-primary-dark);aspect-ratio:16/9;font-family:var(--font-body)}@media (max-width:767px){:host(:not([is-waiting-room])){aspect-ratio:9/16}}.reconnecting-overlay{position:absolute;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 var(--sp-6);background:color-mix(in srgb,var(--color-primary-dark) 70%,transparent);color:var(--color-white);text-align:center}.reconnecting-overlay__text{margin:var(--sp-4) 0 var(--sp-3);font-size:var(--text-xl);font-weight:var(--font-weight-medium);line-height:1.35}.reconnecting-overlay__subtitle{max-width:340px;margin:0 0 var(--sp-5);font-size:var(--text-sm);line-height:1.35;opacity:.85}`}firstUpdated(){this.isWaitingRoom||m.track(f(this.loginToken.patient.hash,this.appointment.id??""))}updated(e){e.has("isWaitingRoom")&&!0===e.get("isWaitingRoom")&&!this.isWaitingRoom&&m.track(f(this.loginToken.patient.hash,this.appointment.id??""))}render(){return s`<video-publisher .session="${this.session}" .devices="${this.devices}" ?is-waiting-room="${this.isWaitingRoom}" ?is-reconnecting="${this.isReconnecting}" .professionalName="${this.appointment.from.name??""}" .startsAt="${this.appointment.started_at??(new Date).toISOString()}" .hasChatInAppointment="${!0===this.appointment.has_chat_in_appointment}" .doctorUnstable="${this.doctorUnstable&&this.streams.length>0}"></video-publisher>${0===this.streams.length?s``:this.streams.map(e=>s`<video-subscriber .session="${this.session}" .stream="${e}" .professionalName="${this.appointment.from.name??""}" .professionalAvatar="${this.appointment.from.avatar}" @doctor-connection="${e=>{this.doctorUnstable=e.unstable}}"></video-subscriber>`)} ${this.isReconnecting?s`<div class="reconnecting-overlay" role="alert" aria-live="assertive">${ee({color:"var(--color-white)"})}<p class="reconnecting-overlay__text">${I("Reconectando…")}</p><p class="reconnecting-overlay__subtitle">${I("Se ha cortado tu conexión. No cierres esta pantalla, estamos volviendo a conectar con tu médico.")}</p>${!0===this.appointment.has_chat_in_appointment?s`<mq-text-button variant="white" size="sm" @click="${()=>this.dispatchEvent(new OpenChatEvent)}">${ze({size:16})} ${I("Escribir al médico por chat")}</mq-text-button>`:o}</div>`:""}`}};e([l({type:Object})],ji.prototype,"session",void 0),e([l({type:Array})],ji.prototype,"streams",void 0),e([l({type:Object})],ji.prototype,"appointment",void 0),e([l({type:Object})],ji.prototype,"devices",void 0),e([S()],ji.prototype,"doctorUnstable",void 0),e([l({type:Boolean,reflect:!0,attribute:"is-waiting-room"})],ji.prototype,"isWaitingRoom",void 0),e([l({type:Boolean,reflect:!0,attribute:"is-reconnecting"})],ji.prototype,"isReconnecting",void 0),e([c({context:u})],ji.prototype,"loginToken",void 0),ji=e([A(),t("mq-videocall-content")],ji);class ReviewSubmittedEvent extends Event{static{this.eventName="review-submitted"}constructor(){super(ReviewSubmittedEvent.eventName,{bubbles:!0,composed:!0})}}class ReviewSkippedEvent extends Event{static{this.eventName="review-skipped"}constructor(){super(ReviewSkippedEvent.eventName,{bubbles:!0,composed:!0})}}let Ui=class ReviewView extends n{constructor(){super(...arguments),this.rating=0,this.comment="",this._reviewMutation=new Ie(this,{mutationFn:({rating:e,comment:t})=>this.apiClient.consultations.postReview({consultation_id:this.appointment.id??"",consultation_type:k.appointment,rating:e,comment:t.trim()?t.trim():null}),onSuccess:()=>{this.dispatchEvent(new ReviewSubmittedEvent)},onError:e=>{!function(e){const t=e,i=t?.response?.status;return 400===i&&/already exists/i.test(t?.response?.data?.message??"")}(e)?ge.error(I("No se ha podido enviar el cuestionario"),{closeLabel:I("Cerrar")}):this.dispatchEvent(new ReviewSubmittedEvent)}}),this._reconnectMutation=new Ie(this,{mutationFn:e=>this.apiClient.appointments.reconnectAppointment(e),onSuccess:()=>{this.dispatchEvent(new CustomEvent("review-reconnect",{bubbles:!0,composed:!0}))},onError:()=>{ge.error(I("No se ha podido volver a la sala de espera"),{closeLabel:I("Cerrar")})}}),this.handleSkip=()=>{this.dispatchEvent(new ReviewSkippedEvent)},this.handleSubmit=()=>{this.rating<1||this.rating>5||this._reviewMutation.isPending||this._reviewMutation.run({rating:this.rating,comment:this.comment})}}static{this.styles=i`:host{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%;background-color:var(--color-background);box-sizing:border-box}.container{width:100%;max-width:500px;display:flex;flex-direction:column;gap:var(--sp-5);box-sizing:border-box}@media (min-width:768px){.container{padding:var(--sp-6)}}.title{margin:0;padding:0 var(--sp-6);font-family:var(--font-titles);font-size:var(--text-2xl);line-height:var(--text-2xl--line-height);font-weight:var(--font-weight-normal);color:var(--color-primary);text-align:center}.rating{display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-6)}.subtitle{margin:0;font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm--line-height);color:var(--color-text-icons--secondary);text-align:center}.comment-card{background-color:var(--color-white);border:var(--action-border-width) solid var(--color-border);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-sm);padding:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-5)}.comment-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--sp-3)}.comment-label{font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-neutrals-text-default)}.comment-counter{font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm--line-height);font-weight:var(--font-weight-normal);color:var(--color-text-icons--secondary);white-space:nowrap}.textarea{width:100%;box-sizing:border-box;height:var(--size-44);padding:var(--sp-3) var(--sp-4);background-color:var(--color-gray-lighter);border:var(--action-border-width) solid var(--color-border);border-radius:var(--border-radius-md);font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm--line-height);color:var(--color-neutrals-text-default);resize:none}.textarea::placeholder{color:var(--color-text-icons--secondary);opacity:.6}.textarea:focus{outline:0;border-color:var(--color-primary)}.actions{display:flex;gap:var(--sp-4)}.btn{flex:1;height:var(--button-height-md);padding:var(--sp-2) var(--sp-4);border-radius:var(--border-radius-md);font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm--line-height);font-weight:var(--font-weight-medium);cursor:pointer;transition:opacity .15s ease-in-out}.btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.btn:disabled{cursor:not-allowed}.btn-skip{background:var(--color-white);border:var(--action-border-width) solid var(--color-primary);color:var(--color-primary)}.btn-skip:hover:not(:disabled){background:var(--color-primary-background-extraWeak)}.btn-submit{background:var(--color-primary);border:var(--action-border-width) solid var(--color-primary);color:var(--color-white)}.btn-submit:hover:not(:disabled){background:var(--color-primary-dark)}.btn-submit:disabled{opacity:.5}.waiting-card{background-color:var(--color-background-primary-light);border-radius:var(--border-radius-lg);padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2)}.waiting-header{display:flex;align-items:center;gap:var(--sp-2);color:var(--color-neutrals-text-default)}.waiting-title{font-family:var(--font-body);font-size:var(--text-xs);line-height:1;font-weight:var(--font-weight-medium);color:var(--color-neutrals-text-default)}.waiting-body{margin:0;font-family:var(--font-body);font-size:var(--text-xs);line-height:var(--text-xs--line-height);color:var(--color-text-icons--secondary)}.waiting-link{background:0 0;border:0;padding:0;cursor:pointer;color:var(--color-primary-text-link);font:inherit;text-decoration:none}.waiting-link:hover{text-decoration:none}.waiting-link:disabled{cursor:not-allowed;opacity:.6}`}render(){return s`<div class="container"><h1 class="title">${I("¿Qué tal ha ido tu cita?")}</h1><div class="rating"><mq-rating .value="${this.rating}" .label="${I("Valoración de la consulta")}" @mq-rating-change="${e=>{this.rating=e.value}}"></mq-rating><p class="subtitle">${I("(1 es muy malo, 5 es excelente)")}</p></div><div class="comment-card"><div class="comment-header"><span class="comment-label">${I("¿Tienes comentarios sobre la consulta?")}</span> <span class="comment-counter">${this.comment.length}/${240}</span></div><textarea class="textarea" maxlength="${240}" placeholder="${I("Comparte cómo fue la atención o si tuviste algún problema con la videollamada…")}" .value="${this.comment}" @input="${e=>{this.comment=e.target.value}}"></textarea><div class="actions"><button type="button" class="btn btn-skip" ?disabled="${this._reviewMutation.isPending}" @click="${this.handleSkip}">${I("Omitir")}</button> <button type="button" class="btn btn-submit" ?disabled="${this.rating<1||this._reviewMutation.isPending}" @click="${this.handleSubmit}">${I("Enviar")}</button></div></div><div class="waiting-card"><div class="waiting-header">${H({color:"currentColor",size:18})} <span class="waiting-title">${I("¿Ocurrió algún problema?")}</span></div><p class="waiting-body">${I("Si la cita no se ha podido realizar, puedes")} <button type="button" class="waiting-link" ?disabled="${this._reconnectMutation.isPending}" @click="${()=>this._reconnectMutation.run({appointmentId:this.appointment.id})}">${I("volver a la sala de espera.")}</button></p></div></div>`}};e([c({context:p,subscribe:!0})],Ui.prototype,"apiClient",void 0),e([l({type:Object})],Ui.prototype,"appointment",void 0),e([S()],Ui.prototype,"rating",void 0),e([S()],Ui.prototype,"comment",void 0),Ui=e([A(),t("review-view")],Ui);let Fi=class ErrorView extends n{static{this.styles=i`.container{display:grid;place-items:center;width:100%;max-width:447px;margin:0 auto}.card>:not(:first-child){margin-top:var(--size-8)}.title{font-family:var(--font-titles);color:var(--color-neutrals-text-default);font-size:var(--text-2xl);line-height:var(--text-2xl--line-height);font-weight:var(--font-weight-bold);margin:0;margin-bottom:var(--size-3)}.description{color:var(--color-neutrals-text-default);font-size:var(--text-sm);line-height:var(--text-sm--line-height);font-weight:400}`}render(){return s`<div class="container"><div class="card"><slot name="icon"></slot><div class="content"><h1 class="title">${this.title}</h1><p class="description">${this.message}</p></div><slot></slot></div></div>`}};e([l({type:String})],Fi.prototype,"title",void 0),e([l({type:String})],Fi.prototype,"message",void 0),Fi=e([t("error-view")],Fi);let Wi=class UnexpectedErrorView extends n{render(){return s`<error-view .title="${I("Error desconocido")}" .message="${I("Ha ocurrido un error al cargar la página. Por favor, intenta nuevamente o contacta al soporte.")}"><div slot="icon">${Oe()}</div></error-view>`}};Wi=e([A(),t("unexpected-error-view")],Wi);let Bi=class ExpiredAppointmentErrorView extends n{render(){return s`<error-view .title="${I("Consulta caducada")}" .message="${I("Parece que no te hemos encontrado a la hora de tu cita. Puedes programar otra consulta para resolver tus dudas.")}"><div slot="icon">${Ae()}</div></error-view>`}};Bi=e([A(),t("expired-appointment-error-view")],Bi);let Hi=class NotFoundErrorView extends n{static{this.styles=i`div{display:flex;flex-direction:column;gap:2px}span{font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:400;color:var(--color-gray-medium)}`}render(){return s`<error-view .title="${I("Página no encontrada")}" .message="${I("La página que estás buscando fue removida, renombrada o puede que no exista.")}"><div slot="icon"><span>404</span> ${Oe()}</div></error-view>`}};function Ki(e){try{return function(e,t){if("string"!=typeof e)throw new InvalidTokenError("Invalid token specified: must be a string");t||(t={});const i=!0===t.header?0:1,o=e.split(".")[i];if("string"!=typeof o)throw new InvalidTokenError(`Invalid token specified: missing part #${i+1}`);let s;try{s=Me(o)}catch(e){throw new InvalidTokenError(`Invalid token specified: invalid base64 for part #${i+1} (${e.message})`)}try{return JSON.parse(s)}catch(e){throw new InvalidTokenError(`Invalid token specified: invalid json for part #${i+1} (${e.message})`)}}(e)}catch{return null}}Hi=e([A(),t("not-found-error-view")],Hi);let Yi=class MqVideocallProvider extends n{static{this.styles=[Fe,i`*{box-sizing:border-box}:host{display:grid;min-height:inherit;margin:0 auto;width:100%;height:100%}documentation-view{display:block}@media (min-width:768px){documentation-view{padding:var(--sp-4)}}.view{position:relative}.stage-skeleton{position:absolute;inset:0}mq-videocall-content{animation:appear .3s cubic-bezier(.23,1,.32,1)}@keyframes appear{from{opacity:0}}@media (prefers-reduced-motion:reduce){mq-videocall-content{animation:none}}`]}constructor(){super(),this.apiClient=$(),this.opentokService=new OpenTokService,this.params={appointmentId:this.appointmentId,token:this.token,apiKey:this.apiKey},this.crossfade=new Crossfade(this),this.appointmentTask=new h(this,{task:async([e,,])=>{const[t,i,o]=await Promise.all([this.apiClient.flash.getAppointment({appointmentId:e}),this.apiClient.consultations.getReview(e).then(()=>!0).catch(()=>!1),this.apiClient.organizations.getOrganizationSetup().catch(()=>{})]);return{appointment:t,hasReview:i,hasNps:!0===o?.appointments?.has_nps}},args:()=>[this.appointmentId,this.apiKey,this.token]}),this.addEventListener(OpenChatEvent.eventName,()=>m.track(g(this.loginToken.patient.hash,this.appointmentId)))}willUpdate(e){const t=q(e,{apiKey:this.apiKey,token:this.token},this.inheritedApiClient);if(t&&(this.apiClient=t),this.appointmentTask.value&&!this.screen){const{appointment:e,hasReview:t,hasNps:i}=this.appointmentTask.value,o=function(e,t){return y(e)?e.status===w.finished||e.status===w.reporting?t?Ue:Ne:Ve:je}(e,i);this.screen=o===Ue&&t?Ne:o,this.params={appointmentId:this.appointmentId,token:this.token,apiKey:this.apiKey}}}enterWaitingRoom(e){const t=this.appointmentTask.value;if(!t)return;const{appointment:i,hasReview:o,hasNps:s}=t;this.devices=e.devices,this.opentokController??=new OpenTokController(this,this.apiClient,i,this.token,()=>{this.screen!==_e&&(this.screen=_e,this.dispatchEvent(new CallStartedEvent))},()=>{this.screen!==Ne&&this.screen!==Ue&&(this.screen=!s||o?Ne:Ue,this.dispatchEvent(new CallFinishedEvent))},e=>this.dispatchEvent(new CallSessionEvent(e))),this.screen=Pe}reenter(){this.opentokController?.reconnect()}render(){const e=s`<device-check-skeleton></device-check-skeleton>`,t=this.renderView(e);return this.crossfade.wrap(t,t===e?e:void 0)}renderView(e){const t=s`<mq-layout background="transparent"><not-found-error-view></not-found-error-view></mq-layout>`;return this.appointmentTask.render({pending:()=>e,error:e=>{const i=Ki(this.token);return i?.exp&&i.exp<Date.now()/1e3?s`<mq-layout background="transparent"><expired-appointment-error-view></expired-appointment-error-view></mq-layout>`:x(e)&&e.response?.status&&e.response.status<500?t:s`<mq-layout background="transparent"><unexpected-error-view></unexpected-error-view></mq-layout>`},complete:({appointment:e,hasNps:i})=>{if(this.opentokController?.errorMessage)return t;if(this.screen===Ve)return s`<device-check .appointment="${e}" @enter-waiting-room="${this.enterWaitingRoom}"></device-check>`;if(this.screen===je)return s`<mq-layout background="transparent"><not-time-yet-view .appointment="${e}"></not-time-yet-view></mq-layout>`;if(this.screen===Ue)return s`<mq-layout background="transparent"><review-view .appointment="${e}" @review-submitted="${()=>{this.screen=Ne}}" @review-skipped="${()=>{this.screen=Ne}}" @review-reconnect="${()=>{this.screen=Ve}}"></review-view></mq-layout>`;if(this.screen===Ne)return s`<mq-layout background="transparent"><documentation-view .appointment="${e}" .token="${this.token}" ?can-reconnect="${!i}" @reconnect="${()=>{this.screen=Ve}}"></documentation-view></mq-layout>`;if(this.screen===Pe||this.screen===_e){const t=this.opentokController?.isLoading?void 0:this.opentokController?.session,i=!0===this.opentokController?.connectionLost;return s`<waiting-room-layout .appointment="${e}" ?is-waiting-room="${this.screen===Pe}" ?doctor-in="${(this.opentokController?.streams.length??0)>0}">${t?s`<mq-videocall-content .session="${t}" .devices="${this.devices}" .streams="${this.opentokController?.streams??[]}" ?is-waiting-room="${this.screen===Pe}" ?is-reconnecting="${this.opentokController?.isReconnecting}" .appointment="${e}"></mq-videocall-content>`:s`<mq-skeleton class="stage-skeleton" height="100%" border-radius="none"></mq-skeleton>`}</waiting-room-layout><connection-lost-dialog ?open="${i}" ?in-call="${this.screen===_e}" .appointment="${e}" @reenter-call="${this.reenter}"></connection-lost-dialog>`}return s`<mq-layout background="transparent"><unexpected-error-view></unexpected-error-view></mq-layout>`}})}};e([l({type:String,attribute:"appointment-id"})],Yi.prototype,"appointmentId",void 0),e([l({type:String,attribute:"api-key"})],Yi.prototype,"apiKey",void 0),e([l({type:String})],Yi.prototype,"token",void 0),e([c({context:p,subscribe:!0}),S()],Yi.prototype,"inheritedApiClient",void 0),e([d({context:p}),S()],Yi.prototype,"apiClient",void 0),e([c({context:u})],Yi.prototype,"loginToken",void 0),e([S()],Yi.prototype,"screen",void 0),e([d({context:Le})],Yi.prototype,"opentokService",void 0),e([d({context:Re})],Yi.prototype,"params",void 0),Yi=e([t("mq-videocall-provider")],Yi);let Gi=class MqVideocall extends n{static{this.styles=i`:host{display:block;width:100%;height:100%}`}render(){return s`<mq-videocall-provider .appointmentId="${this.appointmentId}" .token="${this.token}" .apiKey="${this.apiKey}"></mq-videocall-provider>`}};e([l({type:String,attribute:"appointment-id"})],Gi.prototype,"appointmentId",void 0),e([l({type:String,attribute:"api-key"})],Gi.prototype,"apiKey",void 0),e([l({type:String})],Gi.prototype,"token",void 0),Gi=e([t("mq-videocall")],Gi);export{CallFinishedEvent as C,DevicesPermissionEvent as D,EnterWaitingRoomEvent as E,Gi as M,OpenChatEvent as O,ReenterCallEvent as R,ToggleAudioEvent as T,ViewDocumentationEvent as V,CallSessionEvent as a,CallStartedEvent as b,DownloadFileEvent as c,ReviewSkippedEvent as d,ReviewSubmittedEvent as e,ToggleChatEvent as f,ToggleVideoEvent as g};