@eunomia/elements 1.0.0-beta.1 → 1.0.0-beta.3

package/dist/cdn/components/eun-scheduler.js

@@ -0,0 +1,497 @@
+import{a as A,b as $}from"./chunks/chunk-IKAZYVB7.js";import{a as T}from"./chunks/chunk-ATH2OAMU.js";import{a as S}from"./chunks/chunk-LK5BJ4SH.js";import{a as M}from"./chunks/chunk-IJJ67C66.js";import{a as w}from"./chunks/chunk-BRSNQMCD.js";import{a as D,b as k,d as y,e as C,f as P}from"./chunks/chunk-647ISUF4.js";import{j as E}from"./chunks/chunk-MJ4RDZLL.js";import{a as c}from"./chunks/chunk-5EVP7YNE.js";import{a as i,f as x,g,h as o,i as v,j as h,n as s,p as d,s as L}from"./chunks/chunk-XH6NREVZ.js";var W=g`
+  :host {
+    display: block;
+    box-sizing: border-box;
+    border: 1px solid
+      var(--scheduler-border-color, var(--eun-border-color, #dee0e7));
+    border-radius: var(--eun-borderRadius-m, 10px);
+    background: var(--scheduler-background, var(--eun-surface-color, #ffffff));
+    overflow: hidden;
+    font-family: var(--eun-font-family, "Mulish", sans-serif);
+  }
+
+  #header {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--eun-space-s, 8px);
+    padding: var(--eun-space-s, 8px) var(--eun-space-m, 16px)
+      var(--eun-space-m, 16px);
+    border-bottom: 1px solid
+      var(--scheduler-border-color, var(--eun-border-color, #dee0e7));
+    position: sticky;
+    top: 0;
+    z-index: 4;
+    background: var(--scheduler-background, var(--eun-surface-color, #ffffff));
+  }
+
+  #header-nav {
+    width: 100%;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--eun-space-s, 8px);
+  }
+
+  #header-nav-arrows {
+    display: flex;
+    align-items: center;
+    gap: var(--eun-space-xs, 4px);
+  }
+
+  #header-mobile-nav,
+  #header-mobile-nav-actions,
+  #header-actions {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--eun-space-s, 8px);
+  }
+
+  #header-mobile-nav,
+  #header-actions {
+    width: 100%;
+  }
+
+  #header-mobile-nav {
+    justify-content: space-between;
+  }
+
+  #header-actions eun-toggle-group {
+    max-width: 100%;
+    overflow-x: auto;
+  }
+
+  #header-create-button {
+    --button-border-color: var(--eun-color-grey-300, #dee0e7);
+    --button-border-size: 1px;
+  }
+
+  #period-label {
+    margin: 0 var(--eun-space-xs, 4px);
+    font-size: 15px;
+    font-weight: var(--eun-fontWeight-m, 500);
+    color: var(--eun-text-color, #071621);
+  }
+
+  #view {
+    position: relative;
+    overflow: hidden;
+  }
+
+  #view.swiping-next #view-content {
+    animation: scheduler-slide-from-right var(--scheduler-swipe-duration, 200ms)
+      ease-out;
+  }
+
+  #view.swiping-previous #view-content {
+    animation: scheduler-slide-from-left var(--scheduler-swipe-duration, 200ms)
+      ease-out;
+  }
+
+  @keyframes scheduler-slide-from-right {
+    from {
+      transform: translateX(24px);
+      opacity: 0.4;
+    }
+    to {
+      transform: translateX(0);
+      opacity: 1;
+    }
+  }
+
+  @keyframes scheduler-slide-from-left {
+    from {
+      transform: translateX(-24px);
+      opacity: 0.4;
+    }
+    to {
+      transform: translateX(0);
+      opacity: 1;
+    }
+  }
+
+  :host([no-animation]) #view.swiping-next #view-content,
+  :host([no-animation]) #view.swiping-previous #view-content {
+    animation: none;
+  }
+
+  #live-region {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    clip: rect(0 0 0 0);
+    white-space: nowrap;
+  }
+`,z=W;var Q=g`
+  #event-popover {
+    box-sizing: border-box;
+    width: var(--scheduler-popover-width, 300px);
+    max-width: calc(100vw - 32px);
+    max-height: calc(100vh - 32px);
+    overflow: auto;
+    margin: 0;
+    padding: 0;
+    border: 1px solid var(--eun-border-color, #dee0e7);
+    border-radius: var(--eun-borderRadius-m, 10px);
+    background: var(--eun-surface-color, #ffffff);
+    box-shadow: var(--eun-shadow-m, 0 8px 24px rgba(7, 22, 33, 0.16));
+    font-family: var(--eun-font-family, "Mulish", sans-serif);
+    color: var(--eun-text-color, #071621);
+    position: fixed;
+    top: var(--_anchorTop, 0);
+    left: var(--_anchorLeft, 0);
+    opacity: 0;
+    transform: scale(0.98);
+    transform-origin: left center;
+  }
+
+  #event-popover[data-placement="left"] {
+    transform-origin: right center;
+  }
+
+  #event-popover[data-placement="bottom"] {
+    transform-origin: top center;
+  }
+
+  #event-popover[data-placement="top"] {
+    transform-origin: bottom center;
+  }
+
+  #event-popover:not(:popover-open) {
+    display: none;
+  }
+
+  #event-popover:popover-open {
+    opacity: 1;
+    transform: scale(1);
+  }
+
+  .event-popover-bar {
+    height: 4px;
+    border-radius: var(--eun-borderRadius-m, 10px)
+      var(--eun-borderRadius-m, 10px) 0 0;
+    background: var(--_accent, var(--eun-color-blue-600, #0aa5a8));
+  }
+
+  #event-popover-close {
+    position: absolute;
+    top: var(--eun-space-s, 8px);
+    right: var(--eun-space-s, 8px);
+    z-index: 1;
+  }
+
+  .event-popover-body {
+    display: flex;
+    flex-direction: column;
+    gap: var(--eun-space-s, 8px);
+    padding: var(--eun-space-m, 16px);
+  }
+
+  .event-popover-title {
+    margin: 0;
+    padding-right: 28px;
+    font-size: 16px;
+    font-weight: var(--eun-fontWeight-l, 700);
+  }
+
+  .event-popover-row {
+    display: flex;
+    align-items: flex-start;
+    gap: var(--eun-space-s, 8px);
+    font-size: 13px;
+    color: var(--eun-text-secondary, #484e61);
+  }
+
+  .event-popover-row eun-icon {
+    flex: 0 0 auto;
+    margin-top: 1px;
+    color: var(--eun-text-secondary, #484e61);
+  }
+
+  .event-popover-guests {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+
+  .event-popover-guest {
+    display: flex;
+    align-items: center;
+    gap: var(--eun-space-xs, 4px);
+  }
+
+  .event-popover-guest eun-icon {
+    flex: 0 0 auto;
+    margin-top: 0;
+    color: var(--_guestStatusColor, var(--eun-text-secondary, #484e61));
+  }
+
+  .event-popover-guest[data-status="confirmed"] {
+    --_guestStatusColor: var(--eun-color-success-100, #1a9948);
+  }
+  .event-popover-guest[data-status="pending"] {
+    --_guestStatusColor: var(--eun-color-warning-100, #c85207);
+  }
+  .event-popover-guest[data-status="declined"] {
+    --_guestStatusColor: var(--eun-color-critical-100, #aa0014);
+  }
+
+  .event-popover-actions {
+    display: flex;
+    justify-content: flex-end;
+    gap: var(--eun-space-s, 8px);
+    padding: 0 var(--eun-space-m, 16px) var(--eun-space-m, 16px);
+  }
+`,V=Q;function O(l){let{event:n,locale:e,editLabel:a,deleteLabel:r,closeLabel:u,priorityLabels:p,readonly:b,onEdit:m,onDelete:_,onClose:R}=l;return s`
+    <div
+      class="event-popover-bar"
+      style="--_accent: var(--eun-color-${n.color}-600);"
+    ></div>
+    <eun-button
+      id="event-popover-close"
+      appearance="ghost"
+      rounded
+      size="s"
+      aria-label=${u}
+      @click=${R}
+    >
+      <eun-icon name="close" size="16"></eun-icon>
+    </eun-button>
+    <div class="event-popover-body">
+      <h3 class="event-popover-title">${n.title}</h3>
+      <div class="event-popover-row">
+        <eun-icon name="schedule" size="16"></eun-icon>
+        <span>${I(n,e)}</span>
+      </div>
+      ${n.location?s`
+            <div class="event-popover-row">
+              <eun-icon name="location_on" size="16"></eun-icon>
+              <span>${n.location}</span>
+            </div>
+          `:d}
+      ${n.description?s`
+            <div class="event-popover-row">
+              <eun-icon name="description" size="16"></eun-icon>
+              <span>${n.description}</span>
+            </div>
+          `:d}
+      ${n.notes?s`
+            <div class="event-popover-row">
+              <eun-icon name="notes" size="16"></eun-icon>
+              <span>${n.notes}</span>
+            </div>
+          `:d}
+      ${n.priority?s`
+            <div class="event-popover-row">
+              <eun-icon name="priority_high" size="16"></eun-icon>
+              <eun-tag
+                size="s"
+                hide-icon
+                color="primary"
+                .severity=${D[n.priority]}
+                >${p[n.priority]??n.priority}</eun-tag
+              >
+            </div>
+          `:d}
+      ${n.guests&&n.guests.length>0?s`
+            <div class="event-popover-row">
+              <eun-icon name="group" size="16"></eun-icon>
+              <ul class="event-popover-guests">
+                ${n.guests.map(f=>s`
+                    <li class="event-popover-guest" data-status=${f.status}>
+                      <eun-icon
+                        name=${k[f.status]}
+                        size="14"
+                        aria-hidden="true"
+                      ></eun-icon>
+                      ${f.email}
+                    </li>
+                  `)}
+              </ul>
+            </div>
+          `:d}
+    </div>
+    ${b?d:s`
+          <div class="event-popover-actions">
+            <eun-button
+              variant="critical"
+              size="s"
+              appearance="outline"
+              rounded
+              @click=${_}
+              >${r}</eun-button
+            >
+            <eun-button variant="primary" size="s" rounded @click=${m}
+              >${a}</eun-button
+            >
+          </div>
+        `}
+  `}function I(l,n){let e={weekday:"long",day:"numeric",month:"long"};if(P(l)){let p=l.start.toLocaleDateString(n,e),b=l.end.toLocaleDateString(n,e),m=p===b?p:`${p} \u2013 ${b}`;return l.allDay?`All day \xB7 ${m}`:m}let a=l.start.toLocaleDateString(n,e),r=l.start.toLocaleTimeString(n,{hour:"numeric",minute:"2-digit"}),u=l.end.toLocaleTimeString(n,{hour:"numeric",minute:"2-digit"});return`${a} \xB7 ${r} \u2013 ${u}`}var j="eun-scheduler",N=["day","week","work-week","month","year"],t=class extends T(S(L)){constructor(){super(...arguments);this.events=[];this.view="week";this.displayedDate=new Date;this.weekStartsOn=1;this.dayStartHour=0;this.dayEndHour=24;this.slotDuration=30;this.readonly=!1;this.noAnimation=!1;this.todayLabel="Today";this.newEventLabel="New event";this.ariaLabelPrevious="Previous period";this.ariaLabelNext="Next period";this.viewDayLabel="Day";this.viewWeekLabel="Week";this.viewWorkWeekLabel="Work week";this.viewMonthLabel="Month";this.viewYearLabel="Year";this.applyLabel="Apply";this.cancelLabel="Cancel";this.deleteLabel="Delete";this.editLabel="Edit";this.closeLabel="Close";this.moreEventsLabel="+{count} more";this.eventVariant="default";this.isDrawerOpen=!1;this.isModalOpen=!1;this.editingEvent=null;this.createStart=H(new Date);this.createEnd=E(this.createStart,1);this.editorDirty=!1;this.isMobile=!1;this.selectedEvent=null;this.handleMobileMediaChange=e=>{this.isMobile=e.matches};this.handleToday=()=>{this.displayedDate=new Date};this.handlePrevious=()=>this.navigate(-1);this.handleNext=()=>this.navigate(1);this.handleViewChange=e=>{let[a]=e.target.value;a&&(this.view=a)};this.handleMobileViewSelect=e=>{this.view=e.key};this.handleCalendarPeriodChange=()=>{this.calendarEl&&(this.view=this.calendarEl.view,this.displayedDate=this.calendarEl.displayedDate)};this.handleCalendarEventClick=e=>{this.openEventPopover(e.event,e.anchor)};this.handleCalendarSlotClick=e=>{this.openCreateEditor(e.start)};this.handleEventPopoverToggle=e=>{if(e.newState==="open"){this.popoverTriggerEl&&this.eventPopoverEl&&(this.anchorFloatingElement(this.popoverTriggerEl,this.eventPopoverEl,{axis:"horizontal",forceFallback:!0}),this.observeAnchorVisibility(this.popoverTriggerEl,()=>this.closeEventPopover()));return}this.unanchorFloatingElement(),this.unobserveAnchorVisibility(),this.popoverTriggerEl?.focus(),this.popoverTriggerEl=void 0};this.handlePopoverEdit=()=>{let e=this.selectedEvent;this.closeEventPopover(),e&&this.openEditEditor(e)};this.handlePopoverDelete=()=>{let e=this.selectedEvent;this.closeEventPopover(),e&&this.dispatchEvent(new $(e.id))};this.handlePopoverClose=()=>{this.closeEventPopover()};this.handleEditorCreate=e=>{this.dispatchEvent(new A(e.event)),this.closeEditor()};this.handleEditorUpdate=e=>{this.dispatchEvent(new w(e.event)),this.closeEditor()};this.handleCalendarEventMove=e=>{this.dispatchEvent(new w(e.event))};this.handleEditorDelete=e=>{this.dispatchEvent(new $(e.eventId)),this.closeEditor()};this.handleEditorInput=()=>{this.editorDirty=this.drawerEditorEl?.dirty??!1};this.handleDrawerSave=()=>{this.drawerEditorEl?.requestSave()};this.handleDrawerCancel=()=>{this.closeEditor()};this.handleDrawerDelete=()=>{this.drawerEditorEl?.requestDelete()};this.handleModalSave=()=>{this.modalEditorEl?.requestSave()};this.handleModalDelete=()=>{this.modalEditorEl?.requestDelete()};this.handleModalCancel=()=>{this.closeEditor()}}updated(e){if(super.updated(e),e.has("view")||e.has("displayedDate")||e.has("weekStartsOn")){let a=y(this.view,this.displayedDate,this.weekStartsOn);this.dispatchEvent(new M(this.view,a.start,a.end))}}updateMobileMediaQuery(){this.mobileMediaQuery?.removeEventListener("change",this.handleMobileMediaChange),this.mobileMediaQuery=window.matchMedia("(max-width: 767px)"),this.mobileMediaQuery.addEventListener("change",this.handleMobileMediaChange),this.isMobile=this.mobileMediaQuery.matches}connectedCallback(){super.connectedCallback?.(),this.updateMobileMediaQuery()}disconnectedCallback(){this.mobileMediaQuery?.removeEventListener("change",this.handleMobileMediaChange),super.disconnectedCallback?.()}navigate(e){this.displayedDate=C(this.view,this.displayedDate,e)}openCreateEditor(e){this.readonly||(this.editingEvent=null,this.createStart=e,this.createEnd=E(e,1),this.openEditorSurface())}openEditEditor(e){this.readonly||(this.editingEvent=e,this.openEditorSurface())}openEventPopover(e,a){this.selectedEvent=e,this.popoverTriggerEl=a,this.updateComplete.then(()=>{let r=this.eventPopoverEl;if(!r)return;let u=this.eventPopoverAnimation!==void 0;this.eventPopoverAnimation?.cancel(),this.eventPopoverAnimation=void 0;let p=!r.matches(":popover-open");p&&r.showPopover(),(p||u)&&this.playEventPopoverOpenAnimation(r)})}eventPopoverAnimationDuration(e){if(this.noAnimation||window.matchMedia("(prefers-reduced-motion: reduce)").matches)return 0;let a=getComputedStyle(e).getPropertyValue("--scheduler-popover-transition-duration").trim();if(a){let r=a.endsWith("ms")?Number.parseFloat(a):Number.parseFloat(a)*1e3;if(Number.isFinite(r)&&r>=0)return r}return 160}playEventPopoverOpenAnimation(e){e.style.removeProperty("pointer-events");let a=this.eventPopoverAnimationDuration(e);a!==0&&(this.eventPopoverAnimation=e.animate([{opacity:0,transform:"scale(0.98)"},{opacity:1,transform:"scale(1)"}],{duration:a,easing:"ease",fill:"forwards"}))}closeEventPopover(){let e=this.eventPopoverEl;this.eventPopoverAnimation?.cancel(),this.eventPopoverAnimation=void 0,e?.matches(":popover-open")&&this.playEventPopoverCloseAnimation(e)}playEventPopoverCloseAnimation(e){e.style.pointerEvents="none";let a=this.eventPopoverAnimationDuration(e);if(a===0){e.hidePopover();return}let r=e.animate([{opacity:1,transform:"scale(1)"},{opacity:0,transform:"scale(0.98)"}],{duration:a,easing:"ease",fill:"forwards"});this.eventPopoverAnimation=r,r.finished.then(()=>{this.eventPopoverAnimation===r&&(this.eventPopoverAnimation=void 0),e.hidePopover()}).catch(()=>{})}openEditorSurface(){this.editorDirty=!1,this.isMobile?this.isModalOpen=!0:this.isDrawerOpen=!0}closeEditor(){this.isDrawerOpen=!1,this.isModalOpen=!1,this.editingEvent=null,this.editorDirty=!1}renderNavArrows(){return s`
+      <div id="header-nav-arrows">
+        <eun-button
+          appearance="ghost"
+          size="s"
+          aria-label=${this.ariaLabelPrevious}
+          @click=${this.handlePrevious}
+        >
+          <eun-icon name="chevron_left" size="18"></eun-icon>
+        </eun-button>
+        <eun-button appearance="ghost" size="m" @click=${this.handleToday}>
+          ${this.todayLabel}
+        </eun-button>
+        <eun-button
+          appearance="ghost"
+          size="s"
+          aria-label=${this.ariaLabelNext}
+          @click=${this.handleNext}
+        >
+          <eun-icon name="chevron_right" size="18"></eun-icon>
+        </eun-button>
+      </div>
+    `}renderCreateEventButton(e){return s`
+      <eun-button
+        appearance="flat"
+        id=${c(e?void 0:"header-create-button")}
+        size=${c(e?"s":void 0)}
+        aria-label=${this.newEventLabel}
+        @click=${()=>this.openCreateEditor(H(new Date))}
+      >
+        <eun-icon name="add" size=${e?"12":"18"}></eun-icon>
+      </eun-button>
+    `}render(){let e=y(this.view,this.displayedDate,this.weekStartsOn);return s`
+      <div id="header">
+        <div id="header-nav">
+          <span id="period-label" role="status" aria-live="polite">
+            ${F(this.view,this.displayedDate,e.start,e.end,this.locale)}
+          </span>
+          ${this.isMobile?d:this.renderNavArrows()}
+        </div>
+        <div id="header-actions">
+          ${!this.readonly&&!this.isMobile?this.renderCreateEventButton(!1):d}
+          ${this.isMobile?s`
+                <div id="header-mobile-nav">
+                  ${this.renderNavArrows()}
+                  <div id="header-mobile-nav-actions">
+                    ${this.readonly?d:this.renderCreateEventButton(!0)}
+                    <eun-dropdown-button
+                      appearance="flat"
+                      size="s"
+                      label=${this.viewLabel(this.view)}
+                      .options=${N.map(a=>({key:a,label:this.viewLabel(a)}))}
+                      @eunselect=${this.handleMobileViewSelect}
+                    ></eun-dropdown-button>
+                  </div>
+                </div>
+              `:s`
+                <eun-toggle-group
+                  single
+                  aria-label=${this.dictionary.scheduler.calendarView}
+                  .options=${N.map(a=>({label:this.viewLabel(a),value:a}))}
+                  .value=${[this.view]}
+                  @eunchange=${this.handleViewChange}
+                ></eun-toggle-group>
+              `}
+        </div>
+      </div>
+
+      <eun-calendar
+        id="calendar"
+        .events=${this.events}
+        .view=${this.view}
+        .displayedDate=${this.displayedDate}
+        .weekStartsOn=${this.weekStartsOn}
+        .dayStartHour=${this.dayStartHour}
+        .dayEndHour=${this.dayEndHour}
+        .slotDuration=${this.slotDuration}
+        locale=${c(this.locale)}
+        ?readonly=${this.readonly}
+        ?no-animation=${this.noAnimation}
+        more-events-label=${this.moreEventsLabel}
+        event-variant=${this.eventVariant}
+        @eunperiodchange=${this.handleCalendarPeriodChange}
+        @euneventclick=${this.handleCalendarEventClick}
+        @eunslotclick=${this.handleCalendarSlotClick}
+        @euneventupdate=${this.handleCalendarEventMove}
+      ></eun-calendar>
+
+      <eun-drawer
+        id="drawer"
+        position="end"
+        heading=${this.editingEvent?this.editingEvent.title:this.newEventLabel}
+        ?open=${this.isDrawerOpen}
+        ?dirty=${this.editorDirty}
+        @euncancel=${this.handleDrawerCancel}
+      >
+        <eun-scheduler-event-editor
+          id="editor"
+          hide-actions
+          .event=${this.editingEvent}
+          .initialStart=${this.createStart}
+          .initialEnd=${this.createEnd}
+          locale=${c(this.locale)}
+          @euneventcreate=${this.handleEditorCreate}
+          @euneventupdate=${this.handleEditorUpdate}
+          @euneventdelete=${this.handleEditorDelete}
+          @input=${this.handleEditorInput}
+        ></eun-scheduler-event-editor>
+        <div slot="footer" style="display: contents">
+          ${this.editingEvent?s`<eun-button
+                variant="critical"
+                appearance="outline"
+                @click=${this.handleDrawerDelete}
+                >${this.deleteLabel}</eun-button
+              >`:d}
+          <span style="flex: 1 1 auto;"></span>
+          <eun-button appearance="ghost" @click=${this.handleDrawerCancel}
+            >${this.cancelLabel}</eun-button
+          >
+          <eun-button variant="primary" @click=${this.handleDrawerSave}
+            >${this.applyLabel}</eun-button
+          >
+        </div>
+      </eun-drawer>
+
+      <eun-modal
+        id="modal"
+        heading=${this.editingEvent?this.editingEvent.title:this.newEventLabel}
+        ?open=${this.isModalOpen}
+        @euncancel=${this.handleModalCancel}
+      >
+        <eun-scheduler-event-editor
+          id="editor-mobile"
+          hide-actions
+          .event=${this.editingEvent}
+          .initialStart=${this.createStart}
+          .initialEnd=${this.createEnd}
+          locale=${c(this.locale)}
+          @euneventcreate=${this.handleEditorCreate}
+          @euneventupdate=${this.handleEditorUpdate}
+          @euneventdelete=${this.handleEditorDelete}
+        ></eun-scheduler-event-editor>
+        <div slot="footer">
+          ${this.editingEvent?s`<eun-button
+                variant="critical"
+                @click=${this.handleModalDelete}
+                >${this.deleteLabel}</eun-button
+              >`:d}
+          <span style="flex: 1 1 auto;"></span>
+          <eun-button variant="secondary" @click=${this.handleModalCancel}
+            >${this.cancelLabel}</eun-button
+          >
+          <eun-button variant="primary" @click=${this.handleModalSave}
+            >${this.applyLabel}</eun-button
+          >
+        </div>
+      </eun-modal>
+
+      <div id="event-popover" popover @toggle=${this.handleEventPopoverToggle}>
+        ${this.selectedEvent?O({event:this.selectedEvent,locale:this.locale,editLabel:this.editLabel,deleteLabel:this.deleteLabel,closeLabel:this.closeLabel,priorityLabels:{low:"Low",medium:"Medium",high:"High",critical:"Critical"},readonly:this.readonly,onEdit:this.handlePopoverEdit,onDelete:this.handlePopoverDelete,onClose:this.handlePopoverClose}):d}
+      </div>
+    `}viewLabel(e){switch(e){case"day":return this.viewDayLabel;case"week":return this.viewWeekLabel;case"work-week":return this.viewWorkWeekLabel;case"month":return this.viewMonthLabel;case"year":return this.viewYearLabel;default:return e}}};t.styles=[z,V],i([o({attribute:!1})],t.prototype,"events",2),i([o({reflect:!0})],t.prototype,"view",2),i([o({attribute:!1})],t.prototype,"displayedDate",2),i([o({type:Number,attribute:"week-starts-on"})],t.prototype,"weekStartsOn",2),i([o({type:Number,attribute:"day-start-hour"})],t.prototype,"dayStartHour",2),i([o({type:Number,attribute:"day-end-hour"})],t.prototype,"dayEndHour",2),i([o({type:Number,attribute:"slot-duration"})],t.prototype,"slotDuration",2),i([o({type:Boolean,reflect:!0})],t.prototype,"readonly",2),i([o({type:Boolean,reflect:!0,attribute:"no-animation"})],t.prototype,"noAnimation",2),i([o({attribute:"today-label"})],t.prototype,"todayLabel",2),i([o({attribute:"new-event-label"})],t.prototype,"newEventLabel",2),i([o({attribute:"aria-label-previous"})],t.prototype,"ariaLabelPrevious",2),i([o({attribute:"aria-label-next"})],t.prototype,"ariaLabelNext",2),i([o({attribute:"view-day-label"})],t.prototype,"viewDayLabel",2),i([o({attribute:"view-week-label"})],t.prototype,"viewWeekLabel",2),i([o({attribute:"view-work-week-label"})],t.prototype,"viewWorkWeekLabel",2),i([o({attribute:"view-month-label"})],t.prototype,"viewMonthLabel",2),i([o({attribute:"view-year-label"})],t.prototype,"viewYearLabel",2),i([o({attribute:"apply-label"})],t.prototype,"applyLabel",2),i([o({attribute:"cancel-label"})],t.prototype,"cancelLabel",2),i([o({attribute:"delete-label"})],t.prototype,"deleteLabel",2),i([o({attribute:"edit-label"})],t.prototype,"editLabel",2),i([o({attribute:"close-label"})],t.prototype,"closeLabel",2),i([o({attribute:"more-events-label"})],t.prototype,"moreEventsLabel",2),i([o({attribute:"event-variant"})],t.prototype,"eventVariant",2),i([v()],t.prototype,"isDrawerOpen",2),i([v()],t.prototype,"isModalOpen",2),i([v()],t.prototype,"editingEvent",2),i([v()],t.prototype,"createStart",2),i([v()],t.prototype,"createEnd",2),i([v()],t.prototype,"editorDirty",2),i([v()],t.prototype,"isMobile",2),i([h("#editor")],t.prototype,"drawerEditorEl",2),i([h("#editor-mobile")],t.prototype,"modalEditorEl",2),i([v()],t.prototype,"selectedEvent",2),i([h("#event-popover")],t.prototype,"eventPopoverEl",2),i([h("#calendar")],t.prototype,"calendarEl",2),t=i([x(j)],t);function H(l){let n=new Date(l);return n.setHours(n.getHours()+1,0,0,0),n}function F(l,n,e,a,r){switch(l){case"day":return e.toLocaleDateString(r,{weekday:"long",day:"numeric",month:"long",year:"numeric"});case"year":return String(n.getFullYear());case"month":return n.toLocaleDateString(r,{month:"long",year:"numeric"});default:return`${e.toLocaleDateString(r,{day:"numeric",month:"short"})} \u2013 ${a.toLocaleDateString(r,{day:"numeric",month:"short",year:"numeric"})}`}}export{t as EunomiaScheduler,j as EunomiaSchedulerTagName};