@event-calendar/core 5.3.3 → 5.4.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 (8) hide show
  1. package/README.md +93 -5
  2. package/dist/index.css +1 -1
  3. package/dist/index.js +89 -75
  4. package/package.json +1 -1
  5. package/src/lib/resources.js +5 -5
  6. package/src/plugins/resource-timeline/Expander.svelte +21 -14
  7. package/src/plugins/resource-timeline/index.js +53 -38
  8. package/src/storage/options.js +2 -1
package/README.md CHANGED
@@ -68,9 +68,9 @@ Inspired by [FullCalendar](https://fullcalendar.io/), it implements similar opti
68
68
  - [eventDragStart](#eventdragstart)
69
69
  - [eventDragStop](#eventdragstop)
70
70
  - [eventDrop](#eventdrop)
71
+ - [eventDurationEditable](#eventdurationeditable)
71
72
  </td><td>
72
73
 
73
- - [eventDurationEditable](#eventdurationeditable)
74
74
  - [eventFilter](#eventfilter)
75
75
  - [eventLongPressDelay](#eventlongpressdelay)
76
76
  - [eventMouseEnter](#eventmouseenter)
@@ -92,6 +92,7 @@ Inspired by [FullCalendar](https://fullcalendar.io/), it implements similar opti
92
92
  - [height](#height)
93
93
  - [hiddenDays](#hiddendays)
94
94
  - [highlightedDates](#highlighteddates)
95
+ - [icons](#icons)
95
96
  - [lazyFetching](#lazyfetching)
96
97
  - [listDayFormat](#listdayformat)
97
98
  - [listDaySideFormat](#listdaysideformat)
@@ -102,11 +103,12 @@ Inspired by [FullCalendar](https://fullcalendar.io/), it implements similar opti
102
103
  - [noEventsClick](#noeventsclick)
103
104
  - [noEventsContent](#noeventscontent)
104
105
  - [nowIndicator](#nowindicator)
106
+ - [pointer](#pointer)
105
107
  </td><td>
106
108
 
107
- - [pointer](#pointer)
108
109
  - [refetchResourcesOnNavigate](#refetchresourcesonnavigate)
109
110
  - [resizeConstraint](#resizeconstraint)
111
+ - [resourceExpand](#resourceexpand)
110
112
  - [resources](#resources)
111
113
  - [resourceLabelContent](#resourcelabelcontent)
112
114
  - [resourceLabelDidMount](#resourcelabeldidmount)
@@ -251,8 +253,8 @@ This bundle contains a version of the calendar that includes all plugins and is
251
253
 
252
254
  The first step is to include the following lines of code in the `<head>` section of your page:
253
255
  ```html
254
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@5.3.3/dist/event-calendar.min.css">
255
- <script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@5.3.3/dist/event-calendar.min.js"></script>
256
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@5.4.0/dist/event-calendar.min.css">
257
+ <script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@5.4.0/dist/event-calendar.min.js"></script>
256
258
  ```
257
259
 
258
260
  <details>
@@ -1829,6 +1831,31 @@ Array of dates that need to be highlighted in the calendar.
1829
1831
 
1830
1832
  Each date can be either an ISO8601 date string like `'2026-12-31'`, or a JavaScript Date object.
1831
1833
 
1834
+ ### icons
1835
+ - Type `object`
1836
+ - Default `{collapse: {html: '&minus;'}, expand: {html: '&plus;'}}`
1837
+
1838
+ Defines icons used in some buttons, such as those for expanding nested resources in `resourceTimeline` views.
1839
+
1840
+ Each icon is specified as a [Content](#content) value.
1841
+
1842
+ This option can be either a plain object with all necessary properties, or a callback function that receives default icons object and should return a new one:
1843
+
1844
+ ```js
1845
+ function (icons) {
1846
+ // return new icons object
1847
+ }
1848
+ ```
1849
+ <table>
1850
+ <tr>
1851
+ <td>
1852
+
1853
+ `icons`
1854
+ </td>
1855
+ <td>An object with default icons</td>
1856
+ </tr>
1857
+ </table>
1858
+
1832
1859
  ### lazyFetching
1833
1860
  - Type `boolean`
1834
1861
  - Default `true`
@@ -2029,6 +2056,47 @@ Callback function that limits the date/time range within which the event is allo
2029
2056
 
2030
2057
  The function is triggered during resizing for each cursor movement and takes the same parameters as [eventResize](#eventresize). The function should return `true` if the new size is allowed, and `false` otherwise.
2031
2058
 
2059
+ ### resourceExpand
2060
+ - Type `function`
2061
+ - Default `undefined`
2062
+
2063
+ Callback function that is triggered when a resource with nested children is expanded or collapsed in `resourceTimeline` views.
2064
+
2065
+
2066
+ ```js
2067
+ function (info) { }
2068
+ ```
2069
+ `info` is an object with the following properties:
2070
+ <table>
2071
+ <tr>
2072
+ <td>
2073
+
2074
+ `resource`
2075
+ </td>
2076
+ <td>
2077
+
2078
+ The associated [Resource](#resource-object) object
2079
+ </td>
2080
+ </tr>
2081
+ <tr>
2082
+ <td>
2083
+
2084
+ `jsEvent`
2085
+ </td>
2086
+ <td>JavaScript native event object with low-level information such as click coordinates</td>
2087
+ </tr>
2088
+ <tr>
2089
+ <td>
2090
+
2091
+ `view`
2092
+ </td>
2093
+ <td>
2094
+
2095
+ The current [View](#view-object) object
2096
+ </td>
2097
+ </tr>
2098
+ </table>
2099
+
2032
2100
  ### resources
2033
2101
  - Type `array`, `object` or `function`
2034
2102
  - Default `[]`
@@ -3263,6 +3331,16 @@ The title of the resource. See [Content](#content)
3263
3331
  <tr>
3264
3332
  <td>
3265
3333
 
3334
+ `expanded`
3335
+ </td>
3336
+ <td>
3337
+
3338
+ A flag indicating whether the resource is expanded or collapsed if it has nested children
3339
+ </td>
3340
+ </tr>
3341
+ <tr>
3342
+ <td>
3343
+
3266
3344
  `extendedProps`
3267
3345
  </td>
3268
3346
  <td>
@@ -3320,6 +3398,16 @@ Here are all admissible fields for the resource’s input object:
3320
3398
  <tr>
3321
3399
  <td>
3322
3400
 
3401
+ `expanded`
3402
+ </td>
3403
+ <td>
3404
+
3405
+ `boolean` Specifies whether the resource with nested children will be expanded or collapsed. Default `true`
3406
+ </td>
3407
+ </tr>
3408
+ <tr>
3409
+ <td>
3410
+
3323
3411
  `extendedProps`
3324
3412
  </td>
3325
3413
  <td>
@@ -3336,7 +3424,7 @@ Here are all admissible fields for the resource’s input object:
3336
3424
  </tr>
3337
3425
  </table>
3338
3426
 
3339
- The `timeline` views support displaying nested resources. Nested resources can be collapsed or expanded using an additional button that appears before the parent resource name. To pass nested resources, use the `children` field:
3427
+ The `resourceTimeline` views support displaying nested resources. Nested resources can be collapsed or expanded using an additional button that appears before the parent resource name. To pass nested resources, use the `children` field:
3340
3428
 
3341
3429
  ```js
3342
3430
  resources: [
package/dist/index.css CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * EventCalendar v5.3.3
2
+ * EventCalendar v5.4.0
3
3
  * https://github.com/vkurko/calendar
4
4
  */
5
5
  .ec {
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * EventCalendar v5.3.3
2
+ * EventCalendar v5.4.0
3
3
  * https://github.com/vkurko/calendar
4
4
  */
5
5
  import { untrack, tick, getAbortSignal, getContext, setContext, onMount, mount, unmount } from "svelte";
@@ -679,10 +679,10 @@ function outsideRange(date, range) {
679
679
  }
680
680
  function createResources(input) {
681
681
  let result = [];
682
- _createResources(input, 0, result);
682
+ _createResources(input, 0, false, result);
683
683
  return result;
684
684
  }
685
- function _createResources(input, level, flat) {
685
+ function _createResources(input, level, hidden, flat) {
686
686
  let result = [];
687
687
  for (let item of input) {
688
688
  let resource = createResource(item);
@@ -691,12 +691,11 @@ function _createResources(input, level, flat) {
691
691
  let payload = {
692
692
  level,
693
693
  children: [],
694
- expanded: true,
695
- hidden: false
694
+ hidden
696
695
  };
697
696
  setPayload(resource, payload);
698
697
  if (item.children) {
699
- payload.children = _createResources(item.children, level + 1, flat);
698
+ payload.children = _createResources(item.children, level + 1, hidden || !resource.expanded, flat);
700
699
  }
701
700
  }
702
701
  return result;
@@ -707,6 +706,7 @@ function createResource(input) {
707
706
  title: input.title || "",
708
707
  eventBackgroundColor: eventBackgroundColor(input),
709
708
  eventTextColor: eventTextColor(input),
709
+ expanded: input.expanded ?? true,
710
710
  extendedProps: input.extendedProps ?? {}
711
711
  };
712
712
  }
@@ -851,6 +851,8 @@ function createOptions(plugins) {
851
851
  hiddenDays: [],
852
852
  highlightedDates: [],
853
853
  // ec option
854
+ icons: {},
855
+ // ec option
854
856
  lazyFetching: true,
855
857
  loading: void 0,
856
858
  locale: void 0,
@@ -922,7 +924,7 @@ function createParsers(plugins) {
922
924
  }
923
925
  return parsers;
924
926
  }
925
- const specialOptions = ["buttonText", "customButtons", "theme"];
927
+ const specialOptions = ["buttonText", "customButtons", "icons", "theme"];
926
928
  function optionsState(plugins, userOptions) {
927
929
  let defOptions = createOptions(plugins);
928
930
  let parsers = createParsers(plugins);
@@ -5575,29 +5577,36 @@ function Event($$anchor, $$props) {
5575
5577
  return $.pop($$exports);
5576
5578
  }
5577
5579
  var root_1$2 = $.from_html(`<span></span>`);
5578
- var root_2 = $.from_html(`<button><!></button>`);
5580
+ var root_2 = $.from_html(`<button></button>`);
5579
5581
  var root = $.from_html(`<!> <span><!></span>`, 1);
5580
5582
  function Expander($$anchor, $$props) {
5581
5583
  $.push($$props, true);
5582
- let $$d = $.derived(() => getContext("state")), resources = $.derived(() => $.get($$d).resources), theme = $.derived(() => $.get($$d).options.theme);
5584
+ let resource = $.prop($$props, "resource", 7);
5585
+ let $$d = $.derived(() => getContext("state")), resources = $.derived(() => $.get($$d).resources), view2 = $.derived(() => $.get($$d).view), buttonText = $.derived(() => $.get($$d).options.buttonText), icons = $.derived(() => $.get($$d).options.icons), resourceExpand = $.derived(() => $.get($$d).options.resourceExpand), theme = $.derived(() => $.get($$d).options.theme);
5583
5586
  let payload = $.state({});
5584
- let expanded = $.state(true);
5587
+ let expanded = $.derived(() => resource().expanded);
5588
+ let title = $.derived(() => $.get(buttonText)[$.get(expanded) ? "collapse" : "expand"]);
5585
5589
  $.user_pre_effect(() => {
5586
- $.set(payload, getPayload($$props.resource));
5587
- $.set(expanded, $.get(payload).expanded, true);
5590
+ $.set(payload, getPayload(resource()));
5588
5591
  });
5589
- function onclick() {
5590
- $.set(expanded, !$.get(expanded));
5591
- $.get(payload).expanded = $.get(expanded);
5592
- toggle($.get(payload).children, $.get(expanded));
5592
+ function onclick(jsEvent) {
5593
+ resource().expanded = $.set(expanded, !$.get(expanded));
5594
+ toggle($.get(payload).children);
5593
5595
  $.get(resources).length = $.get(resources).length;
5596
+ if (isFunction($.get(resourceExpand))) {
5597
+ $.get(resourceExpand)({
5598
+ resource: resource(),
5599
+ jsEvent,
5600
+ view: toViewWithLocalDates($.get(view2))
5601
+ });
5602
+ }
5594
5603
  }
5595
- function toggle(children, expand) {
5604
+ function toggle(children) {
5596
5605
  for (let child of children) {
5597
5606
  let payload2 = getPayload(child);
5598
- payload2.hidden = !expand;
5599
- if (payload2.expanded) {
5600
- toggle(payload2.children, expand);
5607
+ payload2.hidden = !$.get(expanded);
5608
+ if (child.expanded) {
5609
+ toggle(payload2.children);
5601
5610
  }
5602
5611
  }
5603
5612
  }
@@ -5611,30 +5620,19 @@ function Expander($$anchor, $$props) {
5611
5620
  var span_1 = $.sibling(node, 2);
5612
5621
  var node_1 = $.child(span_1);
5613
5622
  {
5614
- var consequent_1 = ($$anchor2) => {
5623
+ var consequent = ($$anchor2) => {
5615
5624
  var button = root_2();
5616
5625
  button.__click = onclick;
5617
- var node_2 = $.child(button);
5618
- {
5619
- var consequent = ($$anchor3) => {
5620
- var text = $.text("−");
5621
- $.append($$anchor3, text);
5622
- };
5623
- var alternate = ($$anchor3) => {
5624
- var text_1 = $.text("+");
5625
- $.append($$anchor3, text_1);
5626
- };
5627
- $.if(node_2, ($$render) => {
5628
- if ($.get(expanded)) $$render(consequent);
5629
- else $$render(alternate, false);
5630
- });
5631
- }
5632
- $.reset(button);
5633
- $.template_effect(() => $.set_class(button, 1, $.get(theme).button));
5626
+ $.attach(button, () => contentFrom($.get(icons)[$.get(expanded) ? "collapse" : "expand"]));
5627
+ $.template_effect(() => {
5628
+ $.set_class(button, 1, $.get(theme).button);
5629
+ $.set_attribute(button, "aria-label", $.get(title));
5630
+ $.set_attribute(button, "title", $.get(title));
5631
+ });
5634
5632
  $.append($$anchor2, button);
5635
5633
  };
5636
5634
  $.if(node_1, ($$render) => {
5637
- if ($.get(payload).children?.length) $$render(consequent_1);
5635
+ if ($.get(payload).children?.length) $$render(consequent);
5638
5636
  });
5639
5637
  }
5640
5638
  $.reset(span_1);
@@ -5966,43 +5964,59 @@ const index$1 = {
5966
5964
  createOptions(options) {
5967
5965
  createTRROptions(options);
5968
5966
  createRROptions(options);
5969
- options.slotWidth = 32;
5970
- options.buttonText.resourceTimelineDay = "timeline";
5971
- options.buttonText.resourceTimelineWeek = "timeline";
5972
- options.buttonText.resourceTimelineMonth = "timeline";
5973
- options.theme.expander = "ec-expander";
5974
- options.theme.rowHead = "ec-row-head";
5975
- options.theme.slots = "ec-slots";
5976
- options.view = "resourceTimelineWeek";
5977
- options.views.resourceTimelineDay = {
5978
- buttonText: btnTextDay,
5979
- component: initViewComponent$1,
5980
- displayEventEnd: false,
5981
- dayHeaderFormat: { weekday: "long" },
5982
- duration: { days: 1 },
5983
- theme: themeView("ec-resource ec-timeline ec-day-view"),
5984
- titleFormat: { year: "numeric", month: "long", day: "numeric" }
5985
- };
5986
- options.views.resourceTimelineWeek = {
5987
- buttonText: btnTextWeek,
5988
- component: initViewComponent$1,
5989
- displayEventEnd: false,
5990
- duration: { weeks: 1 },
5991
- theme: themeView("ec-resource ec-timeline ec-week-view")
5992
- };
5993
- options.views.resourceTimelineMonth = {
5994
- buttonText: btnTextMonth,
5995
- component: initMonthViewComponent,
5996
- displayEventEnd: false,
5997
- dayHeaderFormat: {
5998
- weekday: "short",
5999
- day: "numeric"
5967
+ assign(options, {
5968
+ resourceExpand: void 0,
5969
+ slotWidth: 32,
5970
+ // Common options
5971
+ view: "resourceTimelineWeek"
5972
+ });
5973
+ assign(options.buttonText, {
5974
+ expand: "Expand",
5975
+ collapse: "Collapse",
5976
+ resourceTimelineDay: "timeline",
5977
+ resourceTimelineWeek: "timeline",
5978
+ resourceTimelineMonth: "timeline"
5979
+ });
5980
+ assign(options.icons, {
5981
+ collapse: { html: "&minus;" },
5982
+ expand: { html: "&plus;" }
5983
+ });
5984
+ assign(options.theme, {
5985
+ expander: "ec-expander",
5986
+ rowHead: "ec-row-head",
5987
+ slots: "ec-slots"
5988
+ });
5989
+ assign(options.views, {
5990
+ resourceTimelineDay: {
5991
+ buttonText: btnTextDay,
5992
+ component: initViewComponent$1,
5993
+ displayEventEnd: false,
5994
+ dayHeaderFormat: { weekday: "long" },
5995
+ duration: { days: 1 },
5996
+ theme: themeView("ec-resource ec-timeline ec-day-view"),
5997
+ titleFormat: { year: "numeric", month: "long", day: "numeric" }
6000
5998
  },
6001
- duration: { months: 1 },
6002
- slotDuration: { days: 1 },
6003
- theme: themeView("ec-resource ec-timeline ec-month-view"),
6004
- titleFormat: { year: "numeric", month: "long" }
6005
- };
5999
+ resourceTimelineWeek: {
6000
+ buttonText: btnTextWeek,
6001
+ component: initViewComponent$1,
6002
+ displayEventEnd: false,
6003
+ duration: { weeks: 1 },
6004
+ theme: themeView("ec-resource ec-timeline ec-week-view")
6005
+ },
6006
+ resourceTimelineMonth: {
6007
+ buttonText: btnTextMonth,
6008
+ component: initMonthViewComponent,
6009
+ displayEventEnd: false,
6010
+ dayHeaderFormat: {
6011
+ weekday: "short",
6012
+ day: "numeric"
6013
+ },
6014
+ duration: { months: 1 },
6015
+ slotDuration: { days: 1 },
6016
+ theme: themeView("ec-resource ec-timeline ec-month-view"),
6017
+ titleFormat: { year: "numeric", month: "long" }
6018
+ }
6019
+ });
6006
6020
  },
6007
6021
  createParsers(parsers) {
6008
6022
  createTRRParsers(parsers);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@event-calendar/core",
3
- "version": "5.3.3",
3
+ "version": "5.4.0",
4
4
  "title": "Event Calendar Core package",
5
5
  "description": "Full-sized drag & drop event calendar with resource & timeline views",
6
6
  "keywords": [
package/src/lib/resources.js CHANGED
@@ -3,11 +3,11 @@ import {empty} from './utils.js';
3
3
 
4
4
  export function createResources(input) {
5
5
  let result = [];
6
- _createResources(input, 0, result);
6
+ _createResources(input, 0, false, result);
7
7
  return result;
8
8
  }
9
9
 
10
- function _createResources(input, level, flat) {
10
+ function _createResources(input, level, hidden, flat) {
11
11
  let result = [];
12
12
  for (let item of input) {
13
13
  let resource = createResource(item);
@@ -16,12 +16,11 @@ function _createResources(input, level, flat) {
16
16
  let payload = {
17
17
  level,
18
18
  children: [],
19
- expanded: true,
20
- hidden: false
19
+ hidden
21
20
  };
22
21
  setPayload(resource, payload);
23
22
  if (item.children) {
24
- payload.children = _createResources(item.children, level + 1, flat);
23
+ payload.children = _createResources(item.children, level + 1, hidden || !resource.expanded, flat);
25
24
  }
26
25
  }
27
26
  return result;
@@ -33,6 +32,7 @@ export function createResource(input) {
33
32
  title: input.title || '',
34
33
  eventBackgroundColor: eventBackgroundColor(input),
35
34
  eventTextColor: eventTextColor(input),
35
+ expanded: input.expanded ?? true,
36
36
  extendedProps: input.extendedProps ?? {}
37
37
  };
38
38
  }
package/src/plugins/resource-timeline/Expander.svelte CHANGED
@@ -1,32 +1,34 @@
1
1
  <script>
2
2
  import {getContext} from 'svelte';
3
- import {getPayload} from '#lib';
3
+ import {contentFrom, getPayload, isFunction, toViewWithLocalDates} from '#lib';
4
4
 
5
5
  let {resource} = $props();
6
6
 
7
- let {resources, options: {theme}} = $derived(getContext('state'));
7
+ let {resources, view, options: {buttonText, icons, resourceExpand, theme}} = $derived(getContext('state'));
8
8
 
9
9
  let payload = $state.raw({});
10
- let expanded = $state(true);
10
+ let expanded = $derived(resource.expanded);
11
+ let title = $derived(buttonText[expanded ? 'collapse' : 'expand']);
11
12
 
12
13
  $effect.pre(() => {
13
14
  payload = getPayload(resource);
14
- expanded = payload.expanded;
15
15
  });
16
16
 
17
- function onclick() {
18
- expanded = !expanded;
19
- payload.expanded = expanded;
20
- toggle(payload.children, expanded);
17
+ function onclick(jsEvent) {
18
+ resource.expanded = expanded = !expanded;
19
+ toggle(payload.children);
21
20
  resources.length = resources.length;
21
+ if (isFunction(resourceExpand)) {
22
+ resourceExpand({resource, jsEvent, view: toViewWithLocalDates(view)});
23
+ }
22
24
  }
23
25
 
24
- function toggle(children, expand) {
26
+ function toggle(children) {
25
27
  for (let child of children) {
26
28
  let payload = getPayload(child);
27
- payload.hidden = !expand;
28
- if (payload.expanded) {
29
- toggle(payload.children, expand);
29
+ payload.hidden = !expanded;
30
+ if (child.expanded) {
31
+ toggle(payload.children);
30
32
  }
31
33
  }
32
34
  }
@@ -38,8 +40,13 @@
38
40
 
39
41
  <span class="{theme.expander}">
40
42
  {#if payload.children?.length}
41
- <button class="{theme.button}" {onclick}>
42
- {#if expanded}&minus;{:else}&plus;{/if}
43
+ <button
44
+ class="{theme.button}"
45
+ aria-label="{title}"
46
+ title="{title}"
47
+ {onclick}
48
+ {@attach contentFrom(icons[expanded ? 'collapse' : 'expand'])}
49
+ >
43
50
  </button>
44
51
  {/if}
45
52
  </span>
package/src/plugins/resource-timeline/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import {btnTextDay, btnTextMonth, btnTextWeek, getPayload, themeView} from '#lib';
1
+ import {assign, btnTextDay, btnTextMonth, btnTextWeek, getPayload, themeView} from '#lib';
2
2
  import {setExtensions} from '../time-grid/lib.js';
3
3
  import {createTRROptions, createTRRParsers} from '../time-grid/options.js';
4
4
  import {createRROptions} from '../resource-time-grid/options.js';
@@ -8,44 +8,59 @@ export default {
8
8
  createOptions(options) {
9
9
  createTRROptions(options);
10
10
  createRROptions(options);
11
- options.slotWidth = 32;
12
- // Common options
13
- options.buttonText.resourceTimelineDay = 'timeline';
14
- options.buttonText.resourceTimelineWeek = 'timeline';
15
- options.buttonText.resourceTimelineMonth = 'timeline';
16
- options.theme.expander = 'ec-expander';
17
- options.theme.rowHead = 'ec-row-head';
18
- options.theme.slots = 'ec-slots';
19
- options.view = 'resourceTimelineWeek';
20
- options.views.resourceTimelineDay = {
21
- buttonText: btnTextDay,
22
- component: initViewComponent,
23
- displayEventEnd: false,
24
- dayHeaderFormat: {weekday: 'long'},
25
- duration: {days: 1},
26
- theme: themeView('ec-resource ec-timeline ec-day-view'),
27
- titleFormat: {year: 'numeric', month: 'long', day: 'numeric'}
28
- };
29
- options.views.resourceTimelineWeek = {
30
- buttonText: btnTextWeek,
31
- component: initViewComponent,
32
- displayEventEnd: false,
33
- duration: {weeks: 1},
34
- theme: themeView('ec-resource ec-timeline ec-week-view')
35
- };
36
- options.views.resourceTimelineMonth = {
37
- buttonText: btnTextMonth,
38
- component: initMonthViewComponent,
39
- displayEventEnd: false,
40
- dayHeaderFormat: {
41
- weekday: 'short',
42
- day: 'numeric'
11
+ assign(options, {
12
+ resourceExpand: undefined,
13
+ slotWidth: 32,
14
+ // Common options
15
+ view: 'resourceTimelineWeek'
16
+ });
17
+ assign(options.buttonText, {
18
+ expand: 'Expand',
19
+ collapse: 'Collapse',
20
+ resourceTimelineDay: 'timeline',
21
+ resourceTimelineWeek: 'timeline',
22
+ resourceTimelineMonth: 'timeline'
23
+ });
24
+ assign(options.icons, {
25
+ collapse: {html: '&minus;'},
26
+ expand: {html: '&plus;'}
27
+ });
28
+ assign(options.theme, {
29
+ expander: 'ec-expander',
30
+ rowHead: 'ec-row-head',
31
+ slots: 'ec-slots'
32
+ });
33
+ assign(options.views, {
34
+ resourceTimelineDay: {
35
+ buttonText: btnTextDay,
36
+ component: initViewComponent,
37
+ displayEventEnd: false,
38
+ dayHeaderFormat: {weekday: 'long'},
39
+ duration: {days: 1},
40
+ theme: themeView('ec-resource ec-timeline ec-day-view'),
41
+ titleFormat: {year: 'numeric', month: 'long', day: 'numeric'}
43
42
  },
44
- duration: {months: 1},
45
- slotDuration: {days: 1},
46
- theme: themeView('ec-resource ec-timeline ec-month-view'),
47
- titleFormat: {year: 'numeric', month: 'long'}
48
- };
43
+ resourceTimelineWeek: {
44
+ buttonText: btnTextWeek,
45
+ component: initViewComponent,
46
+ displayEventEnd: false,
47
+ duration: {weeks: 1},
48
+ theme: themeView('ec-resource ec-timeline ec-week-view')
49
+ },
50
+ resourceTimelineMonth: {
51
+ buttonText: btnTextMonth,
52
+ component: initMonthViewComponent,
53
+ displayEventEnd: false,
54
+ dayHeaderFormat: {
55
+ weekday: 'short',
56
+ day: 'numeric'
57
+ },
58
+ duration: {months: 1},
59
+ slotDuration: {days: 1},
60
+ theme: themeView('ec-resource ec-timeline ec-month-view'),
61
+ titleFormat: {year: 'numeric', month: 'long'}
62
+ }
63
+ });
49
64
  },
50
65
 
51
66
  createParsers(parsers) {
package/src/storage/options.js CHANGED
@@ -52,6 +52,7 @@ function createOptions(plugins) {
52
52
  height: undefined,
53
53
  hiddenDays: [],
54
54
  highlightedDates: [], // ec option
55
+ icons: {}, // ec option
55
56
  lazyFetching: true,
56
57
  loading: undefined,
57
58
  locale: undefined,
@@ -130,7 +131,7 @@ function createParsers(plugins) {
130
131
  }
131
132
 
132
133
  // Options where default value is passed to the function
133
- const specialOptions = ['buttonText', 'customButtons', 'theme'];
134
+ const specialOptions = ['buttonText', 'customButtons', 'icons', 'theme'];
134
135
 
135
136
  export function optionsState(plugins, userOptions) {
136
137
  // Create default options and parsers