import React, { forwardRef, useCallback, useId, useState } from "react";
import { StyledLabel, StyledTextArea, StyledTextAreaWrapper } from "./TextArea.styled.js";
const TextArea = forwardRef(({ children, className, onFocus, onBlur, onChange, error, label, pinnedLabel = true, placeholder, id, ...props }, ref) => {
    const [focused, setFocused] = useState(false);
    const [internalHasValue, setInternalHasValue] = useState(() => {
        var _a;
        return Boolean((_a = props.value) !== null && _a !== void 0 ? _a : props.defaultValue);
    });
    const isControlled = props.value !== undefined;
    const hasValue = isControlled ? Boolean(props.value) : internalHasValue;
    const generatedInputId = useId();
    const inputId = id !== null && id !== void 0 ? id : (label ? generatedInputId : undefined);
    const handleFocus = useCallback((e) => {
        setFocused(true);
        onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
    }, [onFocus]);
    const handleBlur = useCallback((e) => {
        setFocused(false);
        onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
    }, [onBlur]);
    const handleChange = useCallback((e) => {
        if (!isControlled) {
            setInternalHasValue(Boolean(e.currentTarget.value));
        }
        onChange === null || onChange === void 0 ? void 0 : onChange(e);
    }, [isControlled, onChange]);
    const floating = Boolean(label) && (pinnedLabel || focused || hasValue);
    const showPlaceholder = !label || floating;
    const effectivePlaceholder = showPlaceholder ? placeholder : undefined;
    const labelElem = label
        ? (React.createElement(StyledLabel, { htmlFor: inputId, floating: floating, error: Boolean(error) }, label))
        : null;
    return (React.createElement(StyledTextAreaWrapper, { className: className, focused: focused, disabled: Boolean(props.disabled), readOnly: Boolean(props.readOnly), error: Boolean(error) },
        labelElem,
        React.createElement(StyledTextArea, { ...props, ref: ref, id: inputId, placeholder: effectivePlaceholder, onFocus: handleFocus, onBlur: handleBlur, onChange: handleChange, "data-error": Boolean(error) })));
});
TextArea.displayName = "TextArea";
TextArea.toString = () => StyledTextAreaWrapper.toString();
const TextAreaWrapperSelector = StyledTextAreaWrapper.toString();
const TextAreaTextAreaSelector = StyledTextArea.toString();
const TextAreaLabelSelector = StyledLabel.toString();
export { TextArea, TextAreaWrapperSelector, TextAreaTextAreaSelector, TextAreaLabelSelector, };
//# sourceMappingURL=TextArea.js.map