import { CustomValidation } from '../form';
import { ClassComponent } from '../ts-helpers.d';

export interface InputPasswordProps {
  /**
   * Two way data binding of component.
   */
  modelValue?: string;
  /**
   * The label for input field.
   */
  label?: string;
  /**
   * Placeholder text for the input.
   */
  placeholder?: string;
  /**
   * Whether to show the strength indicator or not.
   * @default false
   */
  feedback?: boolean;
  /**
   * Wether the input should be validated with vee-validator or not.
   * If you use this component within form input, you need to set this props as true.
   */
  useValidator?: boolean;
  /**
   * This prop is required if you use this component in a form input.
   * Specify the unique field name, match with your needs for API request.
   *
   * @default 'textInput'
   */
  fieldName?: string;
  /**
   * Wether this input field is required or not.
   */
  mandatory?: boolean;
  /**
   * When present, it specifies that the component should have invalid state style.
   */
  invalid?: boolean;
  /**
   * Set custom validator message.
   * Will be show if invalid="true"
   */
  validatorMessage?: string | CustomValidation<'empty'>;
  validatorMessageClass?: string;
  labelClass?: string;
  inputContainerClass?: string;
}

export type InputPasswordEmits = {
  /**
   * Emitted when the value changes.
   * @param {string} value - New value.
   */
  'update:modelValue': [value?: string];
};

/**
 * **WangsVue - Password**
 *
 * _Password displays strength indicator for password fields._
 *
 * @group Component
 */
declare class InputPassword extends ClassComponent<
  InputPasswordProps,
  unknown,
  InputPasswordEmits
> {}

export default InputPassword;