"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importStar(require("react"));
const react_native_image_picker_1 = require("react-native-image-picker");
const helpers_1 = require("@platformbuilders/helpers");
const Image_1 = tslib_1.__importDefault(require("../Image"));
const styles_1 = require("./styles");
const isValidURI = (value) => value ? /(?:https?|file):\/\/|www\.[^\s]+/.test(value) : false;
const Avatar = react_1.default.forwardRef(({ id, image, animatedLoading = true, accessibility = 'Upload de Avatar', accessibilityLabel, testID, size = 50, imageQuality = 0.5, borderWidth = 2, onPress, onUpload, showBorder = true, displayMonogram = true, name, monogramStyle, ...rest }, ref) => {
    const [visibleImage, setVisibleImage] = (0, react_1.useState)();
    const [uploadedImage, setUploadedImage] = (0, react_1.useState)();
    const openPicker = () => {
        const options = {
            title: 'Selecionar foto',
            cancelButtonTitle: 'Cancelar',
            takePhotoButtonTitle: 'Tirar foto',
            chooseFromLibraryButtonTitle: 'Escolher da galeria',
            imageQuality,
            storageOptions: {
                skipBackup: true,
                path: 'images',
            },
        };
        return new Promise((resolve) => {
            (0, react_native_image_picker_1.launchImageLibrary)(options, (response) => {
                if (!response.didCancel && response.assets) {
                    setUploadedImage(response?.assets[0]?.uri);
                }
                resolve();
            });
        });
    };
    const getUploadImage = () => {
        return visibleImage;
    };
    const clearUploadImage = () => {
        setVisibleImage(undefined);
    };
    (0, react_1.useImperativeHandle)(ref, () => ({
        getUploadImage,
        clearUploadImage,
        openPicker,
    }));
    (0, react_1.useEffect)(() => {
        if (!!image) {
            setVisibleImage(image);
        }
    }, [image]);
    (0, react_1.useEffect)(() => {
        if (!!uploadedImage && !!onUpload) {
            onUpload(uploadedImage);
        }
    }, [uploadedImage]);
    const source = typeof visibleImage == 'string' && isValidURI(visibleImage)
        ? { uri: visibleImage }
        : visibleImage;
    return (<styles_1.Wrapper id={id || accessibility} accessibility={accessibility} accessibilityLabel={accessibilityLabel || accessibility} testID={testID || id} size={size} onPress={onPress || (onUpload && openPicker)} disabled={!onPress && !onUpload} showBorder={showBorder} borderWidth={borderWidth} {...rest}>
        <Image_1.default testID="avatar-image" displayPlaceholder={animatedLoading} source={source} resizeMode="cover" style={{ width: '101%', height: '101%' }}/>

        {!visibleImage && !!name && (<styles_1.UploadIconWrapper size={size}>
            <styles_1.UploadIcon id="" accessibility="" name="camera"/>
          </styles_1.UploadIconWrapper>)}
        {!visibleImage && !!name && displayMonogram && (<styles_1.MonogramWrapper size={size}>
            <styles_1.MonogramText size={size} style={monogramStyle}>
              {(0, helpers_1.formatToMonogram)(name)}
            </styles_1.MonogramText>
          </styles_1.MonogramWrapper>)}
      </styles_1.Wrapper>);
});
Avatar.displayName = 'AvatarComponent';
exports.default = Avatar;
//# sourceMappingURL=index.js.map