@glatam/calendar-ui 1.0.3 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/glatam-calendar.cjs +7 -7
- package/dist/glatam-calendar.js +46 -46
- package/package.json +2 -2
package/dist/glatam-calendar.cjs
CHANGED
|
@@ -342,7 +342,7 @@
|
|
|
342
342
|
min-width: 32px;
|
|
343
343
|
}
|
|
344
344
|
}
|
|
345
|
-
`;function k(d,t,e){if(t===e)return 0;const a=(r,i)=>{const o={year:"numeric",month:"numeric",day:"numeric",hour:"numeric",minute:"numeric",second:"numeric",hour12:!1};i!=="local"&&(o.timeZone=i);const p=new Intl.DateTimeFormat("en-US",o).formatToParts(r),n=new Map(p.map(u=>[u.type,u.value])),g=Number(n.get("hour")),
|
|
345
|
+
`;function k(d,t,e){if(t===e)return 0;const a=(r,i)=>{const o={year:"numeric",month:"numeric",day:"numeric",hour:"numeric",minute:"numeric",second:"numeric",hour12:!1};i!=="local"&&(o.timeZone=i);const p=new Intl.DateTimeFormat("en-US",o).formatToParts(r),n=new Map(p.map(u=>[u.type,u.value])),g=Number(n.get("hour")),h=g===24?0:g;return new Date(Number(n.get("year")),Number(n.get("month"))-1,Number(n.get("day")),h,Number(n.get("minute")),Number(n.get("second")))};try{const r=a(d,t);return(a(d,e).getTime()-r.getTime())/(60*1e3)}catch{return 0}}function R(d,t){if(t===0)return{start:d.start,end:d.end,dayShift:0};const e=n=>{const[g,h]=n.split(":").map(Number);return g*60+h},a=n=>{let g=n%1440;g<0&&(g+=1440);const h=String(Math.floor(g/60)).padStart(2,"0"),u=String(g%60).padStart(2,"0");return`${h}:${u}`},r=e(d.start),i=e(d.end),o=r+t,c=i+t;let p=0;return o<0?p=-1:o>=1440&&(p=1),{start:a(o),end:a(c),dayShift:p}}var E=Object.defineProperty,z=Object.getOwnPropertyDescriptor,v=(d,t,e,a)=>{for(var r=a>1?void 0:a?z(t,e):t,i=d.length-1,o;i>=0;i--)(o=d[i])&&(r=(a?o(t,e,r):o(r))||r);return a&&r&&E(t,e,r),r};exports.GlatamCalendarMonthView=class extends s.LitElement{constructor(){super(...arguments),this.days=[],this.locale="es",this.startOfWeekDay=0,this.selectedDates=[],this.role="provider",this.size="medium",this.minDate="",this.maxDate="",this.showNeighboringMonth=!0,this.tileClassName=null}getWeekdayNames(){const t=[],e=new Date(2026,6,12+this.startOfWeekDay),a=new Intl.DateTimeFormat(this.locale,{weekday:"short"});for(let r=0;r<7;r++)t.push(a.format(e)),e.setDate(e.getDate()+1);return t}handleDayClick(t){const e=this.minDate&&t.dateString<this.minDate||this.maxDate&&t.dateString>this.maxDate;this.role==="buyer"&&(t.isBlocked||e)||this.dispatchEvent(new CustomEvent("day-select",{detail:{dateString:t.dateString,isBlocked:t.isBlocked},bubbles:!0,composed:!0}))}render(){const t=this.getWeekdayNames();return s.html`
|
|
346
346
|
${t.map(e=>s.html`<div class="weekday">${e}</div>`)}
|
|
347
347
|
|
|
348
348
|
${this.days.map(e=>{var p;if(!e.isCurrentMonth&&!this.showNeighboringMonth)return s.html`<div class="day-cell empty"></div>`;const a=e.dateString===new Date().toISOString().split("T")[0],r=this.selectedDates.includes(e.dateString),i=e.slots.filter(n=>n.isBlocked),o=this.minDate&&e.dateString<this.minDate||this.maxDate&&e.dateString>this.maxDate,c=this.tileClassName?this.tileClassName({date:e.date,dateString:e.dateString}):"";return s.html`
|
|
@@ -354,9 +354,9 @@
|
|
|
354
354
|
<div class="day-number">${e.dayNumber}</div>
|
|
355
355
|
|
|
356
356
|
<div class="slot-indicator">
|
|
357
|
-
${e.isBlocked?s.html`<div class="badge blocked-day">${((p=e.rule)==null?void 0:p.description)||"Bloqueado"}</div>`:i.slice(0,2).map(n=>{var g,
|
|
357
|
+
${e.isBlocked?s.html`<div class="badge blocked-day">${((p=e.rule)==null?void 0:p.description)||"Bloqueado"}</div>`:i.slice(0,2).map(n=>{var g,h;return s.html`
|
|
358
358
|
<div class="badge blocked-slot" title=${((g=n.rule)==null?void 0:g.description)||""}>
|
|
359
|
-
🚫 ${((
|
|
359
|
+
🚫 ${((h=n.rule)==null?void 0:h.description)||n.start}
|
|
360
360
|
</div>
|
|
361
361
|
`})}
|
|
362
362
|
${!e.isBlocked&&i.length>2?s.html`<div style="text-align: center; font-size: 0.65rem; color: var(--glatam-text-secondary);">+${i.length-2} tareas</div>`:""}
|
|
@@ -408,12 +408,12 @@
|
|
|
408
408
|
<div class="day-num">${e.dayNumber}</div>
|
|
409
409
|
</div>
|
|
410
410
|
|
|
411
|
-
${e.slots.map((o,c)=>{var
|
|
411
|
+
${e.slots.map((o,c)=>{var h,u;const p=o.isBlocked,n=this.isSlotSelected(e.dateString,o),g=this.isSlotDragSelecting(a,c);return s.html`
|
|
412
412
|
<div
|
|
413
413
|
class=${$.classMap({"slot-cell":!0,available:!p,blocked:p,selected:n,"drag-selecting":g})}
|
|
414
414
|
@mousedown=${()=>this.handleMouseDown(a,c,p)}
|
|
415
415
|
@mouseenter=${()=>this.handleMouseEnter(a,c,p)}
|
|
416
|
-
title=${p&&((
|
|
416
|
+
title=${p&&((h=o.rule)!=null&&h.description)?o.rule.description:""}
|
|
417
417
|
>
|
|
418
418
|
${p?((u=o.rule)==null?void 0:u.description)||"Ocupado":n?"Reservado":""}
|
|
419
419
|
</div>
|
|
@@ -744,7 +744,7 @@
|
|
|
744
744
|
</div>
|
|
745
745
|
</div>
|
|
746
746
|
</dialog>
|
|
747
|
-
`}};exports.GlatamCalendarModal.styles=B;f([l.property({type:Boolean})],exports.GlatamCalendarModal.prototype,"open",2);f([l.property({type:String})],exports.GlatamCalendarModal.prototype,"dateString",2);f([l.property({type:String})],exports.GlatamCalendarModal.prototype,"startTime",2);f([l.property({type:String})],exports.GlatamCalendarModal.prototype,"endTime",2);f([l.property({type:Boolean})],exports.GlatamCalendarModal.prototype,"isRange",2);f([l.property({type:Object})],exports.GlatamCalendarModal.prototype,"existingRule",2);f([l.state()],exports.GlatamCalendarModal.prototype,"description",2);f([l.state()],exports.GlatamCalendarModal.prototype,"blockAllDay",2);f([l.state()],exports.GlatamCalendarModal.prototype,"isRecurring",2);f([l.state()],exports.GlatamCalendarModal.prototype,"selectedDays",2);exports.GlatamCalendarModal=f([l.customElement("glatam-calendar-modal")],exports.GlatamCalendarModal);var N=Object.defineProperty,W=Object.getOwnPropertyDescriptor,
|
|
747
|
+
`}};exports.GlatamCalendarModal.styles=B;f([l.property({type:Boolean})],exports.GlatamCalendarModal.prototype,"open",2);f([l.property({type:String})],exports.GlatamCalendarModal.prototype,"dateString",2);f([l.property({type:String})],exports.GlatamCalendarModal.prototype,"startTime",2);f([l.property({type:String})],exports.GlatamCalendarModal.prototype,"endTime",2);f([l.property({type:Boolean})],exports.GlatamCalendarModal.prototype,"isRange",2);f([l.property({type:Object})],exports.GlatamCalendarModal.prototype,"existingRule",2);f([l.state()],exports.GlatamCalendarModal.prototype,"description",2);f([l.state()],exports.GlatamCalendarModal.prototype,"blockAllDay",2);f([l.state()],exports.GlatamCalendarModal.prototype,"isRecurring",2);f([l.state()],exports.GlatamCalendarModal.prototype,"selectedDays",2);exports.GlatamCalendarModal=f([l.customElement("glatam-calendar-modal")],exports.GlatamCalendarModal);var N=Object.defineProperty,W=Object.getOwnPropertyDescriptor,m=(d,t,e,a)=>{for(var r=a>1?void 0:a?W(t,e):t,i=d.length-1,o;i>=0;i--)(o=d[i])&&(r=(a?o(t,e,r):o(r))||r);return a&&r&&N(t,e,r),r};const P=[{start:"09:00",end:"10:00"},{start:"10:00",end:"11:00"},{start:"11:00",end:"12:00"},{start:"12:00",end:"13:00"},{start:"13:00",end:"14:00"},{start:"14:00",end:"15:00"},{start:"15:00",end:"16:00"},{start:"16:00",end:"17:00"},{start:"17:00",end:"18:00"}];exports.GlatamCalendar=class extends s.LitElement{constructor(){super(...arguments),this.role="provider",this.size="medium",this.view="month",this.locale="es",this.startOfWeekDay=0,this.rules=[],this.selectedDates=[],this.selectedRange=null,this.hostTimezone="America/Bogota",this.activeTimezone="local",this.slots=P,this.minDate="",this.maxDate="",this.showNeighboringMonth=!0,this.tileClassName=null,this.activeDate=new Date,this.localRules=[],this.darkMode=!1,this.modalOpen=!1,this.modalDateString="",this.modalStartTime="",this.modalEndTime="",this.modalIsRange=!1,this.modalExistingRule=null}firstUpdated(){this.darkMode=window.matchMedia("(prefers-color-scheme: dark)").matches,this.localRules=[...this.rules]}willUpdate(t){t.has("rules")&&(this.localRules=[...this.rules||[]])}updated(t){t.has("darkMode")&&this.classList.toggle("dark-mode",this.darkMode)}handlePrev(){const t=new Date(this.activeDate);this.view==="month"?t.setMonth(t.getMonth()-1):this.view==="week"?t.setDate(t.getDate()-7):t.setDate(t.getDate()-1),this.activeDate=t}handleNext(){const t=new Date(this.activeDate);this.view==="month"?t.setMonth(t.getMonth()+1):this.view==="week"?t.setDate(t.getDate()+7):t.setDate(t.getDate()+1),this.activeDate=t}getHeaderTitle(){const t=this.view==="month"?{month:"long",year:"numeric"}:this.view==="week"?{month:"short",year:"numeric"}:{day:"numeric",month:"long",year:"numeric"};return new Intl.DateTimeFormat(this.locale,t).format(this.activeDate)}handleDaySelect(t){const{dateString:e,isBlocked:a}=t.detail;this.role==="buyer"&&a||(this.activeDate=new Date(e+"T00:00:00"),this.view="day",this.dispatchEvent(new CustomEvent("date-selected",{detail:{dateString:e},bubbles:!0,composed:!0})))}handleRangeSelect(t){var S,D;const{dateString:e,start:a,end:r}=t.detail,i=this.activeTimezone==="local"?k(this.activeDate,this.hostTimezone,"local"):0,o=new Date().toISOString().split("T")[0],c=this.minDate||(this.role==="buyer"?o:"");if(this.role==="buyer"&&c&&e<c)return;const p=this.getDisplaySlots(i),n=p.findIndex(C=>C.start===a),g=p.findIndex(C=>C.end===r),h=((S=this.slots[n])==null?void 0:S.start)||a,u=((D=this.slots[g])==null?void 0:D.end)||r;if(this.role==="buyer"){this.selectedRange={dateString:e,start:a,end:r},this.dispatchEvent(new CustomEvent("booking-selected",{detail:{dateString:e,start:a,end:r,hostStart:h,hostEnd:u},bubbles:!0,composed:!0}));return}this.openModal(e,h,u,!0,null)}handleSlotClick(t){const{dateString:e,slot:a}=t.detail,r=new Date(e+"T00:00:00"),i=this.activeTimezone==="local"?k(this.activeDate,this.hostTimezone,"local"):0,o=new Date().toISOString().split("T")[0],c=this.minDate||(this.role==="buyer"?o:"");if(this.role==="buyer"&&(a.isBlocked||c&&e<c))return;const p=this.getDisplaySlots(i),n=p.findIndex(u=>u.start===a.start),g=this.slots[n]||a;if(this.role==="buyer"){this.selectedRange={dateString:e,start:a.start,end:a.end},this.dispatchEvent(new CustomEvent("booking-selected",{detail:{dateString:e,start:a.start,end:a.end,hostStart:g.start,hostEnd:g.end},bubbles:!0,composed:!0}));return}const h=this.localRules.find(u=>y.isTimeBlocked(r,g,[u]));this.openModal(e,g.start,g.end,!0,h||null)}handleBlockDayAction(){const t=y.formatISODate(this.activeDate),e=this.localRules.find(a=>y.isTimeBlocked(this.activeDate,void 0,[a]));this.openModal(t,"","",!1,e||null)}openModal(t,e,a,r,i){this.modalDateString=t,this.modalStartTime=e,this.modalEndTime=a,this.modalIsRange=r,this.modalExistingRule=i,this.modalOpen=!0}handleSaveRule(t){const e=t.detail,a=this.modalExistingRule?this.modalExistingRule.id:`rule-${Date.now()}`,r={id:a,type:e.isRecurring?"weekly":"date-range",slots:e.blockAllDay?void 0:[{start:e.startTime,end:e.endTime}],daysOfWeek:e.isRecurring?e.selectedDays:void 0,startDate:e.isRecurring?void 0:e.dateString,endDate:e.isRecurring?void 0:e.dateString,description:e.title};this.localRules=this.modalExistingRule?this.localRules.map(i=>i.id===a?r:i):[...this.localRules,r],this.modalOpen=!1,this.dispatchEvent(new CustomEvent("rules-changed",{detail:{rules:this.localRules},bubbles:!0,composed:!0}))}handleDeleteRule(t){this.localRules=this.localRules.filter(e=>e.id!==t.detail.id),this.modalOpen=!1,this.dispatchEvent(new CustomEvent("rules-changed",{detail:{rules:this.localRules},bubbles:!0,composed:!0}))}getDisplaySlots(t){return t===0?this.slots:this.slots.map(e=>{const a=R(e,t),r=a.dayShift>0?" (+1d)":a.dayShift<0?" (-1d)":"";return{start:a.start+r,end:a.end+r}})}render(){var p;const t=this.activeDate.getFullYear(),e=this.activeDate.getMonth(),a=y.isTimeBlocked(this.activeDate,void 0,this.localRules),r=this.activeTimezone==="local"?k(this.activeDate,this.hostTimezone,"local"):0,i=this.getDisplaySlots(r),o=n=>n.map(g=>({...g,slots:g.slots.map((h,u)=>{var S,D;return{...h,start:((S=i[u])==null?void 0:S.start)||h.start,end:((D=i[u])==null?void 0:D.end)||h.end}})})),c=((p=this.hostTimezone.split("/").pop())==null?void 0:p.replace("_"," "))||"Anfitrión";return s.html`
|
|
748
748
|
<div class="calendar-header">
|
|
749
749
|
<div class="nav-group">
|
|
750
750
|
<button class="btn" @click=${()=>this.activeDate=new Date}>Hoy</button>
|
|
@@ -782,7 +782,7 @@
|
|
|
782
782
|
.isRange=${this.modalIsRange} .existingRule=${this.modalExistingRule} @save-rule=${this.handleSaveRule}
|
|
783
783
|
@delete-rule=${this.handleDeleteRule} @close=${()=>this.modalOpen=!1}
|
|
784
784
|
></glatam-calendar-modal>
|
|
785
|
-
`}};exports.GlatamCalendar.styles=[M,G];
|
|
785
|
+
`}};exports.GlatamCalendar.styles=[M,G];m([l.property({type:String})],exports.GlatamCalendar.prototype,"role",2);m([l.property({type:String,reflect:!0})],exports.GlatamCalendar.prototype,"size",2);m([l.property({type:String})],exports.GlatamCalendar.prototype,"view",2);m([l.property({type:String})],exports.GlatamCalendar.prototype,"locale",2);m([l.property({type:Number})],exports.GlatamCalendar.prototype,"startOfWeekDay",2);m([l.property({type:Array})],exports.GlatamCalendar.prototype,"rules",2);m([l.property({type:Array})],exports.GlatamCalendar.prototype,"selectedDates",2);m([l.property({type:Object})],exports.GlatamCalendar.prototype,"selectedRange",2);m([l.property({type:String})],exports.GlatamCalendar.prototype,"hostTimezone",2);m([l.property({type:String})],exports.GlatamCalendar.prototype,"activeTimezone",2);m([l.property({type:Array})],exports.GlatamCalendar.prototype,"slots",2);m([l.property({type:String})],exports.GlatamCalendar.prototype,"minDate",2);m([l.property({type:String})],exports.GlatamCalendar.prototype,"maxDate",2);m([l.property({type:Boolean})],exports.GlatamCalendar.prototype,"showNeighboringMonth",2);m([l.property({attribute:!1})],exports.GlatamCalendar.prototype,"tileClassName",2);m([l.state()],exports.GlatamCalendar.prototype,"activeDate",2);m([l.state()],exports.GlatamCalendar.prototype,"localRules",2);m([l.state()],exports.GlatamCalendar.prototype,"darkMode",2);m([l.state()],exports.GlatamCalendar.prototype,"modalOpen",2);m([l.state()],exports.GlatamCalendar.prototype,"modalDateString",2);m([l.state()],exports.GlatamCalendar.prototype,"modalStartTime",2);m([l.state()],exports.GlatamCalendar.prototype,"modalEndTime",2);m([l.state()],exports.GlatamCalendar.prototype,"modalIsRange",2);m([l.state()],exports.GlatamCalendar.prototype,"modalExistingRule",2);exports.GlatamCalendar=m([l.customElement("glatam-calendar")],exports.GlatamCalendar);var A=Object.defineProperty,L=Object.getOwnPropertyDescriptor,b=(d,t,e,a)=>{for(var r=a>1?void 0:a?L(t,e):t,i=d.length-1,o;i>=0;i--)(o=d[i])&&(r=(a?o(t,e,r):o(r))||r);return a&&r&&A(t,e,r),r};exports.GlatamCalendarMini=class extends s.LitElement{constructor(){super(...arguments),this.role="buyer",this.locale="es",this.startOfWeekDay=0,this.rules=[],this.selectedRange=null,this.size="medium",this.hostTimezone="America/Bogota",this.activeTimezone="local",this.minDate="",this.maxDate="",this.showNeighboringMonth=!0,this.tileClassName=null,this.slots=[{start:"09:00",end:"10:00"},{start:"10:00",end:"11:00"},{start:"11:00",end:"12:00"},{start:"12:00",end:"13:00"},{start:"13:00",end:"14:00"},{start:"14:00",end:"15:00"},{start:"15:00",end:"16:00"},{start:"16:00",end:"17:00"},{start:"17:00",end:"18:00"}],this.activeDate=new Date,this.dropdownOpen=!1,this.dropdownSelectedDateString=""}handleDropdownDaySelect(t){this.dropdownSelectedDateString=t.detail.dateString}selectDropdownSlot(t){const e={dateString:this.dropdownSelectedDateString,start:t.displayStart,end:t.displayEnd,hostStart:t.start,hostEnd:t.end};this.selectedRange={dateString:this.dropdownSelectedDateString,start:t.displayStart,end:t.displayEnd},this.dispatchEvent(new CustomEvent("booking-selected",{detail:e,bubbles:!0,composed:!0})),this.dropdownOpen=!1,this.dropdownSelectedDateString=""}render(){const t=this.selectedRange?`Reserva: ${this.selectedRange.dateString} (${this.selectedRange.start} - ${this.selectedRange.end})`:"Seleccionar Fecha y Hora",e=this.activeDate.getFullYear(),a=this.activeDate.getMonth(),r=this.dropdownSelectedDateString?new Date(this.dropdownSelectedDateString+"T00:00:00"):null,i=r&&this.activeTimezone==="local"?k(r,this.hostTimezone,"local"):0,o=r?this.slots.map(c=>{const p=y.isTimeBlocked(r,c,this.rules),n=R(c,i),g=n.dayShift>0?" (+1d)":n.dayShift<0?" (-1d)":"";return{...c,displayStart:n.start+g,displayEnd:n.end+g,isBlocked:p}}):[];return s.html`
|
|
786
786
|
<div class="dropdown-container">
|
|
787
787
|
<button class="btn btn-primary dropdown-toggle" @click=${()=>this.dropdownOpen=!this.dropdownOpen}>
|
|
788
788
|
<span>${t}</span> <span>${this.dropdownOpen?"▲":"▼"}</span>
|
package/dist/glatam-calendar.js
CHANGED
|
@@ -389,11 +389,11 @@ function U(e, t) {
|
|
|
389
389
|
m < 0 && (m += 1440);
|
|
390
390
|
const y = String(Math.floor(m / 60)).padStart(2, "0"), $ = String(m % 60).padStart(2, "0");
|
|
391
391
|
return `${y}:${$}`;
|
|
392
|
-
}, r = a(e.start), l = a(e.end), o = r + t,
|
|
392
|
+
}, r = a(e.start), l = a(e.end), o = r + t, p = l + t;
|
|
393
393
|
let n = 0;
|
|
394
394
|
return o < 0 ? n = -1 : o >= 1440 && (n = 1), {
|
|
395
395
|
start: i(o),
|
|
396
|
-
end: i(
|
|
396
|
+
end: i(p),
|
|
397
397
|
dayShift: n
|
|
398
398
|
};
|
|
399
399
|
}
|
|
@@ -426,7 +426,7 @@ let f = class extends O {
|
|
|
426
426
|
${e.map((t) => d`<div class="weekday">${t}</div>`)}
|
|
427
427
|
|
|
428
428
|
${this.days.map((t) => {
|
|
429
|
-
var
|
|
429
|
+
var p;
|
|
430
430
|
if (!t.isCurrentMonth && !this.showNeighboringMonth)
|
|
431
431
|
return d`<div class="day-cell empty"></div>`;
|
|
432
432
|
const a = t.dateString === (/* @__PURE__ */ new Date()).toISOString().split("T")[0], i = this.selectedDates.includes(t.dateString), r = t.slots.filter((n) => n.isBlocked), l = this.minDate && t.dateString < this.minDate || this.maxDate && t.dateString > this.maxDate, o = this.tileClassName ? this.tileClassName({ date: t.date, dateString: t.dateString }) : "";
|
|
@@ -447,7 +447,7 @@ let f = class extends O {
|
|
|
447
447
|
<div class="day-number">${t.dayNumber}</div>
|
|
448
448
|
|
|
449
449
|
<div class="slot-indicator">
|
|
450
|
-
${t.isBlocked ? d`<div class="badge blocked-day">${((
|
|
450
|
+
${t.isBlocked ? d`<div class="badge blocked-day">${((p = t.rule) == null ? void 0 : p.description) || "Bloqueado"}</div>` : r.slice(0, 2).map((n) => {
|
|
451
451
|
var c, m;
|
|
452
452
|
return d`
|
|
453
453
|
<div class="badge blocked-slot" title=${((c = n.rule) == null ? void 0 : c.description) || ""}>
|
|
@@ -598,21 +598,21 @@ let w = class extends O {
|
|
|
598
598
|
|
|
599
599
|
${t.slots.map((l, o) => {
|
|
600
600
|
var m, y;
|
|
601
|
-
const
|
|
601
|
+
const p = l.isBlocked, n = this.isSlotSelected(t.dateString, l), c = this.isSlotDragSelecting(a, o);
|
|
602
602
|
return d`
|
|
603
603
|
<div
|
|
604
604
|
class=${N({
|
|
605
605
|
"slot-cell": !0,
|
|
606
|
-
available: !
|
|
607
|
-
blocked:
|
|
606
|
+
available: !p,
|
|
607
|
+
blocked: p,
|
|
608
608
|
selected: n,
|
|
609
609
|
"drag-selecting": c
|
|
610
610
|
})}
|
|
611
|
-
@mousedown=${() => this.handleMouseDown(a, o,
|
|
612
|
-
@mouseenter=${() => this.handleMouseEnter(a, o,
|
|
613
|
-
title=${
|
|
611
|
+
@mousedown=${() => this.handleMouseDown(a, o, p)}
|
|
612
|
+
@mouseenter=${() => this.handleMouseEnter(a, o, p)}
|
|
613
|
+
title=${p && ((m = l.rule) != null && m.description) ? l.rule.description : ""}
|
|
614
614
|
>
|
|
615
|
-
${
|
|
615
|
+
${p ? ((y = l.rule) == null ? void 0 : y.description) || "Ocupado" : n ? "Reservado" : ""}
|
|
616
616
|
</div>
|
|
617
617
|
`;
|
|
618
618
|
})}
|
|
@@ -770,7 +770,7 @@ let S = class extends O {
|
|
|
770
770
|
</div>
|
|
771
771
|
|
|
772
772
|
${this.day.slots.map((a, i) => {
|
|
773
|
-
var
|
|
773
|
+
var p, n;
|
|
774
774
|
const r = a.isBlocked, l = this.isSlotSelected(a), o = this.isSlotDragSelecting(i);
|
|
775
775
|
return d`
|
|
776
776
|
<div
|
|
@@ -783,7 +783,7 @@ let S = class extends O {
|
|
|
783
783
|
})}
|
|
784
784
|
@mousedown=${() => this.handleMouseDown(i, r)}
|
|
785
785
|
@mouseenter=${() => this.handleMouseEnter(i, r)}
|
|
786
|
-
title=${r && ((
|
|
786
|
+
title=${r && ((p = a.rule) != null && p.description) ? a.rule.description : ""}
|
|
787
787
|
>
|
|
788
788
|
${r ? ((n = a.rule) == null ? void 0 : n.description) || "Ocupado" : l ? "Reservado" : ""}
|
|
789
789
|
</div>
|
|
@@ -1156,7 +1156,7 @@ k([
|
|
|
1156
1156
|
x = k([
|
|
1157
1157
|
T("glatam-calendar-modal")
|
|
1158
1158
|
], x);
|
|
1159
|
-
var X = Object.defineProperty, K = Object.getOwnPropertyDescriptor,
|
|
1159
|
+
var X = Object.defineProperty, K = Object.getOwnPropertyDescriptor, h = (e, t, a, i) => {
|
|
1160
1160
|
for (var r = i > 1 ? void 0 : i ? K(t, a) : t, l = e.length - 1, o; l >= 0; l--)
|
|
1161
1161
|
(o = e[l]) && (r = (i ? o(t, a, r) : o(r)) || r);
|
|
1162
1162
|
return i && r && X(t, a, r), r;
|
|
@@ -1180,7 +1180,7 @@ let g = class extends O {
|
|
|
1180
1180
|
this.darkMode = window.matchMedia("(prefers-color-scheme: dark)").matches, this.localRules = [...this.rules];
|
|
1181
1181
|
}
|
|
1182
1182
|
willUpdate(e) {
|
|
1183
|
-
e.has("rules") &&
|
|
1183
|
+
e.has("rules") && (this.localRules = [...this.rules || []]);
|
|
1184
1184
|
}
|
|
1185
1185
|
updated(e) {
|
|
1186
1186
|
e.has("darkMode") && this.classList.toggle("dark-mode", this.darkMode);
|
|
@@ -1205,7 +1205,7 @@ let g = class extends O {
|
|
|
1205
1205
|
var $, M;
|
|
1206
1206
|
const { dateString: t, start: a, end: i } = e.detail, r = this.activeTimezone === "local" ? C(this.activeDate, this.hostTimezone, "local") : 0, l = (/* @__PURE__ */ new Date()).toISOString().split("T")[0], o = this.minDate || (this.role === "buyer" ? l : "");
|
|
1207
1207
|
if (this.role === "buyer" && o && t < o) return;
|
|
1208
|
-
const
|
|
1208
|
+
const p = this.getDisplaySlots(r), n = p.findIndex((B) => B.start === a), c = p.findIndex((B) => B.end === i), m = (($ = this.slots[n]) == null ? void 0 : $.start) || a, y = ((M = this.slots[c]) == null ? void 0 : M.end) || i;
|
|
1209
1209
|
if (this.role === "buyer") {
|
|
1210
1210
|
this.selectedRange = { dateString: t, start: a, end: i }, this.dispatchEvent(new CustomEvent("booking-selected", { detail: { dateString: t, start: a, end: i, hostStart: m, hostEnd: y }, bubbles: !0, composed: !0 }));
|
|
1211
1211
|
return;
|
|
@@ -1215,7 +1215,7 @@ let g = class extends O {
|
|
|
1215
1215
|
handleSlotClick(e) {
|
|
1216
1216
|
const { dateString: t, slot: a } = e.detail, i = /* @__PURE__ */ new Date(t + "T00:00:00"), r = this.activeTimezone === "local" ? C(this.activeDate, this.hostTimezone, "local") : 0, l = (/* @__PURE__ */ new Date()).toISOString().split("T")[0], o = this.minDate || (this.role === "buyer" ? l : "");
|
|
1217
1217
|
if (this.role === "buyer" && (a.isBlocked || o && t < o)) return;
|
|
1218
|
-
const
|
|
1218
|
+
const p = this.getDisplaySlots(r), n = p.findIndex((y) => y.start === a.start), c = this.slots[n] || a;
|
|
1219
1219
|
if (this.role === "buyer") {
|
|
1220
1220
|
this.selectedRange = { dateString: t, start: a.start, end: a.end }, this.dispatchEvent(new CustomEvent("booking-selected", { detail: { dateString: t, start: a.start, end: a.end, hostStart: c.start, hostEnd: c.end }, bubbles: !0, composed: !0 }));
|
|
1221
1221
|
return;
|
|
@@ -1252,11 +1252,11 @@ let g = class extends O {
|
|
|
1252
1252
|
});
|
|
1253
1253
|
}
|
|
1254
1254
|
render() {
|
|
1255
|
-
var
|
|
1255
|
+
var p;
|
|
1256
1256
|
const e = this.activeDate.getFullYear(), t = this.activeDate.getMonth(), a = I(this.activeDate, void 0, this.localRules), i = this.activeTimezone === "local" ? C(this.activeDate, this.hostTimezone, "local") : 0, r = this.getDisplaySlots(i), l = (n) => n.map((c) => ({ ...c, slots: c.slots.map((m, y) => {
|
|
1257
1257
|
var $, M;
|
|
1258
1258
|
return { ...m, start: (($ = r[y]) == null ? void 0 : $.start) || m.start, end: ((M = r[y]) == null ? void 0 : M.end) || m.end };
|
|
1259
|
-
}) })), o = ((
|
|
1259
|
+
}) })), o = ((p = this.hostTimezone.split("/").pop()) == null ? void 0 : p.replace("_", " ")) || "Anfitrión";
|
|
1260
1260
|
return d`
|
|
1261
1261
|
<div class="calendar-header">
|
|
1262
1262
|
<div class="nav-group">
|
|
@@ -1299,79 +1299,79 @@ let g = class extends O {
|
|
|
1299
1299
|
}
|
|
1300
1300
|
};
|
|
1301
1301
|
g.styles = [P, W];
|
|
1302
|
-
|
|
1302
|
+
h([
|
|
1303
1303
|
s({ type: String })
|
|
1304
1304
|
], g.prototype, "role", 2);
|
|
1305
|
-
|
|
1305
|
+
h([
|
|
1306
1306
|
s({ type: String, reflect: !0 })
|
|
1307
1307
|
], g.prototype, "size", 2);
|
|
1308
|
-
|
|
1308
|
+
h([
|
|
1309
1309
|
s({ type: String })
|
|
1310
1310
|
], g.prototype, "view", 2);
|
|
1311
|
-
|
|
1311
|
+
h([
|
|
1312
1312
|
s({ type: String })
|
|
1313
1313
|
], g.prototype, "locale", 2);
|
|
1314
|
-
|
|
1314
|
+
h([
|
|
1315
1315
|
s({ type: Number })
|
|
1316
1316
|
], g.prototype, "startOfWeekDay", 2);
|
|
1317
|
-
|
|
1317
|
+
h([
|
|
1318
1318
|
s({ type: Array })
|
|
1319
1319
|
], g.prototype, "rules", 2);
|
|
1320
|
-
|
|
1320
|
+
h([
|
|
1321
1321
|
s({ type: Array })
|
|
1322
1322
|
], g.prototype, "selectedDates", 2);
|
|
1323
|
-
|
|
1323
|
+
h([
|
|
1324
1324
|
s({ type: Object })
|
|
1325
1325
|
], g.prototype, "selectedRange", 2);
|
|
1326
|
-
|
|
1326
|
+
h([
|
|
1327
1327
|
s({ type: String })
|
|
1328
1328
|
], g.prototype, "hostTimezone", 2);
|
|
1329
|
-
|
|
1329
|
+
h([
|
|
1330
1330
|
s({ type: String })
|
|
1331
1331
|
], g.prototype, "activeTimezone", 2);
|
|
1332
|
-
|
|
1332
|
+
h([
|
|
1333
1333
|
s({ type: Array })
|
|
1334
1334
|
], g.prototype, "slots", 2);
|
|
1335
|
-
|
|
1335
|
+
h([
|
|
1336
1336
|
s({ type: String })
|
|
1337
1337
|
], g.prototype, "minDate", 2);
|
|
1338
|
-
|
|
1338
|
+
h([
|
|
1339
1339
|
s({ type: String })
|
|
1340
1340
|
], g.prototype, "maxDate", 2);
|
|
1341
|
-
|
|
1341
|
+
h([
|
|
1342
1342
|
s({ type: Boolean })
|
|
1343
1343
|
], g.prototype, "showNeighboringMonth", 2);
|
|
1344
|
-
|
|
1344
|
+
h([
|
|
1345
1345
|
s({ attribute: !1 })
|
|
1346
1346
|
], g.prototype, "tileClassName", 2);
|
|
1347
|
-
|
|
1347
|
+
h([
|
|
1348
1348
|
u()
|
|
1349
1349
|
], g.prototype, "activeDate", 2);
|
|
1350
|
-
|
|
1350
|
+
h([
|
|
1351
1351
|
u()
|
|
1352
1352
|
], g.prototype, "localRules", 2);
|
|
1353
|
-
|
|
1353
|
+
h([
|
|
1354
1354
|
u()
|
|
1355
1355
|
], g.prototype, "darkMode", 2);
|
|
1356
|
-
|
|
1356
|
+
h([
|
|
1357
1357
|
u()
|
|
1358
1358
|
], g.prototype, "modalOpen", 2);
|
|
1359
|
-
|
|
1359
|
+
h([
|
|
1360
1360
|
u()
|
|
1361
1361
|
], g.prototype, "modalDateString", 2);
|
|
1362
|
-
|
|
1362
|
+
h([
|
|
1363
1363
|
u()
|
|
1364
1364
|
], g.prototype, "modalStartTime", 2);
|
|
1365
|
-
|
|
1365
|
+
h([
|
|
1366
1366
|
u()
|
|
1367
1367
|
], g.prototype, "modalEndTime", 2);
|
|
1368
|
-
|
|
1368
|
+
h([
|
|
1369
1369
|
u()
|
|
1370
1370
|
], g.prototype, "modalIsRange", 2);
|
|
1371
|
-
|
|
1371
|
+
h([
|
|
1372
1372
|
u()
|
|
1373
1373
|
], g.prototype, "modalExistingRule", 2);
|
|
1374
|
-
g =
|
|
1374
|
+
g = h([
|
|
1375
1375
|
T("glatam-calendar")
|
|
1376
1376
|
], g);
|
|
1377
1377
|
var tt = Object.defineProperty, et = Object.getOwnPropertyDescriptor, v = (e, t, a, i) => {
|
|
@@ -1408,12 +1408,12 @@ let b = class extends O {
|
|
|
1408
1408
|
}
|
|
1409
1409
|
render() {
|
|
1410
1410
|
const e = this.selectedRange ? `Reserva: ${this.selectedRange.dateString} (${this.selectedRange.start} - ${this.selectedRange.end})` : "Seleccionar Fecha y Hora", t = this.activeDate.getFullYear(), a = this.activeDate.getMonth(), i = this.dropdownSelectedDateString ? /* @__PURE__ */ new Date(this.dropdownSelectedDateString + "T00:00:00") : null, r = i && this.activeTimezone === "local" ? C(i, this.hostTimezone, "local") : 0, l = i ? this.slots.map((o) => {
|
|
1411
|
-
const
|
|
1411
|
+
const p = I(i, o, this.rules), n = U(o, r), c = n.dayShift > 0 ? " (+1d)" : n.dayShift < 0 ? " (-1d)" : "";
|
|
1412
1412
|
return {
|
|
1413
1413
|
...o,
|
|
1414
1414
|
displayStart: n.start + c,
|
|
1415
1415
|
displayEnd: n.end + c,
|
|
1416
|
-
isBlocked:
|
|
1416
|
+
isBlocked: p
|
|
1417
1417
|
};
|
|
1418
1418
|
}) : [];
|
|
1419
1419
|
return d`
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@glatam/calendar-ui",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.4",
|
|
4
4
|
"description": "Componente web UI para el calendario @glatam/calendar",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"author": "Santiago Hernández Saldarriaga",
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"dev": "vite"
|
|
41
41
|
},
|
|
42
42
|
"dependencies": {
|
|
43
|
-
"@glatam/calendar-core": "^1.0.
|
|
43
|
+
"@glatam/calendar-core": "^1.0.4",
|
|
44
44
|
"lit": "^3.1.2"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|