"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importStar(require("react"));
const lodash_1 = require("lodash");
const styled_components_1 = require("styled-components");
const FormError_1 = tslib_1.__importDefault(require("../FormError"));
const styles_1 = require("../TextInput/styles");
const styles_2 = require("./styles");
const iconString = (hidePassword) => hidePassword ? 'eye' : 'eye-slash';
const PinInput = ({ password = false, animated = false, centered = false, contrast = false, mask = '•', codeLength = 4, cellSpacing = 6, iconSize = 24, cellSize = 56, caption, error, value, onChangeText, onFulfill = () => { }, labelStyle = {}, borderedLabel, fixedLabelVariant = 'sm', wrapperStyle, ...rest }) => {
    const [hidePassword, setHidePassword] = (0, react_1.useState)(true);
    const theme = (0, react_1.useContext)(styled_components_1.ThemeContext);
    const defaultStyle = (0, styles_2.defaultStyling)(theme);
    const changeText = (text) => {
        onChangeText(text);
        if (text.length === codeLength) {
            onFulfill(text);
        }
    };
    return (<FormError_1.default centered={centered} error={error}>
      <styles_2.Wrapper style={wrapperStyle}>
        {!(0, lodash_1.isEmpty)(borderedLabel) && (<styles_1.FixedLabelAboveBorder style={labelStyle} variant={fixedLabelVariant}>
            {borderedLabel}
          </styles_1.FixedLabelAboveBorder>)}
        <styles_2.PinCodeInput value={value} onTextChange={changeText} password={password && hidePassword} mask={mask} codeLength={codeLength} animated={animated} cellSize={cellSize} cellSpacing={cellSpacing} {...defaultStyle} {...rest}/>
        {password && (<styles_2.Icon accessibility={`Exibir ou ocultar inputs - ${iconString(hidePassword)}`} name={iconString(hidePassword)} size={iconSize} onPress={() => setHidePassword(!hidePassword)} contrast={contrast} error={false}/>)}
      </styles_2.Wrapper>
      {!!caption && (<styles_2.CaptionText accessibility={caption} centered={centered}>
          {caption}
        </styles_2.CaptionText>)}
    </FormError_1.default>);
};
exports.default = PinInput;
//# sourceMappingURL=index.js.map