import { DfInteractiveBaseConfig, SingleInputFieldLayout } from '@allianz/taly-core/dynamic-form';

export const DfTimeTypeName = 'TIME';

interface DfTimeBaseConfig extends DfInteractiveBaseConfig, SingleInputFieldLayout {
  /**
   * Specifies the type of the field as `TIME`.
   */
  type: typeof DfTimeTypeName;

  /**
   * This field's label.
   * It's translatable by default and supports string interpolation.
   * @examples ["Select a time", "My label {$['bb-pgr-simple'].person.firstName}"]
   */
  label: string;

  /**
   * Text that is additionally displayed in the label if the field is not mandatory and supports string interpolation.
   * @examples ["Optional"]
   */
  optionalLabel?: string;

  /**
   * Sets the placeholder of hours field.
   * Default: `"hh"`.
   */
  placeholderHours?: string;

  /**
   * Sets the placeholder of minutes field.
   * Default: `"mm"`.
   */
  placeholderMinutes?: string;

  /**
   * The field's initial value, in HH:mm format (e.g. '14:30').
   * If set, the field will be pre-filled with / pre-set to this value.
   * @TJS-pattern ^\d{2}:\d{2}$
   * @examples ["14:30", "09:15"]
   */
  value?: string;
}

interface DfTime24HourConfig {
  /**
   * Whether to show the time in 12-hour format with AM/PM toggle.
   * Default: `false`
   */
  twelveHourFormat?: false;
}

interface DfTime12HourConfig {
  /**
   * Whether to show the time in 12-hour format with AM/PM toggle.
   * Default: `false`
   */
  twelveHourFormat: true;

  /**
   * Sets the AM button label.
   * Default: `"AM"`.
   * @examples ["AM"]
   */
  labelAM?: string;

  /**
   * Sets the PM button label.
   * Default: `"PM"`.
   * @examples ["PM"]
   */
  labelPM?: string;
}

interface DfTimeNoTimepickerConfig {
  /**
   * Whether to show the timepicker dropdown toggle button.
   * Default: `false`
   */
  withTimepicker?: false;
}

interface DfTimeWithTimepickerConfig {
  /**
   * Whether to show the timepicker dropdown toggle button.
   * Default: `false`
   */
  withTimepicker: true;

  /**
   * The earliest time shown in the timepicker dropdown, in HH:mm format.
   * Default: `"00:00"`.
   * @TJS-pattern ^\d{2}:\d{2}$
   * @examples ["08:00", "09:30"]
   */
  pickerStartTime?: string;

  /**
   * The latest time shown in the timepicker dropdown, in HH:mm format.
   * Default: `"24:00"`.
   * @TJS-pattern ^\d{2}:\d{2}$
   * @examples ["18:00", "22:00"]
   */
  pickerEndTime?: string;

  /**
   * The interval in minutes between options in the timepicker dropdown.
   * Must be at least 1 minute.
   * Default: `30`.
   * @TJS-minimum 1
   * @examples [15, 30, 60]
   */
  pickerTimeInterval?: number;
}

export type DfTime24HourNoPickerConfig = DfTimeBaseConfig &
  DfTime24HourConfig &
  DfTimeNoTimepickerConfig;
export type DfTime12HourNoPickerConfig = DfTimeBaseConfig &
  DfTime12HourConfig &
  DfTimeNoTimepickerConfig;
export type DfTime24HourWithPickerConfig = DfTimeBaseConfig &
  DfTime24HourConfig &
  DfTimeWithTimepickerConfig;
export type DfTime12HourWithPickerConfig = DfTimeBaseConfig &
  DfTime12HourConfig &
  DfTimeWithTimepickerConfig;

export type DfTimeConfig =
  | DfTime24HourNoPickerConfig
  | DfTime12HourNoPickerConfig
  | DfTime24HourWithPickerConfig
  | DfTime12HourWithPickerConfig;