@event-calendar/core 0.12.0 → 0.13.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.
- package/README.md +29 -2
- package/index.css +1 -1
- package/index.js +11 -11
- package/package.json +2 -2
- package/src/Buttons.svelte +30 -30
- package/src/Calendar.svelte +99 -99
- package/src/Toolbar.svelte +26 -26
- package/src/index.scss +1 -2
package/README.md
CHANGED
|
@@ -4,7 +4,7 @@ See [demo](https://vkurko.github.io/calendar/).
|
|
|
4
4
|
|
|
5
5
|
Full-sized drag & drop JavaScript event calendar with resource view:
|
|
6
6
|
|
|
7
|
-
* Lightweight (
|
|
7
|
+
* Lightweight (54kb [br](https://en.wikipedia.org/wiki/Brotli) compressed `modern` version)
|
|
8
8
|
* Zero-dependency (pre-built bundle)
|
|
9
9
|
* Used by [Bookly](https://wordpress.org/plugins/bookly-responsive-appointment-booking-tool/)
|
|
10
10
|
|
|
@@ -42,10 +42,11 @@ Inspired by [FullCalendar](https://fullcalendar.io/), implements similar options
|
|
|
42
42
|
- [eventDragMinDistance](#eventdragmindistance)
|
|
43
43
|
- [eventDragStart](#eventdragstart)
|
|
44
44
|
- [eventDragStop](#eventdragstop)
|
|
45
|
+
- [eventDrop](#eventdrop)
|
|
45
46
|
</td><td>
|
|
46
47
|
|
|
47
|
-
- [eventDrop](#eventdrop)
|
|
48
48
|
- [eventDurationEditable](#eventdurationeditable)
|
|
49
|
+
- [eventLongPressDelay](#eventlongpressdelay)
|
|
49
50
|
- [eventMouseEnter](#eventmouseenter)
|
|
50
51
|
- [eventMouseLeave](#eventmouseleave)
|
|
51
52
|
- [eventResize](#eventresize)
|
|
@@ -66,6 +67,7 @@ Inspired by [FullCalendar](https://fullcalendar.io/), implements similar options
|
|
|
66
67
|
- [listDaySideFormat](#listdaysideformat)
|
|
67
68
|
- [loading](#loading)
|
|
68
69
|
- [locale](#locale)
|
|
70
|
+
- [longPressDelay](#longpressdelay)
|
|
69
71
|
- [monthMode](#monthmode)
|
|
70
72
|
</td><td>
|
|
71
73
|
|
|
@@ -78,6 +80,7 @@ Inspired by [FullCalendar](https://fullcalendar.io/), implements similar options
|
|
|
78
80
|
- [select](#select)
|
|
79
81
|
- [selectable](#selectable)
|
|
80
82
|
- [selectBackgroundColor](#selectbackgroundcolor)
|
|
83
|
+
- [selectLongPressDelay](#selectlongpressdelay)
|
|
81
84
|
- [selectMinDistance](#selectmindistance)
|
|
82
85
|
- [scrollTime](#scrolltime)
|
|
83
86
|
- [slotDuration](#slotduration)
|
|
@@ -822,6 +825,14 @@ The current [View](#view-object) object
|
|
|
822
825
|
|
|
823
826
|
Determines whether calendar events can be resized.
|
|
824
827
|
|
|
828
|
+
### eventLongPressDelay
|
|
829
|
+
- Type `integer`
|
|
830
|
+
- Default `undefined`
|
|
831
|
+
|
|
832
|
+
For touch devices, the amount of time (in milliseconds) the user must hold down a tap before the event becomes draggable/resizable.
|
|
833
|
+
|
|
834
|
+
If not specified, it falls back to [longPressDelay](#longpressdelay).
|
|
835
|
+
|
|
825
836
|
### eventMouseEnter
|
|
826
837
|
- Type `function`
|
|
827
838
|
- Default `undefined`
|
|
@@ -1367,6 +1378,14 @@ function (isLoading) { }
|
|
|
1367
1378
|
|
|
1368
1379
|
Defines the `locales` parameter for the native JavaScript [Intl.DateTimeFormat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat) object that the Event Calendar uses to format date and time strings in options such as [dayHeaderFormat](#dayheaderformat), [eventTimeFormat](#eventtimeformat), etc.
|
|
1369
1380
|
|
|
1381
|
+
### longPressDelay
|
|
1382
|
+
- Type `integer`
|
|
1383
|
+
- Default `1000`
|
|
1384
|
+
|
|
1385
|
+
For touch devices, the amount of time (in milliseconds) the user must hold down a tap before the event becomes draggable/resizable or the date becomes selectable.
|
|
1386
|
+
|
|
1387
|
+
For a more granular configuration, see [eventLongPressDelay](#eventlongpressdelay) and [selectLongPressDelay](#selectlongpressdelay).
|
|
1388
|
+
|
|
1370
1389
|
### monthMode
|
|
1371
1390
|
- Type `boolean`
|
|
1372
1391
|
- Default `false`
|
|
@@ -1562,6 +1581,14 @@ Sets the background color for the event indicating the current selection. See [s
|
|
|
1562
1581
|
|
|
1563
1582
|
You can use any of the CSS color formats such `'#f00'`, `'#ff0000'`, `'rgb(255,0,0)'`, or `'red'`.
|
|
1564
1583
|
|
|
1584
|
+
### selectLongPressDelay
|
|
1585
|
+
- Type `integer`
|
|
1586
|
+
- Default `undefined`
|
|
1587
|
+
|
|
1588
|
+
For touch devices, the amount of time (in milliseconds) the user must hold down a tap before the date becomes selectable.
|
|
1589
|
+
|
|
1590
|
+
If not specified, it falls back to [longPressDelay](#longpressdelay).
|
|
1591
|
+
|
|
1565
1592
|
### selectMinDistance
|
|
1566
1593
|
- Type `integer`
|
|
1567
1594
|
- Default `0`
|
package/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ec-flex{display:flex}.ec-month .ec-body,.ec-days,.ec-day,.ec-day-title,.ec-resource{flex:1 1 0%;min-width:0;max-width:100%}.ec{display:flex;flex-direction:column}.ec ::-webkit-scrollbar{background:#fff}.ec ::-webkit-scrollbar-thumb{border:4px solid #fff;box-shadow:none;background:#dadce0;border-radius:8px;min-height:40px}.ec :hover::-webkit-scrollbar-thumb{background:#bdc1c6}.ec-hidden-scroll{display:none;overflow-y:scroll;visibility:hidden;flex-shrink:0}.ec-with-scroll .ec-hidden-scroll{display:block}.ec-toolbar{flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;margin-bottom:1em}.ec-toolbar>*{margin-bottom:-0.5em}.ec-toolbar>*>*{margin-bottom:.5em}.ec-toolbar>*>*:not(:last-child){margin-right:.75em}.ec-title{margin:0}.ec-button{background-color:#fff;border:1px solid #ced4da;padding:.375rem .75rem;font-size:1rem;line-height:1.5;border-radius:.25rem}.ec-button:not(:disabled){color:#212529;cursor:pointer}.ec-button:not(:disabled):hover,.ec-button.ec-active{background-color:#ececec;border-color:#b1bbc4}.ec-button-group{display:inline-flex}.ec-button-group .ec-button:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}.ec-button-group .ec-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.ec-icon{display:inline-block;width:1em}.ec-icon.ec-prev:after,.ec-icon.ec-next:after{content:"";position:relative;width:.5em;height:.5em;border-top:2px solid #212529;border-right:2px solid #212529;display:inline-block}.ec-icon.ec-prev:after{transform:rotate(-135deg) translate(-2px, 2px)}.ec-icon.ec-next:after{transform:rotate(45deg) translate(-2px, 2px)}.ec-header,.ec-all-day,.ec-body,.ec-days,.ec-day{border:1px solid #dadce0}.ec-header{display:flex;flex-shrink:0}.ec-header .ec-resource{flex-direction:column}.ec-header .ec-resource .ec-days{border-top-style:solid}.ec-header .ec-days{border-bottom:none}.ec-header .ec-day{min-height:24px;line-height:24px;text-align:center;overflow:hidden;text-overflow:ellipsis}.ec-all-day{display:flex;flex-shrink:0;border-top:none}.ec-all-day .ec-days{border-bottom:none}.ec-all-day .ec-day{padding-bottom:4px}.ec-all-day .ec-event-time{display:none}.ec-body{position:relative;overflow-x:hidden;overflow-y:auto}.ec-body:not(.ec-list){border-top:none}.ec-sidebar{flex:0 0 auto;width:auto;max-width:100%;padding:0 4px 0 8px;display:flex;flex-direction:column;justify-content:center}.ec-sidebar-title{visibility:hidden;overflow-y:hidden;height:0;text-align:right}.ec-all-day .ec-sidebar-title{visibility:visible;height:auto;padding:8px 0}.ec-content{display:flex}.ec-month .ec-content{flex-direction:column;height:100%}.ec-month .ec-uniform .ec-content{overflow:hidden}.ec-list .ec-content{flex-direction:column}.ec-resource{display:flex}.ec-days{display:flex;border-style:none none solid}.ec-days:last-child{border-bottom:none}.ec-month .ec-days,.ec-resource .ec-days{flex:1 0 auto}.ec-month .ec-uniform .ec-days{flex:1 1 0%;min-height:0}.ec-day{border-style:none none none solid}.ec-day.ec-today{background-color:#fcf8e3}.ec-day.ec-highlight{background-color:#e5f7fe}.ec-month .ec-body .ec-day{min-height:5em;position:relative}.ec-month .ec-uniform .ec-day{min-height:0}.ec-month .ec-day:first-child{border-left:none}.ec-day.ec-other-month .ec-day-head{opacity:.3}.ec-list .ec-day{flex:1 0 auto;background-color:#fff;border-style:solid none;padding:8px 14px;font-weight:bold;position:-webkit-sticky;position:sticky;top:0;z-index:2}.ec-list .ec-day:first-child{border-top:none}.ec-month .ec-day-head{text-align:right;padding:4px 4px 3px}.ec-month .ec-day-foot{position:absolute;bottom:0;padding:2px;font-size:.85em}.ec-month .ec-day-foot a{cursor:pointer}.ec-list .ec-day-side{float:right}.ec-list .ec-no-events{text-align:center;padding:5em 0}.ec-events{margin:0 6px 0 0}.ec-week .ec-events,.ec-events.ec-preview{position:relative}.ec-event{display:flex;padding:2px;color:#fff;box-sizing:border-box;box-shadow:0 0 1px 0 #dadce0;background-color:#039be5;border-radius:3px;font-size:.85em;line-height:1.5;z-index:1}.ec-month .ec-event,.ec-all-day .ec-event{position:relative}.ec-week .ec-body .ec-event{position:absolute}.ec-list .ec-event{flex-direction:row;padding:8px 14px;color:inherit;background-color:rgba(0,0,0,0);border-radius:0}.ec-event.ec-preview{position:absolute;z-index:1000;width:100%;-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;position:absolute;z-index:0;box-shadow:none;display:none}.ec-day:hover .ec-event.ec-pointer{display:flex}.ec-event-body{display:flex;flex-direction:column;width:100%}.ec-month .ec-event-body,.ec-all-day .ec-event-body{flex-direction:row}.ec-event-tag{width:4px;border-radius:2px;margin-right:8px}.ec-event-time{overflow:hidden;white-space:nowrap;margin:0 0 1px 0;flex-shrink:0}.ec-month .ec-event-time{margin:0 3px 0 0;max-width:100%;text-overflow:ellipsis}.ec-event-title{overflow:hidden}.ec-month .ec-event-title,.ec-all-day .ec-event-title{min-height:1.5em;white-space:nowrap;text-overflow:ellipsis}.ec-week .ec-body .ec-event-title{position:-webkit-sticky;position:sticky;top:0}.ec-list .ec-event-title{font-size:1rem}.ec-draggable{cursor:pointer;-webkit-user-select:none;user-select:none
|
|
1
|
+
.ec-flex{display:flex}.ec-month .ec-body,.ec-days,.ec-day,.ec-day-title,.ec-resource{flex:1 1 0%;min-width:0;max-width:100%}.ec{display:flex;flex-direction:column;-webkit-tap-highlight-color:rgba(0,0,0,0)}.ec ::-webkit-scrollbar{background:#fff}.ec ::-webkit-scrollbar-thumb{border:4px solid #fff;box-shadow:none;background:#dadce0;border-radius:8px;min-height:40px}.ec :hover::-webkit-scrollbar-thumb{background:#bdc1c6}.ec-hidden-scroll{display:none;overflow-y:scroll;visibility:hidden;flex-shrink:0}.ec-with-scroll .ec-hidden-scroll{display:block}.ec-toolbar{flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;margin-bottom:1em}.ec-toolbar>*{margin-bottom:-0.5em}.ec-toolbar>*>*{margin-bottom:.5em}.ec-toolbar>*>*:not(:last-child){margin-right:.75em}.ec-title{margin:0}.ec-button{background-color:#fff;border:1px solid #ced4da;padding:.375rem .75rem;font-size:1rem;line-height:1.5;border-radius:.25rem}.ec-button:not(:disabled){color:#212529;cursor:pointer}.ec-button:not(:disabled):hover,.ec-button.ec-active{background-color:#ececec;border-color:#b1bbc4}.ec-button-group{display:inline-flex}.ec-button-group .ec-button:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}.ec-button-group .ec-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.ec-icon{display:inline-block;width:1em}.ec-icon.ec-prev:after,.ec-icon.ec-next:after{content:"";position:relative;width:.5em;height:.5em;border-top:2px solid #212529;border-right:2px solid #212529;display:inline-block}.ec-icon.ec-prev:after{transform:rotate(-135deg) translate(-2px, 2px)}.ec-icon.ec-next:after{transform:rotate(45deg) translate(-2px, 2px)}.ec-header,.ec-all-day,.ec-body,.ec-days,.ec-day{border:1px solid #dadce0}.ec-header{display:flex;flex-shrink:0}.ec-header .ec-resource{flex-direction:column}.ec-header .ec-resource .ec-days{border-top-style:solid}.ec-header .ec-days{border-bottom:none}.ec-header .ec-day{min-height:24px;line-height:24px;text-align:center;overflow:hidden;text-overflow:ellipsis}.ec-all-day{display:flex;flex-shrink:0;border-top:none}.ec-all-day .ec-days{border-bottom:none}.ec-all-day .ec-day{padding-bottom:4px}.ec-all-day .ec-event-time{display:none}.ec-body{position:relative;overflow-x:hidden;overflow-y:auto}.ec-body:not(.ec-list){border-top:none}.ec-sidebar{flex:0 0 auto;width:auto;max-width:100%;padding:0 4px 0 8px;display:flex;flex-direction:column;justify-content:center}.ec-sidebar-title{visibility:hidden;overflow-y:hidden;height:0;text-align:right}.ec-all-day .ec-sidebar-title{visibility:visible;height:auto;padding:8px 0}.ec-content{display:flex}.ec-month .ec-content{flex-direction:column;height:100%}.ec-month .ec-uniform .ec-content{overflow:hidden}.ec-list .ec-content{flex-direction:column}.ec-resource{display:flex}.ec-days{display:flex;border-style:none none solid}.ec-days:last-child{border-bottom:none}.ec-month .ec-days,.ec-resource .ec-days{flex:1 0 auto}.ec-month .ec-uniform .ec-days{flex:1 1 0%;min-height:0}.ec-day{border-style:none none none solid}.ec-day.ec-today{background-color:#fcf8e3}.ec-day.ec-highlight{background-color:#e5f7fe}.ec-month .ec-body .ec-day{min-height:5em;position:relative}.ec-month .ec-uniform .ec-day{min-height:0}.ec-month .ec-day:first-child{border-left:none}.ec-day.ec-other-month .ec-day-head{opacity:.3}.ec-list .ec-day{flex:1 0 auto;background-color:#fff;border-style:solid none;padding:8px 14px;font-weight:bold;position:-webkit-sticky;position:sticky;top:0;z-index:2}.ec-list .ec-day:first-child{border-top:none}.ec-month .ec-day-head{text-align:right;padding:4px 4px 3px}.ec-month .ec-day-foot{position:absolute;bottom:0;padding:2px;font-size:.85em}.ec-month .ec-day-foot a{cursor:pointer}.ec-list .ec-day-side{float:right}.ec-list .ec-no-events{text-align:center;padding:5em 0}.ec-events{margin:0 6px 0 0}.ec-week .ec-events,.ec-events.ec-preview{position:relative}.ec-event{display:flex;padding:2px;color:#fff;box-sizing:border-box;box-shadow:0 0 1px 0 #dadce0;background-color:#039be5;border-radius:3px;font-size:.85em;line-height:1.5;z-index:1}.ec-month .ec-event,.ec-all-day .ec-event{position:relative}.ec-week .ec-body .ec-event{position:absolute}.ec-list .ec-event{flex-direction:row;padding:8px 14px;color:inherit;background-color:rgba(0,0,0,0);border-radius:0}.ec-event.ec-preview{position:absolute;z-index:1000;width:100%;-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;position:absolute;z-index:0;box-shadow:none;display:none}.ec-day:hover .ec-event.ec-pointer{display:flex}.ec-event-body{display:flex;flex-direction:column;width:100%}.ec-month .ec-event-body,.ec-all-day .ec-event-body{flex-direction:row}.ec-event-tag{width:4px;border-radius:2px;margin-right:8px}.ec-event-time{overflow:hidden;white-space:nowrap;margin:0 0 1px 0;flex-shrink:0}.ec-month .ec-event-time{margin:0 3px 0 0;max-width:100%;text-overflow:ellipsis}.ec-event-title{overflow:hidden}.ec-month .ec-event-title,.ec-all-day .ec-event-title{min-height:1.5em;white-space:nowrap;text-overflow:ellipsis}.ec-week .ec-body .ec-event-title{position:-webkit-sticky;position:sticky;top:0}.ec-list .ec-event-title{font-size:1rem}.ec-draggable{cursor:pointer;-webkit-user-select:none;user-select:none}.ec-ghost{opacity:.5;-webkit-user-select:none;user-select:none}.ec-bg-events{position:relative}.ec-bg-event{position:absolute;background-color:#dadce0;opacity:.3;width:100%}.ec-hidden-times{visibility:hidden;overflow-y:hidden;height:0}.ec-time,.ec-line{height:24px}.ec-time{position:relative;line-height:24px;top:-12px;text-align:right;white-space:nowrap}.ec-lines{width:8px}.ec-line:not(:first-child):after{content:"";position:absolute;width:100%;border-bottom:1px solid #dadce0;pointer-events:none}.ec-body:not(.ec-compact) .ec-line:nth-child(even):after{border-bottom-style:dotted}.ec-popup{position:absolute;top:0;width:110%;min-width:180px;z-index:1010;padding:8px 10px 14px;background-color:#fff;border-radius:6px;outline:1px solid rgba(0,0,0,0);box-shadow:0 1px 3px 0 rgba(60,64,67,.3),0 4px 8px 3px rgba(60,64,67,.15)}.ec-popup .ec-day-head{text-align:left;display:flex;justify-content:space-between}.ec-popup .ec-day-head a{cursor:pointer;font-size:1.5em;line-height:.8}.ec-popup .ec-events{margin:0}.ec-extra{position:relative;height:100%;overflow:hidden;margin-left:-6.5px}.ec-now-indicator{position:absolute;z-index:1005;width:100%;border-top:#ea4335 solid 2px;pointer-events:none}.ec-now-indicator:before{background:#ea4335;border-radius:50%;content:"";position:absolute;height:12px;margin-top:-7px;width:12px;pointer-events:none}.ec-resizer{position:absolute;-webkit-user-select:none;user-select:none}.ec-month .ec-resizer,.ec-all-day .ec-resizer{top:0;right:0;bottom:0;width:50%;max-width:8px;cursor:ew-resize}.ec-week .ec-body .ec-resizer{left:0;right:0;bottom:0;height:50%;max-height:8px;cursor:ns-resize}.ec-dragging{cursor:pointer !important}.ec-resizing-y{cursor:ns-resize !important}.ec-resizing-x{cursor:ew-resize !important}
|
package/index.js
CHANGED
|
@@ -456,7 +456,7 @@ function get_each_context$1(ctx, list, i) {
|
|
|
456
456
|
return child_ctx;
|
|
457
457
|
}
|
|
458
458
|
|
|
459
|
-
// (38:
|
|
459
|
+
// (38:4) {:else}
|
|
460
460
|
function create_else_block$1(ctx) {
|
|
461
461
|
let button;
|
|
462
462
|
let t_value = /*$buttonText*/ ctx[5][/*button*/ ctx[23]] + "";
|
|
@@ -505,7 +505,7 @@ function create_else_block$1(ctx) {
|
|
|
505
505
|
};
|
|
506
506
|
}
|
|
507
507
|
|
|
508
|
-
// (36:
|
|
508
|
+
// (36:33)
|
|
509
509
|
function create_if_block_4(ctx) {
|
|
510
510
|
let button;
|
|
511
511
|
let t_value = /*$buttonText*/ ctx[5][/*button*/ ctx[23]] + "";
|
|
@@ -549,7 +549,7 @@ function create_if_block_4(ctx) {
|
|
|
549
549
|
};
|
|
550
550
|
}
|
|
551
551
|
|
|
552
|
-
// (34:
|
|
552
|
+
// (34:32)
|
|
553
553
|
function create_if_block_3(ctx) {
|
|
554
554
|
let button;
|
|
555
555
|
let i;
|
|
@@ -591,7 +591,7 @@ function create_if_block_3(ctx) {
|
|
|
591
591
|
};
|
|
592
592
|
}
|
|
593
593
|
|
|
594
|
-
// (32:
|
|
594
|
+
// (32:31)
|
|
595
595
|
function create_if_block_2(ctx) {
|
|
596
596
|
let button;
|
|
597
597
|
let i;
|
|
@@ -633,7 +633,7 @@ function create_if_block_2(ctx) {
|
|
|
633
633
|
};
|
|
634
634
|
}
|
|
635
635
|
|
|
636
|
-
// (30:
|
|
636
|
+
// (30:32)
|
|
637
637
|
function create_if_block_1(ctx) {
|
|
638
638
|
let h2;
|
|
639
639
|
let t;
|
|
@@ -662,7 +662,7 @@ function create_if_block_1(ctx) {
|
|
|
662
662
|
};
|
|
663
663
|
}
|
|
664
664
|
|
|
665
|
-
// (29:
|
|
665
|
+
// (29:4) {#if button == ''}
|
|
666
666
|
function create_if_block$1(ctx) {
|
|
667
667
|
return { c: noop, m: noop, p: noop, d: noop };
|
|
668
668
|
}
|
|
@@ -865,7 +865,7 @@ function get_each_context_1(ctx, list, i) {
|
|
|
865
865
|
return child_ctx;
|
|
866
866
|
}
|
|
867
867
|
|
|
868
|
-
// (28:
|
|
868
|
+
// (28:16) {:else}
|
|
869
869
|
function create_else_block(ctx) {
|
|
870
870
|
let buttons;
|
|
871
871
|
let current;
|
|
@@ -899,7 +899,7 @@ function create_else_block(ctx) {
|
|
|
899
899
|
};
|
|
900
900
|
}
|
|
901
901
|
|
|
902
|
-
// (24:
|
|
902
|
+
// (24:16) {#if buttons.length > 1}
|
|
903
903
|
function create_if_block(ctx) {
|
|
904
904
|
let div;
|
|
905
905
|
let buttons;
|
|
@@ -943,7 +943,7 @@ function create_if_block(ctx) {
|
|
|
943
943
|
};
|
|
944
944
|
}
|
|
945
945
|
|
|
946
|
-
// (23:
|
|
946
|
+
// (23:12) {#each sections[key] as buttons}
|
|
947
947
|
function create_each_block_1(ctx) {
|
|
948
948
|
let current_block_type_index;
|
|
949
949
|
let if_block;
|
|
@@ -1013,7 +1013,7 @@ function create_each_block_1(ctx) {
|
|
|
1013
1013
|
};
|
|
1014
1014
|
}
|
|
1015
1015
|
|
|
1016
|
-
// (21:
|
|
1016
|
+
// (21:4) {#each Object.keys(sections) as key}
|
|
1017
1017
|
function create_each_block(ctx) {
|
|
1018
1018
|
let div;
|
|
1019
1019
|
let t;
|
|
@@ -1451,7 +1451,7 @@ function instance($$self, $$props, $$invalidate) {
|
|
|
1451
1451
|
|
|
1452
1452
|
function unselect() {
|
|
1453
1453
|
if ($_interaction.action) {
|
|
1454
|
-
$_interaction.action.
|
|
1454
|
+
$_interaction.action.unselect();
|
|
1455
1455
|
}
|
|
1456
1456
|
|
|
1457
1457
|
return this;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@event-calendar/core",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.13.0",
|
|
4
4
|
"title": "Event Calendar Core package",
|
|
5
5
|
"description": "Full-sized drag & drop event calendar with resource view",
|
|
6
6
|
"keywords": [
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
"./package.json": "./package.json"
|
|
35
35
|
},
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@event-calendar/common": "~0.
|
|
37
|
+
"@event-calendar/common": "~0.13.0",
|
|
38
38
|
"svelte": "^3.51.0"
|
|
39
39
|
}
|
|
40
40
|
}
|
package/src/Buttons.svelte
CHANGED
|
@@ -1,41 +1,41 @@
|
|
|
1
1
|
<script>
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
import {getContext} from 'svelte';
|
|
3
|
+
import {createDate, cloneDate, subtractDay, addDuration, subtractDuration, setMidnight} from '@event-calendar/common';
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
export let buttons;
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
let {_currentRange, _viewTitle, buttonText, date, duration, hiddenDays, theme, view} = getContext('state');
|
|
8
8
|
|
|
9
|
-
|
|
9
|
+
let today = setMidnight(createDate()), isToday;
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
$: isToday = today >= $_currentRange.start && today < $_currentRange.end || null;
|
|
12
12
|
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
13
|
+
function prev() {
|
|
14
|
+
let d = subtractDuration($date, $duration);
|
|
15
|
+
if ($hiddenDays.length && $hiddenDays.length < 7) {
|
|
16
|
+
while ($hiddenDays.includes(d.getUTCDay())) {
|
|
17
|
+
subtractDay(d);
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
$date = d;
|
|
21
|
+
}
|
|
22
22
|
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
23
|
+
function next() {
|
|
24
|
+
$date = addDuration($date, $duration);
|
|
25
|
+
}
|
|
26
26
|
</script>
|
|
27
27
|
|
|
28
28
|
{#each buttons as button}
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
29
|
+
{#if button == ''}
|
|
30
|
+
{:else if button == 'title'}
|
|
31
|
+
<h2 class="{$theme.title}">{$_viewTitle}</h2>
|
|
32
|
+
{:else if button == 'prev'}
|
|
33
|
+
<button class="{$theme.button} ec-{button}" on:click={prev}><i class="{$theme.icon} ec-{button}"></i></button>
|
|
34
|
+
{:else if button === 'next'}
|
|
35
|
+
<button class="{$theme.button} ec-{button}" on:click={next}><i class="{$theme.icon} ec-{button}"></i></button>
|
|
36
|
+
{:else if button === 'today'}
|
|
37
|
+
<button class="{$theme.button} ec-{button}" on:click={() => $date = cloneDate(today)} disabled={isToday}>{$buttonText[button]}</button>
|
|
38
|
+
{:else}
|
|
39
|
+
<button class="{$theme.button}{$view === button ? ' ' + $theme.active : ''} ec-{button}" on:click={() => $view = button}>{$buttonText[button]}</button>
|
|
40
|
+
{/if}
|
|
41
41
|
{/each}
|
package/src/Calendar.svelte
CHANGED
|
@@ -1,105 +1,105 @@
|
|
|
1
1
|
<script>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
2
|
+
import '../index.css';
|
|
3
|
+
import {setContext} from 'svelte';
|
|
4
|
+
import {get} from 'svelte/store';
|
|
5
|
+
import {diff} from './storage/options';
|
|
6
|
+
import State from './storage/state';
|
|
7
|
+
import Toolbar from './Toolbar.svelte';
|
|
8
|
+
import {assign, toEventWithLocalDates, toViewWithLocalDates} from '@event-calendar/common';
|
|
9
|
+
|
|
10
|
+
export let plugins = [];
|
|
11
|
+
export let options = {};
|
|
12
|
+
|
|
13
|
+
let state = new State(plugins, options);
|
|
14
|
+
setContext('state', state);
|
|
15
|
+
|
|
16
|
+
let {_viewComponent, _viewClass, _interaction, _iClass, _events, events, eventSources, height, theme} = state;
|
|
17
|
+
|
|
18
|
+
// Reactively update options that did change
|
|
19
|
+
$: for (let [name, value] of diff(options)) {
|
|
20
|
+
setOption(name, value);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
export function setOption(name, value) {
|
|
24
|
+
if (state.hasOwnProperty(name)) {
|
|
25
|
+
if (state[name].parse) {
|
|
26
|
+
value = state[name].parse(value);
|
|
27
|
+
}
|
|
28
|
+
state[name].set(value);
|
|
29
|
+
}
|
|
30
|
+
return this;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
export function getOption(name) {
|
|
34
|
+
return state.hasOwnProperty(name) ? get(state[name]) : undefined;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
export function refetchEvents() {
|
|
38
|
+
state._fetchedRange.set({start: undefined, end: undefined});
|
|
39
|
+
return this;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
export function getEvents() {
|
|
43
|
+
return get(state._events).map(toEventWithLocalDates);
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
export function getEventById(id) {
|
|
47
|
+
for (let event of get(state._events)) {
|
|
48
|
+
if (event.id == id) {
|
|
49
|
+
return toEventWithLocalDates(event);
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
return null;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
export function addEvent(event) {
|
|
56
|
+
updateEvents(events => events.concat(state.events.parse([event])));
|
|
57
|
+
return this;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
export function updateEvent(event) {
|
|
61
|
+
updateEvents(events => {
|
|
62
|
+
for (let e of events) {
|
|
63
|
+
if (e.id == event.id) {
|
|
64
|
+
assign(e, state.events.parse([event])[0]);
|
|
65
|
+
break;
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
return events;
|
|
69
|
+
});
|
|
70
|
+
return this;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
export function removeEventById(id) {
|
|
74
|
+
updateEvents(events => events.filter(event => event.id != id));
|
|
75
|
+
return this;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
export function getView() {
|
|
79
|
+
return toViewWithLocalDates(state._view.get());
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
export function unselect() {
|
|
83
|
+
if ($_interaction.action) {
|
|
84
|
+
$_interaction.action.unselect();
|
|
85
|
+
}
|
|
86
|
+
return this;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
function updateEvents(func) {
|
|
90
|
+
if ($eventSources.length) {
|
|
91
|
+
$_events = func($_events);
|
|
92
|
+
} else {
|
|
93
|
+
$events = func($events);
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
96
|
</script>
|
|
97
97
|
|
|
98
98
|
<div
|
|
99
|
-
|
|
100
|
-
|
|
99
|
+
class="{$theme.calendar}{$_viewClass ? ' ' + $theme[$_viewClass] : ''}{$_iClass ? ' ' + $theme[$_iClass] : ''}"
|
|
100
|
+
style="height: {$height}"
|
|
101
101
|
>
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
102
|
+
<Toolbar/>
|
|
103
|
+
<svelte:component this={$_viewComponent}/>
|
|
104
|
+
<svelte:component this={$_interaction.component}/>
|
|
105
105
|
</div>
|
package/src/Toolbar.svelte
CHANGED
|
@@ -1,34 +1,34 @@
|
|
|
1
1
|
<script>
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
import {getContext} from 'svelte';
|
|
3
|
+
import Buttons from './Buttons.svelte';
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
let {headerToolbar, theme} = getContext('state');
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
7
|
+
let sections = {
|
|
8
|
+
start: [],
|
|
9
|
+
center: [],
|
|
10
|
+
end: []
|
|
11
|
+
};
|
|
12
12
|
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
13
|
+
$: {
|
|
14
|
+
for (let key of Object.keys(sections)) {
|
|
15
|
+
sections[key] = $headerToolbar[key].split(' ').map(group => group.split(','));
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
18
|
</script>
|
|
19
19
|
|
|
20
20
|
<div class="{$theme.toolbar}">
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
21
|
+
{#each Object.keys(sections) as key}
|
|
22
|
+
<div>
|
|
23
|
+
{#each sections[key] as buttons}
|
|
24
|
+
{#if buttons.length > 1}
|
|
25
|
+
<div class="{$theme.buttonGroup}">
|
|
26
|
+
<Buttons {buttons}/>
|
|
27
|
+
</div>
|
|
28
|
+
{:else}
|
|
29
|
+
<Buttons {buttons}/>
|
|
30
|
+
{/if}
|
|
31
|
+
{/each}
|
|
32
|
+
</div>
|
|
33
|
+
{/each}
|
|
34
34
|
</div>
|
package/src/index.scss
CHANGED
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
.ec {
|
|
17
17
|
display: flex;
|
|
18
18
|
flex-direction: column;
|
|
19
|
+
-webkit-tap-highlight-color: transparent;
|
|
19
20
|
|
|
20
21
|
/* Scrollbar */
|
|
21
22
|
::-webkit-scrollbar {
|
|
@@ -443,13 +444,11 @@
|
|
|
443
444
|
.ec-draggable {
|
|
444
445
|
cursor: pointer;
|
|
445
446
|
user-select: none;
|
|
446
|
-
touch-action: none;
|
|
447
447
|
}
|
|
448
448
|
|
|
449
449
|
.ec-ghost {
|
|
450
450
|
opacity: .5;
|
|
451
451
|
user-select: none;
|
|
452
|
-
touch-action: none;
|
|
453
452
|
}
|
|
454
453
|
|
|
455
454
|
.ec-bg-events {
|