v3.6.0

Fixed some issues in Svelte 5 destroy() is no longer available in Svelte version
vkurko · Oct 1, 2024 · 54316bd · 54316bd
1 parent b3971fb
commit 54316bd
Show file tree

Hide file tree

Showing 22 changed files with 307 additions and 540 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,11 @@
 # Event Calendar changelog
 
+## 3.6.0
+October 1, 2024
+
+* Fixed some issues in Svelte 5 ([235](https://github.com/vkurko/calendar/issues/235))
+* :warning: `destroy()` is no longer available in Svelte version
+
 ## 3.5.0
 September 20, 2024
 

diff --git a/README.md b/README.md
@@ -144,7 +144,7 @@ Inspired by [FullCalendar](https://fullcalendar.io/), implements similar options
 - [Browser support](#browser-support)
 
 ## Usage
-### Svelte component / ES6 module
+### Pure JavaScript / Svelte component
 The first step is to install the Event Calendar `core` package:
 ```bash
 npm install --save-dev @event-calendar/core
@@ -162,27 +162,12 @@ You must use at least one plugin that provides a view. The following plugins are
 * `@event-calendar/time-grid`
 * `@event-calendar/interaction` (doesn't provide a view)
 
-Then, in your Svelte component, use the calendar something like this:
-```html
-<script>
-    import Calendar from '@event-calendar/core';
-    import TimeGrid from '@event-calendar/time-grid';
-
-    let plugins = [TimeGrid];
-    let options = {
-        view: 'timeGridWeek',
-        events: [
-            // your list of events
-        ]
-    };
-</script>
-
-<Calendar {plugins} {options} />
-```
-Or in ES6 module:
+Then, in your JavaScript module:
 ```js
 import Calendar from '@event-calendar/core';
 import TimeGrid from '@event-calendar/time-grid';
+// Import CSS if your build tool supports it
+import '@event-calendar/core/index.css';
 
 let ec = new Calendar({
     target: document.getElementById('ec'),
@@ -197,16 +182,29 @@ let ec = new Calendar({
     }
 });
 ```
-The CSS is located at `@event-calendar/core/index.css`. If your build tool supports CSS processing, you can import it like this:
-```js
-import '@event-calendar/core/index.css';
+Or in your Svelte component, use the calendar like this:
+```html
+<script>
+    import Calendar from '@event-calendar/core';
+    import TimeGrid from '@event-calendar/time-grid';
+
+    let plugins = [TimeGrid];
+    let options = {
+        view: 'timeGridWeek',
+        events: [
+            // your list of events
+        ]
+    };
+</script>
+
+<Calendar {plugins} {options} />
 ```
 
 ### Pre-built browser ready bundle
 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@3.5.0/event-calendar.min.css">
-<script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@3.5.0/event-calendar.min.js"></script>
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@3.6.0/event-calendar.min.css">
+<script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@3.6.0/event-calendar.min.js"></script>
 ```
 
 <details>
@@ -221,7 +219,7 @@ Include the following lines of code in the `<head>` section of your page:
 
 </details>
 
-Then initialize the calendar with something like this:
+Then initialize the calendar like this:
 ```js
 let ec = new EventCalendar(document.getElementById('ec'), {
     view: 'timeGridWeek',
@@ -2394,9 +2392,12 @@ Using this method, you can, for example, find out on which day a click occurred
 
 ### destroy()
 - Return value `undefined`
+- Not available in Svelte
 
 Destroys the calendar, removing all DOM elements, event handlers, and internal data.
 
+Please note that this method is not available in Svelte. Instead, the calendar is destroyed gracefully when the component containing it is destroyed.
+
 ### getView()
 - Return value `View`
 

diff --git a/docs/index.html b/docs/index.html
@@ -12,8 +12,8 @@
     <link rel="manifest" href="site.webmanifest">
     <link rel="stylesheet" href="global.css?20231021">
 
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@3.5.0/event-calendar.min.css">
-    <script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@3.5.0/event-calendar.min.js"></script>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@3.6.0/event-calendar.min.css">
+    <script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@3.6.0/event-calendar.min.js"></script>
     <!-- Yandex.Metrika counter -->
     <script type="text/javascript" >
         (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};