import type * as React from 'react'; import type { CalendarProps, CalendarSelectionMode, CalendarValue, CalendarValueInput } from '../calendar/index.cjs'; import type { DateFieldProps } from '../date-field/index.cjs'; import type { TimeFieldProps } from '../time-field/index.cjs'; import type { Granularity } from '../utils/date-segments.cjs'; import type { AutoFocusEvent } from '../utils/dismissal.cjs'; import type { FormValidityHandle } from '../utils/formControl.cjs'; import type { PassThroughProps } from '../utils/passThrough.cjs'; import type { PopperContentProps } from '../utils/popper.cjs'; import type { PortalProps } from '../utils/portal.cjs'; import type { PrimitivePropsWithRef } from '../utils/primitive.cjs'; import type { FocusOutsideEvent, InteractOutsideEvent } from '../utils/useDismiss.cjs'; /** @internal Shared state distributed from {@link DatePicker} to its parts via context. Not part of the public API. */ export interface DatePickerContextValue { triggerRef: React.RefObject; contentRef: React.RefObject; contentId: string; triggerId: string; value: CalendarValue; selectionMode: CalendarSelectionMode; granularity: Granularity; /** Whether a completed selection dismisses the popup. */ closeOnSelect: boolean; onValueChange: (value: CalendarValue) => void; open: boolean; onOpenChange: (open: boolean) => void; disabled: boolean; /** Whether all editable parts refuse edits but stay focusable. */ readOnly: boolean; /** Whether picker paints as failing validation. */ invalid: boolean; } /** Props for the {@link DatePicker} root. Standard attributes ({@link PassThroughProps}) land on the derived `DatePickerTrigger`. */ export interface DatePickerProps extends PassThroughProps { /** * Replaces derived anatomy entirely; omitted, derives trigger, portal, popup, calendar, fields. * @default undefined */ children?: React.ReactNode | undefined; /** * Derived trigger placeholder (ignored when `children` replaces anatomy). * @default 'Select date' */ placeholder?: string | undefined; /** * BCP 47 locale tag for trigger formatting (ignored when `children` replaces). * @default undefined — runtime's default. */ locale?: string | undefined; /** * Whether derived popup includes typed-entry date field (single-mode only). * @default false */ showInput?: boolean | undefined; /** * How many dates calendar selects (decides `value` shape and auto-close). * @default 'single' */ selectionMode?: CalendarSelectionMode | undefined; /** * Value precision; past `'day'` puts picker in date-time mode. * @default 'day' */ granularity?: Granularity | undefined; /** * Current selection for controlled usage; shape follows `selectionMode` (ISO-8601 strings also accepted). * @default undefined — uncontrolled. */ value?: CalendarValueInput | undefined; /** * Initial selection for uncontrolled usage (same shape and forms as `value`). * @default undefined */ defaultValue?: CalendarValueInput | undefined; /** * Fires with new selection when changed. * @default undefined — no-op. */ onValueChange?: ((value: CalendarValue) => void) | undefined; /** * Whether popup is open for controlled usage; pair with `onOpenChange`. * @default undefined — uncontrolled. */ open?: boolean | undefined; /** * Initial open state for uncontrolled usage. * @default false */ defaultOpen?: boolean | undefined; /** * Fires with new open state on change. * @default undefined — no-op. */ onOpenChange?: ((open: boolean) => void) | undefined; /** * Fires once open-state change finishes (after animation ends). * @default undefined — no-op. */ onOpenChangeComplete?: ((open: boolean) => void) | undefined; /** * Form field name; selection submits as local-time `YYYY-MM-DD` strings like ``. * @default undefined */ name?: string | undefined; /** * Form id picker submits into (only meaningful with `name`). * @default undefined */ form?: string | undefined; /** * Marks picker required; reports `valueMissing` and blocks submission without selection. * @default false */ required?: boolean | undefined; /** * Disables trigger and prevents popup opening. * @default false */ disabled?: boolean | undefined; /** * Whether completed selection dismisses popup (single immediate, range once second date, never multiple). * @default true */ closeOnSelect?: boolean | undefined; /** * Makes picker non-editable; trigger still opens, everything focusable, no selection changes. * @default false */ readOnly?: boolean | undefined; /** * Marks picker invalid (`data-invalid` on trigger/content, `aria-invalid="true"` on trigger). * @default false */ invalid?: boolean | undefined; /** * DOM node the derived Portal renders the overlay into, so it inherits that subtree's theme and stacking context (e.g. a `[data-skdx-theme]` wrapper). * @default undefined — `document.body`. */ portalContainer?: Element | DocumentFragment | null | undefined; } /** Props for {@link DatePickerTrigger}, button opening/closing popup. */ export interface DatePickerTriggerProps extends PrimitivePropsWithRef<'button'> { } /** Props for {@link DatePickerPortal}, teleports content to `document.body` while open. */ export interface DatePickerPortalProps extends PortalProps { /** * Keep portal mounted while closed (useful for animation libraries needing outgoing content during exit). * @default false */ forceMount?: boolean | undefined; } /** Props for {@link DatePickerContent}, popup panel (extends popper positioning, `sideOffset` defaults to 4). */ export interface DatePickerContentProps extends PopperContentProps { /** * Keep panel mounted even while popup is closed. * @default false */ forceMount?: boolean | undefined; /** * Fires on Escape (call `preventDefault()` to prevent close). * @default undefined — no-op. */ onEscapeKeyDown?: ((event: KeyboardEvent) => void) | undefined; /** * Fires on pointerdown outside (call `preventDefault()` to prevent close). * @default undefined — no-op. */ onPointerDownOutside?: ((event: PointerEvent) => void) | undefined; /** * Fires on focus outside (call `preventDefault()` to prevent close; receives cancelable stand-in). * @default undefined — no-op. */ onFocusOutside?: ((event: FocusOutsideEvent) => void) | undefined; /** * Fires for any outside interaction before specific handler. * @default undefined — no-op. */ onInteractOutside?: ((event: InteractOutsideEvent) => void) | undefined; /** * Fires before focus moves into popup on open (to selected date or today; call `preventDefault()` to prevent). * @default undefined — no-op. */ onOpenAutoFocus?: ((event: AutoFocusEvent) => void) | undefined; /** * Fires before focus returns to trigger on inside close (call `preventDefault()` to suppress; not fired for outside dismissal). * @default undefined — no-op. */ onCloseAutoFocus?: ((event: AutoFocusEvent) => void) | undefined; } /** Props for {@link DatePickerCalendar}, like {@link CalendarProps} minus root-owned wiring. */ export interface DatePickerCalendarProps extends Omit { } /** Props for {@link DatePickerClose}, button closing popup without changing selection. */ export interface DatePickerCloseProps extends PrimitivePropsWithRef<'button'> { } /** Props for {@link DatePickerInput}, like {@link DateFieldProps} minus root-owned wiring. */ export interface DatePickerInputProps extends Omit { } /** Props for {@link DatePickerTimeField}, like {@link TimeFieldProps} minus component-owned wiring. */ export interface DatePickerTimeFieldProps extends Omit { } /** {@link DatePicker}'s forwarded ref (root renders no DOM beyond mirrored inputs, just constraint-validation methods). */ export type DatePickerHandle = FormValidityHandle;