@mediquo/elements 0.3.1 → 0.4.0

package/dist/react/mq-support-chat.d.ts

@@ -0,0 +1,15 @@
+import * as _lit_react from '@lit/react';
+import { MqSupportChat as MqSupportChat$1 } from '../mq-support-chat.js';
+import 'lit-html';
+import 'lit';
+import '../chunks/mq-chat-room-DuG4RuIp.js';
+import '../ui/mq-avatar.js';
+import '../ui/mq-button.js';
+import '../ui/mq-skeleton.js';
+import 'zod';
+import '../chunks/appointment.model.d-Dy50gMPg.js';
+import '@tanstack/query-core';
+
+declare const MqSupportChat: _lit_react.ReactWebComponent<MqSupportChat$1, {}>;
+
+export { MqSupportChat };

package/dist/react/mq-support-chat.js

@@ -0,0 +1,2 @@
+"use client";
+import{o as t}from"../chunks/create-component-BB-6Gu6l.js";import*as s from"react";import{MqSupportChat as o}from"../mq-support-chat.js";import"../chunks/custom-element-DA9Fxvxd.js";import"../chunks/runtime-Bg1WXVCx.js";import"../chunks/parseISO-jT42c8Ob.js";import"../chunks/api-chat-client-C8SqZtCa.js";import"../chunks/external-zAbuzxDj.js";import"../chunks/format-Cm3B1GMy.js";import"../chunks/isBefore-Cof0D841.js";import"../env.js";import"../chunks/mutation-controller-OVT8NEt6.js";import"../chunks/query-QJ1INUTG.js";import"../chunks/context-provider-CiMFpvDA.js";import"../chunks/context-request-event-Dfydf1ub.js";import"../chunks/get-organization-setup-query-BMbuRi6v.js";import"../chunks/exports-G_7Ih_GH.js";import"../chunks/provide-CfT7g_Zi.js";import"../chunks/lit-element-DiWJYFwC.js";import"../chunks/property-scuRaFcM.js";import"../chunks/state-LQivXIgA.js";import"../theme.js";import"../ui/icons/x-icon.js";import"../ui/icons/types.js";import"../ui/mq-avatar.js";import"../chunks/class-map-Co76I6aw.js";import"../chunks/directive-2EDmOukv.js";import"../ui/mq-button.js";import"../ui/mq-skeleton.js";import"../chunks/style-map-CIdqdn7C.js";import"../chunks/if-defined-BYeVdwgd.js";import"../ui/icons/chevron-left-icon.js";import"../chunks/query-CeeutdfT.js";import"../events.js";import"../ui/icons/check-double-icon.js";import"../ui/icons/check-icon.js";import"../i18n.js";import"../chunks/chunk-YTQUGGS3-DN-JZpgG.js";import"../ui/icons/annotation-question-icon.js";import"../ui/icons/spinner-icon.js";import"../ui/mq-toast.js";const i=t({react:s,tagName:"mq-support-chat",elementClass:o});export{i as MqSupportChat};

package/dist/react/mq-theme-provider.d.ts

@@ -0,0 +1,8 @@
+import * as _lit_react from '@lit/react';
+import { MqThemeProvider as MqThemeProvider$1 } from '../mq-theme-provider.js';
+import 'lit-html';
+import 'lit';
+
+declare const MqThemeProvider: _lit_react.ReactWebComponent<MqThemeProvider$1, {}>;
+
+export { MqThemeProvider };

package/dist/react/mq-theme-provider.js

@@ -0,0 +1,2 @@
+"use client";
+import{o as e}from"../chunks/create-component-BB-6Gu6l.js";import*as t from"react";import{MqThemeProvider as r}from"../mq-theme-provider.js";import"../chunks/custom-element-DA9Fxvxd.js";import"../chunks/lit-element-DiWJYFwC.js";import"../chunks/property-scuRaFcM.js";import"../chunks/state-LQivXIgA.js";import"../theme.js";import"../chunks/ensure-context-root-DbdqwnKB.js";import"../chunks/context-request-event-Dfydf1ub.js";const o=e({react:t,tagName:"mq-theme-provider",elementClass:r});export{o as MqThemeProvider};

package/dist/react/mq-videocall.d.ts

@@ -0,0 +1,25 @@
+import * as _lit_react from '@lit/react';
+import { MqVideocall as MqVideocall$1 } from '../mq-videocall.js';
+import 'lit-html';
+import 'lit';
+import '@lit/task';
+import '../chunks/appointment.model.d-Dy50gMPg.js';
+import 'zod';
+import '@opentok/client';
+import '../ui/back-link.js';
+import '../ui/mq-text-button.js';
+import '../chunks/professional-overview-mO3tuMuH.js';
+import '../ui/mq-avatar.js';
+import '../ui/mq-button.js';
+import '../chunks/mq-chat-room-DuG4RuIp.js';
+import '../ui/mq-skeleton.js';
+import '@tanstack/query-core';
+import '../ui/mq-floating-bubble.js';
+import '../ui/mq-card.js';
+import '../ui/mq-unread-badge.js';
+import '../ui/mq-rating.js';
+import '../chunks/mq-layout-D8Mak16a.js';
+
+declare const MqVideocall: _lit_react.ReactWebComponent<MqVideocall$1, {}>;
+
+export { MqVideocall };

package/dist/react/mq-videocall.js

@@ -0,0 +1,2 @@
+"use client";
+import{o as i}from"../chunks/create-component-BB-6Gu6l.js";import*as o from"react";import{MqVideocall as s}from"../mq-videocall.js";import"../chunks/custom-element-DA9Fxvxd.js";import"../chunks/lit-element-DiWJYFwC.js";import"../chunks/property-scuRaFcM.js";import"../ui/icons/spinner-icon.js";import"../ui/icons/types.js";import"../chunks/provide-CfT7g_Zi.js";import"../chunks/context-provider-CiMFpvDA.js";import"../chunks/context-request-event-Dfydf1ub.js";import"../chunks/task-Bj8p7kJX.js";import"../chunks/api-chat-client-C8SqZtCa.js";import"../chunks/external-zAbuzxDj.js";import"../chunks/parseISO-jT42c8Ob.js";import"../chunks/runtime-Bg1WXVCx.js";import"../chunks/format-Cm3B1GMy.js";import"../chunks/isBefore-Cof0D841.js";import"../env.js";import"../chunks/state-LQivXIgA.js";import"../chunks/telemetry-client-BRVJU-fZ.js";import"../i18n.js";import"../ui/icons/chevron-down-icon.js";import"../chunks/if-defined-BYeVdwgd.js";import"../ui/mq-text-button.js";import"../chunks/class-map-Co76I6aw.js";import"../chunks/directive-2EDmOukv.js";import"../ui/mq-avatar.js";import"../ui/icons/calendar-icon.js";import"../ui/back-link.js";import"../events.js";import"../ui/icons/chevron-left-icon.js";import"../chunks/mutation-controller-OVT8NEt6.js";import"../chunks/query-QJ1INUTG.js";import"../ui/icons/clock-icon.js";import"../ui/icons/info-circle-outine-icon.js";import"../ui/mq-button.js";import"../chunks/chunk-S5RWG6G2-oTcdgk2H.js";import"../ui/icons/message-bubble-icon.js";import"../chunks/exports-G_7Ih_GH.js";import"../theme.js";import"../ui/icons/x-icon.js";import"../ui/mq-skeleton.js";import"../chunks/style-map-CIdqdn7C.js";import"../chunks/query-CeeutdfT.js";import"../ui/icons/check-double-icon.js";import"../ui/icons/check-icon.js";import"../chunks/chunk-YTQUGGS3-DN-JZpgG.js";import"../ui/mq-floating-bubble.js";import"../ui/mq-card.js";import"../ui/mq-unread-badge.js";import"../ui/icons/chat-bubble-icon.js";import"../ui/icons/mic-icon.js";import"../ui/icons/mic-off-icon.js";import"../ui/icons/video-icon.js";import"../ui/icons/video-off-icon.js";import"../chunks/get-organization-setup-query-BMbuRi6v.js";import"../ui/icons/download-icon.js";import"../ui/icons/alert-circle-icon.js";import"../ui/mq-rating.js";import"../ui/mq-toast.js";import"../ui/icons/heartbeat-icon.js";import"../ui/icons/time-left-icon.js";import"../chunks/mq-layout-CpIZTsV2.js";const t=i({react:o,tagName:"mq-videocall",elementClass:s});export{t as MqVideocall};

package/dist/ui/mq-calendar.js

@@ -1 +1 @@
-import"../chunks/custom-element-DA9Fxvxd.js";import"../chunks/runtime-Bg1WXVCx.js";import"../chunks/parseISO-jT42c8Ob.js";import"../chunks/lit-element-DiWJYFwC.js";import"../chunks/property-scuRaFcM.js";import"../chunks/state-LQivXIgA.js";import"../chunks/class-map-Co76I6aw.js";import"./icons/chevron-left-icon.js";import"./icons/chevron-right-icon.js";import"./icons/spinner-icon.js";export{D as DateSelectEvent,M as MqCalendar,N as NextMonthEvent,P as PrevMonthEvent}from"../chunks/index-BYHKNPG2.js";import"../chunks/isSameDay-DPfclwIL.js";import"../chunks/isBefore-Cof0D841.js";import"../chunks/directive-2EDmOukv.js";import"../chunks/if-defined-BYeVdwgd.js";import"./icons/types.js";
+import"../chunks/custom-element-DA9Fxvxd.js";import"../chunks/runtime-Bg1WXVCx.js";import"../chunks/parseISO-jT42c8Ob.js";import"../chunks/lit-element-DiWJYFwC.js";import"../chunks/property-scuRaFcM.js";import"../chunks/state-LQivXIgA.js";import"../chunks/class-map-Co76I6aw.js";import"./icons/chevron-left-icon.js";import"./icons/chevron-right-icon.js";import"./icons/spinner-icon.js";export{D as DateSelectEvent,M as MqCalendar,N as NextMonthEvent,P as PrevMonthEvent}from"../chunks/index-DiqYAEHW.js";import"../chunks/isSameDay-DPfclwIL.js";import"../chunks/isBefore-Cof0D841.js";import"../chunks/directive-2EDmOukv.js";import"../chunks/if-defined-BYeVdwgd.js";import"./icons/types.js";

package/dist/ui/mq-clamped-text.js

@@ -1 +1 @@
-import"../chunks/custom-element-DA9Fxvxd.js";import"../chunks/lit-element-DiWJYFwC.js";import"../chunks/property-scuRaFcM.js";import"../chunks/state-LQivXIgA.js";import"../chunks/class-map-Co76I6aw.js";export{M as MqClampedText}from"../chunks/index-B9iWdvW3.js";import"../chunks/style-map-CIdqdn7C.js";import"./mq-text-button.js";import"../chunks/directive-2EDmOukv.js";import"../chunks/if-defined-BYeVdwgd.js";
+import"../chunks/custom-element-DA9Fxvxd.js";import"../chunks/lit-element-DiWJYFwC.js";import"../chunks/property-scuRaFcM.js";import"../chunks/state-LQivXIgA.js";import"../chunks/class-map-Co76I6aw.js";export{M as MqClampedText}from"../chunks/index-BJcdB5MT.js";import"../chunks/style-map-CIdqdn7C.js";import"./mq-text-button.js";import"../chunks/directive-2EDmOukv.js";import"../chunks/if-defined-BYeVdwgd.js";

package/dist/ui/mq-toast.js

@@ -1 +1 @@
-import{_ as t,t as o}from"../chunks/custom-element-DA9Fxvxd.js";import{i,a as s,x as e}from"../chunks/lit-element-DiWJYFwC.js";import{n as r}from"../chunks/property-scuRaFcM.js";import{r as a}from"../chunks/state-LQivXIgA.js";import{e as n}from"../chunks/class-map-Co76I6aw.js";import"../chunks/directive-2EDmOukv.js";const p=i`:host{position:fixed;display:flex;flex-direction:column;pointer-events:none;z-index:9999;gap:var(--sp-2)}:host{left:calc(var(--sp-4) + var(--mq-safe-left,0px));right:calc(var(--sp-4) + var(--mq-safe-right,0px));width:auto}:host([position=bottom-center]),:host([position=bottom-left]),:host([position=bottom-right]){bottom:calc(var(--sp-4) + var(--mq-safe-bottom,0px))}:host([position=top-center]),:host([position=top-left]),:host([position=top-right]){top:calc(var(--sp-4) + var(--mq-safe-top,0px));flex-direction:column-reverse}:host([position=bottom-center]),:host([position=bottom-left]),:host([position=bottom-right]),:host([position=top-center]),:host([position=top-left]),:host([position=top-right]){left:calc(var(--sp-4) + var(--mq-safe-left,0px));right:calc(var(--sp-4) + var(--mq-safe-right,0px));transform:none}:host([position=bottom-right]),:host([position=top-right]){align-items:flex-end}:host([position=bottom-left]),:host([position=top-left]){align-items:flex-start}:host([position=bottom-center]),:host([position=top-center]){align-items:center}@media (min-width:768px){:host{left:auto;right:auto;width:auto}:host([position=bottom-right]),:host([position=top-right]){right:calc(var(--sp-4) + var(--mq-safe-right,0px));left:auto;transform:none}:host([position=bottom-left]),:host([position=top-left]){left:calc(var(--sp-4) + var(--mq-safe-left,0px));right:auto;transform:none}:host([position=bottom-center]),:host([position=top-center]){left:50%;right:auto;transform:translateX(-50%)}}`,c=i`:host{display:grid;grid-template-rows:1fr;pointer-events:auto;overflow:hidden;width:100%;box-sizing:border-box;transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1)}@media (min-width:768px){:host{width:auto}}:host(.collapsing){grid-template-rows:0fr}.toast-wrapper{min-height:0;overflow:hidden;box-sizing:border-box}.toast{box-sizing:border-box;background-color:var(--color-gray-dark);border-radius:var(--border-radius-lg);color:var(--color-neutrals-background-extraWeak);font-family:var(--font-body);font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-normal);padding:var(--sp-4) var(--sp-2_5);text-align:center;width:100%;opacity:0;transform:translateY(12px);transition:opacity 350ms cubic-bezier(.16,1,.3,1),transform 350ms cubic-bezier(.16,1,.3,1)}@media (min-width:768px){.toast{width:auto;min-width:343px}}.toast.visible{opacity:1;transform:translateY(0)}.toast.exiting{opacity:0;transform:translateY(8px)}`;let h=class MqToast extends s{constructor(){super(...arguments),this.message="",this.variant="info",this.visible=!1,this.exiting=!1}static{this.styles=[c]}connectedCallback(){super.connectedCallback(),requestAnimationFrame(()=>{requestAnimationFrame(()=>{this.visible=!0})})}startExit(){return new Promise(t=>{this.exiting=!0,this.visible=!1,setTimeout(()=>{this.classList.add("collapsing")},200),setTimeout(t,500)})}render(){const t={toast:!0,visible:this.visible&&!this.exiting,exiting:this.exiting};return e`<div class="toast-wrapper"><div class="${n(t)}" role="status" aria-live="polite" aria-atomic="true">${this.message}</div></div>`}};t([r({type:String})],h.prototype,"message",void 0),t([r({type:String})],h.prototype,"variant",void 0),t([a()],h.prototype,"visible",void 0),t([a()],h.prototype,"exiting",void 0),h=t([o("mq-toast")],h);let l=class MqToastContainer extends s{constructor(){super(...arguments),this.position="bottom-right",this.toasts=[],this.timers=new Map}static{this.styles=[p]}generateId(){return`toast-${Date.now()}-${Math.random().toString(36).slice(2,9)}`}addToast(t,o,i={}){const s=this.generateId(),e=i.duration??3e3;i.position&&(this.position=i.position);const r={id:s,message:t,variant:o,duration:e,visible:!0,exiting:!1};if(this.toasts=[...this.toasts,r],e>0){const t=window.setTimeout(()=>{this.removeToast(s)},e);this.timers.set(s,t)}}async removeToast(t){const o=this.timers.get(t);o&&(window.clearTimeout(o),this.timers.delete(t));const i=this.shadowRoot?.querySelector(`mq-toast[data-toast-id="${t}"]`);i&&await i.startExit(),this.toasts=this.toasts.filter(o=>o.id!==t)}disconnectedCallback(){for(const t of this.timers.values())window.clearTimeout(t);this.timers.clear(),super.disconnectedCallback()}render(){return e`${this.toasts.map(t=>e`<mq-toast data-toast-id="${t.id}" .message="${t.message}" .variant="${t.variant}"></mq-toast>`)}`}};t([r({type:String,reflect:!0})],l.prototype,"position",void 0),t([a()],l.prototype,"toasts",void 0),l=t([o("mq-toast-container")],l);let m=null;function d(t){m=t}function f(){if(m?.isConnected)return m;let t=document.querySelector("mq-toast-container");if(!t){t=document.createElement("mq-toast-container");const o=document.querySelector("mq-theme-provider");o?o.appendChild(t):(console.warn("[mq-toast] No mq-theme-provider found. Toast may not have access to design tokens."),document.body.appendChild(t))}return t}const g={success(t,o){f().addToast(t,"success",o)},error(t,o){f().addToast(t,"error",o)},warning(t,o){f().addToast(t,"warning",o)},info(t,o){f().addToast(t,"info",o)}};export{h as MqToast,l as MqToastContainer,d as registerToastContainer,g as toast};
+import{_ as t,t as o}from"../chunks/custom-element-DA9Fxvxd.js";import{i,a as s,x as e}from"../chunks/lit-element-DiWJYFwC.js";import{n as r}from"../chunks/property-scuRaFcM.js";import{r as a}from"../chunks/state-LQivXIgA.js";import{e as n}from"../chunks/class-map-Co76I6aw.js";import"../chunks/directive-2EDmOukv.js";const p=i`:host{position:fixed;display:flex;flex-direction:column;pointer-events:none;z-index:9999;gap:var(--sp-2)}:host{left:calc(var(--sp-4) + var(--mq-safe-left,0px));right:calc(var(--sp-4) + var(--mq-safe-right,0px));width:auto}:host([position=bottom-center]),:host([position=bottom-left]),:host([position=bottom-right]){bottom:calc(var(--sp-4) + var(--mq-safe-bottom,0px))}:host([position=top-center]),:host([position=top-left]),:host([position=top-right]){top:calc(var(--sp-4) + var(--mq-safe-top,0px));flex-direction:column-reverse}:host([position=bottom-center]),:host([position=bottom-left]),:host([position=bottom-right]),:host([position=top-center]),:host([position=top-left]),:host([position=top-right]){left:calc(var(--sp-4) + var(--mq-safe-left,0px));right:calc(var(--sp-4) + var(--mq-safe-right,0px));transform:none}:host([position=bottom-right]),:host([position=top-right]){align-items:flex-end}:host([position=bottom-left]),:host([position=top-left]){align-items:flex-start}:host([position=bottom-center]),:host([position=top-center]){align-items:center}@media (min-width:768px){:host{left:auto;right:auto;width:auto}:host([position=bottom-right]),:host([position=top-right]){right:calc(var(--sp-4) + var(--mq-safe-right,0px));left:auto;transform:none}:host([position=bottom-left]),:host([position=top-left]){left:calc(var(--sp-4) + var(--mq-safe-left,0px));right:auto;transform:none}:host([position=bottom-center]),:host([position=top-center]){left:50%;right:auto;transform:translateX(-50%)}}`,c=i`:host{display:grid;grid-template-rows:1fr;pointer-events:auto;overflow:hidden;width:100%;box-sizing:border-box;transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1)}@media (min-width:768px){:host{width:auto}}:host(.collapsing){grid-template-rows:0fr}.toast-wrapper{min-height:0;overflow:hidden;box-sizing:border-box}.toast{box-sizing:border-box;background-color:var(--color-gray-dark);border-radius:var(--border-radius-lg);color:var(--color-neutrals-background-extraWeak);font-family:var(--font-body);font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-normal);padding:var(--sp-4) var(--sp-2_5);text-align:center;width:100%;opacity:0;transform:translateY(12px);transition:opacity 350ms cubic-bezier(.16,1,.3,1),transform 350ms cubic-bezier(.16,1,.3,1)}@media (min-width:768px){.toast{width:auto;min-width:343px}}.toast.visible{opacity:1;transform:translateY(0)}.toast.exiting{opacity:0;transform:translateY(8px)}`;let l=class MqToast extends s{constructor(){super(...arguments),this.message="",this.variant="info",this.visible=!1,this.exiting=!1}static{this.styles=[c]}connectedCallback(){super.connectedCallback(),requestAnimationFrame(()=>{requestAnimationFrame(()=>{this.visible=!0})})}startExit(){return new Promise(t=>{this.exiting=!0,this.visible=!1,setTimeout(()=>{this.classList.add("collapsing")},200),setTimeout(t,500)})}render(){const t={toast:!0,visible:this.visible&&!this.exiting,exiting:this.exiting};return e`<div class="toast-wrapper"><div class="${n(t)}" role="status" aria-live="polite" aria-atomic="true">${this.message}</div></div>`}};t([r({type:String})],l.prototype,"message",void 0),t([r({type:String})],l.prototype,"variant",void 0),t([a()],l.prototype,"visible",void 0),t([a()],l.prototype,"exiting",void 0),l=t([o("mq-toast")],l);let h=class MqToastContainer extends s{constructor(){super(...arguments),this.position="bottom-right",this.toasts=[],this.timers=new Map}static{this.styles=[p]}generateId(){return`toast-${Date.now()}-${Math.random().toString(36).slice(2,9)}`}addToast(t,o,i={}){const s=this.generateId(),e=i.duration??3e3;i.position&&(this.position=i.position);const r={id:s,message:t,variant:o,duration:e,visible:!0,exiting:!1};if(this.toasts=[...this.toasts,r],e>0){const t=window.setTimeout(()=>{this.removeToast(s)},e);this.timers.set(s,t)}}async removeToast(t){const o=this.timers.get(t);o&&(window.clearTimeout(o),this.timers.delete(t));const i=this.shadowRoot?.querySelector(`mq-toast[data-toast-id="${t}"]`);i&&await i.startExit(),this.toasts=this.toasts.filter(o=>o.id!==t)}disconnectedCallback(){for(const t of this.timers.values())window.clearTimeout(t);this.timers.clear(),super.disconnectedCallback()}render(){return e`${this.toasts.map(t=>e`<mq-toast data-toast-id="${t.id}" .message="${t.message}" .variant="${t.variant}"></mq-toast>`)}`}};t([r({type:String,reflect:!0})],h.prototype,"position",void 0),t([a()],h.prototype,"toasts",void 0),h=t([o("mq-toast-container")],h);let m=null;function d(t){m=t}function f(){if(m?.isConnected)return m;let t=document.querySelector("mq-toast-container");if(!t){t=document.createElement("mq-toast-container");const o=document.querySelector("mq-theme-provider");o?o.appendChild(t):(console.warn("[mq-toast] No mq-theme-provider found. Toast may not have access to design tokens."),document.body.appendChild(t))}return t}const g={success(t,o){f().addToast(t,"success",o)},error(t,o){f().addToast(t,"error",o)},warning(t,o){f().addToast(t,"warning",o)},info(t,o){f().addToast(t,"info",o)}};export{l as MqToast,h as MqToastContainer,d as registerToastContainer,g as toast};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mediquo/elements",
   "private": false,
-  "version": "0.3.1",
+  "version": "0.4.0",
   "type": "module",
   "description": "Mediquo elements web components",
   "license": "ISC",
@@ -110,13 +110,17 @@
     "./ui/*": {
       "types": "./dist/ui/*.d.ts",
       "default": "./dist/ui/*.js"
+    },
+    "./react/*": {
+      "types": "./dist/react/*.d.ts",
+      "default": "./dist/react/*.js"
     }
   },
   "scripts": {
-    "dev": "rollup -c rollup.config.js --watch",
-    "build": "rm -rf dist && cross-env MODE=production NODE_OPTIONS=--max-old-space-size=4096 rollup -c rollup.config.js",
+    "dev": "rollup -c rollup.config.ts --configPlugin typescript --watch",
+    "build": "rm -rf dist && cross-env MODE=production NODE_OPTIONS=--max-old-space-size=4096 rollup -c rollup.config.ts --configPlugin typescript",
     "build:rc": "cross-env DEFAULT_ENV=development npm run build",
-    "build:watch": "rollup -c rollup.config.js --watch",
+    "build:watch": "rollup -c rollup.config.ts --configPlugin typescript --watch",
     "commit-version": "node scripts/commit-version.js",
     "check": "tsc --noEmit && npm run lit-analyze",
     "check-types": "tsc --noEmit",
@@ -132,6 +136,7 @@
   "dependencies": {
     "@lit/context": "^1.1.5",
     "@lit/localize": "^0.12.2",
+    "@lit/react": "^1.0.8",
     "@lit/task": "^1.0.3",
     "@opentok/client": "^2.30.3",
     "@tanstack/lit-form": "^1.23.4",
@@ -143,9 +148,23 @@
     "socket.io-client": "^2.2.0",
     "zod": "^3.25.76"
   },
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    },
+    "react-dom": {
+      "optional": true
+    }
+  },
   "devDependencies": {
     "@lit/localize-tools": "^0.8.0",
     "@mediquo/core": "*",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
     "@mediquo/eslint-config": "*",
     "@mediquo/telemetry": "*",
     "@rollup/plugin-alias": "^6.0.0",
@@ -162,6 +181,8 @@
     "eslint-plugin-lit-a11y": "^4.1.4",
     "jsdom": "^26.0.0",
     "lit-analyzer": "^2.0.3",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
     "rollup": "^4.0.0",
     "rollup-plugin-dts": "^6.1.0",
     "rollup-plugin-minify-html-literals": "^1.2.6",

package/dist/chunks/exports-XZaVrMLd.js

@@ -1 +0,0 @@
-import{_ as e,t}from"./custom-element-DA9Fxvxd.js";import{e as s}from"./provide-CfT7g_Zi.js";import{Q as o,c as i,s as a,M as r}from"./mutation-controller-OVT8NEt6.js";import{l as n}from"./parseISO-jT42c8Ob.js";import{m as l,s as d}from"./runtime-Bg1WXVCx.js";import{i as c,a as m,x as h,E as p}from"./lit-element-DiWJYFwC.js";import{n as g}from"./property-scuRaFcM.js";import{r as u}from"./state-LQivXIgA.js";import{n as v}from"./context-provider-CiMFpvDA.js";import{tokens as y}from"../theme.js";import{a as b,M as f}from"./api-chat-client-BTBtu01T.js";import{xIcon as w}from"../ui/icons/x-icon.js";import"../ui/mq-avatar.js";import"../ui/mq-button.js";import"../ui/mq-skeleton.js";import{o as x}from"./if-defined-BYeVdwgd.js";import{chevronLeftIcon as k}from"../ui/icons/chevron-left-icon.js";import{e as $}from"./query-CeeutdfT.js";import{l as I,z}from"./external-zAbuzxDj.js";import{DownloadFileEvent as C}from"../events.js";import{checkDoubleIcon as T}from"../ui/icons/check-double-icon.js";import{checkIcon as D}from"../ui/icons/check-icon.js";import{getLocale as M}from"../i18n.js";import{S as q,a as S}from"./chunk-YTQUGGS3-DN-JZpgG.js";import{Q as j}from"./query-QJ1INUTG.js";import{e as P}from"./class-map-Co76I6aw.js";const _=v("apiKey"),A=v("token"),E=v("professionalHash"),R=v("roomId"),U=v("consultationId"),B=v("consultationType");class MqChatRoomCloseEvent extends Event{static{this.eventName="mq-chat-room-close"}constructor(){super(MqChatRoomCloseEvent.eventName,{bubbles:!0,composed:!0})}}class MqChatRoomProfileEvent extends Event{static{this.eventName="mq-chat-room-profile"}constructor(){super(MqChatRoomProfileEvent.eventName,{bubbles:!0,composed:!0})}}function H(e,t,s){return{queryKey:["professionals",t.hash],queryFn:()=>e.professionals.getProfessional(t),staleTime:0,...s}}const N=c`header{padding:var(--size-3) var(--size-4);background-color:var(--color-background-primary);display:flex;justify-content:space-between;gap:var(--size-1)}.left-side{display:flex;flex:1;min-width:0;align-items:center;gap:var(--size-3)}.left-side mq-avatar{flex-shrink:0}.info{min-width:0}.ghost-btn{text-align:left;background:0 0;border:none;padding:0;cursor:pointer}.right-side{display:flex;align-items:center}.name{font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm--line-height);font-weight:var(--font-weight-bold);margin:0;color:var(--color-background);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.specialty{font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm--line-height);font-weight:var(--font-weight-normal);margin:0;color:var(--color-white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.name-skeleton{margin-bottom:var(--size-1)}.profile-title{font-family:var(--font-body);font-size:var(--text-lg);line-height:var(--text-lg--line-height);font-weight:var(--font-weight-medium);margin:0;color:var(--color-white)}`;let K=class ChatRoomHeader extends m{constructor(){super(...arguments),this.hideCloseButton=!1,this.getProfessionalQuery=new o(this,()=>H(b,{hash:this.professionalHash}))}static{this.styles=N}handleClose(){this.dispatchEvent(new MqChatRoomCloseEvent)}handleClickProfile(){this.dispatchEvent(new MqChatRoomProfileEvent)}renderProfile(){return h`<div class="left-side"><mq-button type="button" size="icon-md" variant="ghost-inverted" @click="${()=>{this.dispatchEvent(new CustomEvent("goto-chat",{bubbles:!0,composed:!0}))}}">${k({size:24})}</mq-button><p class="profile-title">${l("Perfil de profesional")}</p></div>`}renderChat(){return h`${this.getProfessionalQuery.render({complete:e=>h`<button type="button" class="left-side ghost-btn" @click="${this.handleClickProfile}"><mq-avatar src="${x(e.avatar??void 0)}" alt="User Avatar" fallback="John Doe" size="sm"></mq-avatar><div class="info"><p class="name">${e.name}</p><p class="specialty">${e.title}</p></div></button>`,pending:()=>h`<div class="left-side"><mq-skeleton width="45px" height="45px" border-radius="full"></mq-skeleton><div><mq-skeleton class="name-skeleton" height="14px" width="120px"></mq-skeleton><mq-skeleton height="14px" width="100px"></mq-skeleton></div></div>`})}`}render(){return h`<header>${"profile"===this.view?this.renderProfile():this.renderChat()}<div class="right-side">${this.hideCloseButton?p:h`<mq-button type="button" size="icon-md" variant="ghost-inverted" @click="${this.handleClose}">${w({size:24})}</mq-button>`}</div></header>`}};e([g({type:String})],K.prototype,"professionalHash",void 0),e([g({type:Boolean})],K.prototype,"hideCloseButton",void 0),e([g({type:String})],K.prototype,"view",void 0),K=e([n(),t("chat-room-header")],K);const L=/(https?:\/\/[^\s,;:!)\]}\]]+|www\.[^\s,;:!)\]}\]]+|[a-zA-Z0-9][-a-zA-Z0-9]*(?:\.[a-zA-Z0-9][-a-zA-Z0-9]*)+(?:\/[^\s,;:!)\]}\]]*|(?:\?|#|&)[^\s,;:!)\]}\]]*)?)/gi;function F(e){return e.split(L).map((e,t)=>{if(t%2==1){const t=e.startsWith("http")?e:`https://${e}`;return h`<a href="${t}" target="_blank" rel="noopener noreferrer" class="message-link">${e}</a>`}return e})}let O=class TextMessageBubble extends m{static{this.styles=[c`:host{display:block}.message-bubble{padding:var(--size-2_5) var(--size-4);border-radius:var(--border-radius-lg);word-wrap:break-word;font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm--line-height);font-weight:var(--font-weight-normal)}.message-bubble.received{background-color:var(--chat-received-message-background);color:var(--chat-received-message-foreground);border-bottom-left-radius:0}.message-bubble.sent{background-color:var(--chat-sent-message-background);color:var(--chat-sent-message-foreground);border-bottom-right-radius:0}.message-content{white-space:pre-wrap}.message-paragraph{margin:0 0 var(--size-3) 0}.message-paragraph:last-child{margin-bottom:0}.message-bubble.received .message-content a.message-link,.message-bubble.sent .message-content a.message-link{color:var(--color-primary-link-default);text-decoration:underline}.message-bubble.received .message-content a.message-link:hover,.message-bubble.sent .message-content a.message-link:hover{opacity:.8}`]}formatMessageContent(e){const t=e.split("\n\n").filter(e=>e.trim());if(t.length<=1)return h`<div class="message-content">${F(e)}</div>`;const s=t.map(e=>h`<div class="message-paragraph">${F(e.trim())}</div>`);return h`<div class="message-content">${s}</div>`}render(){return h`<div class="message-bubble ${this.kind}">${this.formatMessageContent(this.message.string)}</div>`}};e([g({type:Object})],O.prototype,"message",void 0),e([g({type:String})],O.prototype,"kind",void 0),O=e([t("text-message-bubble")],O);const Q=c`:host{display:block}.message-bubble{padding:var(--size-2);border-radius:var(--border-radius-lg);font-size:var(--text-sm);line-height:var(--text-sm--line-height);font-weight:var(--font-weight-normal);overflow:hidden}.message-bubble.received{background-color:var(--chat-received-message-background);border-bottom-left-radius:0}.message-bubble.sent{background-color:var(--chat-sent-message-background);border-bottom-right-radius:0}.image-content{display:block;width:229px;height:229px;object-fit:cover;border-radius:var(--border-radius-md)}.image-placeholder{display:flex;align-items:center;justify-content:center;width:100%;max-width:300px;height:200px;background-color:var(--color-gray-light);border-radius:var(--border-radius-md);color:var(--chat-sent-message-foreground);font-size:var(--text-sm)}.image-content{cursor:pointer;transition:opacity .2s ease}.image-content:hover{opacity:.9}.preview-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--dialog-underlay);display:flex;align-items:center;justify-content:center;z-index:1000;cursor:pointer;opacity:0;transition:opacity var(--dialog-transition-duration) ease}.preview-overlay.open{opacity:1}.preview-image{position:fixed;z-index:1000;inset:var(--mq-safe-top,0) var(--mq-safe-right,0) var(--mq-safe-bottom,0) var(--mq-safe-left,0);max-width:calc(100% - var(--mq-safe-left,4px) - var(--mq-safe-right,4px));max-height:calc(100% - var(--mq-safe-top,4px) - var(--mq-safe-bottom,4px));margin:auto;object-fit:contain;cursor:default;box-shadow:var(--dialog-shadow);transform:scale(.95);transition:transform var(--dialog-transition-duration) ease}.preview-overlay.open .preview-image{transform:scale(1)}.preview-close{z-index:1001;display:inline-flex;align-items:center;justify-content:center;height:var(--size-10);width:var(--size-10);position:absolute;top:var(--mq-safe-top,4px);right:var(--mq-safe-right,4px);background:rgba(255,255,255,.3);border:none;color:var(--color-neutrals-text-default);font-size:var(--text-xl);padding:var(--size-2) var(--size-3);border-radius:var(--border-radius-md);cursor:pointer;transition:background var(--dialog-transition-duration) ease}.preview-close:hover{background:var(--dialog-close-hover-bg)}`;let V=class ImageMessageBubble extends m{constructor(){super(...arguments),this.showPreview=!1,this.isPreviewRendered=!1,this.isPreviewActive=!1,this.closeTimer=null}static{this.styles=Q}handleImageError(e){const t=e.target;t.style.display="none";const s=t.nextElementSibling;s&&(s.style.display="flex")}handleImageLoad(e){const t=e.target.nextElementSibling;t&&(t.style.display="none")}handleImageClick(){this.showPreview=!0,this.isPreviewRendered=!0,this.updateComplete.then(()=>{requestAnimationFrame(()=>{this.isPreviewActive=!0})})}handleImageKeyDown(e){"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.handleImageClick())}handleClosePreview(e){e&&e.stopPropagation(),this.isPreviewActive=!1,this.closeTimer&&window.clearTimeout(this.closeTimer),this.closeTimer=window.setTimeout(()=>{this.isPreviewRendered=!1,this.showPreview=!1,this.closeTimer=null},200)}handleOverlayClick(e){e.target===e.currentTarget&&this.handleClosePreview()}handleOverlayKeyDown(e){"Enter"!==e.key&&" "!==e.key||e.target===e.currentTarget&&(e.preventDefault(),this.handleClosePreview())}handleKeyDown(e){"Escape"===e.key&&this.showPreview&&(e.preventDefault(),this.handleClosePreview())}handlePreviewImageKeyDown(e){e.stopPropagation()}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.handleKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.handleKeyDown.bind(this)),this.closeTimer&&(window.clearTimeout(this.closeTimer),this.closeTimer=null)}render(){const e=this.message.attachment.signed_url??this.message.attachment.url;return h`<div class="message-bubble ${this.kind}"><img class="image-content" src="${e}" width="229" height="229" alt="Shared attachment" @error="${this.handleImageError}" @load="${this.handleImageLoad}" @click="${this.handleImageClick}" @keydown="${this.handleImageKeyDown}" tabindex="0"><div class="image-placeholder" style="display:none">Image unavailable</div></div>${this.showPreview&&this.isPreviewRendered?h`<div class="preview-overlay ${this.isPreviewActive?"open":""}" @click="${this.handleOverlayClick}" @keydown="${this.handleOverlayKeyDown}" tabindex="0"><button class="preview-close" @click="${this.handleClosePreview}" aria-label="Close preview">${w({size:24})}</button> <img class="preview-image" src="${e}" alt="Shared attachment preview" @click="${e=>e.stopPropagation()}" @keydown="${this.handlePreviewImageKeyDown}" tabindex="0"></div>`:""}`}};e([g({type:Object})],V.prototype,"message",void 0),e([g({type:String})],V.prototype,"kind",void 0),e([i({context:A})],V.prototype,"token",void 0),e([u()],V.prototype,"showPreview",void 0),e([u()],V.prototype,"isPreviewRendered",void 0),e([u()],V.prototype,"isPreviewActive",void 0),V=e([t("image-message-bubble")],V);const Y=c`:host{background-color:var(--chat-system-message-background);color:var(--chat-system-message-foreground);display:block;padding:var(--size-2_5) var(--size-4);border-radius:var(--border-radius-lg);font-family:var(--font-body);font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-normal)}a.message-link{color:var(--color-primary-link-default);text-decoration:underline}a.message-link:hover{opacity:.8}`;let Z=class SystemMessageBubble extends m{static{this.styles=Y}render(){return h`<div class="system-message-bubble">${F(this.message.string)}</div>`}};e([g({type:Object})],Z.prototype,"message",void 0),Z=e([t("system-message-bubble")],Z);const J=c`:host{display:block}.message-bubble{display:inline-block;padding:var(--size-2_5) var(--size-4);border-radius:var(--border-radius-lg);word-wrap:break-word;font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm--line-height);font-weight:var(--font-weight-normal);text-decoration:underline;color:var(--color-primary-link-default);border:none;cursor:pointer;text-align:left}.message-bubble:hover:not(:disabled){opacity:.8}.message-bubble:disabled{opacity:.5;cursor:not-allowed}.message-bubble.received{background-color:var(--chat-received-message-background);border-bottom-left-radius:0}.message-bubble.sent{background-color:var(--chat-sent-message-background);border-bottom-right-radius:0}.message-content{white-space:pre-wrap}.message-paragraph{margin:0 0 var(--size-3) 0}.message-paragraph:last-child{margin-bottom:0}`;let G=class FileMessageBubble extends m{constructor(){super(...arguments),this.isDownloading=!1}static{this.styles=J}formatMessageContent(e){const t=e.split("\n\n").filter(e=>e.trim());if(t.length<=1)return h`<div class="message-content">${e}</div>`;const s=t.map(e=>h`<div class="message-paragraph">${e.trim()}</div>`);return h`<div class="message-content">${s}</div>`}async handleDownload(){if(this.isDownloading)return;const e=this.message.attachment.url;try{this.isDownloading=!0;const t=await fetch(e,{headers:{Authorization:`Bearer ${this.token}`}});if(!t.ok)throw new Error(`Failed to fetch file: ${t.statusText}`);const s=await t.blob(),o=new FileReader;o.onloadend=()=>{const e=o.result,t=new C({url:e,filename:this.message.attachment.file_name});this.dispatchEvent(t),this.isDownloading=!1},o.onerror=()=>{I.error("Error reading file as data URL"),this.isDownloading=!1},o.readAsDataURL(s)}catch(e){I.error("Error downloading file:",e),this.isDownloading=!1}}render(){return h`<button type="button" @click="${this.handleDownload}" class="message-bubble ${this.kind}" ?disabled="${this.isDownloading}">${this.formatMessageContent(this.message.attachment.file_name)}</button>`}};e([g({type:Object})],G.prototype,"message",void 0),e([g({type:String})],G.prototype,"kind",void 0),e([i({context:A})],G.prototype,"token",void 0),e([u()],G.prototype,"isDownloading",void 0),G=e([t("file-message-bubble")],G);var W=z.enum(["ordinary","system"]).enum;let X=class MessageBubble extends m{constructor(){super(...arguments),this.showTimestamp=!0}static{this.styles=[c`:host{display:block}.timestamp{font-family:var(--font-body);font-size:var(--text-xs);color:var(--color-gray-medium);font-weight:var(--font-weight-normal);text-align:left;display:flex;align-items:center;gap:var(--size-1)}.timestamp.sent{text-align:right;justify-content:flex-end}.status-icon{width:12px;height:12px}.status-icon.read{color:var(--color-primary)}`]}formatTimestamp(e){if(!e)return"";try{const t=new Date(e);return new Intl.DateTimeFormat(void 0,{hour:"2-digit",minute:"2-digit",hour12:!1}).format(t)}catch{return e}}renderStatusIcon(){switch(this.message.status){case f.Sent:return D({size:12,color:"currentColor"});case f.Received:return T({size:12,color:"currentColor"});case f.Read:return T({size:12,color:"currentColor",className:"read"});default:return null}}renderBubbleContent(){switch(this.message.type){case"image":return h`<image-message-bubble .message="${this.message}" .kind="${this.kind}"></image-message-bubble>`;case"file":return h`<file-message-bubble .message="${this.message}" .kind="${this.kind}"></file-message-bubble>`;default:return h`<text-message-bubble .message="${this.message}" .kind="${this.kind}"></text-message-bubble>`}}render(){if(this.message.senderType===W.system)return h`<system-message-bubble .message="${this.message}"></system-message-bubble>`;const e=this.message.createdAt?new Date(this.message.createdAt):this.message.time?new Date(this.message.time):null;return h`${this.renderBubbleContent()} ${this.showTimestamp&&e?h`<div class="timestamp ${this.kind}">${this.formatTimestamp(e.toISOString())} ${"sent"===this.kind?h`<span class="status-icon ${this.message.status===f.Read?"read":""}">${this.renderStatusIcon()}</span>`:""}</div>`:""}`}};e([g({type:String})],X.prototype,"kind",void 0),e([g({type:Object})],X.prototype,"message",void 0),e([g({type:Boolean})],X.prototype,"showTimestamp",void 0),X=e([t("message-bubble")],X);let ee=class DateBanner extends m{constructor(){super(...arguments),this.date=""}static{this.styles=[y,c`:host{display:block;margin-bottom:var(--size-2)}.date-banner{display:flex;align-items:center;justify-content:center;position:relative}.date-text{background-color:var(--color-gray-light);color:var(--color-gray-darker);font-family:var(--font-body);font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-medium);padding:var(--size-1) var(--size-2);border-radius:var(--border-radius-2xl);white-space:nowrap}`]}formatDate(e){const t=M().replace("_","-"),s=new Date(e),o=new Date,i=new Date(o);i.setDate(i.getDate()-1);const a=new Date(s.getFullYear(),s.getMonth(),s.getDate()),r=new Date(o.getFullYear(),o.getMonth(),o.getDate()),n=new Date(i.getFullYear(),i.getMonth(),i.getDate());return a.getTime()===r.getTime()?l("Hoy"):a.getTime()===n.getTime()?l("Ayer"):s.toLocaleDateString(t,{dateStyle:"medium"})}render(){return h`<div class="date-banner"><span class="date-text">${this.formatDate(this.date)}</span></div>`}};function te(e){return e.createdAt?new Date(e.createdAt):e.time?new Date(e.time):new Date}e([g({type:String})],ee.prototype,"date",void 0),ee=e([n(),t("date-banner")],ee);let se=class MessagesList extends m{constructor(){super(...arguments),this.messages=[]}static{this.styles=[y,c`:host{display:block;width:100%;height:100%;overflow-y:auto;overflow-x:hidden}.messages-container{display:flex;flex-direction:column;padding:var(--size-4);gap:var(--size-1);background-color:var(--color-white);padding-bottom:var(--size-4)}.message-wrapper{display:flex;width:100%}.message-wrapper.received{justify-content:flex-start}.message-wrapper.sent{justify-content:flex-end}.message-wrapper.system{justify-content:center}message-bubble{max-width:70%}`]}scrollToBottom(){requestAnimationFrame(()=>{const e=this.messagesContainerEnd;e&&e.scrollIntoView({behavior:"instant",block:"end"})})}shouldShowMessageTimestamp(e,t){if(e.senderType===W.system)return!1;if(!t)return!0;if(t.senderType!==e.senderType)return!0;if(t.senderType===W.ordinary&&e.senderType===W.ordinary&&t.fromUserHash!==e.fromUserHash)return!0;return(te(t).getTime()-te(e).getTime())/6e4>1}groupMessagesByDate(e){const t=[];let s=null;return e.forEach((o,i)=>{const a=te(o),r=a?.toDateString();r!==s&&(t.push({type:"date",data:a.toDateString()}),s=r??null);const n=e[i+1],l=this.shouldShowMessageTimestamp(o,n);t.push({type:"message",data:o,showTimestamp:l})}),t}firstUpdated(){this.scrollToBottom()}willUpdate(e){e.has("messages")&&this.scrollToBottom()}render(){const e=this.groupMessagesByDate(this.messages),t=e.map((t,s)=>{if("date"===t.type)return h`<date-banner .date="${t.data}"></date-banner>`;const o=this.professionalHash!==t.data.fromUserHash,i=t.data.senderType===W.system?"system":o?"sent":"received";return h`<div class="message-wrapper ${i}"><message-bubble .message="${t.data}" .kind="${i}" .showTimestamp="${t.showTimestamp||"date"===e[s+1]?.type}"></message-bubble></div>`});return h`<div class="messages-container">${t}<div class="messages-container-end"></div></div>`}};e([g({type:Array})],se.prototype,"messages",void 0),e([g({type:String})],se.prototype,"professionalHash",void 0),e([$(".messages-container-end")],se.prototype,"messagesContainerEnd",void 0),se=e([t("messages-list")],se);let oe=class MessageBubbleSkeleton extends m{constructor(){super(...arguments),this.variant="patient",this.height="md",this.showTimestamp=!0}static{this.styles=[c`:host{display:block}.message-bubble{padding:var(--size-4);border-radius:var(--border-radius-lg);margin-bottom:var(--size-1);position:relative;overflow:hidden}.message-bubble.doctor{background-color:var(--color-gray-light);border-bottom-left-radius:0}.message-bubble.patient{background-color:var(--color-background-primary-light);border-bottom-right-radius:0}:host([height=sm]) .message-bubble{height:var(--size-8)}:host([height=md]) .message-bubble{height:var(--size-12)}`]}render(){return h`<div class="message-bubble ${this.variant}"></div>${this.showTimestamp?h`<div class="timestamp-skeleton ${this.variant}"></div>`:""}`}};e([g({type:String})],oe.prototype,"variant",void 0),e([g({type:String})],oe.prototype,"height",void 0),e([g({type:Boolean})],oe.prototype,"showTimestamp",void 0),oe=e([t("message-bubble-skeleton")],oe);let ie=class MessagesSkeleton extends m{constructor(){super(...arguments),this.messageCount=6}static{this.styles=[y,c`:host{display:block;width:100%;height:100%;overflow:hidden}.messages-container{display:flex;flex-direction:column;padding:var(--size-4);gap:var(--size-3);max-width:100%;height:100%;background-color:var(--color-white)}.message-wrapper{display:flex;width:100%}.message-wrapper.doctor{justify-content:flex-start}.message-wrapper.patient{justify-content:flex-end}message-bubble-skeleton{max-width:85%;min-width:60%;width:100%}`]}getSkeletonHeight(e){const t=["sm","md","sm","md","sm","md"];return t[e%t.length]}getSkeletonVariant(e){const t=["doctor","patient","doctor","doctor","patient","doctor","patient"];return t[e%t.length]}renderSkeletonMessages(){return Array.from({length:this.messageCount},(e,t)=>{const s=this.getSkeletonVariant(t),o=this.getSkeletonHeight(t);return h`<div class="message-wrapper ${s}"><message-bubble-skeleton variant="${s}" height="${o}" ?showTimestamp="${t===this.messageCount-1||Math.random()>.7}"></message-bubble-skeleton></div>`})}render(){return h`<div class="messages-container">${this.renderSkeletonMessages()}</div>`}};e([g({type:Number})],ie.prototype,"messageCount",void 0),ie=e([t("messages-skeleton")],ie);var ae=class{constructor(e,t){this.host=e,this.listeners=[],this.host.addController(this),this.socketContext=new a(this.host,{context:q,subscribe:!0,callback:e=>{if(e&&(this.socket=e,t?.listeners)){this.listeners=t.listeners;for(const e of this.listeners)this.socket?.on(e.eventName,e.callback)}}})}hostConnected(){}hostDisconnected(){for(const e of this.listeners)this.socket?.off(e.eventName,e.callback)}};function re(e,t){return{queryKey:["rooms",t.roomId],queryFn:()=>e.rooms.getRoomMessages(t),staleTime:0}}class OptimisticUpdatesController{constructor(e){this.host=e,this.queryClientContext=new a(this.host,{context:j,subscribe:!0,callback:e=>{e&&(this.queryClient=e)}}),this.host.addController(this)}hostConnected(){}appendMessageToRoom(e,t){const s=re(b,{roomId:t}).queryKey;this.queryClient?.setQueriesData({queryKey:s,exact:!0},t=>[...t??[],e])}deleteMessage(e,t){if(!this.queryClient)return;const s=re(b,{roomId:t}).queryKey;this.queryClient.setQueryData(s,t=>(t??[]).map(t=>t.messageId===e?{...t,deletedAt:(new Date).toISOString(),string:l("Este mensaje fue eliminado")}:t))}updateMessageStatus({messageId:e,status:t,roomId:s}){if(!this.queryClient)return;const o=re(b,{roomId:s}).queryKey;this.queryClient.setQueryData(o,s=>(s??[]).map(s=>s.messageId===e?{...s,status:t}:s))}}let ne=class ChatRoomMessages extends m{constructor(){super(...arguments),this.getRoomMessagesQuery=new o(this,()=>re(b,{roomId:this.roomId})),this.optimisticUpdatesController=new OptimisticUpdatesController(this),this.onMessageReceived=e=>{if(e.roomId!==this.roomId)return;const t=function(e){const t={roomId:"string"==typeof e.roomId?Number.parseInt(e.roomId,10):e.roomId,messageId:e.messageId,status:e.status,senderType:e.senderType,fromUserHash:e.fromUserHash,time:e.time,createdAt:e.time?new Date(e.time).toISOString():null,deletedAt:null};switch(e.type){case"string":return{...t,type:"string",string:e.string,auto:e.auto?1:0,attachment:null};case"image":return{...t,type:"image",string:e.fileName||"",auto:0,attachment:{file_name:e.fileName,file_size:e.fileSize,url:e.imageUrl,type:"uncategorized",meta:{duration:0},signed_url:e.imageUrl}};case"file":return{...t,type:"file",string:e.fileName||"",auto:0,attachment:{file_name:e.fileName,file_size:e.fileSize,url:e.fileUrl,type:"uncategorized",meta:{duration:0},signed_url:e.fileUrl}};default:return{...t,type:"string",string:"",auto:0,attachment:null}}}(e);this.optimisticUpdatesController.appendMessageToRoom(t,t.roomId),t.roomId===this.roomId&&e.fromUserHash===this.professionalHash&&this._socketController.socket?.emit(S.messageStatus,e.messageId,this.roomId,f.Read)},this.onMessageDeleted=e=>{e.room_id===this.roomId&&this.optimisticUpdatesController.deleteMessage(e.message_id,e.room_id)},this.onMessageStatusUpdated=e=>{e.roomId===this.roomId&&this.optimisticUpdatesController.updateMessageStatus({messageId:e.messageId,status:e.status,roomId:e.roomId})},this._socketController=new ae(this,{listeners:[{eventName:S.message,callback:this.onMessageReceived},{eventName:S.message_deleted,callback:this.onMessageDeleted},{eventName:S.messageStatus,callback:this.onMessageStatusUpdated}]})}static{this.styles=[y,c`:host{display:block;width:100%;height:100%}`]}render(){return this.getRoomMessagesQuery.render({pending:()=>h`<messages-skeleton messageCount="8"></messages-skeleton>`,complete:e=>h`<messages-list .messages="${e}" .professionalHash="${this.professionalHash}"></messages-list>`})}};e([g({type:Number})],ne.prototype,"roomId",void 0),e([g({type:String})],ne.prototype,"professionalHash",void 0),ne=e([t("chat-room-messages")],ne);var le=class{constructor(e){this.string=e.string,this.roomId=e.roomId,this.messageId=e.messageId,this.type=e.type,this.fileName=e.fileName,this.autoMessage=e.autoMessage,this.senderType=e.senderType,this.attachmentType=e.attachmentType,this.consultationId=e.consultationId,this.consultationType=e.consultationType}toSocketMessage(){return[S.message,this.string,this.roomId,this.messageId,this.type,this.fileName,this.autoMessage,this.senderType,this.attachmentType,this.consultationId,this.consultationType]}},de=class extends le{constructor(e){super({roomId:e.roomId,messageId:e.messageId,string:e.string,type:"string",fileName:null,autoMessage:!1,senderType:W.ordinary,attachmentType:"uncategorized",consultationId:e.consultationId,consultationType:e.consultationType})}},ce=class extends le{constructor(e){super({roomId:e.roomId,messageId:e.messageId,string:e.base64Attachment,fileName:e.fileName,type:e.type,autoMessage:!1,senderType:W.ordinary,attachmentType:"uncategorized",consultationId:e.consultationId,consultationType:e.consultationType})}};async function me(e){return await Promise.all(e.map(async e=>{const t=await function(e){return new Promise((t,s)=>{const o=new FileReader;o.onload=()=>{const i=o.result.split(",")[1];i?t(i):s(new Error(`Invalid data URL format for file: ${e.name}`))},o.onerror=()=>{s(new Error(`Failed to read file: ${e.name}`))},o.readAsDataURL(e)})}(e);return{name:e.name,size:e.size,type:e.type,base64:t}}))}const he=c`:host{display:block;position:absolute;bottom:0;padding:var(--size-2) var(--size-2);background:#fff}.footer-container{display:flex;align-items:center;gap:var(--size-1);max-width:100%}.input-container{flex:1;position:relative;display:flex;align-items:center;border:1px solid var(--color-neutrals-border-disabled);border-radius:var(--border-radius-2xl);padding:0 var(--size-1);overflow:hidden}.input-container:focus-within{border-color:var(--color-primary)}.message-input{flex:1;border:none;outline:0;background:0 0;font-family:var(--font-body);font-size:var(--text-base);font-size:var(--text-sm);line-height:var(--text-sm--line-height);color:var(--color-neutrals-text-default);padding-left:var(--sp-2)}.message-input::placeholder{color:var(--color-neutrals-text-medium)}.attachment-icon{width:var(--size-5);height:var(--size-5);color:var(--color-primary)}.send-icon{width:var(--size-5);height:var(--size-5);color:var(--color-primary)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.send-button{color:var(--color-neutrals-link-disabled);background:0 0;border:none;padding:var(--size-2);border-radius:var(--border-radius-md);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .2s ease}.send-button:hover:not(.disabled){background:var(--color-primary-light)}.send-button:active:not(.disabled){background-color:var(--color-neutrals-background-active)}.send-button.disabled{cursor:not-allowed;opacity:.4}.send-button.disabled .send-icon{color:var(--color-neutrals-text-disabled)}`;let pe=class ChatRoomFooter extends m{constructor(){super(...arguments),this.isTyping=!1,this.typingTimeoutId=null,this.inputValue="",this.socketController=new ae(this)}static{this.styles=[he]}handleInputChange(e){const t=e.target;this.inputValue=t.value,this.isTyping||(this.socketController.socket?.emit(S.typing,this.roomId),this.isTyping=!0),this.typingTimeoutId&&clearTimeout(this.typingTimeoutId),this.typingTimeoutId=setTimeout(()=>{this.isTyping&&(this.socketController.socket?.emit(S.stop_typing,this.roomId),this.isTyping=!1)},1500)}handleKeyDown(e){"Enter"!==e.key||e.shiftKey||(e.preventDefault(),this.handleSendMessage())}async handleAttachment(e){const t=e.target.files;if(!t||0===t.length)return;const s=t.item(0);if(s)try{const e=(await me([s]))[0];if(!e)return void I.error("Error converting file to base64");const t=e?.type.includes("image")?"image":"file",o=crypto.randomUUID(),i=s.name,a=new ce({type:t,base64Attachment:e.base64,fileName:i,roomId:this.roomId,messageId:o,consultationId:this.consultationId,consultationType:this.consultationType});this.socketController.socket?.emit(...a.toSocketMessage())}catch(e){I.error("Error converting files to base64:",e)}}handleAttachmentClick(){this.attachmentInput.click()}handleSendMessage(){const e=this.inputValue.trim();if(!e)return;const t=crypto.randomUUID();this.isTyping&&(this.socketController.socket?.emit(S.stop_typing,this.roomId),this.isTyping=!1,this.typingTimeoutId&&clearTimeout(this.typingTimeoutId));const s=new de({messageId:t,string:e,roomId:this.roomId,consultationId:this.consultationId,consultationType:this.consultationType});this.socketController.socket?.emit(...s.toSocketMessage()),this.inputValue=""}disconnectedCallback(){this.isTyping&&(this.socketController.socket?.emit(S.stop_typing,this.roomId),this.typingTimeoutId&&clearTimeout(this.typingTimeoutId))}render(){const e=this.inputValue.trim().length>0;return h`<div class="footer-container"><div class="input-container"><input class="message-input" type="text" placeholder="${l("Escribe aquí...")}" .value="${this.inputValue}" @input="${this.handleInputChange}" @keydown="${this.handleKeyDown}"><div><input class="attachment-input sr-only" type="file" accept="image/jpeg,image/jpg,image/png,image/gif,image/bmp,image/tiff,application/pdf,text/*,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-powerpoint,application/vnd.openxmlformats-officedocument.presentationml.presentation,audio/*,video/*" @change="${this.handleAttachment}"><mq-button variant="ghost" size="icon-sm" @click="${this.handleAttachmentClick}" title="${l("Adjuntar archivo")}">${h`<svg class="attachment-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"/></svg>`}</mq-button></div></div><button class="send-button ${e?"":"disabled"}" @click="${this.handleSendMessage}" ?disabled="${!e}" title="${l("Enviar mensaje")}">${h`<svg class="send-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 2L11 13"/><path d="M22 2L15 22L11 13L2 9L22 2z"/></svg>`}</button></div>`}};e([i({context:U})],pe.prototype,"consultationId",void 0),e([i({context:B})],pe.prototype,"consultationType",void 0),e([g({type:Number})],pe.prototype,"roomId",void 0),e([u()],pe.prototype,"inputValue",void 0),e([$(".attachment-input")],pe.prototype,"attachmentInput",void 0),pe=e([t("chat-room-footer")],pe);const ge=e=>({all_week:!0,monday:1===e,tuesday:2===e,wednesday:3===e,thursday:4===e,friday:5===e,saturday:6===e,sunday:7===e,working_week:e>=1&&e<=5,weekend:0===e||6===e});function ue(e,t){const s=ge(6===e?0:e+1);return t.some(e=>{const t=e.days_of_week;return!0===s[t]})}let ve=class AvailabilitySection extends m{constructor(){super(...arguments),this.gaps=[],this.selectedDay=function(){const e=(new Date).getDay();return 0===e?6:e-1}()}static{this.styles=c`:host{display:flex;flex-direction:column;gap:var(--size-3)}.availability-header{font-family:var(--font-body);font-size:var(--text-lg);line-height:var(--text-lg--line-height);font-weight:var(--font-weight-normal);color:var(--color-primary);text-align:center;margin:0;margin-bottom:var(--size-4) 0}.availability-days{display:flex;flex-direction:row;justify-content:center;gap:var(--size-1);overflow-x:auto;padding-bottom:var(--size-4)}.availability-button{outline:0;border:1px solid var(--color-gray-medium);background:0 0;color:var(--color-gray-medium);cursor:pointer;height:var(--size-9);width:var(--size-10);border-radius:var(--border-radius-sm);text-transform:capitalize;font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-medium)}.availability-button:hover{background-color:color-mix(in srgb,var(--color-gray-light) 50%,transparent)}.availability-button:focus{background-color:color-mix(in srgb,var(--color-gray-light) 50%,transparent)}.availability-button.active{background:var(--color-primary);color:var(--color-white);border:none}.availability-button:disabled{opacity:.5;cursor:not-allowed;background-color:var(--color-gray-light)}.time-title{font-family:var(--font-body);font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-medium);color:var(--color-gray-dark);margin:0;margin-bottom:var(--size-1)}.time-entries{display:flex;flex-direction:column;gap:var(--size-1);margin-bottom:var(--size-6)}.time-entry{font-family:var(--font-body);font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-normal);color:var(--color-gray-medium);margin:0}`}updated(e){e.has("gaps")&&(void 0===this.selectedDay||ue(this.selectedDay,this.gaps)||(this.selectedDay=void 0))}render(){const e=[{shortLabel:l("Lu"),label:l("Lunes"),key:"monday",disabled:!ue(0,this.gaps)},{shortLabel:l("Ma"),label:l("Martes"),key:"tuesday",disabled:!ue(1,this.gaps)},{shortLabel:l("Mi"),label:l("Miércoles"),key:"wednesday",disabled:!ue(2,this.gaps)},{shortLabel:l("Ju"),label:l("Jueves"),key:"thursday",disabled:!ue(3,this.gaps)},{shortLabel:l("Vi"),label:l("Viernes"),key:"friday",disabled:!ue(4,this.gaps)},{shortLabel:l("Sa"),label:l("Sábado"),key:"saturday",disabled:!ue(5,this.gaps)},{shortLabel:l("Do"),label:l("Domingo"),key:"sunday",disabled:!ue(6,this.gaps)}];return h`<h2 class="availability-header">${l("Disponibilidad")}</h2><div class="availability-days">${e.map((e,t)=>h`<button type="button" class="availability-button ${P({active:this.selectedDay===t&&!e.disabled})}" ?disabled="${e.disabled}" @click="${()=>{e.disabled||(this.selectedDay=t)}}">${e.shortLabel}</button>`)}</div>${void 0===this.selectedDay||e[this.selectedDay]?.disabled?"":(()=>{const t=function(e,t){const s=ge(6===e?0:e+1);return t.filter(e=>{const t=e.days_of_week;return!0===s[t]}).map(e=>({from_time:e.from_time,to_time:e.to_time}))}(this.selectedDay,this.gaps);return h`<div class="availability-time"><p class="time-title">${e[this.selectedDay]?.label}</p><div class="time-entries">${t.length>0?t.map(e=>h`<p class="time-entry">${l("De")} ${e.from_time} ${l("a")} ${e.to_time}</p>`):h`<p class="time-entry">${l("No hay horarios disponibles")}</p>`}</div></div>`})()}`}};e([g({type:Array})],ve.prototype,"gaps",void 0),e([u()],ve.prototype,"selectedDay",void 0),ve=e([n(),t("availability-section")],ve);const ye=c`:host{display:flex;flex-direction:column;height:100%;overflow-y:auto;background-color:var(--color-white)}.profile-container{padding:var(--size-6);display:flex;flex-direction:column}.profile-header{display:flex;flex-direction:column;align-items:center;text-align:center;padding-bottom:var(--size-6);border-bottom:1px solid var(--color-gray-medium);margin-bottom:var(--size-6)}.profile-avatar{margin-bottom:var(--size-2)}.profile-name{font-family:var(--font-body);font-size:var(--text-lg);line-height:var(--text-lg--line-height);font-weight:var(--font-weight-medium);color:var(--color-text-primary);margin:var(--size-4) 0}.profile-specialty{font-family:var(--font-body);font-size:var(--text-xs);line-height:var(--text-xs--line-height);font-weight:var(--font-weight-medium);color:var(--color-text-icons--secondary);margin:0;margin-bottom:var(--size-2);text-transform:uppercase}.profile-collegiate{font-family:var(--font-body);font-size:var(--text-xs);line-height:var(--text-xs--line-height);color:var(--color-gray-medium);text-transform:uppercase;margin:0}.description-header{font-family:var(--font-body);font-size:var(--text-sm);line-height:var(--text-sm--line-height);font-weight:var(--font-weight-medium);color:var(--color-primary);margin:0;margin-bottom:var(--size-3)}.description-text{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-foreground);margin:0}`;let be=class ChatRoomProfile extends m{constructor(){super(...arguments),this.getProfessionalQuery=new o(this,()=>H(b,{hash:this.professionalHash}))}static{this.styles=[y,ye]}renderProfile(e){return h`<div class="profile-container"><div class="profile-header"><mq-avatar class="profile-avatar" src="${e.avatar||""}" fallback="${e.name}" alt="${e.name}'s profile picture" size="xl"></mq-avatar><div><h1 class="profile-name">${e.name}</h1>${e.title?h`<p class="profile-specialty">${e.title}</p>`:""} ${e.collegiate_number?h`<p class="profile-collegiate">${l(d`Nº COL. ${e.collegiate_number}`)}</p>`:""}</div></div>${e.chat_schedule&&e.chat_schedule.gaps.length>0?h`<availability-section .gaps="${e.chat_schedule.gaps}"></availability-section>`:p} ${e.description||e.overview?h`<div><h2 class="description-header">${l("Descripción")}</h2><p class="description-text">${e.description||e.overview}</p></div>`:""}</div>`}render(){return this.getProfessionalQuery.render({pending:()=>h``,complete:e=>this.renderProfile(e)})}};function fe(e,t,s){return{queryKey:["unread-messages",t],queryFn:()=>e.rooms.getUnreadMessagesCount(t),staleTime:0,...s}}e([g({type:String})],be.prototype,"professionalHash",void 0),be=e([n(),t("chat-room-profile")],be);const we=c`.root{display:flex;flex-direction:column;height:100%;overflow:hidden}chat-room-header{flex-shrink:0}chat-room-messages{flex:1;overflow-y:auto;overflow-x:hidden}chat-room-footer{position:sticky;bottom:0;left:0;right:0;flex-shrink:0}`;let xe=class MqChatRoom extends m{constructor(){super(...arguments),this.consultationId=void 0,this.consultationType=void 0,this.readonly=!1,this.hideCloseButton=!1,this.view="chat",this.socketController=new ae(this),this.readAllMessagesMutation=new r(this,{mutationFn:()=>b.professionals.readAllMessages({roomId:this.roomId}),onSuccess:()=>{this.queryClientContext?.invalidateQueries({queryKey:fe(b,{roomId:this.roomId}).queryKey})}})}static{this.styles=[y,we]}willUpdate(e){e.has("apiKey")&&this.apiKey&&b.setApiKey(this.apiKey),e.has("token")&&b.setAuthToken(this.token),e.has("roomId")&&(this.socketController.socket?.emit(S.joinRoom,this.roomId),this.readAllMessagesMutation.run(void 0))}render(){return h`<div class="root"><chat-room-header .professionalHash="${this.professionalHash}" .view="${this.view}" .hideCloseButton="${this.hideCloseButton}" @mq-chat-room-profile="${()=>{this.view="profile"}}" @goto-chat="${()=>{this.view="chat"}}"></chat-room-header>${"chat"===this.view?h`<chat-room-messages .roomId="${this.roomId}" .professionalHash="${this.professionalHash}"></chat-room-messages>${this.readonly?p:h`<chat-room-footer .roomId="${this.roomId}"></chat-room-footer>`}`:h`<chat-room-profile .professionalHash="${this.professionalHash}" @mq-chat-room-chat="${()=>{this.view="chat"}}"></chat-room-profile>`}</div>`}};e([s({context:_}),g({type:String,attribute:"api-key"})],xe.prototype,"apiKey",void 0),e([s({context:A}),g({type:String,attribute:"token"})],xe.prototype,"token",void 0),e([s({context:E}),g({type:String,attribute:"professional-hash"})],xe.prototype,"professionalHash",void 0),e([s({context:R}),g({type:Number,attribute:"room-id"})],xe.prototype,"roomId",void 0),e([s({context:U}),g({type:String,attribute:"consultation-id"})],xe.prototype,"consultationId",void 0),e([s({context:B}),g({type:String,attribute:"consultation-type"})],xe.prototype,"consultationType",void 0),e([g({type:Boolean,reflect:!0})],xe.prototype,"readonly",void 0),e([g({type:Boolean,attribute:"hide-close-button"})],xe.prototype,"hideCloseButton",void 0),e([u()],xe.prototype,"view",void 0),e([i({context:j,subscribe:!0})],xe.prototype,"queryClientContext",void 0),xe=e([n(),t("mq-chat-room")],xe);export{xe as M,fe as a,MqChatRoomCloseEvent as b,MqChatRoomProfileEvent as c,H as g};

package/dist/chunks/index-BYHKNPG2.js

@@ -1 +0,0 @@
-import{_ as e,t}from"./custom-element-DA9Fxvxd.js";import{m as a}from"./runtime-Bg1WXVCx.js";import{t as r,c as n,n as s,g as o,p as i,a as l,s as d,l as c}from"./parseISO-jT42c8Ob.js";import{i as v,a as h,x as u}from"./lit-element-DiWJYFwC.js";import{n as p}from"./property-scuRaFcM.js";import{r as g}from"./state-LQivXIgA.js";import{e as m}from"./class-map-Co76I6aw.js";import{chevronLeftIcon as y}from"../ui/icons/chevron-left-icon.js";import{chevronRightIcon as b}from"../ui/icons/chevron-right-icon.js";import{spinnerIcon as f}from"../ui/icons/spinner-icon.js";import{i as D}from"./isSameDay-DPfclwIL.js";import{i as k}from"./isBefore-Cof0D841.js";function w(e,t,a){const s=r(e,a?.in);if(isNaN(t))return n(e,NaN);if(!t)return s;const o=s.getDate(),i=n(e,s.getTime());i.setMonth(s.getMonth()+t+1,0);return o>=i.getDate()?i:(s.setFullYear(i.getFullYear(),i.getMonth(),o),s)}function M(e,t){const a=r(e,t?.in),n=a.getMonth();return a.setFullYear(a.getFullYear(),n+1,0),a.setHours(23,59,59,999),a}function S(e,t){const{start:a,end:r}=function(e,t){const[a,r]=s(e,t.start,t.end);return{start:a,end:r}}(t?.in,e);let o=+a>+r;const i=o?+a:+r,l=o?r:a;l.setHours(0,0,0,0);const d=[];for(;+l<=i;)d.push(n(a,l)),l.setDate(l.getDate()+1),l.setHours(0,0,0,0);return o?d.reverse():d}function x(e,t){const a=r(e,t?.in);return a.setDate(1),a.setHours(0,0,0,0),a}function E(e,t){const a=o(),n=t?.weekStartsOn??t?.locale?.options?.weekStartsOn??a.weekStartsOn??a.locale?.options?.weekStartsOn??0,s=r(e,t?.in),i=s.getDay(),l=6+(i<n?-7:0)-(i-n);return s.setDate(s.getDate()+l),s.setHours(23,59,59,999),s}function j(e,t){return+r(e)>+r(t)}function $(e,t){return D(n(e,e),function(e){return n(e,Date.now())}(e))}const N=v`:host{display:block;font-family:var(--font-body)}.calendar{background:var(--color-card);border-radius:var(--border-radius-lg);user-select:none}.calendar-header{display:flex;align-items:center;justify-content:space-between;background:var(--color-primary-background-extraWeak);padding:var(--sp-4);border-radius:var(--border-radius-lg) var(--border-radius-lg) 0 0}.calendar-header-title{font-family:var(--font-titles);font-size:var(--text-lg);font-weight:var(--font-weight-bold);color:var(--color-gray-darkest)}.calendar-body{position:relative;transition:opacity .2s}.calendar-body.loading{opacity:.4;pointer-events:none}.calendar-nav{display:flex;gap:var(--sp-2)}.calendar-nav-button{display:flex;align-items:center;justify-content:center;width:var(--size-8);height:var(--size-8);border:none;background:0 0;border-radius:var(--border-radius-md);cursor:pointer;transition:background-color .2s;color:var(--color-gray-darkest);padding:0}.calendar-nav-button:hover{background:var(--color-background-primary-light)}.calendar-nav-button:disabled{opacity:.3;cursor:not-allowed}.calendar-weekdays{display:grid;grid-template-columns:repeat(7,var(--sp-11));justify-content:space-between;padding:var(--sp-4) var(--sp-4) var(--sp-2) var(--sp-4)}.calendar-weekday{text-align:center;font-size:var(--text-sm);font-weight:var(--font-weight-bold);color:var(--color-gray-darkest);padding:var(--sp-2)}.calendar-days{display:grid;gap:var(--sp-1);grid-template-columns:repeat(7,var(--sp-11));justify-content:space-between;padding:0 var(--sp-4) var(--sp-4) var(--sp-4)}.calendar-day{width:var(--sp-11);height:var(--sp-11);display:flex;align-items:center;justify-content:center;border:none;background:0 0;border-radius:var(--border-radius-full);cursor:pointer;font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-gray-darkest);transition:all .2s;padding:0;position:relative}.calendar-day:hover:not(:disabled):not(.other-month){background:var(--color-gray-lighter)}.calendar-day.other-month{color:var(--color-gray-medium);background:0 0}.calendar-day:disabled{color:var(--color-gray-medium);background:0 0;cursor:not-allowed}.calendar-day.available:not(.selected){background:var(--color-primary);color:var(--color-white);font-weight:var(--font-weight-semibold)}.calendar-day.available:hover:not(:disabled):not(.selected){background:var(--color-primary-dark)}.calendar-day.selected{background:var(--color-primary);color:var(--color-white);font-weight:var(--font-weight-bold)}.calendar-day.selected:hover:not(:disabled){background:var(--color-primary-dark)}.calendar-day-empty{width:var(--sp-11);height:var(--sp-11)}.calendar-spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:10}@media (min-width:640px){.calendar-weekdays{gap:var(--sp-2)}.calendar-days{gap:var(--sp-2)}}@media (min-width:768px){.calendar-weekdays{gap:var(--sp-3)}.calendar-days{gap:var(--sp-3)}}@media (min-width:1024px){.calendar-weekdays{gap:var(--sp-4)}.calendar-days{gap:var(--sp-4)}}`;class DateSelectEvent extends Event{static{this.eventName="date-select"}constructor(e){super(DateSelectEvent.eventName,{bubbles:!0,composed:!0}),this.detail=e}}class PrevMonthEvent extends Event{static{this.eventName="prev-month"}constructor(e){super(PrevMonthEvent.eventName,{bubbles:!0,composed:!0}),this.detail=e}}class NextMonthEvent extends Event{static{this.eventName="next-month"}constructor(e){super(NextMonthEvent.eventName,{bubbles:!0,composed:!0}),this.detail=e}}let C=class MqCalendar extends h{constructor(){super(...arguments),this.locale="es-ES",this.isLoading=!1,this.handlePrevMonth=()=>{const e=this.getCurrentMonthDate(),t=w(e,-1,a);var a;this.dispatchEvent(new PrevMonthEvent({currentMonth:t.toISOString()}))},this.handleNextMonth=()=>{const e=w(this.getCurrentMonthDate(),1);this.dispatchEvent(new NextMonthEvent({currentMonth:e.toISOString()}))},this.handleDayClick=e=>{e.isDisabled||(this.selectedDate=e.date,this.value=e.date.toISOString(),this.dispatchEvent(new DateSelectEvent({date:e.date.toISOString()})),this.requestUpdate())}}static{this.styles=[N]}connectedCallback(){super.connectedCallback(),this.value&&(this.selectedDate=i(this.value))}getMonthYear(){const e=this.getCurrentMonthDate();return new Intl.DateTimeFormat(this.locale,{month:"long",year:"numeric"}).format(e)}getCurrentMonthDate(){return this.currentMonth?i(this.currentMonth):new Date}getWeekdays(){const e=l(new Date(2024,0,1),{weekStartsOn:1}),t=S({start:e,end:E(e,{weekStartsOn:1})}),a=new Intl.DateTimeFormat(this.locale,{weekday:"narrow"});return t.map(e=>a.format(e).toUpperCase())}getDaysInMonth(){const e=this.getCurrentMonthDate(),t=x(e),a=M(e);return S({start:l(t,{weekStartsOn:1}),end:E(a,{weekStartsOn:1})}).map(t=>{const a=function(e,t,a){const[r,n]=s(a?.in,e,t);return r.getFullYear()===n.getFullYear()&&r.getMonth()===n.getMonth()}(t,e);return this.createCalendarDay(t,a)})}createCalendarDay(e,t){const a=d(e),r=$(a),n=this.isDateAvailable(a);return{date:a,isCurrentMonth:t,isToday:r,isDisabled:this.isDateDisabled(a,n),isSelected:!!this.selectedDate&&D(a,this.selectedDate),isAvailable:n}}isDateAvailable(e){if(!this.availableDays||0===this.availableDays.length)return!1;const t=d(e);return this.availableDays.some(e=>{const a=d(i(e));return D(t,a)})}isDateDisabled(e,t){const a=d(e);if(this.availableDays&&this.availableDays.length>0)return!t;if(this.minDate){const e=d(i(this.minDate));if(k(a,e))return!0}if(this.maxDate){if(j(a,d(i(this.maxDate))))return!0}return!1}render(){const e=this.getDaysInMonth(),t=this.getWeekdays();return u`<div class="calendar"><div class="calendar-header"><button class="calendar-nav-button" @click="${this.handlePrevMonth}" aria-label="${a("Mes anterior")}">${y({size:24})}</button><div class="calendar-header-title">${this.getMonthYear()}</div><button class="calendar-nav-button" @click="${this.handleNextMonth}" aria-label="${a("Mes siguiente")}">${b({size:24})}</button></div><div class="calendar-body ${this.isLoading?"loading":""}"><div class="calendar-weekdays">${t.map(e=>u`<div class="calendar-weekday">${e}</div>`)}</div><div class="calendar-days">${e.map(e=>e.isCurrentMonth?u`<button class="${m({"calendar-day":!0,"other-month":!e.isCurrentMonth,today:e.isToday,selected:e.isSelected,available:e.isAvailable})}" ?disabled="${e.isDisabled||this.isLoading}" @click="${()=>this.handleDayClick(e)}" aria-label="${e.date.toLocaleDateString(this.locale)}">${e.date.getDate()}</button>`:u`<div class="calendar-day-empty"></div>`)}</div>${this.isLoading?u`<div class="calendar-spinner">${f({size:40,color:"var(--color-primary)"})}</div>`:""}</div></div>`}};e([p({type:String})],C.prototype,"locale",void 0),e([p({type:String,attribute:"min-date"})],C.prototype,"minDate",void 0),e([p({type:String,attribute:"max-date"})],C.prototype,"maxDate",void 0),e([p({type:String})],C.prototype,"value",void 0),e([p({type:Boolean,attribute:"is-loading"})],C.prototype,"isLoading",void 0),e([p({type:String,attribute:"current-month"})],C.prototype,"currentMonth",void 0),e([p({type:Array,attribute:"available-days"})],C.prototype,"availableDays",void 0),e([g()],C.prototype,"selectedDate",void 0),C=e([c(),t("mq-calendar")],C);export{DateSelectEvent as D,C as M,NextMonthEvent as N,PrevMonthEvent as P,M as e,j as i,x as s};