@astryxdesign/core 0.7.8 → 0.7.9-canary.0200dfe

package/dist/DateInput/monthGeometry.js

@@ -2,14 +2,16 @@
 
 /**
  * @file monthGeometry.ts
- * @input PlainDate values, scroll offsets, pane heights
- * @output Pure month-index arithmetic and the virtualized pane window
- * @position Internal helper; consumed by MonthScroller.tsx and DateInput.tsx
+ * @input PlainDate values, a calendar system, scroll offsets, pane heights
+ * @output Month-index arithmetic for a calendar and the virtualized pane window
+ * @position Internal helper; consumed by the touch date surfaces
  *
- * A "month index" is a single integer that totally orders calendar months:
- * `year * 12 + (month - 1)`. The scroller is a list of equal-width panes, so
- * one integer converts freely between a month, a row in that list, and a
- * scroll offset — which is the whole trick behind continuous scrolling.
+ * A "month index" is a single integer that totally orders calendar months. In
+ * the Gregorian-aligned calendars it is `year * 12 + (month - 1)`; in the
+ * others it counts calendar months from a fixed month, because their years
+ * have 12 or 13 months. The scroller is a list of equal-width panes, so one
+ * integer converts freely between a month, a row in that list, and a scroll
+ * offset — which is the whole trick behind continuous scrolling.
  *
  * These are pure functions on purpose: the scroll math is the part most likely
  * to be wrong, and it is testable without a layout engine.
@@ -17,6 +19,8 @@
  * SYNC: When modified, update DateInputTouch.test.tsx.
  */
 
+import { calendarAddMonths, calendarMonthOf, calendarMonthOfYear, calendarMonthsBetween, calendarMonthsInCalendarYear, calendarShiftYears, calendarYearMonthOf, isGregorianAligned } from "../utils/calendarSystem.js";
+
 /** How many months are reachable in either direction when unbounded. */
 export const DEFAULT_MONTH_REACH = 600;
 
@@ -95,4 +99,74 @@ export function rowsIn({
     rows.push(row);
   }
   return rows;
+}
+
+/**
+ * Month indexes for one calendar. Years and month positions are the ones
+ * `calendarMonthOfYear` counts.
+ */
+
+const GREGORIAN_MONTH_MODELS = new Map();
+function gregorianMonthModel(calendar) {
+  let model = GREGORIAN_MONTH_MODELS.get(calendar);
+  if (model == null) {
+    model = {
+      calendar,
+      indexOf: monthIndexOf,
+      monthAt: index => {
+        const {
+          year,
+          month
+        } = fromMonthIndex(index);
+        return calendarMonthOfYear(calendar, year, month);
+      },
+      yearMonthAt: fromMonthIndex,
+      indexOfYearMonth: toMonthIndex,
+      monthsInYear: () => 12,
+      shiftYears: (index, years) => index + years * 12
+    };
+    GREGORIAN_MONTH_MODELS.set(calendar, model);
+  }
+  return model;
+}
+
+// The month that holds EPOCH is index 0. Any fixed month works; a recent one
+// keeps the indexes of nearby months small.
+const EPOCH = {
+  year: 2000,
+  month: 1,
+  day: 1
+};
+function temporalMonthModel(calendar) {
+  const epoch = calendarMonthOf(calendar, EPOCH);
+  // Temporal arithmetic is slow next to a render. The panes and the wheels ask
+  // for the same months on every render.
+  const months = new Map();
+  const monthAt = index => {
+    let month = months.get(index);
+    if (month == null) {
+      month = calendarAddMonths(calendar, epoch, index);
+      months.set(index, month);
+    }
+    return month;
+  };
+  const indexOf = date => calendarMonthsBetween(calendar, epoch, calendarMonthOf(calendar, date));
+  return {
+    calendar,
+    indexOf,
+    monthAt,
+    yearMonthAt: index => calendarYearMonthOf(calendar, monthAt(index)),
+    indexOfYearMonth: (year, month) => indexOf(calendarMonthOfYear(calendar, year, month).start),
+    monthsInYear: year => calendarMonthsInCalendarYear(calendar, year),
+    shiftYears: (index, years) => indexOf(calendarShiftYears(calendar, monthAt(index).start, years))
+  };
+}
+
+/**
+ * The month model of a calendar. A calendar that needs Temporal must be
+ * available in this runtime; `useCalendarSystem` resolves one that is not to
+ * `gregory`.
+ */
+export function createMonthModel(calendar) {
+  return isGregorianAligned(calendar) ? gregorianMonthModel(calendar) : temporalMonthModel(calendar);
 }

package/dist/DateInput/useCalendarPresentation.d.ts

@@ -0,0 +1,10 @@
+import { type CalendarSystem } from '../utils/calendarSystem.js';
+import { type LegacyNativePicker, type PickerPresentation } from '../utils/inputPresentation.js';
+export interface CalendarPresentation {
+    /** The calendar the component shows. */
+    calendar: CalendarSystem;
+    /** The presentation policy, with native surfaces replaced in a calendar the native control cannot show. */
+    presentation: PickerPresentation;
+}
+export declare function useCalendarPresentation(source: string, calendarProp: CalendarSystem | undefined, presentation: PickerPresentation | undefined, nativePicker: LegacyNativePicker | undefined): CalendarPresentation;
+//# sourceMappingURL=useCalendarPresentation.d.ts.map

package/dist/DateInput/useCalendarPresentation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCalendarPresentation.d.ts","sourceRoot":"","sources":["../../src/DateInput/useCalendarPresentation.ts"],"names":[],"mappings":"AAcA,OAAO,EACL,KAAK,cAAc,EAEpB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EACL,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,EAGxB,MAAM,4BAA4B,CAAC;AAEpC,MAAM,WAAW,oBAAoB;IACnC,wCAAwC;IACxC,QAAQ,EAAE,cAAc,CAAC;IACzB,2GAA2G;IAC3G,YAAY,EAAE,kBAAkB,CAAC;CAClC;AAED,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,cAAc,GAAG,SAAS,EACxC,YAAY,EAAE,kBAAkB,GAAG,SAAS,EAC5C,YAAY,EAAE,kBAAkB,GAAG,SAAS,GAC3C,oBAAoB,CAyBtB"}

package/dist/DateInput/useCalendarPresentation.js

@@ -0,0 +1,32 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+'use client';
+
+/**
+ * @file useCalendarPresentation.ts
+ * @input A date component's `calendar`, `presentation`, and `nativePicker`
+ * @output The resolved calendar and the presentation policy it allows
+ * @position DateInput helper hook; used by DateInput and DateTimeInput to
+ *   choose a surface. Warns once when an explicit `native` cannot apply.
+ */
+import { useEffect } from 'react';
+import { useCalendarSystem } from "../i18n/useCalendarSystem.js";
+import { isGregorianCalendar } from "../utils/calendarSystem.js";
+import { warnOnce } from "../utils/devWarning.js";
+import { calendarPickerPresentation, effectivePickerPresentation } from "../utils/inputPresentation.js";
+export function useCalendarPresentation(source, calendarProp, presentation, nativePicker) {
+  const calendar = useCalendarSystem(calendarProp, source);
+  const isNativeCalendar = isGregorianCalendar(calendar);
+  const isNativeOverridden = presentation === 'native' && !isNativeCalendar;
+  // Synchronizes the development console. The key is the component and
+  // calendar, so a replay or a second field does not warn again.
+  useEffect(() => {
+    if (isNativeOverridden) {
+      warnOnce(`presentation-native-calendar:${source}:${calendar}`, source, `presentation="native" shows the Astryx picker in the "${calendar}" ` + 'calendar, because the native date control shows only Gregorian ' + 'dates: the popover on a fine pointer and the bottom sheet on a ' + 'coarse pointer.');
+    }
+  }, [isNativeOverridden, source, calendar]);
+  return {
+    calendar,
+    presentation: calendarPickerPresentation(effectivePickerPresentation(presentation, nativePicker), isNativeCalendar)
+  };
+}

package/dist/DateInput/useTypedDate.d.ts

@@ -0,0 +1,92 @@
+import type { InputStatus } from '../Field/types.js';
+import { type CalendarSystem } from '../utils/calendarSystem.js';
+import { type CalendarDateParseResult } from '../utils/calendarDateParser.js';
+import type { ISODateString, PlainDate } from '../utils/dateTypes.js';
+import { type SharedDateFormat } from '../utils/plainDate.js';
+/** A rejected typed date, by the message it announces. */
+export type TypedDateError = 'unreadable' | 'nonexistent' | 'outOfRange';
+export interface UseTypedDateOptions {
+    /** The component that names itself in development warnings. */
+    source: string;
+    /** The field's own calendar; the provider's calendar applies otherwise. */
+    calendar?: CalendarSystem;
+    /** The committed display format. */
+    format: SharedDateFormat | ((value: ISODateString) => string);
+    min?: ISODateString;
+    max?: ISODateString;
+    isDateDisabled: (date: PlainDate) => boolean;
+}
+export interface TypedDate {
+    /** The resolved calendar, for the field's Calendar. */
+    calendar: CalendarSystem;
+    /** Builds the lexicon ahead of the first keystroke. */
+    prepare: () => void;
+    parse: (text: string) => CalendarDateParseResult;
+    formatCommitted: (value: ISODateString) => string;
+    /**
+     * An example date for an empty focused field, or null for Gregorian. The
+     * example is today when the field accepts it, else the nearest date it
+     * accepts.
+     */
+    getFormatHint: () => string | null;
+    /** Names the calendar, or null when it is the provider's calendar. */
+    calendarDescription: string | null;
+    /** The message for a rejected result. */
+    errorMessage: (result: CalendarDateParseResult) => string;
+}
+/** The rejection a result shows: errors of complete text, or of committed text. */
+export declare function typedDateError(result: CalendarDateParseResult | null, isCommitted: boolean): TypedDateError | null;
+/**
+ * Typed entry for a date text field in the active calendar. Values stay
+ * Gregorian; the calendar changes only what people type and read.
+ */
+export declare function useTypedDate({ source, calendar: calendarProp, format, min, max, isDateDisabled, }: UseTypedDateOptions): TypedDate;
+export interface UseTypedDateFieldOptions extends UseTypedDateOptions {
+    /** The committed date. */
+    value: ISODateString | undefined;
+    /** The date the field shows, which leads `value` while a commit is in flight. */
+    shownValue: ISODateString | undefined;
+    /** Reports a typed date. */
+    onChange: (value: ISODateString) => void;
+    /** Runs when Enter or blur commits emptied text. */
+    onClear: () => void;
+    /** Runs when typing completes a new date, such as to show its month. */
+    onTypedDate?: (value: ISODateString) => void;
+    /**
+     * A disabled or busy field ignores typing, Enter and blur, and hides a typed
+     * rejection. Typed text stays until the next Enter or blur once the field is
+     * editable, or until `value` changes. Once the field is editable, text whose
+     * date typing already reported gives way to the field's value.
+     */
+    isDisabled: boolean;
+    /** The caller's status. Rejected text that stays shows its own error instead. */
+    status?: InputStatus;
+    /** Whether the shown status announces itself, as Field's status does. */
+    isStatusAnnounced: boolean;
+    /** Whether the caller gave a placeholder, which replaces the format hint. */
+    hasPlaceholder: boolean;
+}
+export interface TypedDateField {
+    typedDate: TypedDate;
+    /** The text the input shows. */
+    displayValue: string;
+    /** The format hint for an empty focused field. */
+    formatHint: string | null;
+    /** Whether typed text waits to commit. */
+    isPending: boolean;
+    isInvalid: boolean;
+    /** The status the field shows. */
+    fieldStatus: InputStatus | undefined;
+    /** A typed rejection that the field status does not announce. */
+    alertMessage: string;
+    handleChange: (text: string) => void;
+    /** Commits typed text, on Enter or blur. */
+    commit: () => void;
+    handleFocus: () => void;
+    handleBlur: () => void;
+    /** Drops typed text after a date is picked another way. */
+    reset: () => void;
+}
+/** The typed entry of a date text field: its text, rejections, and commits. */
+export declare function useTypedDateField({ value, shownValue, onChange, onClear, onTypedDate, isDisabled, status, isStatusAnnounced, hasPlaceholder, ...options }: UseTypedDateFieldOptions): TypedDateField;
+//# sourceMappingURL=useTypedDate.d.ts.map

package/dist/DateInput/useTypedDate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTypedDate.d.ts","sourceRoot":"","sources":["../../src/DateInput/useTypedDate.ts"],"names":[],"mappings":"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"}

package/dist/DateInput/useTypedDate.js

@@ -0,0 +1,269 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+'use client';
+
+/**
+ * @file useTypedDate.ts
+ * @input Provider locale and calendar, a field's format, bounds and constraints;
+ *   calendarDateParser, and parseDateInput for other Gregorian text
+ * @output Typed-date reading, committed text, the format hint, the calendar
+ *   description and rejection messages for a date text field, and the typed
+ *   entry state that DateInput and DateTimeInput share
+ * @position DateInput helper hook; used by DateInput and DateTimeInput
+ */
+import { useCallback, useMemo, useRef, useState } from 'react';
+import { useLocale } from "../i18n/useLocale.js";
+import { useCalendarSystem } from "../i18n/useCalendarSystem.js";
+import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
+import english from "../i18n/generated-english/DateInput/useTypedDate.generated.js";
+import { isGregorianCalendar } from "../utils/calendarSystem.js";
+import { calendarDisplayName, formatCalendarDateText, formatCalendarDateHint, getCalendarDateLexicon, parseCalendarDate } from "../utils/calendarDateParser.js";
+import { parseDateInput } from "../utils/dateParser.js";
+import { nearestAcceptedDate, plainDateFromISO, plainDateIsAfter, plainDateIsBefore, plainDateToISO, plainDateToday } from "../utils/plainDate.js";
+registerEnglishFallback(english);
+
+/** A rejected typed date, by the message it announces. */
+
+/** The rejection a result shows: errors of complete text, or of committed text. */
+export function typedDateError(result, isCommitted) {
+  if (result == null) {
+    return null;
+  }
+  if (result.kind === 'unreadable' || result.kind === 'incomplete' && isCommitted) {
+    return 'unreadable';
+  }
+  if ((result.kind === 'nonexistent' || result.kind === 'outOfRange') && (result.isComplete || isCommitted)) {
+    return result.kind;
+  }
+  return null;
+}
+
+/**
+ * Typed entry for a date text field in the active calendar. Values stay
+ * Gregorian; the calendar changes only what people type and read.
+ */
+export function useTypedDate({
+  source,
+  calendar: calendarProp,
+  format,
+  min,
+  max,
+  isDateDisabled
+}) {
+  const t = useComponentTranslator();
+  const locale = useLocale();
+  const calendar = useCalendarSystem(calendarProp, source);
+  const providerCalendar = useCalendarSystem(undefined, source);
+  const isGregorian = isGregorianCalendar(calendar);
+  const prepare = useCallback(() => {
+    getCalendarDateLexicon(locale, calendar);
+  }, [locale, calendar]);
+  const parse = useCallback(text => {
+    const result = parseCalendarDate(text, getCalendarDateLexicon(locale, calendar), {
+      isoIsGregorian: format === 'system_date',
+      isDateDisabled
+    });
+    if (!isGregorian || result.kind !== 'unreadable' && result.kind !== 'nonexistent') {
+      return result;
+    }
+    // Gregorian text that only parseDateInput reads still commits, on Enter
+    // or blur only: it is never complete while the person types. This
+    // includes a day-first date in a month-first locale, which
+    // parseDateInput reads by swapping the order.
+    const date = parseDateInput(text, locale);
+    if (date == null) {
+      return result;
+    }
+    return isDateDisabled(date) ? {
+      kind: 'outOfRange',
+      date,
+      isComplete: false
+    } : {
+      kind: 'value',
+      date,
+      isComplete: false
+    };
+  }, [locale, calendar, format, isDateDisabled, isGregorian]);
+  const formatCommitted = useCallback(value => typeof format === 'function' ? format(value) : formatCalendarDateText(plainDateFromISO(value), format, locale, calendar), [format, locale, calendar]);
+  const getFormatHint = useCallback(() => {
+    if (isGregorian) {
+      return null;
+    }
+    const example = nearestAcceptedDate(plainDateToday(), {
+      min: min != null ? plainDateFromISO(min) : null,
+      max: max != null ? plainDateFromISO(max) : null,
+      isDateDisabled
+    });
+    return t('@astryx.dateInput.formatHint', {
+      example: formatCalendarDateHint(example, locale, calendar)
+    });
+  }, [isGregorian, t, locale, calendar, min, max, isDateDisabled]);
+  const calendarName = useMemo(() => calendarDisplayName(calendar, locale), [calendar, locale]);
+  const errorMessage = useCallback(result => {
+    if (result.kind === 'nonexistent') {
+      return t('@astryx.dateInput.nonexistentDate', {
+        calendar: calendarName
+      });
+    }
+    if (result.kind === 'outOfRange') {
+      const boundFormat = typeof format === 'function' ? 'date_long' : format;
+      const writeBound = bound => formatCalendarDateText(plainDateFromISO(bound), boundFormat, locale, calendar);
+      const isBeforeMin = min != null && plainDateIsBefore(result.date, plainDateFromISO(min));
+      const isAfterMax = max != null && plainDateIsAfter(result.date, plainDateFromISO(max));
+      const bounds = !isBeforeMin && !isAfterMax ? 'none' : min != null && max != null ? 'both' : min != null ? 'min' : 'max';
+      return t('@astryx.dateInput.outOfRangeDate', {
+        bounds,
+        min: min != null ? writeBound(min) : '',
+        max: max != null ? writeBound(max) : ''
+      });
+    }
+    return t('@astryx.dateInput.invalidDate');
+  }, [t, calendarName, format, locale, calendar, min, max]);
+  const isProviderCalendar = isGregorian ? isGregorianCalendar(providerCalendar) : calendar === providerCalendar;
+  return {
+    calendar,
+    prepare,
+    parse,
+    formatCommitted,
+    getFormatHint,
+    calendarDescription: isProviderCalendar ? null : t('@astryx.dateInput.calendarDescription', {
+      calendar: calendarName
+    }),
+    errorMessage
+  };
+}
+/** The typed entry of a date text field: its text, rejections, and commits. */
+export function useTypedDateField({
+  value,
+  shownValue,
+  onChange,
+  onClear,
+  onTypedDate,
+  isDisabled,
+  status,
+  isStatusAnnounced,
+  hasPlaceholder,
+  ...options
+}) {
+  const typedDate = useTypedDate(options);
+  // Typed text, or null when the field shows the committed value.
+  const [pendingInput, setPendingInput] = useState(null);
+  // Set when Enter or blur keeps rejected text so the person can correct it.
+  const [isRejectionCommitted, setIsRejectionCommitted] = useState(false);
+  const [isFocused, setIsFocused] = useState(false);
+  // The date that typing last reported, so one typing session reports each
+  // date once.
+  const lastFiredRef = useRef(undefined);
+  const typedResult = pendingInput !== null && pendingInput.trim() ? typedDate.parse(pendingInput) : null;
+  // A locked field hides the rejection but keeps its state, so the rejection
+  // shows again once the field is editable.
+  const typedError = isDisabled ? null : typedDateError(typedResult, isRejectionCommitted);
+  const errorMessage = typedError != null && typedResult != null ? typedDate.errorMessage(typedResult) : null;
+  // Text that stays in the field shows its reason as well as announcing it.
+  const isErrorShown = typedError === 'nonexistent' || typedError === 'outOfRange' || typedError === 'unreadable' && isRejectionCommitted;
+  const typedStatus = isErrorShown && errorMessage != null ? {
+    type: 'error',
+    message: errorMessage
+  } : undefined;
+  const fieldStatus = typedStatus ?? status;
+  const reset = useCallback(() => {
+    setPendingInput(null);
+    setIsRejectionCommitted(false);
+  }, []);
+
+  // A value from outside drops typed text. Computed during render, so it
+  // takes no extra render.
+  const prevValueRef = useRef(value);
+  if (value !== prevValueRef.current) {
+    prevValueRef.current = value;
+    if (value !== lastFiredRef.current) {
+      lastFiredRef.current = undefined;
+      if (pendingInput !== null) {
+        setPendingInput(null);
+        setIsRejectionCommitted(false);
+      }
+    }
+  }
+
+  // Typing already reported this date through `onChange`. Once the field is
+  // editable, it shows its value. A retyped date then reports again. A focused
+  // field keeps the text until Enter or blur, which end the typing session.
+  const wasDisabledRef = useRef(isDisabled);
+  if (isDisabled !== wasDisabledRef.current) {
+    wasDisabledRef.current = isDisabled;
+    if (!isDisabled && !isFocused && typedResult?.kind === 'value' && plainDateToISO(typedResult.date) === lastFiredRef.current) {
+      lastFiredRef.current = undefined;
+      setPendingInput(null);
+      setIsRejectionCommitted(false);
+    }
+  }
+  const report = useCallback(date => {
+    if (date === value || date === lastFiredRef.current) {
+      return false;
+    }
+    lastFiredRef.current = date;
+    onChange(date);
+    return true;
+  }, [value, onChange]);
+  const handleChange = useCallback(text => {
+    if (isDisabled) {
+      return;
+    }
+    setPendingInput(text);
+    setIsRejectionCommitted(false);
+    // Report a date only once more typing cannot change it.
+    const result = typedDate.parse(text);
+    if (result.kind === 'value' && result.isComplete) {
+      const date = plainDateToISO(result.date);
+      if (report(date)) {
+        onTypedDate?.(date);
+      }
+    }
+  }, [isDisabled, typedDate, report, onTypedDate]);
+  const commit = useCallback(() => {
+    if (pendingInput === null || isDisabled) {
+      return;
+    }
+    if (!pendingInput.trim()) {
+      onClear();
+      reset();
+      return;
+    }
+    const result = typedDate.parse(pendingInput);
+    if (result.kind === 'incomplete' || result.kind === 'nonexistent' || result.kind === 'outOfRange') {
+      // Keep the text and show why it cannot commit; never finish or adjust
+      // the date.
+      setIsRejectionCommitted(true);
+      return;
+    }
+    if (result.kind === 'value') {
+      report(plainDateToISO(result.date));
+    }
+    // A new typing session reports a retyped date again.
+    lastFiredRef.current = undefined;
+    reset();
+  }, [pendingInput, isDisabled, onClear, typedDate, report, reset]);
+  const handleFocus = useCallback(() => {
+    setIsFocused(true);
+    typedDate.prepare();
+  }, [typedDate]);
+  const handleBlur = useCallback(() => {
+    setIsFocused(false);
+    commit();
+  }, [commit]);
+  const displayValue = pendingInput !== null ? pendingInput : shownValue != null && /^\d{4}-\d{2}-\d{2}$/.test(shownValue) ? typedDate.formatCommitted(shownValue) : '';
+  return {
+    typedDate,
+    displayValue,
+    formatHint: !hasPlaceholder && isFocused && !displayValue ? typedDate.getFormatHint() : null,
+    isPending: pendingInput !== null,
+    isInvalid: typedError != null,
+    fieldStatus,
+    alertMessage: isStatusAnnounced && typedStatus != null ? '' : errorMessage ?? '',
+    handleChange,
+    commit,
+    handleFocus,
+    handleBlur,
+    reset
+  };
+}

package/dist/DateInput/wheelStrip.js

@@ -16,7 +16,7 @@
  */
 
 import { canVibrate, playHaptic } from "../gestures/haptics.js";
-import { createMotionAnimator } from "../motion/animator.js";
+import { createMotionEngine } from "../motion/animator.js";
 import { reducedMotionFade } from "../motion/reducedMotion.js";
 import { picker } from "../motion/uikit/picker.js";
 import { nearestIndex, reachesRow, tickTimes } from "./wheelPhysics.js";
@@ -55,7 +55,7 @@ function now() {
  * ```
  */
 export function createWheelStrip(initialLayout) {
-  const animator = createMotionAnimator(null);
+  const animator = createMotionEngine(null);
   let layout = initialLayout;
   let running = null;
   let nearestListener = null;

package/dist/DateRangeInput/DateRangeInput.d.ts

@@ -1,3 +1,4 @@
+import { type CalendarSystem } from '../utils/calendarSystem.js';
 import { type InputStatus } from '../Field/index.js';
 import { type ISODateString, type DateRange, type DayOfWeek, type DayOfWeekName } from '../Calendar/index.js';
 import { type FieldInputBaseProps } from '../Field/fieldParts.js';
@@ -167,6 +168,21 @@ export interface DateRangeInputProps extends Omit<FieldInputBaseProps<HTMLButton
      * @default 2
      */
     numberOfMonths?: 1 | 2;
+    /**
+     * The calendar the trigger text and the popover calendar show, such as
+     * `'persian'`, `'hebrew'`, or `'buddhist'`. `value`, `onChange`, `min`,
+     * `max`, and presets stay Gregorian ISO dates in every calendar. Calendars
+     * other than `gregory`, `iso8601`, `buddhist`, `roc`, and `japanese` need
+     * `Temporal`, native or a polyfill the application loads; without it the
+     * field shows Gregorian dates.
+     *
+     * @default the InternationalizationProvider's calendar, else `'gregory'`
+     * @example
+     * ```
+     * <DateRangeInput label="Stay" calendar="persian" value={range} onChange={setRange} />
+     * ```
+     */
+    calendar?: CalendarSystem;
     /**
      * First day of week in the calendar. Accepts a number
      * (0 = Sunday … 6 = Saturday) or a three-letter day name ('sun'–'sat',
@@ -196,7 +212,7 @@ export interface DateRangeInputProps extends Omit<FieldInputBaseProps<HTMLButton
  * />
  * ```
  */
-export declare function DateRangeInput({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, value, onChange, changeAction, isLoading, min, max, dateConstraints, maxRangeSpan, minRangeSpan, presets, hasClear, placeholder: placeholderFromProps, size: sizeProp, status, statusVariant, labelTooltip, numberOfMonths, weekStartsOn, width, containerXstyle, containerClassName, containerStyle, controlXstyle, controlClassName, controlStyle, ref, ...restProps }: DateRangeInputProps): import("react").JSX.Element;
+export declare function DateRangeInput({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, value, onChange, changeAction, isLoading, min, max, dateConstraints, maxRangeSpan, minRangeSpan, presets, hasClear, placeholder: placeholderFromProps, size: sizeProp, status, statusVariant, labelTooltip, numberOfMonths, weekStartsOn, calendar: calendarProp, width, containerXstyle, containerClassName, containerStyle, controlXstyle, controlClassName, controlStyle, ref, ...restProps }: DateRangeInputProps): import("react").JSX.Element;
 export declare namespace DateRangeInput {
     var displayName: string;
 }

package/dist/DateRangeInput/DateRangeInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../src/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../src/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"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"}