import { DefineComponent } from 'vue';

/**
 * TSDayOfYearPicker component props
 */
export interface TSDayOfYearPickerProps {
  /**
   * TSDayOfYearPicker modelValue is array of timestamps
   */
  modelValue?: number[];
  /**
   * TSDayOfYearPicker initialValue is array of timestamps
   */
  initialValue?: number[];
  /**
   * Array of timestamps representing dates that cannot be selected
   * @default []
   */
  disabledDates?: number[];
  /**
   * Display label on top of Date Input.
   */
  label?: string;
  /**
   * Enable Validator using vee-validate. Combine with TSForm that handle form validation.
   */
  useValidator?: boolean;
  /**
   * When used as field in From Validation using TSForm,
   * specify the unique field name, match with your needs for API request.
   */
  fieldName?: string;
  /**
   * Whether this field should be filled or not.
   */
  mandatory?: boolean;
  /**
   * Sets the invalid state.
   */
  invalid?: boolean;
  /**
   * Set the custom validator message.
   * By default each field has preserved with its validator message, you don't need to worrying about the message.
   */
  errorMessage?: { empty: string };
  /**
   * Year to display (defaults to 2024 due to leap year requirement)
   */
  year?: number;
  /**
   * Validate value while the overlay is shown. This function is run on clicking the dates in the overlay.
   *
   * @returns {boolean} - Return true if the value is valid.
   */
  overlayValidatorFunction?: (value?: number[]) => Promise<boolean> | boolean;
  /**
   * Set the custom validator message to show on the overlay.
   * Used alongside overlayValidatorFunction.
   */
  overlayValidatorMessage?: string;
  /**
   * Set a message to be shown on top of the overlay.
   */
  overlayMessage?: string;
  /**
   * In range selection mode, if the same date is chosen twice,
   * set whether it should be shown as separate dates ("date 1" - "date 1") or not ("date 1").
   * @default true
   */
  separateSameDate?: boolean;
}

/**
 * TSDayOfYearPicker component emits
 */
export type TSDayOfYearPickerEmits = {
  'update:modelValue': [days?: number[]];
  // Emits when overlay is hidden
  'hide': [];
};

/**
 * **TSVue - TSDayOfYearPicker**
 *
 * _Handle input day with form validation._
 *
 * --- ---
 * ![TSVue](https://ik.imagekit.io/kurniadev/TS-HEAD-BLACK.png)
 *
 * @group form
 */
declare const TSDayOfYearPicker: DefineComponent<
  TSDayOfYearPickerProps,
  TSDayOfYearPickerEmits
>;

export default TSDayOfYearPicker;