import { InputHTMLAttributes } from 'react';
import { BreakpointCustomizable, SelectedAriaAttributes, Theme } from '../../types';
import { InputSize } from '../Input/Input.utils';
import { InputPasswordAriaAttribute } from './InputPassword.utils';
export interface InputPasswordProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'size'> {
    /** Unique id for the input. */
    id: string;
    /** Label text displayed above the input. */
    label: string;
    /** ARIA attributes to enhance accessibility.
     *  `{'aria-describedby'?: string; 'aria-labelledby'?: string;}`
     *
     * The ids are appended to the ids the component generates internally, e.g. for the label, hint and system feedback.
     * */
    aria?: SelectedAriaAttributes<InputPasswordAriaAttribute>;
    /** The value of autoComplete to use for the input.
     * @default 'new-password'
     */
    autoComplete?: 'new-password' | 'current-password' | 'off';
    /** Disables the input, preventing user interaction.
     * @default false
     */
    disabled?: boolean;
    /** Hides the input label, can be responsive.
     *  `boolean | { base: boolean; s?: boolean; m?: boolean; l?: boolean; xl?: boolean; }`
     * @default false
     */
    hideLabel?: BreakpointCustomizable<boolean>;
    /** Short descriptive text displayed beneath the label. */
    hint?: string;
    /** Marks the input as invalid, typically used for form validation.
     * @default false
     */
    invalid?: boolean;
    /** Shows an info button next to the label that triggers a popover with the passed content. */
    popoverContent?: React.ReactNode;
    /** Popover info button props:
     *
     * `data-*`: Custom data attributes.
     *
     * `label`: Accessibility label for the default anchor button.
     * (default) 'Toggle popover'
     */
    popoverInfoButtonProps?: {
        [key: `data-${string}`]: string | undefined;
        label?: string;
    };
    /** Enables the readonly state of the input.
     * @default false
     */
    readonly?: boolean;
    /** Indicates that the input is required.
     * @default false
     */
    required?: boolean;
    /** Defines a system feedback message, shown when `invalid={true}`. */
    systemFeedback?: string;
    /** Size of the input.
     * @default 'medium'
     */
    size?: InputSize;
    /** Toggle password visibility button props:
     *
     * `data-*`: Custom data attributes.
     *
     * `hidePasswordText`: The hide password button text label (for assistive technologies).
     * (default) 'Hide password'
     *
     * `showPasswordText`: The show password button text label (for assistive technologies).
     * (default) 'Show password'
     */
    togglePasswordVisibilityButtonProps?: {
        [key: `data-${string}`]: string | undefined;
        hidePasswordText?: string;
        showPasswordText?: string;
    };
}
/** @internal Props including theme — not exported to consumers. */
export interface InputPasswordPropsWithTheme extends InputPasswordProps {
    /** Defines the theme.
     * @default 'light'
     */
    theme?: Theme;
}
/**
 * The `<DSInputPassword />` component is an input field that allows users to enter and edit passwords.
 * It comes in two sizes (medium & small) and supports various customizations including a label,
 * a hint and a system feedback message.
 *
 * The user can toggle the visibility of the password by clicking on the action button.
 *
 * Design in Figma: [Input Password](https://www.figma.com/design/qXldpLO6gxHJNLdcXIPxYt/Core-Components-%F0%9F%92%A0?node-id=2141-6655&t=UBsmFURFENnuYSW1-11)
 */
export declare const DSInputPassword: import('react').ForwardRefExoticComponent<InputPasswordProps & import('react').RefAttributes<HTMLInputElement>>;