@full-ui/headless-calendar 7.0.0-beta.8 → 7.1.0-alpha.0

package/index.d.ts

@@ -119,13 +119,10 @@ declare function expandZonedMarker(dateInfo: ZonedMarker, calendarSystem: Calend
 interface VerboseFormattingData {
     date: ExpandedZonedMarker;
     start: ExpandedZonedMarker;
-    end?: ExpandedZonedMarker;
+    end?: ExpandedZonedMarker | null;
     timeZone: string;
     localeCodes: string[];
-    defaultSeparator: string;
 }
-declare function createVerboseFormattingArg(start: ZonedMarker, end: ZonedMarker, context: DateFormattingContext, betterDefaultSeparator?: string): VerboseFormattingData;
-type CmdFormatterFunc = (cmd: string, data: VerboseFormattingData) => string | Intl.DateTimeFormatPart[];
 interface DateFormattingContext {
     timeZone: string;
     locale: Locale;
@@ -133,12 +130,19 @@ interface DateFormattingContext {
     computeWeekNumber: (d: DateMarker) => number;
     weekText: string;
     weekTextShort: string;
-    cmdFormatter?: CmdFormatterFunc;
-    defaultSeparator: string;
+    cmdFormatter?: CmdDateFormatterFunc;
 }
+declare function createVerboseFormattingArg(start: ZonedMarker, end: ZonedMarker | null, context: DateFormattingContext): VerboseFormattingData;
+type DateTimeFormatPartWithWeek = Omit<Intl.DateTimeFormatPart, 'type'> & {
+    type: Intl.DateTimeFormatPart['type'] | 'week';
+};
+type DateTimeRangeFormatPartWithWeek = Omit<Intl.DateTimeRangeFormatPart, 'type'> & {
+    type: Intl.DateTimeRangeFormatPart['type'] | 'week';
+};
+type CmdDateFormatterFunc = (cmd: string, data: VerboseFormattingData) => string | DateTimeFormatPartWithWeek[];
 interface DateFormatter {
-    format(date: ZonedMarker, context: DateFormattingContext): [string, Intl.DateTimeFormatPart[]];
-    formatRange(start: ZonedMarker, end: ZonedMarker, context: DateFormattingContext, betterDefaultSeparator?: string): string;
+    formatToParts(date: ZonedMarker, context: DateFormattingContext): DateTimeFormatPartWithWeek[];
+    formatRangeToParts(start: ZonedMarker, end: ZonedMarker, context: DateFormattingContext): DateTimeRangeFormatPartWithWeek[];
 }
 
 type WeekNumberCalculation = 'local' | 'ISO' | ((m: Date) => number);
@@ -150,8 +154,7 @@ interface DateEnvSettings {
     firstDay?: number;
     weekText?: string;
     weekTextShort?: string;
-    cmdFormatter?: CmdFormatterFunc;
-    defaultSeparator?: string;
+    cmdFormatter?: CmdDateFormatterFunc;
 }
 type DateInput = Date | string | number | number[];
 interface DateMarkerMeta {
@@ -167,8 +170,7 @@ declare class DateEnv {
     weekNumberFunc: any;
     weekText: string;
     weekTextShort: string;
-    cmdFormatter?: CmdFormatterFunc;
-    defaultSeparator: string;
+    cmdFormatter?: CmdDateFormatterFunc;
     constructor(settings: DateEnvSettings);
     createMarker(input: DateInput): DateMarker;
     createNowMarker(): DateMarker;
@@ -196,11 +198,10 @@ declare class DateEnv {
     startOfMonth(m: DateMarker): DateMarker;
     startOfWeek(m: DateMarker): DateMarker;
     computeWeekNumber(marker: DateMarker): number;
-    format(marker: DateMarker, formatter: DateFormatter): [string, Intl.DateTimeFormatPart[]];
-    formatRange(start: DateMarker, end: DateMarker, formatter: DateFormatter, dateOptions?: {
+    formatToParts(marker: DateMarker, formatter: DateFormatter): DateTimeFormatPartWithWeek[];
+    formatRangeToParts(start: DateMarker, end: DateMarker, formatter: DateFormatter, dateOptions?: {
         isEndExclusive?: boolean;
-        defaultSeparator?: string;
-    }): string;
+    }): DateTimeRangeFormatPartWithWeek[];
     formatIso(marker: DateMarker, extraOptions?: any): string;
     timestampToMarker(ms: number): Date;
     offsetForMarker(m: DateMarker): number;
@@ -228,19 +229,41 @@ declare function rangeContainsRange(outerRange: OpenDateRange, innerRange: OpenD
 declare function rangeContainsMarker(range: OpenDateRange, date: DateMarker | number): boolean;
 declare function constrainMarkerToRange(date: DateMarker, range: DateRange): DateMarker;
 
-declare class CmdFormatter implements DateFormatter {
+interface NativeDateFormatterOptions extends Intl.DateTimeFormatOptions {
+    week?: 'long' | 'short' | 'narrow' | 'numeric';
+    meridiem?: 'lowercase' | 'short' | 'narrow' | boolean;
+    omitZeroMinute?: boolean;
+    omitCommas?: boolean;
+    forceCommas?: boolean;
+    omitTrailing?: boolean;
+    weekdayJustify?: 'start' | 'end';
+}
+declare class NativeDateFormatter implements DateFormatter {
+    private standardOptions;
+    private extendedOptions;
+    private weekOnly;
+    private timeZoneOnly;
+    private cachedContext;
+    private cachedFormats;
+    constructor(options?: NativeDateFormatterOptions);
+    formatToParts(date: ZonedMarker, context: DateFormattingContext): DateTimeFormatPartWithWeek[];
+    formatRangeToParts(start: ZonedMarker, end: ZonedMarker, context: DateFormattingContext): DateTimeRangeFormatPartWithWeek[];
+    private getFormats;
+}
+
+declare class CmdDateFormatter implements DateFormatter {
     cmdStr: string;
     constructor(cmdStr: string);
-    format(date: ZonedMarker, context: DateFormattingContext, betterDefaultSeparator?: string): [string, Intl.DateTimeFormatPart[]];
-    formatRange(start: ZonedMarker, end: ZonedMarker, context: DateFormattingContext, betterDefaultSeparator?: string): string;
+    formatToParts(date: ZonedMarker, context: DateFormattingContext): DateTimeFormatPartWithWeek[];
+    formatRangeToParts(start: ZonedMarker, end: ZonedMarker, context: DateFormattingContext): DateTimeRangeFormatPartWithWeek[];
 }
 
-type FuncFormatterFunc = (data: VerboseFormattingData) => string;
-declare class FuncFormatter implements DateFormatter {
-    func: FuncFormatterFunc;
-    constructor(func: FuncFormatterFunc);
-    format(date: ZonedMarker, context: DateFormattingContext, betterDefaultSeparator?: string): [string, Intl.DateTimeFormatPart[]];
-    formatRange(start: ZonedMarker, end: ZonedMarker, context: DateFormattingContext, betterDefaultSeparator?: string): string;
+type FuncDateFormatterFunc = (info: VerboseFormattingData) => string;
+declare class FuncDateFormatter implements DateFormatter {
+    func: FuncDateFormatterFunc;
+    constructor(func: FuncDateFormatterFunc);
+    formatToParts(date: ZonedMarker, context: DateFormattingContext): DateTimeFormatPartWithWeek[];
+    formatRangeToParts(start: ZonedMarker, end: ZonedMarker, context: DateFormattingContext): DateTimeRangeFormatPartWithWeek[];
 }
 
 declare function buildIsoString(marker: DateMarker, timeZoneOffset?: number, stripZeroTime?: boolean): string;
@@ -262,4 +285,4 @@ declare function isInt(n: any): boolean;
 declare function trimEnd(s: string): string;
 declare function padStart(val: any, len: any): string;
 
-export { CalendarSystem, CmdFormatter, CmdFormatterFunc, DateEnv, DateEnvSettings, DateFormatter, DateFormattingContext, DateInput, DateMarker, DateMarkerMeta, DateRange, DateRangeInput, Duration, DurationInput, DurationObjectInput, ExpandedZonedMarker, FuncFormatter, FuncFormatterFunc, Locale, LocaleCodeArg, OpenDateRange, VerboseFormattingData, WeekNumberCalculation, ZonedMarker, addDays, addDurations, addMs, addWeeks, arrayToLocalDate, arrayToUtcDate, asCleanDays, asRoughDays, asRoughHours, asRoughMinutes, asRoughMonths, asRoughMs, asRoughSeconds, asRoughYears, buildIsoString, constrainMarkerToRange, createCalendarSystem, createDuration, createVerboseFormattingArg, dateToLocalArray, dateToUtcArray, diffDayAndTime, diffDays, diffHours, diffMinutes, diffSeconds, diffWeeks, diffWholeDays, diffWholeWeeks, durationsEqual, expandZonedMarker, formatDayString, formatIsoMonthStr, formatIsoTimeString, formatTimeZoneOffset, greatestDurationDenominator, intersectRanges, invertRanges, isInt, isValidDate, joinDateTimeFormatParts, multiplyDuration, padStart, parse as parseMarker, parseRange, rangeContainsMarker, rangeContainsRange, rangesEqual, rangesIntersect, registerCalendarSystem, startOfDay, startOfHour, startOfMinute, startOfSecond, subtractDurations, timeAsMs, trimEnd, weekOfYear, wholeDivideDurations };
+export { CalendarSystem, CmdDateFormatter, CmdDateFormatterFunc, DateEnv, DateEnvSettings, DateFormatter, DateFormattingContext, DateInput, DateMarker, DateMarkerMeta, DateRange, DateRangeInput, DateTimeFormatPartWithWeek, DateTimeRangeFormatPartWithWeek, Duration, DurationInput, DurationObjectInput, ExpandedZonedMarker, FuncDateFormatter, FuncDateFormatterFunc, Locale, LocaleCodeArg, NativeDateFormatter, NativeDateFormatterOptions, OpenDateRange, VerboseFormattingData, WeekNumberCalculation, ZonedMarker, addDays, addDurations, addMs, addWeeks, arrayToLocalDate, arrayToUtcDate, asCleanDays, asRoughDays, asRoughHours, asRoughMinutes, asRoughMonths, asRoughMs, asRoughSeconds, asRoughYears, buildIsoString, constrainMarkerToRange, createCalendarSystem, createDuration, createVerboseFormattingArg, dateToLocalArray, dateToUtcArray, diffDayAndTime, diffDays, diffHours, diffMinutes, diffSeconds, diffWeeks, diffWholeDays, diffWholeWeeks, durationsEqual, expandZonedMarker, formatDayString, formatIsoMonthStr, formatIsoTimeString, formatTimeZoneOffset, greatestDurationDenominator, intersectRanges, invertRanges, isInt, isValidDate, joinDateTimeFormatParts, multiplyDuration, padStart, parse as parseMarker, parseRange, rangeContainsMarker, rangeContainsRange, rangesEqual, rangesIntersect, registerCalendarSystem, startOfDay, startOfHour, startOfMinute, startOfSecond, subtractDurations, timeAsMs, trimEnd, weekOfYear, wholeDivideDurations };

package/index.js

@@ -306,7 +306,7 @@ function expandZonedMarker(dateInfo, calendarSystem) {
     };
 }
 
-function createVerboseFormattingArg(start, end, context, betterDefaultSeparator) {
+function createVerboseFormattingArg(start, end, context) {
     let startInfo = expandZonedMarker(start, context.calendarSystem);
     let endInfo = end ? expandZonedMarker(end, context.calendarSystem) : null;
     return {
@@ -315,7 +315,6 @@ function createVerboseFormattingArg(start, end, context, betterDefaultSeparator)
         end: endInfo,
         timeZone: context.timeZone,
         localeCodes: context.locale.codes,
-        defaultSeparator: betterDefaultSeparator || context.defaultSeparator,
     };
 }
 
@@ -500,27 +499,22 @@ function buildIsoString(marker, timeZoneOffset, stripZeroTime = false) {
     if (stripZeroTime) {
         s = s.replace('T00:00:00Z', '');
     }
-    if (s.length > 10) { // time part wasn't stripped, can add timezone info
+    if (s.length > 10) {
         if (timeZoneOffset == null) {
             s = s.replace('Z', '');
         }
         else if (timeZoneOffset !== 0) {
             s = s.replace('Z', formatTimeZoneOffset(timeZoneOffset, true));
         }
-        // otherwise, its UTC-0 and we want to keep the Z
     }
     return s;
 }
-// formats the date, but with no time part
-// TODO: somehow merge with buildIsoString and stripZeroTime
-// TODO: rename. omit "string"
 function formatDayString(marker) {
     return marker.toISOString().replace(/T.*$/, '');
 }
 function formatIsoMonthStr(marker) {
     return marker.toISOString().match(/^\d{4}-\d{2}/)[0];
 }
-// TODO: use Date::toISOString and use everything after the T?
 function formatIsoTimeString(marker) {
     return padStart(marker.getUTCHours(), 2) + ':' +
         padStart(marker.getUTCMinutes(), 2) + ':' +
@@ -567,7 +561,6 @@ function parse(str) {
 
 class DateEnv {
     constructor(settings) {
-        var _a;
         this.timeZone = settings.timeZone;
         this.calendarSystem = createCalendarSystem(settings.calendarSystem);
         this.locale = settings.locale;
@@ -584,9 +577,8 @@ class DateEnv {
             this.weekNumberFunc = settings.weekNumberCalculation;
         }
         this.weekText = settings.weekText;
-        this.weekTextShort = (_a = settings.weekTextShort) !== null && _a !== void 0 ? _a : settings.weekText;
+        this.weekTextShort = settings.weekTextShort ?? settings.weekText;
         this.cmdFormatter = settings.cmdFormatter;
-        this.defaultSeparator = settings.defaultSeparator;
     }
     // Creating / Parsing
     createMarker(input) {
@@ -794,25 +786,23 @@ class DateEnv {
         }
         return weekOfYear(marker, this.weekDow, this.weekDoy);
     }
-    // TODO: choke on timeZoneName: long
-    format(marker, formatter) {
-        return formatter.format({
+    formatToParts(marker, formatter) {
+        return formatter.formatToParts({
             marker,
             timeZoneOffset: this.offsetForMarker(marker),
         }, this);
     }
-    // Unlike format(), returns plain string!
-    formatRange(start, end, formatter, dateOptions = {}) {
+    formatRangeToParts(start, end, formatter, dateOptions = {}) {
         if (dateOptions.isEndExclusive) {
             end = addMs(end, -1);
         }
-        return formatter.formatRange({
+        return formatter.formatRangeToParts({
             marker: start,
             timeZoneOffset: this.offsetForMarker(start),
         }, {
             marker: end,
             timeZoneOffset: this.offsetForMarker(end),
-        }, this, dateOptions.defaultSeparator);
+        }, this);
     }
     /*
     DUMB: the omitTime arg is dumb. if we omit the time, we want to omit the timezone offset. and if we do that,
@@ -858,54 +848,268 @@ class DateEnv {
     }
 }
 
-/*
-TODO: fix the terminology of "formatter" vs "formatting func"
-*/
-/*
-At the time of instantiation, this object does not know which cmd-formatting system it will use.
-It receives this at the time of formatting, as a setting.
-*/
-class CmdFormatter {
+const EXTENDED_SETTINGS = new Set([
+    'week',
+    'meridiem',
+    'omitZeroMinute',
+    'omitCommas',
+    'forceCommas',
+    'omitTrailing',
+    'weekdayJustify',
+]);
+const MERIDIEM_RE = /([ap])\.?m\.?/i;
+const COMMA_RE = /,/g;
+const LTR_RE = /\u200e/g; // control character
+const TRAILING_RE = /[\s.,]+$/;
+const WHITESPACE_ONLY_RE = /^\s+$/;
+class NativeDateFormatter {
+    constructor(options) {
+        const standardOptions = {};
+        const extendedOptions = {};
+        for (const name in options) {
+            if (EXTENDED_SETTINGS.has(name)) {
+                extendedOptions[name] = options[name];
+            }
+            else {
+                standardOptions[name] = options[name];
+            }
+        }
+        if (standardOptions.timeZoneName === 'long') {
+            standardOptions.timeZoneName = 'short';
+        }
+        this.timeZoneOnly = Object.keys(standardOptions).length === 1 &&
+            standardOptions.timeZoneName === 'short';
+        this.weekOnly = Boolean(!Object.keys(standardOptions).length && extendedOptions.week);
+        if (!this.timeZoneOnly) {
+            if (standardOptions.timeZoneName) {
+                if (!standardOptions.hour) {
+                    standardOptions.hour = '2-digit';
+                }
+                if (!standardOptions.minute) {
+                    standardOptions.minute = '2-digit';
+                }
+            }
+            if (extendedOptions.omitZeroMinute &&
+                (standardOptions.second || standardOptions.fractionalSecondDigits)) {
+                delete extendedOptions.omitZeroMinute;
+            }
+            standardOptions.timeZone = 'UTC';
+        }
+        this.standardOptions = standardOptions;
+        this.extendedOptions = extendedOptions;
+    }
+    formatToParts(date, context) {
+        const { standardOptions, extendedOptions } = this;
+        if (this.timeZoneOnly) {
+            return [{
+                    type: 'timeZoneName',
+                    value: formatTimeZoneOffset(date.timeZoneOffset),
+                }];
+        }
+        if (this.weekOnly) {
+            return formatWeekNumberParts(context.computeWeekNumber(date.marker), context.weekText, context.weekTextShort, context.locale, extendedOptions.week);
+        }
+        const { normalFormat, zeroFormat } = this.getFormats(context);
+        const format = (zeroFormat && !date.marker.getUTCMinutes())
+            ? zeroFormat
+            : normalFormat;
+        const parts = format.formatToParts(date.marker);
+        return postProcessParts(parts, date, standardOptions, extendedOptions);
+    }
+    formatRangeToParts(start, end, context) {
+        const { standardOptions, extendedOptions } = this;
+        if (this.timeZoneOnly || this.weekOnly) {
+            return this.formatToParts(start, context).map((part) => {
+                return {
+                    source: part.type === 'literal' ? 'shared' : 'startRange',
+                    ...part,
+                };
+            });
+        }
+        const { normalFormat, zeroFormat } = this.getFormats(context);
+        const format = (zeroFormat && !start.marker.getUTCMinutes() && !end.marker.getUTCMinutes())
+            ? zeroFormat
+            : normalFormat;
+        const parts = format.formatRangeToParts(start.marker, end.marker);
+        return postProcessRangeParts(parts, start, end, standardOptions, extendedOptions);
+    }
+    getFormats(context) {
+        if (this.cachedContext !== context) {
+            const { standardOptions, extendedOptions } = this;
+            const { codes } = context.locale;
+            const normalFormat = new Intl.DateTimeFormat(codes, standardOptions);
+            let zeroFormat;
+            if (extendedOptions.omitZeroMinute) {
+                const zeroProps = { ...standardOptions };
+                delete zeroProps.minute;
+                zeroFormat = new Intl.DateTimeFormat(codes, zeroProps);
+            }
+            this.cachedContext = context;
+            this.cachedFormats = { normalFormat, zeroFormat };
+        }
+        return this.cachedFormats;
+    }
+}
+function processPartsLoop(parts, extendedOptions, getTzValue) {
+    let anyTzInjected = false;
+    let priorLiteral;
+    for (const part of parts) {
+        const isLiteral = part.type === 'literal';
+        if (isLiteral || part.type === 'dayPeriod') {
+            let s = part.value;
+            s = s.replace(LTR_RE, '');
+            if (extendedOptions.omitCommas) {
+                s = s.replace(COMMA_RE, '');
+            }
+            if (!isLiteral) {
+                const { meridiem } = extendedOptions;
+                if (meridiem === false) {
+                    s = s.replace(MERIDIEM_RE, '');
+                }
+                else if (meridiem === 'narrow') {
+                    s = s.replace(MERIDIEM_RE, (_m0, m1) => m1.toLocaleLowerCase());
+                }
+                else if (meridiem === 'short') {
+                    s = s.replace(MERIDIEM_RE, (_m0, m1) => `${m1.toLocaleLowerCase()}m`);
+                }
+                else if (meridiem === 'lowercase') {
+                    s = s.replace(MERIDIEM_RE, (m0) => m0.toLocaleLowerCase());
+                }
+                if (priorLiteral) {
+                    priorLiteral.value = priorLiteral.value.trimEnd();
+                }
+            }
+            part.value = s;
+        }
+        else if (part.type === 'timeZoneName') {
+            const tzValue = getTzValue(part);
+            if (tzValue != null) {
+                part.value = tzValue;
+                anyTzInjected = true;
+            }
+        }
+        priorLiteral = isLiteral ? part : undefined;
+    }
+    return { lastLiteral: priorLiteral, anyTzInjected };
+}
+function postProcessParts(parts, date, standardOptions, extendedOptions) {
+    const injectableTz = standardOptions.timeZoneName === 'short'
+        ? (date.timeZoneOffset == null ? 'UTC' : formatTimeZoneOffset(date.timeZoneOffset))
+        : undefined;
+    const { lastLiteral, anyTzInjected } = processPartsLoop(parts, extendedOptions, () => injectableTz);
+    if (injectableTz && !anyTzInjected) {
+        if (lastLiteral) {
+            lastLiteral.value += ' ';
+        }
+        else {
+            parts.push({ type: 'literal', value: ' ' });
+        }
+        parts.push({ type: 'timeZoneName', value: injectableTz });
+    }
+    if (extendedOptions.weekdayJustify &&
+        parts.length === 3 &&
+        WHITESPACE_ONLY_RE.test(parts[1].value)) {
+        if (parts[extendedOptions.weekdayJustify === 'start' ? 2 : 0].type === 'weekday') {
+            parts.reverse();
+        }
+    }
+    if (extendedOptions.forceCommas) {
+        for (const part of parts) {
+            if (part.type === 'literal' && WHITESPACE_ONLY_RE.test(part.value)) {
+                part.value = `,${part.value}`;
+            }
+        }
+    }
+    if (extendedOptions.omitTrailing) {
+        stripTrailingLiteral(parts);
+    }
+    return parts.filter((part) => part.value);
+}
+function postProcessRangeParts(parts, start, end, standardOptions, extendedOptions) {
+    const injectTz = standardOptions.timeZoneName === 'short';
+    processPartsLoop(parts, extendedOptions, (part) => {
+        if (!injectTz)
+            return undefined;
+        const offset = part.source === 'endRange' ? end.timeZoneOffset : start.timeZoneOffset;
+        return offset == null ? 'UTC' : formatTimeZoneOffset(offset);
+    });
+    if (extendedOptions.forceCommas) {
+        for (const part of parts) {
+            if (part.type === 'literal' && WHITESPACE_ONLY_RE.test(part.value)) {
+                part.value = `,${part.value}`;
+            }
+        }
+    }
+    if (extendedOptions.omitTrailing) {
+        stripTrailingLiteral(parts);
+    }
+    return parts.filter((part) => part.value);
+}
+function stripTrailingLiteral(parts) {
+    const lastPart = parts[parts.length - 1];
+    if (lastPart?.type === 'literal') {
+        lastPart.value = lastPart.value.replace(TRAILING_RE, '');
+        if (!lastPart.value) {
+            parts.pop();
+        }
+    }
+}
+function formatWeekNumberParts(num, weekText, weekTextShort, locale, display) {
+    const parts = [];
+    if (display === 'long') {
+        parts.push({ type: 'literal', value: weekText });
+    }
+    else if (display === 'short' || display === 'narrow') {
+        parts.push({ type: 'literal', value: weekTextShort });
+    }
+    if (display === 'long' || display === 'short') {
+        parts.push({ type: 'literal', value: ' ' });
+    }
+    parts.push({
+        type: 'week',
+        value: locale.simpleNumberFormat.format(num),
+    });
+    if (locale.options.direction === 'rtl') {
+        parts.reverse();
+    }
+    return parts;
+}
+
+class CmdDateFormatter {
     constructor(cmdStr) {
         this.cmdStr = cmdStr;
     }
-    format(date, context, betterDefaultSeparator) {
-        const res = context.cmdFormatter(this.cmdStr, createVerboseFormattingArg(date, null, context, betterDefaultSeparator));
-        // array of parts?
-        if (typeof res === 'object') {
-            return [joinDateTimeFormatParts(res), res];
+    formatToParts(date, context) {
+        const res = context.cmdFormatter(this.cmdStr, createVerboseFormattingArg(date, null, context));
+        if (Array.isArray(res)) {
+            return res;
         }
-        // otherwise, just a string
-        return [res, [{ type: 'literal', value: res }]];
-    }
-    // Unlike format(), returns plain string!
-    formatRange(start, end, context, betterDefaultSeparator) {
-        const res = context.cmdFormatter(this.cmdStr, createVerboseFormattingArg(start, end, context, betterDefaultSeparator));
-        // array of parts?
-        if (typeof res === 'object') {
-            return joinDateTimeFormatParts(res);
+        return [{ type: 'literal', value: res }];
+    }
+    formatRangeToParts(start, end, context) {
+        const res = context.cmdFormatter(this.cmdStr, createVerboseFormattingArg(start, end, context));
+        if (Array.isArray(res)) {
+            return res.map((part) => ({
+                source: 'shared',
+                ...part,
+            }));
         }
-        // otherwise, just a string
-        return res;
+        return [{ source: 'shared', type: 'literal', value: res }];
     }
 }
 
-class FuncFormatter {
+class FuncDateFormatter {
     constructor(func) {
         this.func = func;
     }
-    format(date, context, betterDefaultSeparator) {
-        const str = this.func(createVerboseFormattingArg(date, null, context, betterDefaultSeparator));
-        return [
-            str,
-            // HACK. In future versions, allow func-formatters to return parts?
-            [{ type: 'literal', value: str }],
-        ];
+    formatToParts(date, context) {
+        const str = this.func(createVerboseFormattingArg(date, null, context));
+        return [{ type: 'literal', value: str }];
     }
-    // Unlike format(), returns plain string!
-    formatRange(start, end, context, betterDefaultSeparator) {
-        return this.func(createVerboseFormattingArg(start, end, context, betterDefaultSeparator));
+    formatRangeToParts(start, end, context) {
+        const str = this.func(createVerboseFormattingArg(start, end, context));
+        return [{ source: 'shared', type: 'literal', value: str }];
     }
 }
 
-export { CmdFormatter, DateEnv, FuncFormatter, addDays, addDurations, addMs, addWeeks, arrayToLocalDate, arrayToUtcDate, asCleanDays, asRoughDays, asRoughHours, asRoughMinutes, asRoughMonths, asRoughMs, asRoughSeconds, asRoughYears, buildIsoString, constrainMarkerToRange, createCalendarSystem, createDuration, createVerboseFormattingArg, dateToLocalArray, dateToUtcArray, diffDayAndTime, diffDays, diffHours, diffMinutes, diffSeconds, diffWeeks, diffWholeDays, diffWholeWeeks, durationsEqual, expandZonedMarker, formatDayString, formatIsoMonthStr, formatIsoTimeString, formatTimeZoneOffset, greatestDurationDenominator, intersectRanges, invertRanges, isInt, isValidDate, joinDateTimeFormatParts, multiplyDuration, padStart, parse as parseMarker, parseRange, rangeContainsMarker, rangeContainsRange, rangesEqual, rangesIntersect, registerCalendarSystem, startOfDay, startOfHour, startOfMinute, startOfSecond, subtractDurations, timeAsMs, trimEnd, weekOfYear, wholeDivideDurations };
+export { CmdDateFormatter, DateEnv, FuncDateFormatter, NativeDateFormatter, addDays, addDurations, addMs, addWeeks, arrayToLocalDate, arrayToUtcDate, asCleanDays, asRoughDays, asRoughHours, asRoughMinutes, asRoughMonths, asRoughMs, asRoughSeconds, asRoughYears, buildIsoString, constrainMarkerToRange, createCalendarSystem, createDuration, createVerboseFormattingArg, dateToLocalArray, dateToUtcArray, diffDayAndTime, diffDays, diffHours, diffMinutes, diffSeconds, diffWeeks, diffWholeDays, diffWholeWeeks, durationsEqual, expandZonedMarker, formatDayString, formatIsoMonthStr, formatIsoTimeString, formatTimeZoneOffset, greatestDurationDenominator, intersectRanges, invertRanges, isInt, isValidDate, joinDateTimeFormatParts, multiplyDuration, padStart, parse as parseMarker, parseRange, rangeContainsMarker, rangeContainsRange, rangesEqual, rangesIntersect, registerCalendarSystem, startOfDay, startOfHour, startOfMinute, startOfSecond, subtractDurations, timeAsMs, trimEnd, weekOfYear, wholeDivideDurations };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@full-ui/headless-calendar",
-  "version": "7.0.0-beta.8",
+  "version": "7.1.0-alpha.0",
   "keywords": [
     "headless",
     "calendar",