@progress/kendo-angular-dateinputs
Version:
Kendo UI for Angular Date Inputs Package - Everything you need to add date selection functionality to apps (DatePicker, TimePicker, DateInput, DateRangePicker, DateTimePicker, Calendar, and MultiViewCalendar).
220 lines (219 loc) • 9.16 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { Injectable } from '@angular/core';
import { addDecades, addCenturies, cloneDate, durationInCenturies, firstYearOfDecade, firstDecadeOfCentury, lastDecadeOfCentury, createDate, lastYearOfDecade, lastMonthOfYear, lastDayOfMonth } from '@progress/kendo-date-math';
import { Action } from '../models/navigation-action.enum';
import { EMPTY_SELECTIONRANGE } from '../models/selection-range.interface';
import { getToday, isInSelectionRange, range } from '../../util';
import { isPresent } from '../../common/utils';
import * as i0 from "@angular/core";
const EMPTY_DATA = [[]];
const CELLS_LENGTH = 4;
const ROWS_LENGTH = 3;
const upStep = (year) => {
const decadeOfCentury = Number(year.toString().slice(-2, -1));
if (decadeOfCentury < 2) {
return -2;
}
if (decadeOfCentury < 4) {
return -6;
}
return -4;
};
const downStep = (year) => {
const decadeOfCentury = Number(year.toString().slice(-2, -1));
if (decadeOfCentury > 7) {
return 2;
}
if (decadeOfCentury > 5) {
return 6;
}
return 4;
};
const ACTIONS = {
[Action.Left]: (date) => addDecades(date, -1),
[Action.Up]: (date) => addDecades(date, upStep(date.getFullYear())),
[Action.Right]: (date) => addDecades(date, 1),
[Action.Down]: (date) => addDecades(date, downStep(date.getFullYear())),
[Action.PrevView]: (date) => addCenturies(date, -1),
[Action.NextView]: (date) => addCenturies(date, 1),
[Action.FirstInView]: (date) => firstDecadeOfCentury(date),
[Action.LastInView]: (date) => lastDecadeOfCentury(date)
};
/**
* @hidden
*/
export class CenturyViewService {
addToDate(min, skip) {
return addCenturies(min, skip);
}
datesList(start, count) {
return range(0, count).map(i => addCenturies(start, i));
}
data(options) {
const { cellUID, focusedDate, isActiveView, max, min, selectedDates, selectionRange = EMPTY_SELECTIONRANGE, viewDate, allowReverse } = options;
if (!viewDate) {
return EMPTY_DATA;
}
const cells = range(0, CELLS_LENGTH);
const firstDate = firstDecadeOfCentury(viewDate);
const lastDate = lastDecadeOfCentury(viewDate);
const lastYearOfCentury = lastYearOfDecade(lastDate).getFullYear() + 1;
const today = getToday();
return range(0, ROWS_LENGTH).map(rowOffset => {
const baseDate = addDecades(firstDate, rowOffset * CELLS_LENGTH);
return cells.map(cellOffset => {
const cellDate = this.normalize(addDecades(baseDate, cellOffset), min, max);
const nextCentury = cellDate.getFullYear() >= lastYearOfCentury;
if (!this.isInRange(cellDate, min, max) || nextCentury) {
return null;
}
let isRangeStart = false;
let isRangeEnd = false;
if (allowReverse) {
if ((this.isEqual(cellDate, selectionRange.start) && selectionRange.start <= selectionRange.end) ||
(this.isEqual(cellDate, selectionRange.end) && selectionRange.end <= selectionRange.start)) {
isRangeStart = true;
}
if ((this.isEqual(cellDate, selectionRange.start) && selectionRange.start >= selectionRange.end) ||
(this.isEqual(cellDate, selectionRange.end) && selectionRange.end >= selectionRange.start)) {
isRangeEnd = true;
}
}
else {
isRangeStart = this.isEqual(cellDate, selectionRange.start);
isRangeEnd = this.isEqual(cellDate, selectionRange.end);
}
const isInMiddle = !isRangeStart && !isRangeEnd;
let isRangeMid;
if (allowReverse) {
isRangeMid = isInMiddle && (isInSelectionRange(cellDate, selectionRange) || isInSelectionRange(cellDate, { start: selectionRange.end, end: selectionRange.start }));
}
else {
isRangeMid = isInMiddle && isInSelectionRange(cellDate, selectionRange);
}
return {
formattedValue: this.value(cellDate),
id: `${cellUID}${cellDate.getTime()}`,
isFocused: this.isEqual(cellDate, focusedDate),
isSelected: isActiveView && selectedDates.some(date => this.isEqual(cellDate, date)),
isWeekend: false,
isRangeStart: isRangeStart,
isRangeMid: isRangeMid,
isRangeEnd: isRangeEnd,
isRangeSplitEnd: isRangeMid && this.isEqual(cellDate, lastDate),
isRangeSplitStart: isRangeMid && this.isEqual(cellDate, firstDate),
isToday: this.isEqual(cellDate, today),
title: this.cellTitle(cellDate),
value: cellDate,
allowReverse: allowReverse
};
});
});
}
isEqual(candidate, expected) {
if (!candidate || !expected) {
return false;
}
return firstYearOfDecade(candidate).getFullYear() === firstYearOfDecade(expected).getFullYear();
}
isInArray(date, dates) {
if (!dates.length) {
return false;
}
const year = date.getFullYear();
return dates[0].getFullYear() <= year && year <= (dates[dates.length - 1].getFullYear() + 99);
}
isInRange(candidate, min, max) {
const year = firstYearOfDecade(candidate).getFullYear();
const aboveMin = !min || firstYearOfDecade(min).getFullYear() <= year;
const belowMax = !max || year <= firstYearOfDecade(max).getFullYear();
return aboveMin && belowMax;
}
beginningOfPeriod(date) {
if (!date) {
return date;
}
const firstYear = firstYearOfDecade(firstDecadeOfCentury(date));
return createDate(firstYear.getFullYear(), 0, 1);
}
lastDayOfPeriod(date) {
const decade = lastDecadeOfCentury(date);
const year = lastYearOfDecade(decade);
const month = lastMonthOfYear(year);
return lastDayOfMonth(month);
}
isRangeStart(value) {
return value.getFullYear() % 1000 === 0;
}
move(value, action) {
const modifier = ACTIONS[action];
if (!modifier) {
return value;
}
return modifier(value);
}
cellTitle(value) {
return firstYearOfDecade(value).getFullYear().toString();
}
navigationTitle(value) {
return value ? firstDecadeOfCentury(value).getFullYear().toString() : '';
}
title(value) {
if (!value) {
return '';
}
return `${firstDecadeOfCentury(value).getFullYear()} - ${lastDecadeOfCentury(value).getFullYear()}`;
}
rowLength() {
return CELLS_LENGTH;
}
skip(value, min) {
return durationInCenturies(min, value);
}
total(min, max) {
return durationInCenturies(min, max) + 1;
}
value(current) {
return current ? firstYearOfDecade(current).getFullYear().toString() : '';
}
viewDate(date, max, viewsCount = 1) {
const viewsInRange = this.total(date, max);
if (viewsInRange < viewsCount) {
const centuriesToSubtract = viewsCount - viewsInRange;
return addCenturies(date, -1 * centuriesToSubtract);
}
return date;
}
dateRange = (start, end) => {
if (!isPresent(start) || !isPresent(end)) {
return [];
}
const result = [];
let current = start;
while (current <= end) {
result.push(current);
current = addDecades(current, 1);
}
return result;
};
normalize(cellDate, min, max) {
if (cellDate < min && this.isEqual(cellDate, min)) {
return cloneDate(min);
}
if (cellDate > max && this.isEqual(cellDate, max)) {
return cloneDate(max);
}
return cellDate;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CenturyViewService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CenturyViewService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CenturyViewService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root'
}]
}] });