/**
 * @license MIT
 * author: Cube Dev Team
 * @cube-dev/ui-kit v0.0.0-canary-c015414
 * Released under the MIT license.
 */

import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef, useCallback, useRef, useState } from 'react';
import { useTextField } from 'react-aria';
import { EyeIcon, EyeInvisibleIcon } from '../../../icons/index.js';
import { useProviderProps } from '../../../provider.js';
import { mergeProps } from '../../../utils/react/index.js';
import { castNullableStringValue, } from '../../../utils/react/nullableValue.js';
import { ItemAction } from '../../actions/index.js';
import { useFieldProps } from '../../form/index.js';
import { TextInputBase } from '../TextInput/index.js';
function PasswordInput(props, ref) {
    props = castNullableStringValue(props);
    props = useProviderProps(props);
    props = useFieldProps(props, {
        defaultValidationTrigger: 'onBlur',
        valuePropsMapper: ({ value, onChange }) => ({
            value: value?.toString() ?? '',
            onChange,
        }),
    });
    let [type, setType] = useState('password');
    let { labelProps: userLabelProps, suffix, multiLine, inputRef: propsInputRef, ...rest } = props;
    let localInputRef = useRef(null);
    let inputRef = propsInputRef ?? localInputRef;
    let { labelProps, inputProps } = useTextField({
        ...rest,
        type,
    }, inputRef);
    // Merge user-provided labelProps with aria labelProps
    const mergedLabelProps = mergeProps(labelProps, userLabelProps);
    const toggleType = useCallback(() => {
        setType((type) => (type === 'password' ? 'text' : 'password'));
    }, []);
    const wrappedSuffix = (_jsxs(_Fragment, { children: [suffix, _jsx(ItemAction, { type: "neutral", tooltip: "Toggle masking", icon: type === 'password' ? _jsx(EyeInvisibleIcon, {}) : _jsx(EyeIcon, {}), onPress: toggleType })] }));
    return (_jsx(TextInputBase, { ref: ref, labelProps: mergedLabelProps, inputProps: { ...inputProps, 'data-input-type': 'passwordinput' }, inputRef: inputRef, inputStyles: { paddingRight: '4x' }, type: type, suffixPosition: "after", suffix: wrappedSuffix, multiLine: multiLine, ...rest }));
}
/**
 * PasswordInputs are password inputs that allow users to input passwords or code entries
 * with a keyboard. Various decorations can be displayed around the field to
 * communicate the entry requirements.
 */
const _PasswordInput = forwardRef(PasswordInput);
_PasswordInput.cubeInputType = 'Text';
_PasswordInput.displayName = 'PasswordInput';
export { _PasswordInput as PasswordInput };

        