@getmicdrop/venue-calendar 1.0.0 → 1.0.1
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 +14 -14
- package/dist/venue-calendar.es.js +14 -10
- package/dist/venue-calendar.es.js.map +1 -1
- package/dist/venue-calendar.iife.js +1 -1
- package/dist/venue-calendar.iife.js.map +1 -1
- package/dist/venue-calendar.umd.js +1 -1
- package/dist/venue-calendar.umd.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# @
|
|
1
|
+
# @getmicdrop/venue-calendar
|
|
2
2
|
|
|
3
3
|
A beautiful, customizable calendar component built with Svelte for displaying comedy events. Perfect for comedy clubs, venues, and event organizers who want to showcase their upcoming shows.
|
|
4
4
|
|
|
@@ -17,23 +17,23 @@ A beautiful, customizable calendar component built with Svelte for displaying co
|
|
|
17
17
|
### NPM/Yarn
|
|
18
18
|
|
|
19
19
|
```bash
|
|
20
|
-
npm install @
|
|
20
|
+
npm install @getmicdrop/venue-calendar
|
|
21
21
|
```
|
|
22
22
|
|
|
23
23
|
or
|
|
24
24
|
|
|
25
25
|
```bash
|
|
26
|
-
yarn add @
|
|
26
|
+
yarn add @getmicdrop/venue-calendar
|
|
27
27
|
```
|
|
28
28
|
|
|
29
29
|
### CDN (JSDelivr)
|
|
30
30
|
|
|
31
31
|
```html
|
|
32
32
|
<!-- Latest version -->
|
|
33
|
-
<script src="https://cdn.jsdelivr.net/npm/@
|
|
33
|
+
<script src="https://cdn.jsdelivr.net/npm/@getmicdrop/venue-calendar/dist/venue-calendar.iife.js"></script>
|
|
34
34
|
|
|
35
35
|
<!-- Specific version (recommended for production) -->
|
|
36
|
-
<script src="https://cdn.jsdelivr.net/npm/@
|
|
36
|
+
<script src="https://cdn.jsdelivr.net/npm/@getmicdrop/venue-calendar@1.0.0/dist/venue-calendar.iife.js"></script>
|
|
37
37
|
```
|
|
38
38
|
|
|
39
39
|
## Quick Start
|
|
@@ -58,7 +58,7 @@ Simply add a div with the class `micdrop-calendar-container` and the calendar wi
|
|
|
58
58
|
</div>
|
|
59
59
|
|
|
60
60
|
<!-- Load the script -->
|
|
61
|
-
<script src="https://cdn.jsdelivr.net/npm/@
|
|
61
|
+
<script src="https://cdn.jsdelivr.net/npm/@getmicdrop/venue-calendar/dist/venue-calendar.iife.js"></script>
|
|
62
62
|
</body>
|
|
63
63
|
</html>
|
|
64
64
|
```
|
|
@@ -82,7 +82,7 @@ Use the custom `<micdrop-calendar>` element:
|
|
|
82
82
|
show-month-switcher="true">
|
|
83
83
|
</micdrop-calendar>
|
|
84
84
|
|
|
85
|
-
<script src="https://cdn.jsdelivr.net/npm/@
|
|
85
|
+
<script src="https://cdn.jsdelivr.net/npm/@getmicdrop/venue-calendar/dist/venue-calendar.iife.js"></script>
|
|
86
86
|
</body>
|
|
87
87
|
</html>
|
|
88
88
|
```
|
|
@@ -101,7 +101,7 @@ For more control, use the JavaScript API:
|
|
|
101
101
|
<div id="my-calendar"></div>
|
|
102
102
|
|
|
103
103
|
<script type="module">
|
|
104
|
-
import { initVenueCalendar } from 'https://cdn.jsdelivr.net/npm/@
|
|
104
|
+
import { initVenueCalendar } from 'https://cdn.jsdelivr.net/npm/@getmicdrop/venue-calendar/dist/venue-calendar.es.js';
|
|
105
105
|
|
|
106
106
|
initVenueCalendar({
|
|
107
107
|
target: '#my-calendar',
|
|
@@ -122,7 +122,7 @@ For more control, use the JavaScript API:
|
|
|
122
122
|
|
|
123
123
|
```jsx
|
|
124
124
|
import React, { useEffect, useRef } from 'react';
|
|
125
|
-
import { initVenueCalendar } from '@
|
|
125
|
+
import { initVenueCalendar } from '@getmicdrop/venue-calendar';
|
|
126
126
|
|
|
127
127
|
function VenueCalendarComponent({ venueId, view = 'calendar' }) {
|
|
128
128
|
const calendarRef = useRef(null);
|
|
@@ -226,7 +226,7 @@ export default App;
|
|
|
226
226
|
|
|
227
227
|
<script setup>
|
|
228
228
|
import { ref, onMounted, onUnmounted, watch } from 'vue';
|
|
229
|
-
import { initVenueCalendar } from '@
|
|
229
|
+
import { initVenueCalendar } from '@getmicdrop/venue-calendar';
|
|
230
230
|
|
|
231
231
|
const props = defineProps({
|
|
232
232
|
venueId: String,
|
|
@@ -276,7 +276,7 @@ watch(() => props.venueId, (newId) => {
|
|
|
276
276
|
|
|
277
277
|
```svelte
|
|
278
278
|
<script>
|
|
279
|
-
import { VenueCalendar } from '@
|
|
279
|
+
import { VenueCalendar } from '@getmicdrop/venue-calendar';
|
|
280
280
|
import { Calendar, Grid, List } from 'carbon-icons-svelte';
|
|
281
281
|
import { writable } from 'svelte/store';
|
|
282
282
|
|
|
@@ -313,7 +313,7 @@ watch(() => props.venueId, (newId) => {
|
|
|
313
313
|
|
|
314
314
|
```typescript
|
|
315
315
|
import { Component, OnInit, OnDestroy, ElementRef, ViewChild } from '@angular/core';
|
|
316
|
-
import { initVenueCalendar } from '@
|
|
316
|
+
import { initVenueCalendar } from '@getmicdrop/venue-calendar';
|
|
317
317
|
|
|
318
318
|
@Component({
|
|
319
319
|
selector: 'app-venue-calendar',
|
|
@@ -401,7 +401,7 @@ For WordPress sites, you can add this to your page/post HTML:
|
|
|
401
401
|
data-view="calendar">
|
|
402
402
|
</div>
|
|
403
403
|
|
|
404
|
-
<script src="https://cdn.jsdelivr.net/npm/@
|
|
404
|
+
<script src="https://cdn.jsdelivr.net/npm/@getmicdrop/venue-calendar/dist/venue-calendar.iife.js"></script>
|
|
405
405
|
```
|
|
406
406
|
|
|
407
407
|
Or add the script to your theme's footer and use the div anywhere in your content.
|
|
@@ -490,7 +490,7 @@ Automatically mount calendars to all elements with class `micdrop-calendar-conta
|
|
|
490
490
|
|
|
491
491
|
**Example:**
|
|
492
492
|
```javascript
|
|
493
|
-
import { autoMount } from '@
|
|
493
|
+
import { autoMount } from '@getmicdrop/venue-calendar';
|
|
494
494
|
autoMount();
|
|
495
495
|
```
|
|
496
496
|
|
|
@@ -3923,17 +3923,21 @@ function qr(e = {}) {
|
|
|
3923
3923
|
view: n = "calendar",
|
|
3924
3924
|
events: a = [],
|
|
3925
3925
|
showViewOptions: i = !0,
|
|
3926
|
-
showMonthSwitcher: s = !0
|
|
3926
|
+
showMonthSwitcher: s = !0,
|
|
3927
|
+
currentMonth: l = null,
|
|
3928
|
+
currentYear: o = null,
|
|
3929
|
+
handleNext: f = null,
|
|
3930
|
+
handlePrev: v = null
|
|
3927
3931
|
} = e;
|
|
3928
|
-
let
|
|
3929
|
-
if (typeof t == "string" ?
|
|
3932
|
+
let d;
|
|
3933
|
+
if (typeof t == "string" ? d = document.querySelector(t) : t instanceof HTMLElement && (d = t), !d)
|
|
3930
3934
|
return console.error("VenueCalendar: Target element not found"), null;
|
|
3931
3935
|
({
|
|
3932
3936
|
list: 0,
|
|
3933
3937
|
gallery: 1,
|
|
3934
3938
|
calendar: 2
|
|
3935
3939
|
})[n.toLowerCase()];
|
|
3936
|
-
const
|
|
3940
|
+
const _ = i ? [
|
|
3937
3941
|
{
|
|
3938
3942
|
id: 0,
|
|
3939
3943
|
text: "List view",
|
|
@@ -3951,16 +3955,16 @@ function qr(e = {}) {
|
|
|
3951
3955
|
}
|
|
3952
3956
|
] : null;
|
|
3953
3957
|
return new ta({
|
|
3954
|
-
target:
|
|
3958
|
+
target: d,
|
|
3955
3959
|
props: {
|
|
3956
|
-
showViewOptions:
|
|
3960
|
+
showViewOptions: _,
|
|
3957
3961
|
showMonthSwitcher: s,
|
|
3958
3962
|
events: a,
|
|
3959
3963
|
venueId: r,
|
|
3960
|
-
currentMonth:
|
|
3961
|
-
currentYear:
|
|
3962
|
-
handleNext:
|
|
3963
|
-
handlePrev:
|
|
3964
|
+
currentMonth: l,
|
|
3965
|
+
currentYear: o,
|
|
3966
|
+
handleNext: f,
|
|
3967
|
+
handlePrev: v
|
|
3964
3968
|
}
|
|
3965
3969
|
});
|
|
3966
3970
|
}
|