Skip to main content
Version: 1.1.0

IDateTimePickerTokens

@spartanfx/react v1.1.0


@spartanfx/react / index / IDateTimePickerTokens

Interface: IDateTimePickerTokens

Customization tokens for the DateTimePicker component. Any value supplied overrides the default theme resolved from the current AppearanceMode.

All keys are optional — provide only what you need.

Properties

PropertyTypeDescription
accentColor?stringAccent color used for the current day, AM/PM selection, primary button.
borderColor?stringBorder color of the trigger and the time fields.
borderHoverColor?stringBorder color on hover.
borderRadius?numberBorder radius applied to the trigger and the time inputs (in px).
errorColor?stringColor of the inline error message and the border when an error is set.
fieldBackgroundColor?stringBackground color of the trigger field.
fieldHeight?numberHeight applied to the trigger field (in px).
focusColor?stringBorder & focus ring color when the control is focused.
popupBackgroundColor?stringBackground of the popup Callout.
popupGap?numberMinimum gap between popup sections (in px).
popupSurfaceColor?stringBackground of secondary popup sections (time + footer).
popupWidth?numberWidth of the popup callout (in px).
separatorColor?stringSeparator color used between popup sections.
textColor?stringColor of the text typed inside the trigger and the time fields.
textSecondaryColor?stringColor of secondary text (labels, placeholder, icon default color).
timeFieldWidth?numberWidth of the hour / minute inputs in the time picker (in px).
transitionDuration?stringTransition duration for hover / focus interactions (e.g. 0.15s).