import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useRef } from "react";
import { Controller } from "react-hook-form";
import { twMerge } from "tailwind-merge";
export function ImageInput(props) {
    const { className, name, id, control } = props;
    const fileInputRef = useRef(null);
    function parseImageAsBase64(e) {
        return new Promise((resolve, reject) => {
            const file = e.target.files?.[0] ?? null;
            if (file) {
                const reader = new FileReader();
                reader.onloadend = () => {
                    resolve(reader.result);
                };
                reader.onerror = () => {
                    reject(new Error(reader.error?.message));
                };
                reader.readAsDataURL(file);
            }
            else {
                resolve(null);
            }
        });
    }
    async function getBase64File(e) {
        try {
            const base64String = await parseImageAsBase64(e);
            return base64String;
        }
        catch (error) {
            console.error("Error reading file:", error);
        }
    }
    function handleContainerClick() {
        fileInputRef.current?.click();
    }
    return (_jsx(Controller, { control: control, name: name, render: ({ field: { onBlur, onChange, value } }) => (_jsxs("div", { className: twMerge("flex cursor-pointer items-center gap-2 rounded-xl bg-gray-100 p-3 text-gray-800", className), onClick: handleContainerClick, children: [_jsx("div", { className: "shrink-0", children: _jsx("img", { alt: "Preview", className: "size-7 object-cover", src: value }) }), _jsx("span", { className: "font-semibold", children: "Change Drive Icon" }), _jsx("input", { accept: "image/*", className: "hidden", id: id, onBlur: onBlur, onChange: async (e) => {
                        const base64String = await getBase64File(e);
                        onChange(base64String);
                    }, ref: fileInputRef, type: "file" })] })) }));
}
//# sourceMappingURL=image-input.js.map