@progress/kendo-vue-scheduler 3.0.8 → 3.0.9-dev.202203010857

package/dist/npm/reducers/editReducer.d.ts

@@ -0,0 +1,33 @@
+import { DataItem } from '../models';
+/** @hidden */
+export interface SchedulerEditState {
+    dataItem?: DataItem;
+    editDialog: boolean;
+    occurrenceDialog: boolean;
+    drop?: boolean;
+    removeDialog: boolean;
+    removeOccurrenceDialog: boolean;
+}
+/** @hidden */
+export declare const EDIT_INITIAL_STATE: SchedulerEditState;
+/** @hidden */
+export interface SchedulerEditAction {
+    type: EDIT_ACTIONS;
+    payload?: DataItem;
+    original?: DataItem;
+    finishCallback?: (event: any) => void;
+}
+/** @hidden */
+export declare enum EDIT_ACTIONS {
+    CREATE = 0,
+    EDIT = 1,
+    EDIT_OCCURRENCE = 2,
+    EDIT_CONFIRM = 3,
+    EDIT_DROP_OCCURRENCE = 4,
+    REMOVE = 5,
+    REMOVE_OCCURRENCE = 6,
+    REMOVE_CONFIRM = 7,
+    RESET = 8
+}
+/** @hidden */
+export declare const editReducer: (state: SchedulerEditState, action: SchedulerEditAction) => SchedulerEditState;

package/dist/npm/reducers/editReducer.js

@@ -0,0 +1,68 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.editReducer = exports.EDIT_ACTIONS = exports.EDIT_INITIAL_STATE = void 0;
+/** @hidden */
+exports.EDIT_INITIAL_STATE = {
+    dataItem: undefined,
+    drop: false,
+    editDialog: false,
+    occurrenceDialog: false,
+    removeDialog: false,
+    removeOccurrenceDialog: false
+};
+/** @hidden */
+var EDIT_ACTIONS;
+(function (EDIT_ACTIONS) {
+    EDIT_ACTIONS[EDIT_ACTIONS["CREATE"] = 0] = "CREATE";
+    EDIT_ACTIONS[EDIT_ACTIONS["EDIT"] = 1] = "EDIT";
+    EDIT_ACTIONS[EDIT_ACTIONS["EDIT_OCCURRENCE"] = 2] = "EDIT_OCCURRENCE";
+    EDIT_ACTIONS[EDIT_ACTIONS["EDIT_CONFIRM"] = 3] = "EDIT_CONFIRM";
+    EDIT_ACTIONS[EDIT_ACTIONS["EDIT_DROP_OCCURRENCE"] = 4] = "EDIT_DROP_OCCURRENCE";
+    EDIT_ACTIONS[EDIT_ACTIONS["REMOVE"] = 5] = "REMOVE";
+    EDIT_ACTIONS[EDIT_ACTIONS["REMOVE_OCCURRENCE"] = 6] = "REMOVE_OCCURRENCE";
+    EDIT_ACTIONS[EDIT_ACTIONS["REMOVE_CONFIRM"] = 7] = "REMOVE_CONFIRM";
+    EDIT_ACTIONS[EDIT_ACTIONS["RESET"] = 8] = "RESET";
+})(EDIT_ACTIONS = exports.EDIT_ACTIONS || (exports.EDIT_ACTIONS = {}));
+/** @hidden */
+exports.editReducer = function (state, action) {
+    var newState;
+    switch (action.type) {
+        case EDIT_ACTIONS.CREATE:
+            newState = __assign(__assign({}, state), { dataItem: action.payload, editDialog: true });
+            break;
+        case EDIT_ACTIONS.EDIT:
+            newState = __assign(__assign({}, state), { dataItem: action.payload, editDialog: true, occurrenceDialog: false });
+            break;
+        case EDIT_ACTIONS.EDIT_OCCURRENCE:
+            newState = __assign(__assign({}, state), { dataItem: action.payload, occurrenceDialog: true });
+            break;
+        case EDIT_ACTIONS.EDIT_DROP_OCCURRENCE:
+            newState = __assign(__assign({}, state), { dataItem: action.original, drop: action.payload, occurrenceDialog: true });
+            break;
+        case EDIT_ACTIONS.REMOVE:
+            newState = __assign(__assign({}, state), { dataItem: action.payload, removeDialog: true });
+            break;
+        case EDIT_ACTIONS.REMOVE_OCCURRENCE:
+            newState = __assign(__assign({}, state), { dataItem: action.payload, removeOccurrenceDialog: true });
+            break;
+        case EDIT_ACTIONS.EDIT_CONFIRM:
+        case EDIT_ACTIONS.REMOVE_CONFIRM:
+        case EDIT_ACTIONS.RESET:
+            newState = __assign({}, exports.EDIT_INITIAL_STATE);
+            break;
+        default:
+            newState = __assign({}, exports.EDIT_INITIAL_STATE);
+    }
+    return newState;
+};

package/dist/npm/reducers/index.d.ts

@@ -0,0 +1 @@
+export * from './editReducer';

package/dist/npm/reducers/index.js

@@ -0,0 +1,13 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./editReducer"), exports);

package/dist/npm/services/index.d.ts

@@ -0,0 +1,4 @@
+export * from './itemsService';
+export * from './slotsService';
+export * from './occurrenceService';
+export * from './rangeService';

package/dist/npm/services/index.js

@@ -0,0 +1,16 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./itemsService"), exports);
+__exportStar(require("./slotsService"), exports);
+__exportStar(require("./occurrenceService"), exports);
+__exportStar(require("./rangeService"), exports);

package/dist/npm/services/itemsService.d.ts

@@ -0,0 +1,14 @@
+import { Occurrence, Group, Range, Item, Slot } from '../models';
+/** @hidden */
+export declare const toItems: (occurrences: Occurrence[], { timezone }: {
+    timezone: any;
+}, { groups, ranges }: {
+    groups: Group[];
+    ranges: Range[];
+}) => Item[];
+/** @hidden */
+export declare const inGroup: (occurrence: Occurrence, group: Group) => boolean;
+/** @hidden */
+export declare const inSlot: (occurrence: Occurrence, slot: Slot) => boolean;
+/** @hidden */
+export declare const inRange: (occurrence: Occurrence, range: Range) => boolean;

package/dist/npm/services/itemsService.js

@@ -0,0 +1,85 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.inRange = exports.inSlot = exports.inGroup = exports.toItems = void 0;
+var utils_1 = require("../utils");
+var kendo_data_query_1 = require("@progress/kendo-data-query");
+var kendo_date_math_1 = require("@progress/kendo-date-math");
+/** @hidden */
+exports.toItems = function (occurrences, _a, _b) {
+    var timezone = _a.timezone;
+    var groups = _b.groups, ranges = _b.ranges;
+    var result = [];
+    var sorted = kendo_data_query_1.orderBy(occurrences, [
+        { field: 'start', dir: 'asc' },
+        { field: 'end', dir: 'desc' },
+        { field: 'isAllDay', dir: 'desc' }
+    ]);
+    sorted.forEach(function (occurrence) {
+        groups.forEach(function (g) {
+            var group = groups.length === 1
+                ? personalizedGroup(occurrence, g)
+                : g;
+            if (exports.inGroup(occurrence, group)) {
+                ranges.forEach(function (range) {
+                    if (exports.inRange(occurrence, range)) {
+                        var itemRef = {};
+                        var refTo = {};
+                        var head = range.end < occurrence.end;
+                        var tail = occurrence.start < range.start;
+                        var zonedStart = kendo_date_math_1.ZonedDate.fromLocalDate(occurrence.start, timezone);
+                        var zonedEnd = kendo_date_math_1.ZonedDate.fromLocalDate(occurrence.end, timezone);
+                        var item = __assign(__assign({}, occurrence), { refTo: refTo,
+                            itemRef: itemRef,
+                            head: head,
+                            tail: tail, order: null, zonedStart: zonedStart,
+                            zonedEnd: zonedEnd,
+                            group: group,
+                            range: range, slots: [], isRecurring: Boolean(occurrence.recurrenceRule), isException: Boolean(!occurrence.recurrenceRule
+                                && occurrence.recurrenceId !== null && occurrence.recurrenceId !== undefined), isAllDay: Boolean(occurrence.isAllDay) });
+                        result.push(item);
+                    }
+                });
+            }
+        });
+    });
+    return result;
+};
+var personalizedGroup = function (occurrence, group) {
+    return {
+        index: 0,
+        resources: group.resources.filter(function (resource) { return inResource(occurrence, resource); })
+    };
+};
+var inResource = function (occurrence, resource) {
+    return resource.multiple
+        ? (occurrence.dataItem[resource.field] || []).some(function (val) { return resource[resource.valueField] === val; })
+        : occurrence.dataItem[resource.field] === resource[resource.valueField];
+};
+/** @hidden */
+exports.inGroup = function (occurrence, group) {
+    return !group.resources.some(function (res) { return res.multiple
+        ? !occurrence.dataItem[res.field].some(function (val) { return res[res.valueField] === val; })
+        : occurrence.dataItem[res.field] !== res[res.valueField]; });
+};
+/** @hidden */
+exports.inSlot = function (occurrence, slot) {
+    return utils_1.intersects(slot.start, slot.end, occurrence.start, occurrence.end);
+};
+/** @hidden */
+exports.inRange = function (occurrence, range) {
+    return utils_1.intersects(range.start, range.end, occurrence.start, occurrence.end)
+        && (range.isAllDay === undefined
+            || occurrence.isAllDay === undefined
+            || (occurrence.isAllDay === range.isAllDay));
+};

package/dist/npm/services/occurrenceService.d.ts

@@ -0,0 +1,7 @@
+import { DataItem, Occurrence } from '../models';
+/** @hidden */
+export declare const toOccurrences: (data: DataItem[], { dateRange, fields, timezone }: {
+    dateRange: any;
+    fields: any;
+    timezone: any;
+}) => Occurrence[];

package/dist/npm/services/occurrenceService.js

@@ -0,0 +1,93 @@
+"use strict";
+var __spreadArrays = (this && this.__spreadArrays) || function () {
+    for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
+    for (var r = Array(s), k = 0, i = 0; i < il; i++)
+        for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
+            r[k] = a[j];
+    return r;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toOccurrences = void 0;
+var kendo_vue_common_1 = require("@progress/kendo-vue-common");
+var kendo_recurrence_1 = require("@progress/kendo-recurrence");
+var kendo_date_math_1 = require("@progress/kendo-date-math");
+var utils_1 = require("../utils");
+/** @hidden */
+exports.toOccurrences = function (data, _a) {
+    var dateRange = _a.dateRange, fields = _a.fields, timezone = _a.timezone;
+    var result = data
+        .map(readItem(fields))
+        .reduce(occurrenceReducer(dateRange, timezone, fields), [])
+        .filter(function (occurrence) { return !utils_1.isMaster(occurrence.dataItem, fields); });
+    return result;
+};
+var readItem = function (fields) { return function (dataItem) {
+    var result = {
+        uid: kendo_vue_common_1.getter(fields.id || 'id')(dataItem),
+        start: kendo_vue_common_1.getter(fields.start || 'start')(dataItem),
+        startTimezone: kendo_vue_common_1.getter(fields.startTimezone || 'startTimezone')(dataItem),
+        originalStart: kendo_vue_common_1.getter(fields.originalStart || 'originalStart')(dataItem),
+        end: kendo_vue_common_1.getter(fields.end || 'end')(dataItem),
+        endTimezone: kendo_vue_common_1.getter(fields.endTimezone || 'endTimezone')(dataItem),
+        isAllDay: kendo_vue_common_1.getter(fields.isAllDay || 'isAllDay')(dataItem),
+        title: kendo_vue_common_1.getter(fields.title || 'title')(dataItem),
+        description: kendo_vue_common_1.getter(fields.description || 'description')(dataItem),
+        occurrenceId: kendo_vue_common_1.getter('occurrenceId')(dataItem),
+        recurrenceRule: kendo_vue_common_1.getter(fields.recurrenceRule || 'recurrenceRule')(dataItem),
+        recurrenceExceptions: kendo_vue_common_1.getter(fields.recurrenceExceptions || 'recurrenceExceptions')(dataItem),
+        recurrenceId: kendo_vue_common_1.getter(fields.recurrenceId || 'recurrenceId')(dataItem),
+        dataItem: kendo_vue_common_1.clone(dataItem)
+    };
+    return result;
+}; };
+var occurrenceReducer = function (dateRange, timezone, fields) { return function (acc, current) {
+    return __spreadArrays(acc, ((Boolean(current.recurrenceRule)
+        && Boolean(current.recurrenceId === null || current.recurrenceId === undefined)
+        && utils_1.isMaster(current.dataItem, fields))
+        ? __spreadArrays(occurrences(current, { dateRange: dateRange, timezone: timezone, fields: fields })) : [current]));
+}; };
+var occurrences = function (item, _a) {
+    var dateRange = _a.dateRange, timezone = _a.timezone, fields = _a.fields;
+    var rrule = item.recurrenceRule;
+    var rule = kendo_recurrence_1.parseRule({ recurrenceRule: rrule });
+    // changed as for display purposes timezone of the scheduler is the correct one
+    if (!rule.start) {
+        rule.start = kendo_date_math_1.ZonedDate.fromLocalDate(item.start, timezone);
+    }
+    if (!rule.end) {
+        rule.end = kendo_date_math_1.ZonedDate.fromLocalDate(item.end, timezone);
+    }
+    var exceptionRule = item.recurrenceExceptions;
+    if (exceptionRule) {
+        rule.exceptionDates = exceptionRule
+            .map(function (exDate) {
+            return kendo_date_math_1.ZonedDate.fromLocalDate(exDate, timezone);
+        });
+    }
+    var utcRangeStart = dateRange.zonedStart;
+    var utcRangeEnd = dateRange.zonedEnd;
+    var series = kendo_recurrence_1.expand(rule, {
+        rangeStart: kendo_date_math_1.ZonedDate.fromUTCDate(utcRangeStart, timezone),
+        rangeEnd: kendo_date_math_1.ZonedDate.fromUTCDate(utcRangeEnd, timezone)
+    });
+    if (!series.events.length) {
+        return [];
+    }
+    var expanded = series.events.map(function (occurrence, idx) {
+        var occurrenceItem = kendo_vue_common_1.clone(item);
+        var occurrenceDataItem = kendo_vue_common_1.clone(item.dataItem);
+        occurrenceItem.recurrenceId = occurrenceItem.uid;
+        utils_1.setField(occurrenceDataItem, fields.recurrenceId, item.uid);
+        occurrenceItem.originalStart = occurrence.start.toLocalDate();
+        utils_1.setField(occurrenceDataItem, fields.originalStart, occurrence.start.toLocalDate());
+        occurrenceItem.start = occurrence.start.toLocalDate();
+        utils_1.setField(occurrenceDataItem, fields.start, occurrence.start.toLocalDate());
+        occurrenceItem.end = occurrence.end.toLocalDate();
+        utils_1.setField(occurrenceDataItem, fields.end, occurrence.end.toLocalDate());
+        occurrenceItem.occurrenceId = String(idx);
+        utils_1.setField(occurrenceDataItem, 'occurrenceId', String(idx));
+        occurrenceItem.dataItem = occurrenceDataItem;
+        return occurrenceItem;
+    });
+    return expanded;
+};

package/dist/npm/services/rangeService.d.ts

@@ -0,0 +1,6 @@
+import { Range, DateRange } from '../models';
+/** @hidden */
+export declare const toRanges: (dateRange: DateRange, { step, timezone }: {
+    step: any;
+    timezone: any;
+}) => Range[];

package/dist/npm/services/rangeService.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toRanges = void 0;
+var kendo_date_math_1 = require("@progress/kendo-date-math");
+/** @hidden */
+exports.toRanges = function (dateRange, _a) {
+    var step = _a.step, timezone = _a.timezone;
+    var ranges = [];
+    var zonedRangeStart = kendo_date_math_1.ZonedDate.fromLocalDate(dateRange.start, timezone);
+    var zonedRangeEnd = kendo_date_math_1.ZonedDate.fromLocalDate(dateRange.end, timezone);
+    for (var current = zonedRangeStart.clone(), index = 0; current.getTime() < zonedRangeEnd.getTime(); index++, current = current.addTime(step)) {
+        var zonedStart = current.clone();
+        var zonedEnd = zonedStart.clone().addTime(step);
+        var start = new Date(zonedStart.getTime());
+        var end = new Date(zonedEnd.getTime());
+        var range = {
+            index: index,
+            end: end,
+            start: start,
+            zonedStart: zonedStart,
+            zonedEnd: zonedEnd
+        };
+        ranges.push(range);
+    }
+    return ranges;
+};

package/dist/npm/services/slotsService.d.ts

@@ -0,0 +1,8 @@
+import { Group, Range, Slot, DateRange } from '../models';
+/** @hidden */
+export declare const toSlots: (_dateRange: DateRange, { step }: {
+    step: any;
+}, { groups, ranges }: {
+    groups: Group[];
+    ranges: Range[];
+}) => Slot[];

package/dist/npm/services/slotsService.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toSlots = void 0;
+var kendo_date_math_1 = require("@progress/kendo-date-math");
+var constants_1 = require("../constants");
+/** @hidden */
+exports.toSlots = function (_dateRange, _a, _b) {
+    var step = _a.step;
+    var groups = _b.groups, ranges = _b.ranges;
+    var slots = [];
+    groups.forEach(function (group) {
+        ranges.forEach(function (range) {
+            var viewStart = range.zonedStart;
+            var viewEnd = range.zonedEnd;
+            var offset = (viewEnd.timezoneOffset - viewStart.timezoneOffset);
+            for (var current = viewStart.clone(), index = 0, deficiency = offset < 0 ? offset * constants_1.MS_PER_MINUTE * -1 : 0; current.getTime() < viewEnd.getTime(); index++, current = current.addTime(step)) {
+                var refTo = {};
+                var zonedStart = current.clone();
+                var zonedEnd = current.addTime(step);
+                var difference = (zonedEnd.timezoneOffset - zonedStart.timezoneOffset) * constants_1.MS_PER_MINUTE;
+                var canFill = step < Math.abs(difference);
+                if (deficiency && canFill) {
+                    deficiency -= step;
+                    current = current.addTime(-step);
+                }
+                var start = new Date(zonedStart.getTime());
+                var end = new Date(zonedEnd.getTime());
+                var slot = {
+                    refTo: refTo,
+                    index: index,
+                    end: end,
+                    start: start,
+                    zonedStart: zonedStart,
+                    zonedEnd: zonedEnd,
+                    range: range,
+                    group: group,
+                    items: [],
+                    isAllDay: kendo_date_math_1.MS_PER_DAY <= step
+                };
+                slots.push(slot);
+            }
+        });
+    });
+    return slots;
+};

package/dist/npm/slots/SchedulerEditSlot.d.ts

@@ -0,0 +1,78 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { DataItem } from '../models';
+import { DataAction } from '../Scheduler';
+import { SchedulerSlotHandle } from './SchedulerSlot';
+import { SchedulerViewSlotProps } from './SchedulerViewSlot';
+/**
+ * Represents the props of the Kendo UI for Vue [SchedulerEditSlot]({% slug api_scheduler_schedulereditslot %}) component.
+ */
+export interface SchedulerEditSlotProps extends SchedulerViewSlotProps {
+    /**
+     * Overrides the default component responsible for view-specific functionality.
+     *
+     * The default Component is: [SchedulerViewSlot]({% slug api_scheduler_schedulerviewslot %}).
+     */
+    viewSlot?: any;
+    /**
+     * Overrides the default component responsible for visualizing the `formItem`.
+     *
+     * The default Component is: [SchedulerForm]({% slug api_scheduler_schedulerform %}).
+     */
+    form?: any;
+    /**
+     * Setting this property will force the `formItem` to be in controlled state, allowing further customization.
+     */
+    formItem?: DataItem | null;
+    /**
+     * Called every time the `formItem` changes.
+     */
+    onFormItemChange?: (event: any) => void;
+    /**
+     * Called when new item has been created in the slot.
+     */
+    onDataaction?: (action: DataAction, event: any) => void;
+}
+/**
+ * Represents the object which is returned from the `ref` callback of the [SchedulerEditSlot]({% slug api_scheduler_schedulereditslot %}).
+ *
+ * For more information about Refs, refer to the [React Refs & Dom](https://reactjs.org/docs/refs-and-the-dom.html) article.
+ */
+export interface SchedulerEditSlotHandle {
+    props: SchedulerEditSlotProps;
+}
+/**
+ * @hidden
+ */
+export interface SchedulerEditSlotState {
+    slot: SchedulerSlotHandle | null;
+    editableSlot: SchedulerEditSlotHandle | null;
+}
+/**
+ * @hidden
+ */
+export interface SchedulerEditSlotComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface SchedulerEditSlotMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface SchedulerEditSlotData {
+}
+/**
+ * @hidden
+ */
+export interface SchedulerEditSlotAll extends Vue2type, SchedulerEditSlotMethods, SchedulerEditSlotData, SchedulerEditSlotComputed, SchedulerEditSlotState {
+}
+declare let SchedulerEditSlotVue2: ComponentOptions<SchedulerEditSlotAll, DefaultData<SchedulerEditSlotData>, DefaultMethods<SchedulerEditSlotAll>, SchedulerEditSlotComputed, RecordPropsDefinition<SchedulerEditSlotProps>>;
+declare const SchedulerEditSlot: DefineComponent<SchedulerEditSlotProps, any, SchedulerEditSlotData, SchedulerEditSlotComputed, SchedulerEditSlotMethods, {}, {}, {}, string, SchedulerEditSlotProps, SchedulerEditSlotProps, {}>;
+export { SchedulerEditSlot, SchedulerEditSlotVue2 };