import React from 'react';
import { findChildElement, hasSiblingQuestions } from '../../dom-utils';
import { shortDisplayNumber } from '../../shortDisplayNumber';
import { ScreenReaderOnly } from '../ScreenReaderOnly';
import TextAnswerInput from './internal/TextAnswerInput';
function TextAnswer(props) {
    const { element, renderChildNodes } = props;
    const displayNumber = element.getAttribute('display-number');
    const hint = findChildElement(element, 'hint');
    const textAnswer = React.createElement(TextAnswerInput, { ...props });
    const hasSiblings = hasSiblingQuestions(element);
    return (React.createElement(React.Fragment, null,
        React.createElement("span", { className: "anchor", id: `question-nr-${displayNumber}` }),
        hint ? (React.createElement("label", { className: "e-nowrap" },
            hasSiblings && (React.createElement("sup", { className: "e-text-answer-display-number e-color-darkgrey" }, shortDisplayNumber(displayNumber))),
            React.createElement(ScreenReaderOnly, null, renderChildNodes(hint)),
            textAnswer)) : (textAnswer)));
}
export default React.memo(TextAnswer);
//# sourceMappingURL=TextAnswer.js.map