"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.InputPrimitive = exports.InputGroup = exports.InputAddon = exports.InputError = exports.InputDescription = exports.InputLabel = exports.InputContainer = exports.InputRoot = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const bottom_sheet_1 = require("@gorhom/bottom-sheet");
const react_1 = tslib_1.__importStar(require("react"));
const react_native_1 = require("react-native");
const theme_1 = require("../../../lib/theme/theme");
const tokens = tslib_1.__importStar(require("../../../lib/theme/tokens"));
exports.InputRoot = (0, react_1.forwardRef)(({ value, onChangeText, onChange, onFocus, onBlur, error = false, disabled = false, loading = false, editable, style, placeholderTextColor: placeholderTextColorProp, ...props }, ref) => {
    const [isFocused, setIsFocused] = react_1.default.useState(false);
    const { theme } = (0, theme_1.useTheme)();
    const placeholderTextColor = placeholderTextColorProp ?? theme.colors.textMuted;
    let isInBottomSheet = false;
    try {
        (0, bottom_sheet_1.useBottomSheetInternal)();
        isInBottomSheet = true;
    }
    catch {
        isInBottomSheet = false;
    }
    const InputComponent = isInBottomSheet && react_native_1.Platform.OS !== "web"
        ? bottom_sheet_1.BottomSheetTextInput
        : react_native_1.TextInput;
    const handleChangeText = react_1.default.useCallback((text) => {
        if (onChangeText) {
            onChangeText(text);
        }
        if (onChange) {
            onChange(text);
        }
    }, [onChangeText, onChange]);
    const handleFocus = react_1.default.useCallback((event) => {
        setIsFocused(true);
        if (onFocus) {
            onFocus(event);
        }
    }, [onFocus]);
    const handleBlur = react_1.default.useCallback((event) => {
        setIsFocused(false);
        if (onBlur) {
            onBlur(event);
        }
    }, [onBlur]);
    const colorStyles = {
        borderColor: error ? theme.colors.destructive : theme.colors.border,
        ...(disabled && {
            backgroundColor: theme.colors.muted,
            opacity: 0.6,
        }),
        ...(loading && { opacity: 0.7 }),
    };
    return ((0, jsx_runtime_1.jsx)(InputComponent, { ref: ref, value: value, onChangeText: handleChangeText, onFocus: handleFocus, onBlur: handleBlur, editable: !disabled && !loading && editable, placeholderTextColor: placeholderTextColor, style: [structuralStyles.input, colorStyles, style], ...props }));
});
exports.InputRoot.displayName = "InputRoot";
exports.InputContainer = (0, react_1.forwardRef)(({ children, focused = false, error = false, disabled = false, style, ...props }, ref) => {
    const { theme } = (0, theme_1.useTheme)();
    const colorStyles = {
        borderColor: error
            ? theme.colors.destructive
            : focused
                ? theme.colors.ring
                : theme.colors.border,
        backgroundColor: theme.colors.background,
        ...(disabled && {
            backgroundColor: theme.colors.muted,
            opacity: 0.6,
        }),
    };
    return ((0, jsx_runtime_1.jsx)(react_native_1.View, { ref: ref, style: [structuralStyles.container, colorStyles, style], ...props, children: children }));
});
exports.InputContainer.displayName = "InputContainer";
exports.InputLabel = (0, react_1.forwardRef)(({ children, required = false, disabled = false, error = false, style, ...props }, ref) => {
    const { theme } = (0, theme_1.useTheme)();
    const colorStyle = {
        color: error
            ? theme.colors.destructive
            : disabled
                ? theme.colors.textMuted
                : theme.colors.text,
        ...(disabled && { opacity: 0.6 }),
    };
    return ((0, jsx_runtime_1.jsxs)(react_native_1.Text, { ref: ref, style: [structuralStyles.label, colorStyle, style], ...props, children: [children, required && ((0, jsx_runtime_1.jsx)(react_native_1.Text, { style: { color: theme.colors.destructive }, children: " *" }))] }));
});
exports.InputLabel.displayName = "InputLabel";
exports.InputDescription = (0, react_1.forwardRef)(({ children, error = false, disabled = false, style, ...props }, ref) => {
    const { theme } = (0, theme_1.useTheme)();
    const colorStyle = {
        color: error
            ? theme.colors.destructive
            : disabled
                ? theme.colors.textMuted
                : theme.colors.textMuted,
        ...(disabled && { opacity: 0.6 }),
    };
    return ((0, jsx_runtime_1.jsx)(react_native_1.Text, { ref: ref, style: [structuralStyles.description, colorStyle, style], ...props, children: children }));
});
exports.InputDescription.displayName = "InputDescription";
exports.InputError = (0, react_1.forwardRef)(({ children, visible = true, style, ...props }, ref) => {
    const { theme } = (0, theme_1.useTheme)();
    if (!visible || !children)
        return null;
    return ((0, jsx_runtime_1.jsx)(react_native_1.Text, { ref: ref, style: [
            structuralStyles.error,
            { color: theme.colors.destructive },
            style,
        ], ...props, children: children }));
});
exports.InputError.displayName = "InputError";
exports.InputAddon = (0, react_1.forwardRef)(({ children, position = "left", touchable = false, onPress, style, ...props }, ref) => {
    const addonStyle = [
        structuralStyles.addon,
        structuralStyles[`addon${position.charAt(0).toUpperCase() + position.slice(1)}`],
        style,
    ];
    const { onBlur, onFocus, ...restProps } = props;
    const touchableProps = {
        ...restProps,
        ...(onBlur !== null && onBlur !== undefined && { onBlur }),
        ...(onFocus !== null && onFocus !== undefined && { onFocus }),
    };
    if (touchable && onPress) {
        return ((0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, { ref: ref, style: addonStyle, onPress: onPress, ...touchableProps, children: children }));
    }
    return ((0, jsx_runtime_1.jsx)(react_native_1.View, { ref: ref, style: addonStyle, ...props, children: children }));
});
exports.InputAddon.displayName = "InputAddon";
exports.InputGroup = (0, react_1.forwardRef)(({ children, spacing = 8, style, ...props }, ref) => {
    return ((0, jsx_runtime_1.jsx)(react_native_1.View, { ref: ref, style: [structuralStyles.group, { gap: spacing }, style], ...props, children: children }));
});
exports.InputGroup.displayName = "InputGroup";
const structuralStyles = react_native_1.StyleSheet.create({
    input: {
        minHeight: 44,
        paddingHorizontal: 12,
        paddingVertical: 8,
        fontSize: 16,
        borderWidth: 1,
        borderRadius: 8,
        boxShadow: "none",
        fontFamily: tokens.fontFamilies.regular,
        ...react_native_1.Platform.select({
            ios: {
                paddingVertical: 12,
            },
            android: {
                paddingVertical: 8,
                textAlignVertical: "center",
            },
        }),
    },
    container: {
        flexDirection: "row",
        alignItems: "center",
        borderWidth: 1,
        borderRadius: 8,
        paddingHorizontal: 12,
        minHeight: 44,
    },
    label: {
        fontSize: 14,
        fontWeight: "500",
        marginBottom: 4,
    },
    description: {
        fontSize: 12,
        marginTop: 4,
    },
    error: {
        fontSize: 12,
        marginTop: 4,
    },
    addon: {
        alignItems: "center",
        justifyContent: "center",
        paddingHorizontal: 8,
    },
    addonLeft: {
        marginRight: 8,
    },
    addonRight: {
        marginLeft: 8,
    },
    group: {
        flexDirection: "column",
    },
});
exports.InputPrimitive = {
    Root: exports.InputRoot,
    Container: exports.InputContainer,
    Label: exports.InputLabel,
    Description: exports.InputDescription,
    Error: exports.InputError,
    Addon: exports.InputAddon,
    Group: exports.InputGroup,
};
//# sourceMappingURL=input.js.map