npm - @event-calendar/build - Versions diffs - 5.5.0 → 5.6.0 - Mend

@event-calendar/build 5.5.0 → 5.6.0

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.

Files changed (5) hide show

package/README.md +119 -19
package/dist/event-calendar.min.css +1 -1
package/dist/event-calendar.min.js +3 -3
package/dist/event-calendar.min.js.map +1 -1
package/package.json +1 -1

package/README.md CHANGED Viewed

@@ -48,8 +48,10 @@ Inspired by [FullCalendar](https://fullcalendar.io/), it implements similar opti
   - [customScrollbars](#customscrollbars)
   - [date](#date)
   - [dateClick](#dateclick)
+  - [dateIncrement](#dateincrement)
   - [datesAboveResources](#datesaboveresources)
   - [datesSet](#datesset)
+  - [dayCellContent](#daycellcontent)
   - [dayCellFormat](#daycellformat)
   - [dayHeaderAriaLabelFormat](#dayheaderarialabelformat)
   - [dayHeaderFormat](#dayheaderformat)
@@ -72,9 +74,9 @@ Inspired by [FullCalendar](https://fullcalendar.io/), it implements similar opti
   - [eventDragStart](#eventdragstart)
   - [eventDragStop](#eventdragstop)
   - [eventDrop](#eventdrop)
-  - [eventDurationEditable](#eventdurationeditable)
   </td><td>
+  - [eventDurationEditable](#eventdurationeditable)
   - [eventFilter](#eventfilter)
   - [eventLongPressDelay](#eventlongpressdelay)
   - [eventMouseEnter](#eventmouseenter)
@@ -103,13 +105,14 @@ Inspired by [FullCalendar](https://fullcalendar.io/), it implements similar opti
   - [loading](#loading)
   - [locale](#locale)
   - [longPressDelay](#longpressdelay)
+  - [monthHeaderFormat](#monthheaderformat)
   - [moreLinkContent](#morelinkcontent)
   - [noEventsClick](#noeventsclick)
   - [noEventsContent](#noeventscontent)
   - [nowIndicator](#nowindicator)
-  - [pointer](#pointer)
   </td><td>
+  - [pointer](#pointer)
   - [refetchResourcesOnNavigate](#refetchresourcesonnavigate)
   - [resizeConstraint](#resizeconstraint)
   - [resourceExpand](#resourceexpand)
@@ -257,8 +260,8 @@ This bundle contains a version of the calendar that includes all plugins and is
 The first step is to include the following lines of code in the `<head>` section of your page:
 ```html
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@5.4.2/dist/event-calendar.min.css">
-<script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@5.4.2/dist/event-calendar.min.js"></script>
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@5.6.0/dist/event-calendar.min.css">
+<script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@5.6.0/dist/event-calendar.min.js"></script>
 ```
 <details>
@@ -353,7 +356,7 @@ When hidden with `false`, all-day events will not be displayed in `timeGrid`/`re
 <details>
     <summary>Default</summary>
-`{collapse: 'Collapse', close: 'Close', dayGridDay: 'day', dayGridMonth: 'month', dayGridWeek: 'week', expand: 'Expand', listDay: 'list', listMonth: 'list', listWeek: 'list', listYear: 'list', resourceTimeGridDay: 'resources', resourceTimeGridWeek: 'resources', resourceTimelineDay: 'timeline', resourceTimelineMonth: 'timeline', resourceTimelineWeek: 'timeline', timeGridDay: 'day', timeGridWeek: 'week', today: 'today'}`
+`{collapse: 'Collapse', close: 'Close', dayGridDay: 'day', dayGridMonth: 'month', dayGridWeek: 'week', expand: 'Expand', listDay: 'day', listMonth: 'month', listWeek: 'week', listYear: 'year', resourceTimeGridDay: 'day', resourceTimeGridWeek: 'week', resourceTimelineDay: 'day', resourceTimelineMonth: 'month', resourceTimelineWeek: 'week', resourceTimelineYear: 'year', timeGridDay: 'day', timeGridWeek: 'week', today: 'today'}`
 > Views override the default value as follows:
 > - dayGridDay `text => ({...text, next: 'Next day', prev: 'Previous day'})`
 > - dayGridMonth `text => ({...text, next: 'Next month', prev: 'Previous month'})`
@@ -367,6 +370,7 @@ When hidden with `false`, all-day events will not be displayed in `timeGrid`/`re
 > - resourceTimelineDay `text => ({...text, next: 'Next day', prev: 'Previous day'})`
 > - resourceTimelineMonth `text => ({...text, next: 'Next month', prev: 'Previous month'})`
 > - resourceTimelineWeek `text => ({...text, next: 'Next week', prev: 'Previous week'})`
+> - resourceTimelineYear `text => ({...text, next: 'Next year', prev: 'Previous year'})`
 > - timeGridDay `text => ({...text, next: 'Next day', prev: 'Previous day'})`
 > - timeGridWeek `text => ({...text, next: 'Next week', prev: 'Previous week'})`
@@ -568,6 +572,16 @@ If the current view is a resource view, the [Resource](#resource-object) object
 </tr>
 </table>
+### dateIncrement
+- Type `string`, `integer` or `object`
+- Default `undefined`
+Defines the interval by which the displayed view is shifted when pressing the prev/next buttons or when the [prev()](#prev)/[next()](#next) methods are called.
+This should be a value that can be parsed into a [Duration](#duration-object) object.
+If not specified, then equal to [duration](#duration).
 ### datesAboveResources
 - Type `boolean`
 - Default `false`
@@ -625,6 +639,60 @@ The current [View](#view-object) object
 </tr>
 </table>
+### dayCellContent
+- Type `Content` or `function`
+- Default `undefined`
+Defines the content that is rendered inside the day cell.
+This value can be either a [Content](#content) or a function that returns content:
+```js
+function (arg) {
+    // return Content
+}
+```
+`arg` is an object with the following properties:
+<table>
+<tr>
+<td>
+`allDay`
+</td>
+<td>
+`true` or `false`. Determines if the cell is within `all-day` slot. Month and list views are also considered as all-day slots
+</td>
+</tr>
+<tr>
+<td>
+`date`
+</td>
+<td>JavaScript Date object corresponding to the day</td>
+</tr>
+<tr>
+<td>
+`isToday`
+</td>
+<td>
+`true` or `false`. Determines if the cell is for today
+</td>
+</tr>
+<tr>
+<td>
+`resource`
+</td>
+<td>
+If the current view is a resource view, the [Resource](#resource-object) object that owns this cell
+</td>
+</tr>
+</table>
 ### dayCellFormat
 - Type `object` or `function`
 - Default `{day: 'numeric'}`
@@ -680,6 +748,7 @@ function (date) {
 > - dayGridDay `{weekday: 'long'}`
 > - dayGridMonth `{weekday: 'short'}`
 > - resourceTimelineMonth `{weekday: 'short', day: 'numeric'}`
+> - resourceTimelineYear `{weekday: 'short', day: 'numeric'}`
 > - timeGridDay `{weekday: 'long'}`
 Defines the text that is displayed on the calendar’s column headings.
@@ -734,6 +803,7 @@ function (date) {
 > - resourceTimelineDay `false`
 > - resourceTimelineMonth `false`
 > - resourceTimelineWeek `false`
+> - resourceTimelineYear `false`
 Determines whether to display an event’s end time.
@@ -765,6 +835,7 @@ Determines whether the calendar should automatically scroll during the event dra
 > - resourceTimeGridDay `{days: 1}`
 > - resourceTimelineDay `{days: 1}`
 > - resourceTimelineMonth `{months: 1}`
+> - resourceTimelineYear `{years: 1}`
 > - timeGridDay `{days: 1}`
 Sets the duration of a view.
@@ -1954,6 +2025,29 @@ For touch devices, the amount of time (in milliseconds) the user must hold down
 For a more granular configuration, see [eventLongPressDelay](#eventlongpressdelay) and [selectLongPressDelay](#selectlongpressdelay).
+### monthHeaderFormat
+- Type `object` or `function`
+- Default `{month: 'long'}`
+Defines the text that is displayed in month headings in `resourceTimelineYear` view.
+This value can be either an object with options for the native JavaScript [Intl.DateTimeFormat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat) object, or a callback function that returns a [Content](#content) with the formatted string:
+```js
+function (date) {
+  // return Content with the formatted date string
+}
+```
+<table>
+<tr>
+<td>
+`date`
+</td>
+<td>JavaScript Date object that needs to be formatted</td>
+</tr>
+</table>
 ### moreLinkContent
 - Type `Content` or `function`
 - Default `undefined`
@@ -2412,6 +2506,7 @@ Defines how many pixels the user’s mouse must move before the selection begins
 - Default `'00:30:00'`
 > Views override the default value as follows:
 > - resourceTimelineMonth `{days: 1}`
+> - resourceTimelineYear `{days: 1}`
 Defines the frequency for displaying time slots.
@@ -2519,6 +2614,7 @@ If not specified, then equal to [slotDuration](#slotduration).
 > - resourceTimelineDay `theme => ({...theme, view: 'ec-resource ec-timeline ec-day-view'})`
 > - resourceTimelineMonth `theme => ({...theme, view: 'ec-resource ec-timeline ec-month-view'})`
 > - resourceTimelineWeek `theme => ({...theme, view: 'ec-resource ec-timeline ec-week-view'})`
+> - resourceTimelineYear `theme => ({...theme, view: 'ec-resource ec-timeline ec-year-view'})`
 > - timeGridDay `theme => ({...theme, view: 'ec-time-grid ec-day-view'})`
 > - timeGridWeek `theme => ({...theme, view: 'ec-time-grid ec-week-view'})`
 </details>
@@ -2549,6 +2645,9 @@ function (theme) {
 - Default `{year: 'numeric', month: 'short', day: 'numeric'}`
 > Views override the default value as follows:
 > - dayGridMonth `{year: 'numeric', month: 'long'}`
+> - listDay `{year: 'numeric', month: 'long', day: 'numeric'}`
+> - listMonth `{year: 'numeric', month: 'long'}`
+> - listYear `{year: 'numeric'}`
 > - timeGridDay `{year: 'numeric', month: 'long', day: 'numeric'}`
 Defines the text that is displayed in the header toolbar’s title.
@@ -2686,6 +2785,7 @@ The following values are available:
 - `'resourceTimelineDay'`
 - `'resourceTimelineWeek'`
 - `'resourceTimelineMonth'`
+- `'resourceTimelineYear'`
 - `'timeGridDay'`
 - `'timeGridWeek'`
@@ -2765,7 +2865,7 @@ function (arg) {
 - Type `boolean`
 - Default `false`
-Determines whether week numbers should be displayed in the `dayGrid` view.
+Determines whether week numbers should be displayed in `dayGrid`/`resourceTimeline` views.
 The numbering of weeks depends on the value of [firstDay](#firstday). When `firstDay` is `0`, the [Western](https://en.wikipedia.org/wiki/Week#Other_week_numbering_systems) system is used. Any other value uses the [ISO](https://en.wikipedia.org/wiki/Week#The_ISO_week_date_system) system.
@@ -2775,20 +2875,20 @@ Methods allow you to manipulate EventCalendar after initialization. They are acc
 In Svelte, methods are available from a component instance:
 ```html
 <script>
-    import {Calendar, TimeGrid} from '@event-calendar/core';
-    let ec = $state();
-    let options = $state({
-        view: 'timeGridWeek',
-        eventSources: [{events: function() {
-            console.log('fetching...');
-            return [];
-        }}]
-    });
+  import {Calendar, TimeGrid} from '@event-calendar/core';
-    function invokeMethod() {
-        ec.refetchEvents();
-    }
+  let ec = $state();
+  let options = $state({
+    view: 'timeGridWeek',
+    eventSources: [{events: function() {
+        console.log('fetching...');
+        return [];
+      }}]
+  });
+  function invokeMethod() {
+    ec.refetchEvents();
+  }
 </script>
 <button onclick={invokeMethod}>Refetch events</button>

package/dist/event-calendar.min.css CHANGED Viewed

@@ -1,5 +1,5 @@
 /*!
- * EventCalendar v5.5.0
+ * EventCalendar v5.6.0
  * https://github.com/vkurko/calendar
  */
 .ec{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ec-color-400:oklch(70.8% 0 0);--ec-color-300:oklch(87% 0 0);--ec-color-200:oklch(92.2% 0 0);--ec-color-100:oklch(97% 0 0);--ec-color-50:oklch(98.5% 0 0);--ec-bg-color:#fff;--ec-text-color:currentcolor;--ec-border-color:var(--ec-color-300);--ec-button-bg-color:var(--ec-bg-color);--ec-button-border-color:var(--ec-border-color);--ec-button-text-color:var(--ec-text-color);--ec-button-active-bg-color:var(--ec-color-200);--ec-button-active-border-color:var(--ec-color-400);--ec-button-active-text-color:var(--ec-button-text-color);--ec-today-bg-color:oklch(98.7% .026 102.212);--ec-highlight-color:oklch(98.4% .019 200.873);--ec-event-bg-color:oklch(70.7% .165 254.624);--ec-event-text-color:#fff;--ec-bg-event-color:var(--ec-color-300);--ec-bg-event-opacity:.3;--ec-event-col-gap:.375rem;--ec-now-indicator-color:oklch(63.7% .237 25.331);--ec-popup-bg-color:var(--ec-bg-color)}.ec-dark .ec{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ec-color-400:oklch(43.9% 0 0);--ec-color-300:oklch(37.1% 0 0);--ec-color-200:oklch(26.9% 0 0);--ec-color-100:oklch(20.5% 0 0);--ec-color-50:oklch(14.5% 0 0);--ec-bg-color:var(--ec-color-100);--ec-today-bg-color:oklch(28.6% .066 53.813);--ec-highlight-color:oklch(30.2% .056 229.695);--ec-bg-event-opacity:.5}@media (prefers-color-scheme:dark){.ec-auto-dark .ec{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ec-color-400:oklch(43.9% 0 0);--ec-color-300:oklch(37.1% 0 0);--ec-color-200:oklch(26.9% 0 0);--ec-color-100:oklch(20.5% 0 0);--ec-color-50:oklch(14.5% 0 0);--ec-bg-color:var(--ec-color-100);--ec-today-bg-color:oklch(28.6% .066 53.813);--ec-highlight-color:oklch(30.2% .056 229.695);--ec-bg-event-opacity:.5}}.ec-day{--ec-day-bg-color:var(--ec-bg-color);background-color:var(--ec-day-bg-color);border:1px solid var(--ec-border-color);border-block-start:none;border-inline-start:none}.ec-day.ec-today{--ec-day-bg-color:var(--ec-today-bg-color)}.ec-day.ec-highlight{--ec-day-bg-color:var(--ec-highlight-color)}.ec-time-grid .ec-body .ec-day{background-image:linear-gradient(to top, var(--ec-day-bg-color) 1px, transparent 1px), linear-gradient(to top, var(--ec-border-color) 1px, transparent 1px), linear-gradient(to right, var(--ec-day-bg-color) 1px, transparent 1px), linear-gradient(to top, var(--ec-border-color) 1px, transparent 1px);background-size:100% 100%, 100% calc(var(--ec-slot-height) * var(--ec-slot-label-periodicity)), 2px 100%, 100% var(--ec-slot-height)}.ec-timeline:not(.ec-month-view,.ec-year-view) .ec-body .ec-day{--ec-last-line-color:transparent;--ec-direction:to left}[dir=rtl] :is(.ec-timeline:not(.ec-month-view,.ec-year-view) .ec-body .ec-day){--ec-direction:to right}.ec-timeline:not(.ec-month-view,.ec-year-view) .ec-body .ec-day{background-image:linear-gradient(var(--ec-direction), var(--ec-last-line-color) 1px, transparent 1px), linear-gradient(var(--ec-direction), var(--ec-border-color) 1px, transparent 1px), linear-gradient(var(--ec-day-bg-color) 1px, transparent 1px), linear-gradient(var(--ec-direction), var(--ec-border-color) 1px, transparent 1px);background-size:100% 100%, calc(var(--ec-slot-width) * var(--ec-slot-label-periodicity)) 100%, 100% 2px, var(--ec-slot-width) 100%;border-inline:none}.ec-timeline:not(.ec-month-view,.ec-year-view) .ec-body .ec-day.ec-no-ieb{--ec-last-line-color:var(--ec-day-bg-color)}.ec-day-grid .ec-day{flex-direction:column;justify-content:space-between;min-block-size:5em;display:flex}.ec-day-grid .ec-uniform .ec-day{min-block-size:auto}.ec-list .ec-day{border-inline:none}.ec-list .ec-day:last-child{border:none}.ec-day.ec-no-ieb{border-inline-end:none}.ec-day.ec-no-beb{border-block-end:none}.ec-day-head{flex-direction:row-reverse;justify-content:space-between;display:flex}.ec-day-grid.ec-month-view .ec-day-head{padding:.375rem}.ec-day.ec-other-month .ec-day-head time{opacity:.3}.ec-list .ec-day-head{background-color:var(--ec-day-bg-color);border-block-end:1px solid var(--ec-border-color);flex-direction:unset;z-index:2;margin:0 0 -1px;padding:.5em 1.5em;position:sticky;inset-block-start:0}.ec-day-foot{padding:.18rem;font-size:.85em}.ec-day-foot a{cursor:pointer}.ec-disabled{position:relative}.ec-disabled:after{content:"";background-color:var(--ec-bg-event-color);opacity:var(--ec-bg-event-opacity);position:absolute;inset:0}.ec-toolbar{justify-content:space-between;align-items:center;margin-block-end:1em;display:flex}.ec-toolbar>*{flex-wrap:wrap;gap:.5rem .75rem;display:inline-flex}.ec-title{margin:0}.ec-button{background-color:var(--ec-button-bg-color);border:1px solid var(--ec-button-border-color);border-radius:.25rem;padding:.375rem .75rem;font-size:1rem;line-height:1.5}.ec-button:not(:disabled){color:var(--ec-button-text-color);cursor:pointer}.ec-button:not(:disabled):hover,.ec-button.ec-active{background-color:var(--ec-button-active-bg-color);border-color:var(--ec-button-active-border-color);color:var(--ec-button-active-text-color);z-index:1}.ec-button-group{vertical-align:top;display:inline-flex}.ec-button-group .ec-button:not(:first-child){border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:-1px}.ec-button-group .ec-button:not(:last-child){border-start-end-radius:0;border-end-end-radius:0}.ec-icon{inline-size:1em;display:inline-block}.ec-icon.ec-prev:after,.ec-icon.ec-next:after{content:"";border-block-start:2px solid;border-inline-end:2px solid;block-size:.5em;inline-size:.5em;display:inline-block;position:relative}.ec-icon.ec-prev:after{inset-inline-start:3px;rotate:-135deg}[dir=rtl] .ec-icon.ec-prev:after{rotate:135deg}.ec-icon.ec-next:after{inset-inline-start:-3px;rotate:45deg}[dir=rtl] .ec-icon.ec-next:after{rotate:-45deg}.ec-sidebar{z-index:1;background-color:var(--ec-bg-color);border-inline-end:1px solid var(--ec-border-color);text-align:end;position:sticky;inset-inline-start:0;overflow:clip}.ec-header .ec-sidebar{border-block-end:1px solid var(--ec-border-color);padding-block:.375rem}.ec-time-grid .ec-sidebar{padding-inline:.75rem}.ec-time-grid .ec-body .ec-sidebar{--ec-direction:to left}[dir=rtl] :is(.ec-time-grid .ec-body .ec-sidebar){--ec-direction:to right}.ec-time-grid .ec-body .ec-sidebar{background-image:linear-gradient(var(--ec-direction), transparent .375rem, var(--ec-bg-color) .375rem), linear-gradient(to top, var(--ec-bg-color) 1px, transparent 1px), linear-gradient(to top, var(--ec-border-color) 1px, transparent 1px), linear-gradient(to right, var(--ec-bg-color) 1px, transparent 1px), linear-gradient(to top, var(--ec-border-color) 1px, transparent 1px);background-size:100% 100%, 100% 100%, 100% calc(var(--ec-slot-height) * var(--ec-slot-label-periodicity)), 2px 100%, 100% var(--ec-slot-height)}.ec-timeline .ec-body .ec-sidebar{grid-area:1/1/-1/2;grid-template-rows:subgrid;display:grid}.ec-row-head{border-block-end:1px solid var(--ec-border-color);min-block-size:1.5em;padding:.375em .75rem;display:flex}.ec-row-head:last-child{border:none}.ec-expander{inline-size:1.25em;margin-block-start:-1px;margin-inline-end:.25em}.ec-expander .ec-button{aspect-ratio:1;block-size:1.25em;padding:0;line-height:normal}.ec-slot{white-space:nowrap}.ec-time-grid .ec-slot{block-size:calc(var(--ec-slot-height) * var(--ec-slot-label-periodicity));position:relative;inset-block-start:-.5lh}.ec-timeline .ec-slot{grid-column:span var(--ec-slot-label-periodicity);text-overflow:ellipsis;padding:.18rem 0;font-size:.95em;overflow:clip}.ec-slots{grid-auto-flow:column;grid-auto-columns:var(--ec-slot-width);text-align:center;--ec-day-bg-color:var(--ec-bg-color);background-color:var(--ec-day-bg-color);border-block-end:1px solid var(--ec-border-color);display:grid}.ec-slots.ec-today{--ec-day-bg-color:var(--ec-today-bg-color)}.ec-slots.ec-highlight{--ec-day-bg-color:var(--ec-highlight-color)}.ec-slots{--ec-last-line-color:transparent;--ec-direction:to left}[dir=rtl] .ec-slots{--ec-direction:to right}.ec-slots{background-image:linear-gradient(var(--ec-direction), var(--ec-last-line-color) 1px, transparent 1px), linear-gradient(var(--ec-direction), var(--ec-border-color) 1px, transparent 1px);background-size:100% 100%, calc(var(--ec-slot-width) * var(--ec-slot-label-periodicity)) 100%}.ec-slots:last-child{--ec-last-line-color:var(--ec-day-bg-color)}.ec-events{grid-area:1/2/-1/-1;grid-template:subgrid / subgrid;isolation:isolate;pointer-events:none;display:grid}.ec-day-grid .ec-events{grid-column-start:1}.ec-event{color:var(--ec-event-text-color);box-sizing:border-box;box-shadow:0 0 1px 0 var(--ec-border-color);background-color:var(--ec-event-bg-color);z-index:1;pointer-events:all;inline-size:calc(100% - var(--ec-event-col-gap));border-radius:3px;padding:2px;font-size:.85em;line-height:1.5;display:flex;position:relative}.ec-time-grid .ec-event{grid-row:1}.ec-day-grid .ec-event,.ec-all-day .ec-event,.ec-timeline .ec-event{block-size:max-content;margin-block-end:var(--ec-event-col-gap)}.ec-list .ec-event{color:inherit;background-color:var(--ec-day-bg-color);border-radius:0;flex-direction:row;padding:.5em 1.5em}.ec-event.ec-preview{z-index:1000;-webkit-user-select:none;user-select:none;opacity:.8}.ec-event.ec-pointer{color:inherit;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:0;box-shadow:none}.ec-bg-event{background-color:var(--ec-bg-event-color);opacity:var(--ec-bg-event-opacity);grid-row:1;position:relative}.ec-draggable{cursor:pointer;-webkit-user-select:none;user-select:none}.ec-ghost{opacity:.5;-webkit-user-select:none;user-select:none;pointer-events:none}.ec-event-body{flex-direction:column;inline-size:100%;display:flex}.ec-day-grid .ec-event-body,.ec-all-day .ec-event-body,.ec-timeline .ec-event-body{flex-direction:row}.ec-event-tag{border-radius:2px;inline-size:4px;margin-inline-end:8px}.ec-event-time{white-space:nowrap;flex-shrink:0;max-block-size:100%;margin:0 0 1px;overflow:hidden}.ec-day-grid .ec-event-time,.ec-timeline .ec-event-time{text-overflow:ellipsis;max-inline-size:100%;margin:0 3px 0 0}.ec-event-title{font-weight:inherit;margin:0;overflow:hidden}.ec-time-grid .ec-event-title{position:sticky;inset-block-start:var(--ec-header-height)}.ec-day-grid .ec-event-title,.ec-all-day .ec-event-title,.ec-timeline .ec-event-title{white-space:nowrap;text-overflow:ellipsis;min-block-size:1.5em;position:sticky;inset-inline-start:calc(var(--ec-sidebar-width) + .18em)}.ec-list .ec-event-title{font-size:1rem}.ec-resizer{-webkit-user-select:none;user-select:none;position:absolute}.ec-time-grid .ec-body .ec-resizer{cursor:ns-resize;block-size:50%;max-block-size:8px;inset:auto 0 0}.ec-time-grid .ec-body .ec-resizer.ec-start{inset:0 0 auto}.ec-day-grid .ec-resizer,.ec-all-day .ec-resizer,.ec-timeline .ec-resizer{cursor:ew-resize;inline-size:50%;max-inline-size:8px;inset:0 0 0 auto}:is(.ec-day-grid .ec-resizer,.ec-all-day .ec-resizer,.ec-timeline .ec-resizer).ec-start{inset:0 auto 0 0}.ec-dragging,.ec-dragging *{cursor:pointer!important}.ec-resizing-y,.ec-resizing-y *{cursor:ns-resize!important}.ec-resizing-x,.ec-resizing-x *{cursor:ew-resize!important}.ec-no-events{text-align:center;background-color:var(--ec-bg-color);padding:5em 0}.ec-now-indicator{pointer-events:none;will-change:inset;grid-row:2;position:relative}.ec-time-grid .ec-now-indicator{border-block-start:var(--ec-now-indicator-color) solid 2px;block-size:0;inline-size:100%}.ec-timeline .ec-now-indicator{border-inline-start:var(--ec-now-indicator-color) solid 2px;inline-size:0}.ec-timeline .ec-now-indicator:before{z-index:2;inset-block-start:calc(var(--ec-header-height) - 6.5px)}.ec-now-indicator:before{background:var(--ec-now-indicator-color);content:"";block-size:12px;inline-size:12px;z-index:1;border-radius:50%;margin-block-start:-7px;margin-inline-start:-7px;display:block;position:sticky;inset-inline-start:calc(var(--ec-sidebar-width) - 6.5px)}.ec-popup{box-sizing:border-box;background-color:var(--ec-popup-bg-color);border:1px solid var(--ec-border-color);block-size:max-content;min-block-size:8em;inline-size:125%;min-inline-size:12em;box-shadow:var(--ec-color-300) 0 10px 15px -3px, var(--ec-color-300) 0 4px 6px -4px;border-radius:.25rem;flex-direction:column;padding:.375rem .75rem .75rem;display:flex;position:relative}.ec-popup .ec-day-head{flex-direction:row;padding-inline:0}.ec-popup .ec-day-head a{cursor:pointer;font-size:1.5em;line-height:.8}.ec-popup .ec-events{--ec-event-col-gap:0;pointer-events:auto;display:block;overflow-y:auto}.ec-custom-scrollbars .ec-main::-webkit-scrollbar{background-color:#0000}.ec-custom-scrollbars .ec-main::-webkit-scrollbar-thumb{box-shadow:none;background-color:var(--ec-border-color);background-clip:padding-box;border:4px solid #0000;border-radius:8px}.ec-custom-scrollbars .ec-main::-webkit-scrollbar-thumb:hover{background-color:var(--ec-color-400)}.ec{flex-direction:column;display:flex}.ec-main{border:1px solid var(--ec-border-color);display:grid;overflow:auto}.ec-time-grid .ec-main{grid-template-columns:max-content repeat(var(--ec-grid-cols), var(--ec-col-width));grid-template-rows:repeat(2,max-content)}.ec-day-grid .ec-main{--ec-row-height:auto;grid-template-columns:repeat(var(--ec-grid-cols), minmax(0, 1fr));grid-template-rows:max-content repeat(var(--ec-grid-rows), var(--ec-row-height))}.ec-day-grid .ec-main.ec-uniform{--ec-row-height:minmax(0, 1fr);flex-grow:1;overflow:hidden}.ec-timeline .ec-main{grid-template-columns:max-content repeat(var(--ec-grid-cols), min-content);grid-template-rows:max-content var(--ec-grid-rows);flex-grow:1}.ec-timeline:is(.ec-month-view,.ec-year-view) .ec-main{grid-template-columns:max-content repeat(var(--ec-grid-cols), var(--ec-col-width))}.ec-header{grid-area:1/1/2/-1;grid-template-columns:subgrid;z-index:2;display:grid;position:sticky;inset-block-start:0}.ec-grid{grid-area:1/1/-1/-1;grid-template-columns:subgrid;display:grid}.ec-body .ec-grid{grid-template-rows:subgrid}.ec-time-grid .ec-grid,.ec-timeline .ec-grid{grid-column-start:2}.ec-all-day{grid-area:2/1/auto/-1;grid-template-columns:subgrid;min-block-size:var(--ec-slot-height);display:grid}.ec-col-group{grid-column:span var(--ec-col-group-span)}.ec-col-group,.ec-col-head{text-align:center;background-color:var(--ec-bg-color);border:1px solid var(--ec-border-color);text-overflow:ellipsis;border-block-start:none;border-inline-start:none;padding:.375rem .18em;overflow:clip}:is(.ec-col-group,.ec-col-head).ec-today{background-color:var(--ec-today-bg-color)}:is(.ec-col-group,.ec-col-head).ec-highlight{background-color:var(--ec-highlight-color)}.ec-col-group:nth-last-child(1 of .ec-col-group),.ec-col-head:nth-last-child(1 of .ec-col-head){border-inline-end:none}.ec-col-group>*,.ec-timeline .ec-col-head>*{position:sticky;inset-inline-start:calc(var(--ec-sidebar-width) + .18em)}.ec-body{grid-area:2/1/-1/-1;grid-template:subgrid / subgrid;display:grid}.ec-hidden{visibility:hidden}