@vonage/vivid 3.0.0 → 3.1.0

package/calendar/index.js

@@ -1,1522 +1,8 @@
-import '../elevation/index.js';
-import { e as emptyArray, O as Observable, S as SubscriberSet, D as DOM, H as HTMLDirective, f as HTMLView, F as FoundationElement, _ as __decorate, a as attr, b as __metadata, h as html, d as designSystem } from '../shared/index.js';
-import { s as styleInject } from '../shared/style-inject.es.js';
-import '../shared/web.dom-collections.iterator.js';
+import { r as registerCalendar } from '../shared/definition12.js';
+import '../shared/index.js';
+import '../shared/calendar-event.js';
 import '../shared/es.object.assign.js';
-import { b as _has, _ as _curry1, a as _curry2 } from '../shared/_has.js';
-import '../shared/class-names.js';
-import '../shared/object-set-prototype-of.js';
+import '../shared/_has.js';
+import '../shared/repeat.js';
 
-/** @internal */
-function newSplice(index, removed, addedCount) {
-    return {
-        index: index,
-        removed: removed,
-        addedCount: addedCount,
-    };
-}
-const EDIT_LEAVE = 0;
-const EDIT_UPDATE = 1;
-const EDIT_ADD = 2;
-const EDIT_DELETE = 3;
-// Note: This function is *based* on the computation of the Levenshtein
-// "edit" distance. The one change is that "updates" are treated as two
-// edits - not one. With Array splices, an update is really a delete
-// followed by an add. By retaining this, we optimize for "keeping" the
-// maximum array items in the original array. For example:
-//
-//   'xxxx123' -> '123yyyy'
-//
-// With 1-edit updates, the shortest path would be just to update all seven
-// characters. With 2-edit updates, we delete 4, leave 3, and add 4. This
-// leaves the substring '123' intact.
-function calcEditDistances(current, currentStart, currentEnd, old, oldStart, oldEnd) {
-    // "Deletion" columns
-    const rowCount = oldEnd - oldStart + 1;
-    const columnCount = currentEnd - currentStart + 1;
-    const distances = new Array(rowCount);
-    let north;
-    let west;
-    // "Addition" rows. Initialize null column.
-    for (let i = 0; i < rowCount; ++i) {
-        distances[i] = new Array(columnCount);
-        distances[i][0] = i;
-    }
-    // Initialize null row
-    for (let j = 0; j < columnCount; ++j) {
-        distances[0][j] = j;
-    }
-    for (let i = 1; i < rowCount; ++i) {
-        for (let j = 1; j < columnCount; ++j) {
-            if (current[currentStart + j - 1] === old[oldStart + i - 1]) {
-                distances[i][j] = distances[i - 1][j - 1];
-            }
-            else {
-                north = distances[i - 1][j] + 1;
-                west = distances[i][j - 1] + 1;
-                distances[i][j] = north < west ? north : west;
-            }
-        }
-    }
-    return distances;
-}
-// This starts at the final weight, and walks "backward" by finding
-// the minimum previous weight recursively until the origin of the weight
-// matrix.
-function spliceOperationsFromEditDistances(distances) {
-    let i = distances.length - 1;
-    let j = distances[0].length - 1;
-    let current = distances[i][j];
-    const edits = [];
-    while (i > 0 || j > 0) {
-        if (i === 0) {
-            edits.push(EDIT_ADD);
-            j--;
-            continue;
-        }
-        if (j === 0) {
-            edits.push(EDIT_DELETE);
-            i--;
-            continue;
-        }
-        const northWest = distances[i - 1][j - 1];
-        const west = distances[i - 1][j];
-        const north = distances[i][j - 1];
-        let min;
-        if (west < north) {
-            min = west < northWest ? west : northWest;
-        }
-        else {
-            min = north < northWest ? north : northWest;
-        }
-        if (min === northWest) {
-            if (northWest === current) {
-                edits.push(EDIT_LEAVE);
-            }
-            else {
-                edits.push(EDIT_UPDATE);
-                current = northWest;
-            }
-            i--;
-            j--;
-        }
-        else if (min === west) {
-            edits.push(EDIT_DELETE);
-            i--;
-            current = west;
-        }
-        else {
-            edits.push(EDIT_ADD);
-            j--;
-            current = north;
-        }
-    }
-    edits.reverse();
-    return edits;
-}
-function sharedPrefix(current, old, searchLength) {
-    for (let i = 0; i < searchLength; ++i) {
-        if (current[i] !== old[i]) {
-            return i;
-        }
-    }
-    return searchLength;
-}
-function sharedSuffix(current, old, searchLength) {
-    let index1 = current.length;
-    let index2 = old.length;
-    let count = 0;
-    while (count < searchLength && current[--index1] === old[--index2]) {
-        count++;
-    }
-    return count;
-}
-function intersect(start1, end1, start2, end2) {
-    // Disjoint
-    if (end1 < start2 || end2 < start1) {
-        return -1;
-    }
-    // Adjacent
-    if (end1 === start2 || end2 === start1) {
-        return 0;
-    }
-    // Non-zero intersect, span1 first
-    if (start1 < start2) {
-        if (end1 < end2) {
-            return end1 - start2; // Overlap
-        }
-        return end2 - start2; // Contained
-    }
-    // Non-zero intersect, span2 first
-    if (end2 < end1) {
-        return end2 - start1; // Overlap
-    }
-    return end1 - start1; // Contained
-}
-/**
- * Splice Projection functions:
- *
- * A splice map is a representation of how a previous array of items
- * was transformed into a new array of items. Conceptually it is a list of
- * tuples of
- *
- *   <index, removed, addedCount>
- *
- * which are kept in ascending index order of. The tuple represents that at
- * the |index|, |removed| sequence of items were removed, and counting forward
- * from |index|, |addedCount| items were added.
- */
-/**
- * @internal
- * @remarks
- * Lacking individual splice mutation information, the minimal set of
- * splices can be synthesized given the previous state and final state of an
- * array. The basic approach is to calculate the edit distance matrix and
- * choose the shortest path through it.
- *
- * Complexity: O(l * p)
- *   l: The length of the current array
- *   p: The length of the old array
- */
-function calcSplices(current, currentStart, currentEnd, old, oldStart, oldEnd) {
-    let prefixCount = 0;
-    let suffixCount = 0;
-    const minLength = Math.min(currentEnd - currentStart, oldEnd - oldStart);
-    if (currentStart === 0 && oldStart === 0) {
-        prefixCount = sharedPrefix(current, old, minLength);
-    }
-    if (currentEnd === current.length && oldEnd === old.length) {
-        suffixCount = sharedSuffix(current, old, minLength - prefixCount);
-    }
-    currentStart += prefixCount;
-    oldStart += prefixCount;
-    currentEnd -= suffixCount;
-    oldEnd -= suffixCount;
-    if (currentEnd - currentStart === 0 && oldEnd - oldStart === 0) {
-        return emptyArray;
-    }
-    if (currentStart === currentEnd) {
-        const splice = newSplice(currentStart, [], 0);
-        while (oldStart < oldEnd) {
-            splice.removed.push(old[oldStart++]);
-        }
-        return [splice];
-    }
-    else if (oldStart === oldEnd) {
-        return [newSplice(currentStart, [], currentEnd - currentStart)];
-    }
-    const ops = spliceOperationsFromEditDistances(calcEditDistances(current, currentStart, currentEnd, old, oldStart, oldEnd));
-    const splices = [];
-    let splice = void 0;
-    let index = currentStart;
-    let oldIndex = oldStart;
-    for (let i = 0; i < ops.length; ++i) {
-        switch (ops[i]) {
-            case EDIT_LEAVE:
-                if (splice !== void 0) {
-                    splices.push(splice);
-                    splice = void 0;
-                }
-                index++;
-                oldIndex++;
-                break;
-            case EDIT_UPDATE:
-                if (splice === void 0) {
-                    splice = newSplice(index, [], 0);
-                }
-                splice.addedCount++;
-                index++;
-                splice.removed.push(old[oldIndex]);
-                oldIndex++;
-                break;
-            case EDIT_ADD:
-                if (splice === void 0) {
-                    splice = newSplice(index, [], 0);
-                }
-                splice.addedCount++;
-                index++;
-                break;
-            case EDIT_DELETE:
-                if (splice === void 0) {
-                    splice = newSplice(index, [], 0);
-                }
-                splice.removed.push(old[oldIndex]);
-                oldIndex++;
-                break;
-            // no default
-        }
-    }
-    if (splice !== void 0) {
-        splices.push(splice);
-    }
-    return splices;
-}
-const $push = Array.prototype.push;
-function mergeSplice(splices, index, removed, addedCount) {
-    const splice = newSplice(index, removed, addedCount);
-    let inserted = false;
-    let insertionOffset = 0;
-    for (let i = 0; i < splices.length; i++) {
-        const current = splices[i];
-        current.index += insertionOffset;
-        if (inserted) {
-            continue;
-        }
-        const intersectCount = intersect(splice.index, splice.index + splice.removed.length, current.index, current.index + current.addedCount);
-        if (intersectCount >= 0) {
-            // Merge the two splices
-            splices.splice(i, 1);
-            i--;
-            insertionOffset -= current.addedCount - current.removed.length;
-            splice.addedCount += current.addedCount - intersectCount;
-            const deleteCount = splice.removed.length + current.removed.length - intersectCount;
-            if (!splice.addedCount && !deleteCount) {
-                // merged splice is a noop. discard.
-                inserted = true;
-            }
-            else {
-                let currentRemoved = current.removed;
-                if (splice.index < current.index) {
-                    // some prefix of splice.removed is prepended to current.removed.
-                    const prepend = splice.removed.slice(0, current.index - splice.index);
-                    $push.apply(prepend, currentRemoved);
-                    currentRemoved = prepend;
-                }
-                if (splice.index + splice.removed.length >
-                    current.index + current.addedCount) {
-                    // some suffix of splice.removed is appended to current.removed.
-                    const append = splice.removed.slice(current.index + current.addedCount - splice.index);
-                    $push.apply(currentRemoved, append);
-                }
-                splice.removed = currentRemoved;
-                if (current.index < splice.index) {
-                    splice.index = current.index;
-                }
-            }
-        }
-        else if (splice.index < current.index) {
-            // Insert splice here.
-            inserted = true;
-            splices.splice(i, 0, splice);
-            i++;
-            const offset = splice.addedCount - splice.removed.length;
-            current.index += offset;
-            insertionOffset += offset;
-        }
-    }
-    if (!inserted) {
-        splices.push(splice);
-    }
-}
-function createInitialSplices(changeRecords) {
-    const splices = [];
-    for (let i = 0, ii = changeRecords.length; i < ii; i++) {
-        const record = changeRecords[i];
-        mergeSplice(splices, record.index, record.removed, record.addedCount);
-    }
-    return splices;
-}
-/** @internal */
-function projectArraySplices(array, changeRecords) {
-    let splices = [];
-    const initialSplices = createInitialSplices(changeRecords);
-    for (let i = 0, ii = initialSplices.length; i < ii; ++i) {
-        const splice = initialSplices[i];
-        if (splice.addedCount === 1 && splice.removed.length === 1) {
-            if (splice.removed[0] !== array[splice.index]) {
-                splices.push(splice);
-            }
-            continue;
-        }
-        splices = splices.concat(calcSplices(array, splice.index, splice.index + splice.addedCount, splice.removed, 0, splice.removed.length));
-    }
-    return splices;
-}
-
-let arrayObservationEnabled = false;
-function adjustIndex(changeRecord, array) {
-    let index = changeRecord.index;
-    const arrayLength = array.length;
-    if (index > arrayLength) {
-        index = arrayLength - changeRecord.addedCount;
-    }
-    else if (index < 0) {
-        index =
-            arrayLength + changeRecord.removed.length + index - changeRecord.addedCount;
-    }
-    if (index < 0) {
-        index = 0;
-    }
-    changeRecord.index = index;
-    return changeRecord;
-}
-class ArrayObserver extends SubscriberSet {
-    constructor(source) {
-        super(source);
-        this.oldCollection = void 0;
-        this.splices = void 0;
-        this.needsQueue = true;
-        this.call = this.flush;
-        Reflect.defineProperty(source, "$fastController", {
-            value: this,
-            enumerable: false,
-        });
-    }
-    addSplice(splice) {
-        if (this.splices === void 0) {
-            this.splices = [splice];
-        }
-        else {
-            this.splices.push(splice);
-        }
-        if (this.needsQueue) {
-            this.needsQueue = false;
-            DOM.queueUpdate(this);
-        }
-    }
-    reset(oldCollection) {
-        this.oldCollection = oldCollection;
-        if (this.needsQueue) {
-            this.needsQueue = false;
-            DOM.queueUpdate(this);
-        }
-    }
-    flush() {
-        const splices = this.splices;
-        const oldCollection = this.oldCollection;
-        if (splices === void 0 && oldCollection === void 0) {
-            return;
-        }
-        this.needsQueue = true;
-        this.splices = void 0;
-        this.oldCollection = void 0;
-        const finalSplices = oldCollection === void 0
-            ? projectArraySplices(this.source, splices)
-            : calcSplices(this.source, 0, this.source.length, oldCollection, 0, oldCollection.length);
-        this.notify(finalSplices);
-    }
-}
-/* eslint-disable prefer-rest-params */
-/* eslint-disable @typescript-eslint/explicit-function-return-type */
-/**
- * Enables the array observation mechanism.
- * @remarks
- * Array observation is enabled automatically when using the
- * {@link RepeatDirective}, so calling this API manually is
- * not typically necessary.
- * @public
- */
-function enableArrayObservation() {
-    if (arrayObservationEnabled) {
-        return;
-    }
-    arrayObservationEnabled = true;
-    Observable.setArrayObserverFactory((collection) => {
-        return new ArrayObserver(collection);
-    });
-    const proto = Array.prototype;
-    // Don't patch Array if it has already been patched
-    // by another copy of fast-element.
-    if (proto.$fastPatch) {
-        return;
-    }
-    Reflect.defineProperty(proto, "$fastPatch", {
-        value: 1,
-        enumerable: false,
-    });
-    const pop = proto.pop;
-    const push = proto.push;
-    const reverse = proto.reverse;
-    const shift = proto.shift;
-    const sort = proto.sort;
-    const splice = proto.splice;
-    const unshift = proto.unshift;
-    proto.pop = function () {
-        const notEmpty = this.length > 0;
-        const methodCallResult = pop.apply(this, arguments);
-        const o = this.$fastController;
-        if (o !== void 0 && notEmpty) {
-            o.addSplice(newSplice(this.length, [methodCallResult], 0));
-        }
-        return methodCallResult;
-    };
-    proto.push = function () {
-        const methodCallResult = push.apply(this, arguments);
-        const o = this.$fastController;
-        if (o !== void 0) {
-            o.addSplice(adjustIndex(newSplice(this.length - arguments.length, [], arguments.length), this));
-        }
-        return methodCallResult;
-    };
-    proto.reverse = function () {
-        let oldArray;
-        const o = this.$fastController;
-        if (o !== void 0) {
-            o.flush();
-            oldArray = this.slice();
-        }
-        const methodCallResult = reverse.apply(this, arguments);
-        if (o !== void 0) {
-            o.reset(oldArray);
-        }
-        return methodCallResult;
-    };
-    proto.shift = function () {
-        const notEmpty = this.length > 0;
-        const methodCallResult = shift.apply(this, arguments);
-        const o = this.$fastController;
-        if (o !== void 0 && notEmpty) {
-            o.addSplice(newSplice(0, [methodCallResult], 0));
-        }
-        return methodCallResult;
-    };
-    proto.sort = function () {
-        let oldArray;
-        const o = this.$fastController;
-        if (o !== void 0) {
-            o.flush();
-            oldArray = this.slice();
-        }
-        const methodCallResult = sort.apply(this, arguments);
-        if (o !== void 0) {
-            o.reset(oldArray);
-        }
-        return methodCallResult;
-    };
-    proto.splice = function () {
-        const methodCallResult = splice.apply(this, arguments);
-        const o = this.$fastController;
-        if (o !== void 0) {
-            o.addSplice(adjustIndex(newSplice(+arguments[0], methodCallResult, arguments.length > 2 ? arguments.length - 2 : 0), this));
-        }
-        return methodCallResult;
-    };
-    proto.unshift = function () {
-        const methodCallResult = unshift.apply(this, arguments);
-        const o = this.$fastController;
-        if (o !== void 0) {
-            o.addSplice(adjustIndex(newSplice(0, [], arguments.length), this));
-        }
-        return methodCallResult;
-    };
-}
-/* eslint-enable prefer-rest-params */
-/* eslint-enable @typescript-eslint/explicit-function-return-type */
-
-const defaultRepeatOptions = Object.freeze({
-    positioning: false,
-    recycle: true,
-});
-function bindWithoutPositioning(view, items, index, context) {
-    view.bind(items[index], context);
-}
-function bindWithPositioning(view, items, index, context) {
-    const childContext = Object.create(context);
-    childContext.index = index;
-    childContext.length = items.length;
-    view.bind(items[index], childContext);
-}
-/**
- * A behavior that renders a template for each item in an array.
- * @public
- */
-class RepeatBehavior {
-    /**
-     * Creates an instance of RepeatBehavior.
-     * @param location - The location in the DOM to render the repeat.
-     * @param itemsBinding - The array to render.
-     * @param isItemsBindingVolatile - Indicates whether the items binding has volatile dependencies.
-     * @param templateBinding - The template to render for each item.
-     * @param isTemplateBindingVolatile - Indicates whether the template binding has volatile dependencies.
-     * @param options - Options used to turn on special repeat features.
-     */
-    constructor(location, itemsBinding, isItemsBindingVolatile, templateBinding, isTemplateBindingVolatile, options) {
-        this.location = location;
-        this.itemsBinding = itemsBinding;
-        this.templateBinding = templateBinding;
-        this.options = options;
-        this.source = null;
-        this.views = [];
-        this.items = null;
-        this.itemsObserver = null;
-        this.originalContext = void 0;
-        this.childContext = void 0;
-        this.bindView = bindWithoutPositioning;
-        this.itemsBindingObserver = Observable.binding(itemsBinding, this, isItemsBindingVolatile);
-        this.templateBindingObserver = Observable.binding(templateBinding, this, isTemplateBindingVolatile);
-        if (options.positioning) {
-            this.bindView = bindWithPositioning;
-        }
-    }
-    /**
-     * Bind this behavior to the source.
-     * @param source - The source to bind to.
-     * @param context - The execution context that the binding is operating within.
-     */
-    bind(source, context) {
-        this.source = source;
-        this.originalContext = context;
-        this.childContext = Object.create(context);
-        this.childContext.parent = source;
-        this.childContext.parentContext = this.originalContext;
-        this.items = this.itemsBindingObserver.observe(source, this.originalContext);
-        this.template = this.templateBindingObserver.observe(source, this.originalContext);
-        this.observeItems(true);
-        this.refreshAllViews();
-    }
-    /**
-     * Unbinds this behavior from the source.
-     * @param source - The source to unbind from.
-     */
-    unbind() {
-        this.source = null;
-        this.items = null;
-        if (this.itemsObserver !== null) {
-            this.itemsObserver.unsubscribe(this);
-        }
-        this.unbindAllViews();
-        this.itemsBindingObserver.disconnect();
-        this.templateBindingObserver.disconnect();
-    }
-    /** @internal */
-    handleChange(source, args) {
-        if (source === this.itemsBinding) {
-            this.items = this.itemsBindingObserver.observe(this.source, this.originalContext);
-            this.observeItems();
-            this.refreshAllViews();
-        }
-        else if (source === this.templateBinding) {
-            this.template = this.templateBindingObserver.observe(this.source, this.originalContext);
-            this.refreshAllViews(true);
-        }
-        else {
-            this.updateViews(args);
-        }
-    }
-    observeItems(force = false) {
-        if (!this.items) {
-            this.items = emptyArray;
-            return;
-        }
-        const oldObserver = this.itemsObserver;
-        const newObserver = (this.itemsObserver = Observable.getNotifier(this.items));
-        const hasNewObserver = oldObserver !== newObserver;
-        if (hasNewObserver && oldObserver !== null) {
-            oldObserver.unsubscribe(this);
-        }
-        if (hasNewObserver || force) {
-            newObserver.subscribe(this);
-        }
-    }
-    updateViews(splices) {
-        const childContext = this.childContext;
-        const views = this.views;
-        const totalRemoved = [];
-        const bindView = this.bindView;
-        let removeDelta = 0;
-        for (let i = 0, ii = splices.length; i < ii; ++i) {
-            const splice = splices[i];
-            const removed = splice.removed;
-            totalRemoved.push(...views.splice(splice.index + removeDelta, removed.length));
-            removeDelta -= splice.addedCount;
-        }
-        const items = this.items;
-        const template = this.template;
-        for (let i = 0, ii = splices.length; i < ii; ++i) {
-            const splice = splices[i];
-            let addIndex = splice.index;
-            const end = addIndex + splice.addedCount;
-            for (; addIndex < end; ++addIndex) {
-                const neighbor = views[addIndex];
-                const location = neighbor ? neighbor.firstChild : this.location;
-                const view = this.options.recycle && totalRemoved.length > 0
-                    ? totalRemoved.shift()
-                    : template.create();
-                views.splice(addIndex, 0, view);
-                bindView(view, items, addIndex, childContext);
-                view.insertBefore(location);
-            }
-        }
-        for (let i = 0, ii = totalRemoved.length; i < ii; ++i) {
-            totalRemoved[i].dispose();
-        }
-        if (this.options.positioning) {
-            for (let i = 0, ii = views.length; i < ii; ++i) {
-                const currentContext = views[i].context;
-                currentContext.length = ii;
-                currentContext.index = i;
-            }
-        }
-    }
-    refreshAllViews(templateChanged = false) {
-        const items = this.items;
-        const childContext = this.childContext;
-        const template = this.template;
-        const location = this.location;
-        const bindView = this.bindView;
-        let itemsLength = items.length;
-        let views = this.views;
-        let viewsLength = views.length;
-        if (itemsLength === 0 || templateChanged) {
-            // all views need to be removed
-            HTMLView.disposeContiguousBatch(views);
-            viewsLength = 0;
-        }
-        if (viewsLength === 0) {
-            // all views need to be created
-            this.views = views = new Array(itemsLength);
-            for (let i = 0; i < itemsLength; ++i) {
-                const view = template.create();
-                bindView(view, items, i, childContext);
-                views[i] = view;
-                view.insertBefore(location);
-            }
-        }
-        else {
-            // attempt to reuse existing views with new data
-            let i = 0;
-            for (; i < itemsLength; ++i) {
-                if (i < viewsLength) {
-                    const view = views[i];
-                    bindView(view, items, i, childContext);
-                }
-                else {
-                    const view = template.create();
-                    bindView(view, items, i, childContext);
-                    views.push(view);
-                    view.insertBefore(location);
-                }
-            }
-            const removed = views.splice(i, viewsLength - i);
-            for (i = 0, itemsLength = removed.length; i < itemsLength; ++i) {
-                removed[i].dispose();
-            }
-        }
-    }
-    unbindAllViews() {
-        const views = this.views;
-        for (let i = 0, ii = views.length; i < ii; ++i) {
-            views[i].unbind();
-        }
-    }
-}
-/**
- * A directive that configures list rendering.
- * @public
- */
-class RepeatDirective extends HTMLDirective {
-    /**
-     * Creates an instance of RepeatDirective.
-     * @param itemsBinding - The binding that provides the array to render.
-     * @param templateBinding - The template binding used to obtain a template to render for each item in the array.
-     * @param options - Options used to turn on special repeat features.
-     */
-    constructor(itemsBinding, templateBinding, options) {
-        super();
-        this.itemsBinding = itemsBinding;
-        this.templateBinding = templateBinding;
-        this.options = options;
-        /**
-         * Creates a placeholder string based on the directive's index within the template.
-         * @param index - The index of the directive within the template.
-         */
-        this.createPlaceholder = DOM.createBlockPlaceholder;
-        enableArrayObservation();
-        this.isItemsBindingVolatile = Observable.isVolatileBinding(itemsBinding);
-        this.isTemplateBindingVolatile = Observable.isVolatileBinding(templateBinding);
-    }
-    /**
-     * Creates a behavior for the provided target node.
-     * @param target - The node instance to create the behavior for.
-     */
-    createBehavior(target) {
-        return new RepeatBehavior(target, this.itemsBinding, this.isItemsBindingVolatile, this.templateBinding, this.isTemplateBindingVolatile, this.options);
-    }
-}
-/**
- * A directive that enables list rendering.
- * @param itemsBinding - The array to render.
- * @param templateOrTemplateBinding - The template or a template binding used obtain a template
- * to render for each item in the array.
- * @param options - Options used to turn on special repeat features.
- * @public
- */
-function repeat(itemsBinding, templateOrTemplateBinding, options = defaultRepeatOptions) {
-    const templateBinding = typeof templateOrTemplateBinding === "function"
-        ? templateOrTemplateBinding
-        : () => templateOrTemplateBinding;
-    return new RepeatDirective(itemsBinding, templateBinding, options);
-}
-
-/**
- * Tests whether or not an object is an array.
- *
- * @private
- * @param {*} val The object to test.
- * @return {Boolean} `true` if `val` is an array, `false` otherwise.
- * @example
- *
- *      _isArray([]); //=> true
- *      _isArray(null); //=> false
- *      _isArray({}); //=> false
- */
-var _isArray = Array.isArray || function _isArray(val) {
-  return val != null && val.length >= 0 && Object.prototype.toString.call(val) === '[object Array]';
-};
-
-function _isString(x) {
-  return Object.prototype.toString.call(x) === '[object String]';
-}
-
-var toString = Object.prototype.toString;
-
-var _isArguments =
-/*#__PURE__*/
-function () {
-  return toString.call(arguments) === '[object Arguments]' ? function _isArguments(x) {
-    return toString.call(x) === '[object Arguments]';
-  } : function _isArguments(x) {
-    return _has('callee', x);
-  };
-}();
-
-var _isArguments$1 = _isArguments;
-
-var hasEnumBug = !
-/*#__PURE__*/
-{
-  toString: null
-}.propertyIsEnumerable('toString');
-var nonEnumerableProps = ['constructor', 'valueOf', 'isPrototypeOf', 'toString', 'propertyIsEnumerable', 'hasOwnProperty', 'toLocaleString']; // Safari bug
-
-var hasArgsEnumBug =
-/*#__PURE__*/
-function () {
-
-  return arguments.propertyIsEnumerable('length');
-}();
-
-var contains = function contains(list, item) {
-  var idx = 0;
-
-  while (idx < list.length) {
-    if (list[idx] === item) {
-      return true;
-    }
-
-    idx += 1;
-  }
-
-  return false;
-};
-/**
- * Returns a list containing the names of all the enumerable own properties of
- * the supplied object.
- * Note that the order of the output array is not guaranteed to be consistent
- * across different JS platforms.
- *
- * @func
- * @memberOf R
- * @since v0.1.0
- * @category Object
- * @sig {k: v} -> [k]
- * @param {Object} obj The object to extract properties from
- * @return {Array} An array of the object's own properties.
- * @see R.keysIn, R.values
- * @example
- *
- *      R.keys({a: 1, b: 2, c: 3}); //=> ['a', 'b', 'c']
- */
-
-
-var keys = typeof Object.keys === 'function' && !hasArgsEnumBug ?
-/*#__PURE__*/
-_curry1(function keys(obj) {
-  return Object(obj) !== obj ? [] : Object.keys(obj);
-}) :
-/*#__PURE__*/
-_curry1(function keys(obj) {
-  if (Object(obj) !== obj) {
-    return [];
-  }
-
-  var prop, nIdx;
-  var ks = [];
-
-  var checkArgsLength = hasArgsEnumBug && _isArguments$1(obj);
-
-  for (prop in obj) {
-    if (_has(prop, obj) && (!checkArgsLength || prop !== 'length')) {
-      ks[ks.length] = prop;
-    }
-  }
-
-  if (hasEnumBug) {
-    nIdx = nonEnumerableProps.length - 1;
-
-    while (nIdx >= 0) {
-      prop = nonEnumerableProps[nIdx];
-
-      if (_has(prop, obj) && !contains(ks, prop)) {
-        ks[ks.length] = prop;
-      }
-
-      nIdx -= 1;
-    }
-  }
-
-  return ks;
-});
-var keys$1 = keys;
-
-/**
- * Gives a single-word string description of the (native) type of a value,
- * returning such answers as 'Object', 'Number', 'Array', or 'Null'. Does not
- * attempt to distinguish user Object types any further, reporting them all as
- * 'Object'.
- *
- * @func
- * @memberOf R
- * @since v0.8.0
- * @category Type
- * @sig (* -> {*}) -> String
- * @param {*} val The value to test
- * @return {String}
- * @example
- *
- *      R.type({}); //=> "Object"
- *      R.type(1); //=> "Number"
- *      R.type(false); //=> "Boolean"
- *      R.type('s'); //=> "String"
- *      R.type(null); //=> "Null"
- *      R.type([]); //=> "Array"
- *      R.type(/[A-z]/); //=> "RegExp"
- *      R.type(() => {}); //=> "Function"
- *      R.type(undefined); //=> "Undefined"
- */
-
-var type =
-/*#__PURE__*/
-_curry1(function type(val) {
-  return val === null ? 'Null' : val === undefined ? 'Undefined' : Object.prototype.toString.call(val).slice(8, -1);
-});
-
-var type$1 = type;
-
-/**
- * A function that returns the `!` of its argument. It will return `true` when
- * passed false-y value, and `false` when passed a truth-y one.
- *
- * @func
- * @memberOf R
- * @since v0.1.0
- * @category Logic
- * @sig * -> Boolean
- * @param {*} a any value
- * @return {Boolean} the logical inverse of passed argument.
- * @see R.complement
- * @example
- *
- *      R.not(true); //=> false
- *      R.not(false); //=> true
- *      R.not(0); //=> true
- *      R.not(1); //=> false
- */
-
-var not =
-/*#__PURE__*/
-_curry1(function not(a) {
-  return !a;
-});
-
-var not$1 = not;
-
-function _arrayFromIterator(iter) {
-  var list = [];
-  var next;
-
-  while (!(next = iter.next()).done) {
-    list.push(next.value);
-  }
-
-  return list;
-}
-
-function _includesWith(pred, x, list) {
-  var idx = 0;
-  var len = list.length;
-
-  while (idx < len) {
-    if (pred(x, list[idx])) {
-      return true;
-    }
-
-    idx += 1;
-  }
-
-  return false;
-}
-
-function _functionName(f) {
-  // String(x => x) evaluates to "x => x", so the pattern may not match.
-  var match = String(f).match(/^function (\w*)/);
-  return match == null ? '' : match[1];
-}
-
-// Based on https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
-function _objectIs(a, b) {
-  // SameValue algorithm
-  if (a === b) {
-    // Steps 1-5, 7-10
-    // Steps 6.b-6.e: +0 != -0
-    return a !== 0 || 1 / a === 1 / b;
-  } else {
-    // Step 6.a: NaN == NaN
-    return a !== a && b !== b;
-  }
-}
-
-var _objectIs$1 = typeof Object.is === 'function' ? Object.is : _objectIs;
-
-/**
- * private _uniqContentEquals function.
- * That function is checking equality of 2 iterator contents with 2 assumptions
- * - iterators lengths are the same
- * - iterators values are unique
- *
- * false-positive result will be returned for comparision of, e.g.
- * - [1,2,3] and [1,2,3,4]
- * - [1,1,1] and [1,2,3]
- * */
-
-function _uniqContentEquals(aIterator, bIterator, stackA, stackB) {
-  var a = _arrayFromIterator(aIterator);
-
-  var b = _arrayFromIterator(bIterator);
-
-  function eq(_a, _b) {
-    return _equals(_a, _b, stackA.slice(), stackB.slice());
-  } // if *a* array contains any element that is not included in *b*
-
-
-  return !_includesWith(function (b, aItem) {
-    return !_includesWith(eq, aItem, b);
-  }, b, a);
-}
-
-function _equals(a, b, stackA, stackB) {
-  if (_objectIs$1(a, b)) {
-    return true;
-  }
-
-  var typeA = type$1(a);
-
-  if (typeA !== type$1(b)) {
-    return false;
-  }
-
-  if (a == null || b == null) {
-    return false;
-  }
-
-  if (typeof a['fantasy-land/equals'] === 'function' || typeof b['fantasy-land/equals'] === 'function') {
-    return typeof a['fantasy-land/equals'] === 'function' && a['fantasy-land/equals'](b) && typeof b['fantasy-land/equals'] === 'function' && b['fantasy-land/equals'](a);
-  }
-
-  if (typeof a.equals === 'function' || typeof b.equals === 'function') {
-    return typeof a.equals === 'function' && a.equals(b) && typeof b.equals === 'function' && b.equals(a);
-  }
-
-  switch (typeA) {
-    case 'Arguments':
-    case 'Array':
-    case 'Object':
-      if (typeof a.constructor === 'function' && _functionName(a.constructor) === 'Promise') {
-        return a === b;
-      }
-
-      break;
-
-    case 'Boolean':
-    case 'Number':
-    case 'String':
-      if (!(typeof a === typeof b && _objectIs$1(a.valueOf(), b.valueOf()))) {
-        return false;
-      }
-
-      break;
-
-    case 'Date':
-      if (!_objectIs$1(a.valueOf(), b.valueOf())) {
-        return false;
-      }
-
-      break;
-
-    case 'Error':
-      return a.name === b.name && a.message === b.message;
-
-    case 'RegExp':
-      if (!(a.source === b.source && a.global === b.global && a.ignoreCase === b.ignoreCase && a.multiline === b.multiline && a.sticky === b.sticky && a.unicode === b.unicode)) {
-        return false;
-      }
-
-      break;
-  }
-
-  var idx = stackA.length - 1;
-
-  while (idx >= 0) {
-    if (stackA[idx] === a) {
-      return stackB[idx] === b;
-    }
-
-    idx -= 1;
-  }
-
-  switch (typeA) {
-    case 'Map':
-      if (a.size !== b.size) {
-        return false;
-      }
-
-      return _uniqContentEquals(a.entries(), b.entries(), stackA.concat([a]), stackB.concat([b]));
-
-    case 'Set':
-      if (a.size !== b.size) {
-        return false;
-      }
-
-      return _uniqContentEquals(a.values(), b.values(), stackA.concat([a]), stackB.concat([b]));
-
-    case 'Arguments':
-    case 'Array':
-    case 'Object':
-    case 'Boolean':
-    case 'Number':
-    case 'String':
-    case 'Date':
-    case 'Error':
-    case 'RegExp':
-    case 'Int8Array':
-    case 'Uint8Array':
-    case 'Uint8ClampedArray':
-    case 'Int16Array':
-    case 'Uint16Array':
-    case 'Int32Array':
-    case 'Uint32Array':
-    case 'Float32Array':
-    case 'Float64Array':
-    case 'ArrayBuffer':
-      break;
-
-    default:
-      // Values of other types are only equal if identical.
-      return false;
-  }
-
-  var keysA = keys$1(a);
-
-  if (keysA.length !== keys$1(b).length) {
-    return false;
-  }
-
-  var extendedStackA = stackA.concat([a]);
-  var extendedStackB = stackB.concat([b]);
-  idx = keysA.length - 1;
-
-  while (idx >= 0) {
-    var key = keysA[idx];
-
-    if (!(_has(key, b) && _equals(b[key], a[key], extendedStackA, extendedStackB))) {
-      return false;
-    }
-
-    idx -= 1;
-  }
-
-  return true;
-}
-
-/**
- * Returns `true` if its arguments are equivalent, `false` otherwise. Handles
- * cyclical data structures.
- *
- * Dispatches symmetrically to the `equals` methods of both arguments, if
- * present.
- *
- * @func
- * @memberOf R
- * @since v0.15.0
- * @category Relation
- * @sig a -> b -> Boolean
- * @param {*} a
- * @param {*} b
- * @return {Boolean}
- * @example
- *
- *      R.equals(1, 1); //=> true
- *      R.equals(1, '1'); //=> false
- *      R.equals([1, 2, 3], [1, 2, 3]); //=> true
- *
- *      const a = {}; a.v = a;
- *      const b = {}; b.v = b;
- *      R.equals(a, b); //=> true
- */
-
-var equals =
-/*#__PURE__*/
-_curry2(function equals(a, b) {
-  return _equals(a, b, [], []);
-});
-
-var equals$1 = equals;
-
-function _isObject(x) {
-  return Object.prototype.toString.call(x) === '[object Object]';
-}
-
-/**
- * Returns the empty value of its argument's type. Ramda defines the empty
- * value of Array (`[]`), Object (`{}`), String (`''`), and Arguments. Other
- * types are supported if they define `<Type>.empty`,
- * `<Type>.prototype.empty` or implement the
- * [FantasyLand Monoid spec](https://github.com/fantasyland/fantasy-land#monoid).
- *
- * Dispatches to the `empty` method of the first argument, if present.
- *
- * @func
- * @memberOf R
- * @since v0.3.0
- * @category Function
- * @sig a -> a
- * @param {*} x
- * @return {*}
- * @example
- *
- *      R.empty(Just(42));      //=> Nothing()
- *      R.empty([1, 2, 3]);     //=> []
- *      R.empty('unicorns');    //=> ''
- *      R.empty({x: 1, y: 2});  //=> {}
- */
-
-var empty =
-/*#__PURE__*/
-_curry1(function empty(x) {
-  return x != null && typeof x['fantasy-land/empty'] === 'function' ? x['fantasy-land/empty']() : x != null && x.constructor != null && typeof x.constructor['fantasy-land/empty'] === 'function' ? x.constructor['fantasy-land/empty']() : x != null && typeof x.empty === 'function' ? x.empty() : x != null && x.constructor != null && typeof x.constructor.empty === 'function' ? x.constructor.empty() : _isArray(x) ? [] : _isString(x) ? '' : _isObject(x) ? {} : _isArguments$1(x) ? function () {
-    return arguments;
-  }() : void 0 // else
-  ;
-});
-
-var empty$1 = empty;
-
-/**
- * Returns `true` if the given value is its type's empty value; `false`
- * otherwise.
- *
- * @func
- * @memberOf R
- * @since v0.1.0
- * @category Logic
- * @sig a -> Boolean
- * @param {*} x
- * @return {Boolean}
- * @see R.empty
- * @example
- *
- *      R.isEmpty([1, 2, 3]);   //=> false
- *      R.isEmpty([]);          //=> true
- *      R.isEmpty('');          //=> true
- *      R.isEmpty(null);        //=> false
- *      R.isEmpty({});          //=> true
- *      R.isEmpty({length: 0}); //=> false
- */
-
-var isEmpty =
-/*#__PURE__*/
-_curry1(function isEmpty(x) {
-  return x != null && equals$1(x, empty$1(x));
-});
-
-var isEmpty$1 = isEmpty;
-
-var css_248z = "/*\n  Do not edit directly\n  Generated on Wed, 27 Apr 2022 11:58:36 GMT\n*/\nol {\n  padding: 0;\n  margin: 0;\n  list-style: none;\n}\n\n[role=grid i] {\n  position: relative;\n  z-index: 0;\n  display: grid;\n  margin: auto;\n  grid-template-areas: \". column-headers\" \"row-headers calendar\";\n  grid-template-columns: min-content auto;\n  inline-size: max(100%, 500px);\n  min-inline-size: 880px;\n}\n\n.row-headers {\n  display: grid;\n  grid-area: row-headers;\n  grid-template-rows: repeat(24, 1fr);\n  margin-inline-end: 2px;\n}\n.row-headers > [role=rowheader i] {\n  display: flex;\n  align-items: flex-end;\n  justify-content: flex-end;\n}\n.row-headers > [role=rowheader i] > time {\n  font: 400 ultra-condensed 12px / 16px SpeziaWebVariable;\n  letter-spacing: 0px;\n  text-decoration: none;\n  text-transform: none;\n  font-size: small;\n  line-height: 1;\n  text-transform: uppercase;\n  white-space: nowrap;\n}\n\n.calendar-row {\n  display: contents;\n}\n\n.calendar-grid-presentation {\n  display: grid;\n  overflow: hidden;\n  background-color: var(--vvd-color-surface-2dp);\n  border-radius: 6px;\n  counter-reset: listing;\n  filter: var(--vvd-shadow-surface-2dp);\n  gap: 1px;\n  grid-area: calendar;\n  grid-auto-flow: column;\n  grid-template: repeat(24, 1fr)/repeat(7, 1fr);\n}\n\n.hours {\n  display: contents;\n}\n.hours > [role=listitem i] {\n  position: relative;\n  grid-column: 1/8;\n  grid-row: var(--row);\n  min-block-size: 48px;\n  pointer-events: none;\n}\n.hours > [role=listitem i]:not(:first-child)::after {\n  position: absolute;\n  border-block-end: var(--vvd-color-neutral-20) 1px solid;\n  content: \"\";\n  inline-size: 100%;\n  margin-block-start: -1px;\n}\n.hours > [role=listitem i]:nth-child(24n+1) {\n  --row: 1;\n}\n.hours > [role=listitem i]:nth-child(24n+2) {\n  --row: 2;\n}\n.hours > [role=listitem i]:nth-child(24n+3) {\n  --row: 3;\n}\n.hours > [role=listitem i]:nth-child(24n+4) {\n  --row: 4;\n}\n.hours > [role=listitem i]:nth-child(24n+5) {\n  --row: 5;\n}\n.hours > [role=listitem i]:nth-child(24n+6) {\n  --row: 6;\n}\n.hours > [role=listitem i]:nth-child(24n+7) {\n  --row: 7;\n}\n.hours > [role=listitem i]:nth-child(24n+8) {\n  --row: 8;\n}\n.hours > [role=listitem i]:nth-child(24n+9) {\n  --row: 9;\n}\n.hours > [role=listitem i]:nth-child(24n+10) {\n  --row: 10;\n}\n.hours > [role=listitem i]:nth-child(24n+11) {\n  --row: 11;\n}\n.hours > [role=listitem i]:nth-child(24n+12) {\n  --row: 12;\n}\n.hours > [role=listitem i]:nth-child(24n+13) {\n  --row: 13;\n}\n.hours > [role=listitem i]:nth-child(24n+14) {\n  --row: 14;\n}\n.hours > [role=listitem i]:nth-child(24n+15) {\n  --row: 15;\n}\n.hours > [role=listitem i]:nth-child(24n+16) {\n  --row: 16;\n}\n.hours > [role=listitem i]:nth-child(24n+17) {\n  --row: 17;\n}\n.hours > [role=listitem i]:nth-child(24n+18) {\n  --row: 18;\n}\n.hours > [role=listitem i]:nth-child(24n+19) {\n  --row: 19;\n}\n.hours > [role=listitem i]:nth-child(24n+20) {\n  --row: 20;\n}\n.hours > [role=listitem i]:nth-child(24n+21) {\n  --row: 21;\n}\n.hours > [role=listitem i]:nth-child(24n+22) {\n  --row: 22;\n}\n.hours > [role=listitem i]:nth-child(24n+23) {\n  --row: 23;\n}\n.hours > [role=listitem i]:nth-child(24n+24) {\n  --row: 24;\n}\n\n[role=gridcell i] {\n  display: grid;\n  gap: 1px;\n  grid-auto-flow: column;\n}\n\n[role=gridcell i],\n[role=columnheader i],\n[role=columnheader i] [role=button i] {\n  position: relative;\n}\n[role=gridcell i]::before,\n[role=columnheader i]::before,\n[role=columnheader i] [role=button i]::before {\n  position: absolute;\n  z-index: -1;\n  background-color: var(--vvd-color-info-10);\n  content: \"\";\n}\n@supports (inset: 0) {\n  [role=gridcell i]::before,\n[role=columnheader i]::before,\n[role=columnheader i] [role=button i]::before {\n    inset: 0;\n  }\n}\n@supports not (inset: 0) {\n  [role=gridcell i]::before,\n[role=columnheader i]::before,\n[role=columnheader i] [role=button i]::before {\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n  }\n}\n[role=gridcell i]:focus,\n[role=columnheader i]:focus,\n[role=columnheader i] [role=button i]:focus {\n  outline: none;\n}\n[role=gridcell i]:not(:focus)::before,\n[role=columnheader i]:not(:focus)::before,\n[role=columnheader i] [role=button i]:not(:focus)::before {\n  display: none;\n}\n\n.columns {\n  display: contents;\n}\n.columns > [role=gridcell i] {\n  position: relative;\n  grid-column: var(--column);\n  grid-row: 1/25;\n}\n.columns > [role=gridcell i]:nth-child(1) {\n  --column: 1;\n}\n.columns > [role=gridcell i]:nth-child(2) {\n  --column: 2;\n}\n.columns > [role=gridcell i]:nth-child(3) {\n  --column: 3;\n}\n.columns > [role=gridcell i]:nth-child(4) {\n  --column: 4;\n}\n.columns > [role=gridcell i]:nth-child(5) {\n  --column: 5;\n}\n.columns > [role=gridcell i]:nth-child(6) {\n  --column: 6;\n}\n.columns > [role=gridcell i]:nth-child(7) {\n  --column: 7;\n}\n.columns > [role=gridcell i]:not(:first-child)::after {\n  position: absolute;\n  block-size: 100%;\n  border-inline-end: var(--vvd-color-neutral-20) 1px solid;\n  content: \"\";\n  margin-inline-start: -1px;\n}\n\n.column-headers {\n  display: grid;\n  grid-area: column-headers;\n  grid-template-columns: repeat(7, 1fr);\n}\n.column-headers [role=columnheader i] h2 {\n  font: 500 condensed 20px / 28px SpeziaWebVariable;\n  letter-spacing: 0px;\n  text-decoration: none;\n  text-transform: none;\n  display: grid;\n  align-items: baseline;\n  margin: 0;\n  grid-template-columns: 1fr auto 1fr;\n}\n.column-headers [role=columnheader i] h2 > em {\n  font: inherit;\n  inline-size: min-content;\n}\n@supports (inset: 0) {\n  .column-headers [role=columnheader i] h2 > em {\n    inset-inline-start: 0;\n  }\n}\n@supports not (inset: 0) {\n  .column-headers [role=columnheader i] h2 > em {\n    left: 0;\n  }\n}\n.column-headers [role=columnheader i] h2 > small {\n  font: 400 ultra-condensed 12px / 16px SpeziaWebVariable;\n  letter-spacing: 0px;\n  text-decoration: none;\n  text-transform: none;\n  text-transform: uppercase;\n}";
-styleInject(css_248z);
-
-const ARROW_UP = 'ArrowUp';
-const ARROW_RIGHT = 'ArrowRight';
-const ARROW_DOWN = 'ArrowDown';
-const ARROW_LEFT = 'ArrowLeft';
-function isCellOrHeader(el) {
-  return el instanceof HTMLElement && (el.matches('[role="gridcell"i]') || el.matches('[role="columnheader"i]'));
-}
-
-const getCellOrHeader = f => f.matches('[role="columnheader"i]') ? '[role="gridcell"i]' : '[role="columnheader"i]';
-
-function getNextFocusableGridElement(key, activeElement) {
-  if (activeElement.parentNode instanceof HTMLElement) {
-    switch (key) {
-      case ARROW_RIGHT:
-        return activeElement.nextElementSibling || activeElement.parentNode.firstElementChild;
-
-      case ARROW_LEFT:
-        return activeElement.previousElementSibling || activeElement.parentNode.lastElementChild;
-
-      case ARROW_UP:
-      case ARROW_DOWN:
-        {
-          const {
-            children
-          } = activeElement.parentNode;
-          const i = Array.from(children).indexOf(activeElement);
-          return this.shadowRoot.querySelector(`${getCellOrHeader(activeElement)}:nth-child(${i + 1})`);
-        }
-    }
-  }
-}
-function getHeaderDescendantGridCell(key, activeElement) {
-  if (key !== ARROW_DOWN) {
-    return;
-  }
-
-  const header = activeElement.closest('[role="columnheader"i]');
-  const columnHeaders = this.shadowRoot.querySelectorAll('[role="columnheader"i]');
-  const i = Array.from(columnHeaders).indexOf(header);
-  return this.shadowRoot.querySelector(`[role="gridcell"i]:nth-child(${i + 1})`);
-}
-
-function getDay(el) {
-  const cellOrHeader = el.closest('[role="gridcell"i], [role="columnheader"i]');
-
-  if (cellOrHeader) {
-    const {
-      parentElement
-    } = cellOrHeader;
-
-    if (parentElement) {
-      return parentElement.children && Array.from(parentElement.children).indexOf(cellOrHeader);
-    }
-  }
-}
-
-function getHour(e, el, hours) {
-  const rowHeaderOrCell = el.closest('[role="rowheader"], [role="gridcell"i]');
-
-  if (rowHeaderOrCell) {
-    const DOMRect = rowHeaderOrCell.getBoundingClientRect();
-    const offsetY = e.clientY - DOMRect.y;
-    const hourHeight = DOMRect.height / hours;
-    const hour = offsetY / hourHeight;
-    return Math.round((hour + Number.EPSILON) * 100) / 100;
-  }
-}
-
-const getEventContext = function getEventContext(e) {
-  if (!(e instanceof KeyboardEvent || e instanceof MouseEvent)) {
-    throw new Error('Invalid event. Event must be instance of KeyboardEvent or MouseEvent');
-  }
-
-  const [el] = e.composedPath();
-
-  if (!(el && el instanceof HTMLElement && this.shadowRoot.contains(el))) {
-    throw new Error('Invalid event. Event must contain a target object which is a direct descendant of calendar');
-  }
-
-  const day = getDay(el);
-  let hour;
-
-  if (e instanceof MouseEvent) {
-    hour = getHour(e, el, this._hours);
-  }
-
-  const context = Object.assign(Object.assign({}, day != undefined && {
-    day
-  }), hour != undefined && {
-    hour
-  });
-  return not$1(isEmpty$1(context)) ? context : null;
-};
-
-class Calendar extends FoundationElement {
-  constructor() {
-    super(...arguments);
-    this.hour12 = false;
-    this._hours = 24;
-    this._days = 7;
-    this.hoursAsDatetime = Array.from({
-      length: this._hours - 1
-    }).fill(new Date(new Date().setHours(0, 0, 0))).map((d, i) => new Date(d.setHours(++i)));
-
-    this._generateDaysArr = dateArr => {
-      if (dateArr.length == this._days) {
-        return dateArr;
-      }
-
-      const lastDate = new Date(dateArr[dateArr.length - 1]);
-      lastDate.setDate(lastDate.getDate() + 1);
-      return this._generateDaysArr([...dateArr, lastDate]);
-    };
-
-    this.getEventContext = getEventContext;
-  }
-
-  arrowKeysInteractions(key) {
-    const activeElement = this.shadowRoot.activeElement;
-    let focusNext;
-
-    if (isCellOrHeader(activeElement)) {
-      focusNext = getNextFocusableGridElement.call(this, key, activeElement);
-    } else if (activeElement === null || activeElement === void 0 ? void 0 : activeElement.matches('em[role="button"i]')) {
-      focusNext = getHeaderDescendantGridCell.call(this, key, activeElement);
-    } else {
-      focusNext = this.shadowRoot.querySelector('[role="columnheader"i]');
-    }
-
-    this.moveTo(focusNext);
-  }
-
-  moveTo(el) {
-    const onBlur = ({
-      target
-    }) => target.setAttribute('tabindex', '-1');
-
-    el === null || el === void 0 ? void 0 : el.addEventListener('blur', onBlur, {
-      once: true
-    });
-    el === null || el === void 0 ? void 0 : el.setAttribute('tabindex', '0');
-    el === null || el === void 0 ? void 0 : el.focus();
-  }
-
-  onKeydown({
-    key
-  }) {
-    const isArrow = [ARROW_UP, ARROW_RIGHT, ARROW_DOWN, ARROW_LEFT].some(predefinedKey => predefinedKey == key);
-
-    if (isArrow) {
-      this.arrowKeysInteractions(key);
-    }
-
-    return !isArrow;
-  }
-
-}
-
-__decorate([attr, __metadata("design:type", Object)], Calendar.prototype, "datetime", void 0);
-
-__decorate([attr({
-  attribute: 'start-day'
-}), __metadata("design:type", String)], Calendar.prototype, "startDay", void 0);
-
-__decorate([attr, __metadata("design:type", Object)], Calendar.prototype, "locales", void 0);
-
-__decorate([attr({
-  mode: 'boolean'
-}), __metadata("design:type", Object)], Calendar.prototype, "hour12", void 0);
-
-function getValidDateString(date) {
-  const twoDigit = num => `0${num}`.slice(-2);
-
-  return `${date.getFullYear()}-${twoDigit(date.getMonth() + 1)}-${twoDigit(date.getDate())}`;
-}
-const weekdaysMap = new Map([['sunday', 0], ['monday', 1]]);
-function getFirstDateOfTheWeek(date = new Date(), startDay) {
-  date = new Date(date);
-  let num = weekdaysMap.get(startDay);
-  num !== null && num !== void 0 ? num : num = 1;
-  const day = date.getDate() - (date.getDay() + 7 - num) % 7;
-  return new Date(date.setDate(day));
-}
-
-let _2 = t => t,
-    _t,
-    _t2,
-    _t3,
-    _t4,
-    _t5,
-    _t6,
-    _t7;
-
-const HoursTemplate = () => {
-  return html(_t || (_t = _2`
-  <div class="row-headers" role="presentation">
-    ${0}
-  </div>`), repeat(x => x.hoursAsDatetime, html(_t2 || (_t2 = _2`<span role="rowheader">
-      <time datetime="${0}">
-						${0}
-					</time>
-				</span>`), (x, c) => new Intl.DateTimeFormat(c.parent.locales, {
-    hour: 'numeric',
-    minute: 'numeric',
-    hour12: false
-  }).format(x), (x, c) => new Intl.DateTimeFormat(c.parent.locales, {
-    hour: 'numeric',
-    hour12: c.parent.hour12
-  }).format(x))));
-};
-
-const DaysTemplate = () => {
-  return html(_t3 || (_t3 = _2`
-			<div class="column-headers" role="row">
-				${0}
-			</div>`), repeat(x => x._generateDaysArr([getFirstDateOfTheWeek(x.datetime, x.startDay)]), html(_t4 || (_t4 = _2`
-						<div role="columnheader" tabindex="-1">
-              <time datetime=${0}>
-                <h2>
-									<!-- TODO add to column aria-labelledby or describedby to count
-                  events and related day e.g. "3 events, Sunday, March 8" -->
-									<em tabindex="0" role="button" aria-label=${0}>
-										${0}
-									</em>
-									<small aria-hidden="true">
-										${0}
-									</small>
-                </h2>
-              </time>
-						</div>`), x => getValidDateString(x), (x, c) => new Intl.DateTimeFormat(c.parent.locales, {
-    weekday: 'long',
-    month: 'long',
-    day: 'numeric'
-  }).format(x), (x, c) => new Intl.DateTimeFormat(c.parent.locales, {
-    day: '2-digit'
-  }).format(x), (x, c) => new Intl.DateTimeFormat(c.parent.locales, {
-    weekday: 'short'
-  }).format(x))));
-};
-
-const ColumnTemplate = html(_t5 || (_t5 = _2`
-            <div role="gridcell" tabindex="-1">
-              <slot name="day-${0}"></slot>
-            </div>
-          `), (_, c) => c.index);
-const CalendarTemplate = () => html(_t6 || (_t6 = _2`
-  <div role="grid" @keydown=${0}>
-    ${0}
-    <div role="row" class="calendar-row">
-      ${0}
-      <div class="calendar-grid-presentation" role="presentation">
-        <div class="hours" role="list">
-          ${0}
-        </div>
-        <div class="columns" role="presentation">
-          ${0}
-        </div>
-        <slot></slot>
-      </div>
-    </div>
-  </div>
-`), (x, c) => x.onKeydown(c.event), DaysTemplate, HoursTemplate, repeat(x => Array.from({
-  length: x.hoursAsDatetime.length + 1
-}), html(_t7 || (_t7 = _2`
-            <div role="listitem"></div>`))), repeat(x => Array.from(Array(x._days)), ColumnTemplate, {
-  positioning: true
-}));
-
-const vividCalendar = Calendar.compose({
-  baseName: 'calendar',
-  template: CalendarTemplate,
-  styles: css_248z
-});
-designSystem.register(vividCalendar());
-
-export { vividCalendar };
+registerCalendar();