/*! * Copyright (c) 2024-present, Okta, Inc. and/or its affiliates. All rights reserved. * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.") * * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0. * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * * See the License for the specific language governing permissions and limitations under the License. */ import { DateTime } from "luxon"; import { FocusEventHandler } from "react"; import { FieldComponentProps } from "../FieldComponentProps.js"; import { TimeZoneOption, TimeZonePickerProps } from "./TimeZonePicker.js"; export type UncontrolledDateFieldProps = { /** * Value the field is seeded with while it mounts. Read only on that first render, so a later change is ignored. * * NOTE: Must be a date string in ISO format */ defaultValue?: string; /** * Value the field displays for its whole life. Should not be used if `defaultValue` is used */ value?: never; }; export type ControlledDateFieldProps = { /** * Value the field is seeded with while it mounts. Should not be used if `value` is used */ defaultValue?: never; /** * Value the field displays for its whole life, so passing an empty value clears it. * * NOTE: Must be a date string in ISO format. Anything that cannot be parsed * leaves the field empty */ value?: string; }; export type OdysseyDateFieldBaseProps = { /** * Disable specific date(s). * * Warning: This function can be called multiple times (for example when rendering date calendar, checking if focus can be moved to a certain date, etc.). Expensive computations can impact performance. */ isDateEnabled?: (date: Date) => boolean; /** * Disable specific month(s). */ isMonthEnabled?: (date: Date) => boolean; /** * Disable specific year(s). */ isYearEnabled?: (date: Date) => boolean; /** * The label for the `input` element. */ label: string; /** * Maximum date allowed. * * NOTE: If not a valid date string in ISO format, `maxDate` will not apply */ maxDate?: string; /** * Minimum date allowed. * * NOTE: If not a valid date string in ISO format, `minDate` will not apply */ minDate?: string; /** * Callback fired when the a date field loses focus */ onBlur?: FocusEventHandler; /** * Callback fired when the a date is selected with the calendar. */ onCalendarDateChange?: ({ value, timeZone, }: { timeZone: string; value: string | undefined; }) => void; /** * Callback fired when the date/text input changes. */ onInputChange?: (value: string) => void; /** * a default timezone for the picker */ timeZone?: string; /** * If provided, a `TimeZonePicker` will be rendered below the DatePicker. These options will populate as the Autocomplete options */ timeZoneOptions?: TimeZoneOption[]; /** * label for `TimeZonePicker` */ timeZonePickerLabel?: TimeZonePickerProps["label"]; }; export type OdysseyDateFieldProps = OdysseyDateFieldBaseProps & (ControlledDateFieldProps | UncontrolledDateFieldProps); type FormatDateTimeToUtcIsoDateString = (value: DateTime) => string | undefined; export declare const useOdysseyDateFields: ({ defaultValue, isDateEnabled, isMonthEnabled, isYearEnabled, minDate: minDateProp, maxDate: maxDateProp, onInputChange: onInputChangeProp, timeZone, value, }: Pick & Pick) => { closeCalendar: () => void; commonIcons: { ArrowLeftIcon: import("react").MemoExoticComponent & import("react").RefAttributes>>; ArrowRightIcon: import("react").MemoExoticComponent & import("react").RefAttributes>>; CalendarIcon: import("react").MemoExoticComponent & import("react").RefAttributes>>; ChevronDownIcon: import("react").MemoExoticComponent & import("react").RefAttributes>>; }; defaultedLanguageCode: string; formatDateTimeToUtcIsoDateString: FormatDateTimeToUtcIsoDateString; formatDayOfWeek: (date: DateTime) => string; internalTimeZone: string; internalValueRef: import("react").MutableRefObject | null>; isOpen: boolean; isValidTimeZone: (timeZone: string) => boolean; localeText: import("./useDateFieldsTranslations.js").DateFieldsTranslations; maxDate: DateTime | undefined; minDate: DateTime | undefined; popperElement: HTMLInputElement | null | undefined; onInputChange: (value: string) => void; onTimeZoneChange: (timeZone: string | undefined) => void; pickerValue: DateTime | DateTime | null; setInternalTimeZone: import("react").Dispatch>; setIsOpen: import("react").Dispatch>; setPopperElement: import("react").Dispatch>; shouldDisableDate: (date: DateTime) => boolean; shouldDisableMonth: (date: DateTime) => boolean; shouldDisableYear: (date: DateTime) => boolean; toggleCalendarVisibility: () => void; }; export {}; //# sourceMappingURL=useOdysseyDateFields.d.ts.map