igniteui-webcomponents
Version:
Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.
121 lines • 5.15 kB
JavaScript
import { DatePartType, } from '../date-time-input/date-part.js';
import { DateTimeMaskParser, DEFAULT_DATETIME_FORMAT, } from '../date-time-input/datetime-mask-parser.js';
import { MaskParser } from '../mask-input/mask-parser.js';
export var DateRangePosition;
(function (DateRangePosition) {
DateRangePosition["Start"] = "start";
DateRangePosition["End"] = "end";
DateRangePosition["Separator"] = "separator";
})(DateRangePosition || (DateRangePosition = {}));
const DEFAULT_SEPARATOR = ' - ';
export class DateRangeMaskParser extends MaskParser {
get rangeParts() {
return this._rangeParts;
}
get separator() {
return this._separator;
}
constructor(options) {
const format = options?.format || DEFAULT_DATETIME_FORMAT;
const separator = options?.separator || DEFAULT_SEPARATOR;
const promptCharacter = options?.promptCharacter;
const rangeFormat = `${format}${separator}${format}`;
super(options?.promptCharacter
? { format: rangeFormat, promptCharacter: options.promptCharacter }
: { format: rangeFormat });
this._rangeParts = [];
this._startParser = new DateTimeMaskParser({ format, promptCharacter });
this._endParser = new DateTimeMaskParser({ format, promptCharacter });
this._separator = separator;
this._separatorStart = this._startParser.mask.length;
this._separatorEnd = this._separatorStart + separator.length;
this._buildRangeParts();
}
_parseMaskLiterals() {
const dateFormat = this._options.format;
const maskFormat = DateTimeMaskParser.convertDateFormatToMaskFormat(dateFormat);
const originalFormat = this._options.format;
this._options.format = maskFormat;
super._parseMaskLiterals();
this._options.format = originalFormat;
}
_buildRangeParts() {
const startParts = this._startParser.dateParts.map((part) => ({
...part,
position: DateRangePosition.Start,
getValue: part.getValue.bind(part),
validate: part.validate.bind(part),
spin: part.spin.bind(part),
}));
const endParts = this._endParser.dateParts.map((part) => ({
...part,
start: part.start + this._separatorEnd,
end: part.end + this._separatorEnd,
position: DateRangePosition.End,
getValue: part.getValue.bind(part),
validate: part.validate.bind(part),
spin: part.spin.bind(part),
}));
this._rangeParts = [...startParts, ...endParts];
}
set mask(value) {
this._startParser.mask = value;
this._endParser.mask = value;
this._separatorStart = this._startParser.mask.length;
this._separatorEnd = this._separatorStart + this._separator.length;
const rangeFormat = `${value}${this._separator}${value}`;
super.mask = rangeFormat;
this._buildRangeParts();
}
get mask() {
return super.mask;
}
parseDateRange(masked) {
if (!masked || masked === this.emptyMask) {
return null;
}
const startString = masked.substring(0, this._separatorStart);
const endString = masked.substring(this._separatorEnd);
const start = this._startParser.parseDate(startString);
const end = this._endParser.parseDate(endString);
return { start, end };
}
formatDateRange(range) {
const startString = range?.start
? this._startParser.formatDate(range.start)
: this._startParser.emptyMask;
const endString = range?.end
? this._endParser.formatDate(range.end)
: this._endParser.emptyMask;
return startString + this._separator + endString;
}
getDateRangePartAtPosition(position) {
return this._rangeParts.find((part) => position >= part.start && position < part.end);
}
getDateRangePartForCursor(position) {
return this._rangeParts.find((part) => position >= part.start && position <= part.end);
}
getPartByTypeAndPosition(type, position) {
return this._rangeParts.find((p) => p.type === type && p.position === position);
}
getFirstDatePartForPosition(position) {
return this._rangeParts.find((p) => p.position === position && p.type !== DatePartType.Literal);
}
spinDateRangePart(part, delta, currentValue, spinLoop, amPmValue) {
const value = currentValue || { start: null, end: null };
const targetDate = part.position === DateRangePosition.Start ? value.start : value.end;
const dateToSpin = targetDate || new Date();
const newDate = new Date(dateToSpin.getTime());
const spinOptions = {
date: newDate,
spinLoop,
originalDate: dateToSpin,
amPmValue,
};
part.spin(delta, spinOptions);
return part.position === DateRangePosition.Start
? { ...value, start: newDate }
: { ...value, end: newDate };
}
}
//# sourceMappingURL=date-range-mask-parser.js.map