import type { FocusEventHandler } from 'react'; import type { RequireAtLeastOne } from 'type-fest'; import { AriaDisabledProps } from '../../core/types/a11y-props.js'; import type { BehaviorTrackingProps } from '../../core/types/behavior-tracking-props.js'; import { DataTestId } from '../../core/types/data-props.js'; import type { FormControlProps } from '../../core/types/form-control-props.js'; import { MaskingProps } from '../../core/types/masking-props.js'; import { StylingProps } from '../../core/types/styling-props.js'; import type { TimeValue, Timeframe } from '../../core/types/time.js'; import type { DateTimePickerPrecision, DateTimePickerType } from '../date-time-picker/types.js'; import type { FormControlRef, TimeRangePickerRef } from '../shared-types.js'; import type { SpinButtonHandler } from '../spin-buttons/spin-button-group/types.js'; /** * Possible DateTimeInput error states * @internal */ export type DateTimeRangeError = DateTimeError | 'invalidOrder'; /** @internal */ export type ValidationError = { error: DateTimeRangeError; source: 'both' | 'from' | 'to'; }; /** * Props for the controlled and uncontrolled version for the DateTimeRangePicker component. * @internal */ export type DateTimeRangePickerProps = FormControlProps | RequireAtLeastOne | null, (value: Timeframe | null) => void> & StylingProps & DataTestId & MaskingProps & BehaviorTrackingProps & { /** * The ISODatetime string of the earliest datetime that can be configured. * @defaultValue '1677-09-21T00:12:43.145224192Z' */ min?: string; /** * The ISODatetime string of the latest datetime that can be configured. * @defaultValue '2262-04-11T23:47:16.854775807Z' */ max?: string; /** * Determines the level of precision of the time component. * @defaultValue 'minutes' */ precision?: DateTimePickerPrecision; /** * The placeholder that's shown in the respective input fields if the content is empty. */ placeholder?: { from?: string; to?: string; }; /** * Callback triggered when the element loses focus. */ onBlur?: FocusEventHandler; }; /** * Imperative handler to give access to the DOM elements of the DateTimeRangePicker. * It provides additional methods to interact with the DateTimeRangePicker. * @internal */ export type DateTimeRangePickerRef = Omit & Pick & { /** Open calendar widget.*/ readonly open: () => void; /** Close calendar widget.*/ readonly close: () => void; /** Returns the current internal from/to values, including when only one side is set. */ readonly getCurrentValue: () => { from: TimeValue | null; to: TimeValue | null; }; }; /** * Possible DateTimeInput error states * @internal */ export type DateTimeError = 'valueMissing' | 'invalid' | 'outsideRange' | null; /** * Common props for the controlled and uncontrolled version for the DateTimeInput component. * @internal */ export type DateTimeInputProps = FormControlProps void> & StylingProps & DataTestId & { /** * Determines which spin buttons will be shown when not in expression mode. */ type?: DateTimePickerType; /** * The placeholder that's shown in the respective input fields if the content is empty. */ placeholder?: string; /** * Callback triggered when the element has an error. */ onError?: (error: DateTimeError) => void; /** * Used to connect the hidden input with the form field context */ controlId?: string; /** Internal: validation mode used when required empty values are checked. */ validationValueMode?: 'single'; /** * Called when the user navigates backwards past the first spin button of this input * (ArrowLeft at position 0, or Backspace with collapsed cursor at position 0). */ onLeadingEdge?: () => void; /** * Called when the user navigates forward past the last spin button of this input * (ArrowRight at the last cursor position). */ onTrailingEdge?: () => void; /** * Called with the overflow character when a digit overflows the last spin button * and there is no further spin button within this input. */ onTrailingOverflow?: (overflowChar: string) => void; /** * When pasting a date-only value, determines whether to anchor the * time portion at the start or end of the day. * @defaultValue 'startOfDay' */ dateOnlyPasteAnchor?: 'startOfDay' | 'endOfDay'; /** * Called after a complete value was successfully pasted. */ onPasteComplete?: () => void; }; /** * Imperative handler to give access to the DOM elements of the DateTimeInput. * @internal */ export type DateTimeInputRef = Omit, 'inputRef'> & { readonly inputRef?: HTMLInputElement | null; readonly expressionInputRef?: HTMLSpanElement | null; readonly spinButtonHandlers: Map; /** * Focuses the last interactive element (last spin button or expression input). * Useful when navigating backwards into this input from the sibling input. */ readonly focusLast: () => void; /** * Clears all spin buttons, switches to expression mode, and seeds the * expression input with the supplied text. */ readonly setExpressionValue: (text: string) => void; }; /** * Props of the DateRangeSelector value. * @internal */ export type DateRangeSelectorValueType = { from: TimeValue | null; to: TimeValue | null; } | null; /** * Props of the DateRangeSelector component. * @internal */ export interface DateRangeSelectorProps extends StylingProps, DataTestId, MaskingProps, AriaDisabledProps { /** Determine if the trigger is disabled or not. */ disabled?: boolean; /** Determines whether the input is in read-only mode. */ readOnly?: boolean; /** Determine if the trigger is in error state or not. */ error: boolean; } /** * Imperative handle to provide methods to interact with the calendar widget. * @internal */ export interface DateRangeSelectorRef { /** Open the calendar widget. */ open(): void; /** Close the calendar widget. */ close(): void; } /** * Snapshot of a DateTimeInput state used for undo operations. * @internal */ export type UndoSnapshot = { value: TimeValue | null; valueType: 'expression' | 'iso8601'; spinButtonTexts: Map; expressionText: string; };