New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@event-calendar/core

Package Overview
Dependencies
Maintainers
1
Versions
105
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@event-calendar/core - npm Package Compare versions

Comparing version 1.5.1 to 2.0.0

2

package.json
{
"name": "@event-calendar/core",
"version": "1.5.1",
"version": "2.0.0",
"title": "Event Calendar Core package",

@@ -5,0 +5,0 @@ "description": "Full-sized drag & drop event calendar with resource view",

127

README.md

@@ -7,3 +7,3 @@ # Event Calendar [![](https://data.jsdelivr.com/v1/package/npm/@event-calendar/build/badge)](https://www.jsdelivr.com/package/npm/@event-calendar/build) [![npm](https://img.shields.io/npm/dm/@event-calendar/core?color=red&label=npm&style=flat-square)](https://www.npmjs.com/package/@event-calendar/core)

* Lightweight (28kb [br](https://en.wikipedia.org/wiki/Brotli) compressed)
* Lightweight (31kb [br](https://en.wikipedia.org/wiki/Brotli) compressed)
* Zero-dependency (pre-built bundle)

@@ -198,4 +198,4 @@ * Used on over 70,000 websites with [Bookly](https://wordpress.org/plugins/bookly-responsive-appointment-booking-tool/)

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@1.5.1/event-calendar.min.css">
<script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@1.5.1/event-calendar.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@event-calendar/build@2.0.0/event-calendar.min.css">
<script src="https://cdn.jsdelivr.net/npm/@event-calendar/build@2.0.0/event-calendar.min.js"></script>
```

@@ -253,3 +253,3 @@

### allDayContent
- Type `string`, `object`or `function`
- Type `Content` or `function`
- Default `'all-day'`

@@ -259,7 +259,7 @@

This value can be either a string containing text `'...'`, an object containing the HTML string `{html: '<p>...</p>'}`, an object containing an array of DOM nodes `{domNodes: [node1, node2, ...]}` or a function that returns any of the above formats:
This value can be either a [Content](#content) or a function that returns content:
```js
function (arg) {
// return string or object
// return Content
}

@@ -468,7 +468,7 @@ ```

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 formatted string:
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 formatted date string
// return Content with the formatted date string
}

@@ -502,4 +502,9 @@ ```

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 formatted string:
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
}
```
### displayEventEnd

@@ -654,3 +659,3 @@ - Type `boolean`

### eventContent
- Type `string`, `object` or `function`
- Type `Content` or `function`
- Default `undefined`

@@ -660,7 +665,7 @@

This value can be either a string containing text `'...'`, an object containing the HTML string `{html: '<p>...</p>'}`, an object containing an array of DOM nodes `{domNodes: [node1, node2, ...]}` or a function that returns any of the above formats:
This value can be either a [Content](#content) or a function that returns content:
```js
function (info) {
// return string or object
// return Content
}

@@ -1309,7 +1314,7 @@ ```

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 formatted string:
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 formatted string:
```js
function (time) {
// return formatted time string
function (start, end) {
// return Content with the formatted time string
}

@@ -1321,6 +1326,13 @@ ```

`time`
`start`
</td>
<td>JavaScript Date object that needs to be formatted</td>
<td>JavaScript Date object containing the beginning of the time span to be formatted</td>
</tr>
<tr>
<td>
`end`
</td>
<td>JavaScript Date object containing the end of the time span to be formatted</td>
</tr>
</table>

@@ -1475,7 +1487,7 @@

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 formatted string:
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 formatted date string
// return Content with the formatted date string
}

@@ -1499,7 +1511,7 @@ ```

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 formatted string:
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 formatted date string
// return Content with the formatted date string
}

@@ -1554,3 +1566,3 @@ ```

### moreLinkContent
- Type `string`, `object`or `function`
- Type `Content` or `function`
- Default `undefined`

@@ -1560,7 +1572,7 @@

This value can be either a string containing text `'...'`, an object containing the HTML string `{html: '<p>...</p>'}`, an object containing an array of DOM nodes `{domNodes: [node1, node2, ...]}` or a function that returns any of the above formats:
This value can be either a [Content](#content) or a function that returns content:
```js
function (arg) {
// return string or object
// return Content
}

@@ -1620,3 +1632,3 @@ ```

### noEventsContent
- Type `string`, `object`or `function`
- Type `Content` or `function`
- Default `'No events'`

@@ -1626,7 +1638,7 @@

This value can be either a string containing text `'...'`, an object containing the HTML string `{html: '<p>...</p>'}`, an object containing an array of DOM nodes `{domNodes: [node1, node2, ...]}` or a function that returns any of the above formats:
This value can be either a [Content](#content) or a function that returns content:
```js
function () {
// return string or object
// return Content
}

@@ -1660,7 +1672,7 @@ ```

This value can be either a string containing text `'...'`, an object containing the HTML string `{html: '<p>...</p>'}`, an object containing an array of DOM nodes `{domNodes: [node1, node2, ...]}` or a function that returns any of the above formats:
This value can be either a [Content](#content) or a function that returns content:
```js
function (info) {
// return string or object
// return Content
}

@@ -1878,7 +1890,7 @@ ```

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 formatted string:
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 (time) {
// return formatted time string
// return Content with the formatted time string
}

@@ -1944,7 +1956,7 @@ ```

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 formatted string:
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 formatted date string
function (start, end) {
// return Content with the formatted date string
}

@@ -1956,8 +1968,25 @@ ```

`date`
`start`
</td>
<td>JavaScript Date object that needs to be formatted</td>
<td>JavaScript Date object containing the beginning of the time span to be formatted</td>
</tr>
<tr>
<td>
`end`
</td>
<td>JavaScript Date object containing the end of the time span to be formatted</td>
</tr>
</table>
The callback function can return HTML markup. If you want to use HTML entities in the title, you must use the callback function:
```js
function (date) {
let month = date.toLocaleDateString('en-US', { month: 'long' })
let year = date.toLocaleDateString('en-US', { year: 'numeric' })
return `<span class="month">${month}</span> <span class="year">${year}</span>`
}
```
### unselect

@@ -2212,2 +2241,9 @@ - Type `function`

## Content
The content can be presented in the following forms:
* a string containing text `'some text'`
* an object containing the HTML string `{html: '<p>some HTML</p>'}`
* an object containing an array of DOM nodes `{domNodes: [node1, node2, ...]}`
## Event object

@@ -2260,10 +2296,5 @@ This is a JavaScript object that the Event Calendar uses to store information about a calendar event.

</td>
<td>The text appearing on the event</td>
</tr>
<tr>
<td>
`titleHTML`
</td>
<td>The HTML version of the title</td>
The text appearing on the event. See [Content](#content)</td>
</tr>

@@ -2416,3 +2447,3 @@ <tr>

`string` The text that will appear on the event. Default `''`
`Content` The text that will appear on the event. See [Content](#content). Default `''`
</td>

@@ -2423,12 +2454,2 @@ </tr>

`titleHTML`
</td>
<td>
`string` The HTML version of the title to be displayed instead of the text version. Default `''`
</td>
</tr>
<tr>
<td>
`editable`

@@ -2435,0 +2456,0 @@ </td>

14

src/lib/actions.js

@@ -1,2 +0,1 @@

import {isObject} from './utils.js';

@@ -6,12 +5,7 @@ export function setContent(node, content) {

update(content) {
while (node.firstChild) {
node.removeChild(node.lastChild);
}
if (!isObject(content)) {
if (typeof content == 'string') {
node.innerText = content;
} else if (content.domNodes) {
for (let child of content.domNodes) {
node.appendChild(child);
}
} else if (content.html) {
} else if (content?.domNodes) {
node.replaceChildren(...content.domNodes);
} else if (content?.html) {
node.innerHTML = content.html;

@@ -18,0 +12,0 @@ }

86

src/lib/date.js

@@ -94,39 +94,2 @@ export const DAY_IN_SECONDS = 86400;

export function formatRange(start, end, intl) {
if (start.getFullYear() !== end.getFullYear()) {
return intl.format(start) + ' - ' + intl.format(end);
}
let diff = [];
if (start.getMonth() !== end.getMonth()) {
diff.push('month');
}
if (start.getDate() !== end.getDate()) {
diff.push('day');
}
if (!diff.length) {
return intl.format(start);
}
let opts1 = intl.resolvedOptions();
let opts2 = {};
for (let key of diff) {
opts2[key] = opts1[key];
}
let intl2 = new Intl.DateTimeFormat(opts1.locale, opts2);
let full1 = intl.format(start);
let full2 = intl.format(end);
let part1 = intl2.format(start);
let part2 = intl2.format(end);
let common = _commonChunks(full1, part1, full2, part2);
if (common) {
return common.head + part1 + ' - ' + part2 + common.tail;
}
return full1 + ' - ' + full2;
}
export function datesEqual(date1, ...dates2) {

@@ -156,2 +119,11 @@ return dates2.every(date2 => date1.getTime() === date2.getTime());

/**
* Copy time from one date to another
*/
export function copyTime(toDate, fromDate) {
toDate.setUTCHours(fromDate.getUTCHours(), fromDate.getUTCMinutes(), fromDate.getUTCSeconds(), 0);
return toDate;
}
/**
* Private functions

@@ -182,41 +154,1 @@ */

}
function _commonChunks(str1, substr1, str2, substr2) {
let i = 0;
while (i < str1.length) {
let res1;
[i, res1] = _cut(str1, substr1, i);
if (!res1) {
break;
}
let j = 0;
while (j < str2.length) {
let res2;
[j, res2] = _cut(str2, substr2, j);
if (!res2) {
break;
}
if (res1.head === res2.head && res1.tail === res2.tail) {
return res1;
}
}
}
return null
}
function _cut(str, substr, from) {
let start = str.indexOf(substr, from);
if (start >= 0) {
let end = start + substr.length;
return [end, {
head: str.substr(0, start),
tail: str.substr(end)
}];
}
return [-1, null];
}

12

src/lib/dom.js
import {symbol} from './utils.js';
export function createElement(tag, className, html, text) {
export function createElement(tag, className, content) {
let el = document.createElement(tag);
el.className = className;
if (html) {
el.innerHTML = html;
} else if (text) {
el.innerText = text;
if (typeof content == 'string') {
el.innerText = content;
} else if (content.domNodes) {
el.replaceChildren(...content.domNodes);
} else if (content.html) {
el.innerHTML = content.html;
}

@@ -11,0 +13,0 @@ return el;

20

src/lib/events.js

@@ -1,2 +0,2 @@

import {addDay, datesEqual, createDate, cloneDate, setMidnight, toLocalDate, noTimePart} from './date';
import {addDay, datesEqual, createDate, cloneDate, setMidnight, toLocalDate, noTimePart, copyTime} from './date';
import {createElement} from './dom';

@@ -134,6 +134,10 @@ import {assign} from './utils';

export function createEventContent(chunk, displayEventEnd, eventContent, theme, _intlEventTime, _view) {
let timeText = _intlEventTime.format(chunk.start), content;
if (displayEventEnd && chunk.event.display !== 'pointer') {
timeText += ` - ${_intlEventTime.format(chunk.end)}`;
}
let timeText = _intlEventTime.formatRange(
chunk.start,
displayEventEnd && chunk.event.display !== 'pointer'
? copyTime(cloneDate(chunk.start), chunk.end) // make Intl.formatRange output only the time part
: chunk.start
);
let content;
if (eventContent) {

@@ -154,3 +158,3 @@ content = is_function(eventContent)

content = {
domNodes: [createElement('div', theme.eventTime, null, timeText)]
domNodes: [createElement('div', theme.eventTime, timeText)]
};

@@ -161,4 +165,4 @@ break;

domNodes: [
...chunk.event.allDay ? [] : [createElement('div', theme.eventTime, null, timeText)],
createElement('div', theme.eventTitle, chunk.event.titleHTML, chunk.event.title)
...chunk.event.allDay ? [] : [createElement('div', theme.eventTime, timeText)],
createElement('div', theme.eventTitle, chunk.event.title)
]

@@ -165,0 +169,0 @@ };

13

src/lib/stores.js
import {derived, writable, get} from 'svelte/store';
import {is_function} from 'svelte/internal';
import {toLocalDate, formatRange} from './date';
import {toLocalDate} from './date';
export function writable2(value, parser, start) {
return {
...writable(parser ? parser(value) : value, start),
...writable(value, start),
parse: parser

@@ -46,10 +46,9 @@ };

return derived([locale, format], ([$locale, $format]) => {
if (is_function($format)) {
return {format: (start, end) => $format(toLocalDate(start), toLocalDate(end))};
}
let intl = new Intl.DateTimeFormat($locale, $format);
let intl = is_function($format)
? {formatRange: $format}
: new Intl.DateTimeFormat($locale, $format);
return {
format: (start, end) => formatRange(toLocalDate(start), toLocalDate(end), intl)
formatRange: (start, end) => intl.formatRange(toLocalDate(start), toLocalDate(end))
};
});
}

8

src/lib/utils.js

@@ -5,2 +5,6 @@ export function assign(...args) {

export function keys(object) {
return Object.keys(object);
}
export function floor(value) {

@@ -18,8 +22,4 @@ return Math.floor(value);

export function isObject(test) {
return typeof test === 'object' && test !== null;
}
export function symbol() {
return Symbol('ec');
}

37

src/storage/state.js

@@ -15,3 +15,3 @@ import {writable} from 'svelte/store';

} from './stores';
import {assign, writable2, intl, intlRange} from '../lib.js';
import {assign, keys, writable2, intl, intlRange} from '../lib.js';

@@ -23,5 +23,9 @@ export default class {

// Create options
let options = createOptions(plugins);
let options= createOptions(plugins);
let parsers = createParsers(options, plugins);
// Parse options
options = parseOpts(options, parsers);
input = parseOpts(input, parsers);
// Create stores for options

@@ -42,6 +46,6 @@ for (let [option, value] of Object.entries(options)) {

this._today = today(this);
this._intlEventTime = intl(this.locale, this.eventTimeFormat);
this._intlEventTime = intlRange(this.locale, this.eventTimeFormat);
this._intlSlotLabel = intl(this.locale, this.slotLabelFormat);
this._intlDayHeader = intl(this.locale, this.dayHeaderFormat);
this._titleIntlRange = intlRange(this.locale, this.titleFormat);
this._intlTitle = intlRange(this.locale, this.titleFormat);
this._bodyEl = writable(undefined);

@@ -74,9 +78,5 @@ this._scrollable = writable(false);

// Set options for each view
let commonOpts = assign({}, options, input);
parseOpts(commonOpts, this);
let views = new Set([...Object.keys(options.views), ...Object.keys(input.views || {})]);
let views = new Set([...keys(options.views), ...keys(input.views ?? {})]);
for (let view of views) {
let viewOpts = assign({}, options.views[view] ?? {}, input.views?.[view] ?? {});
parseOpts(viewOpts, this);
let opts = assign({}, commonOpts, viewOpts);
let opts = assign({}, options, options.views[view] ?? {}, input, input.views?.[view] ?? {});
// Change view component when view changes

@@ -92,3 +92,3 @@ this.view.subscribe(newView => {

// Process options
for (let key of Object.keys(opts)) {
for (let key of keys(opts)) {
if (this.hasOwnProperty(key) && key[0] !== '_') {

@@ -121,10 +121,13 @@ let {set, _set, ...rest} = this[key];

function parseOpts(opts, state) {
for (let key of Object.keys(opts)) {
if (state.hasOwnProperty(key) && key[0] !== '_') {
if (state[key].parse) {
opts[key] = state[key].parse(opts[key]);
}
function parseOpts(opts, parsers) {
let result = {};
for (let key of keys(opts)) {
result[key] = parsers[key] ? parsers[key](opts[key]) : opts[key];
}
if (opts.views) {
for (let view of keys(opts.views)) {
result.views[view] = parseOpts(opts.views[view], parsers);
}
}
return result;
}

8

src/storage/stores.js

@@ -96,7 +96,7 @@ import {derived, writable, readable} from 'svelte/store';

return derived(
[state.date, state._activeRange, state._titleIntlRange, state._monthMode],
([$date, $_activeRange, $_titleIntlRange, $_monthMode]) => {
[state.date, state._activeRange, state._intlTitle, state._monthMode],
([$date, $_activeRange, $_intlTitle, $_monthMode]) => {
return $_monthMode
? $_titleIntlRange.format($date, $date)
: $_titleIntlRange.format($_activeRange.start, subtractDay(cloneDate($_activeRange.end)));
? $_intlTitle.formatRange($date, $date)
: $_intlTitle.formatRange($_activeRange.start, subtractDay(cloneDate($_activeRange.end)));
}

@@ -103,0 +103,0 @@ );

index.js

Sorry, the diff of this file is too big to display

src/Buttons.svelte

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc