@tpr/govuk-react-jsx/govuk/components/textarea/index.js

[](https://github.com/alphagov/govuk-frontend/releases/tag/v4.0.1) [![version](https://img.shields.io/npm/v/govuk-react-jsx.svg?styl

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Textarea = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));

var _react = _interopRequireDefault(require("react"));

var _ = require("../..");

var _excluded = ["govukClassNames", "className", "aria-describedby", "errorMessage", "formGroup", "hint", "label", "id"];

var Textarea = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
  var govukClassNames = props.govukClassNames,
      className = props.className,
      describedBy = props['aria-describedby'],
      errorMessage = props.errorMessage,
      formGroup = props.formGroup,
      hint = props.hint,
      label = props.label,
      id = props.id,
      attributes = (0, _objectWithoutProperties2["default"])(props, _excluded);
  var classNames = govukClassNames || {};
  classNames['govuk-form-group'] = classNames['govuk-form-group'] || 'govuk-form-group';
  classNames['govuk-form-group--error'] = classNames['govuk-form-group--error'] || 'govuk-form-group--error';
  classNames['govuk-textarea'] = classNames['govuk-textarea'] || 'govuk-textarea';
  classNames['govuk-textarea--error'] = classNames['govuk-textarea--error'] || 'govuk-textarea--error';
  var describedByValue = describedBy;
  var hintComponent;
  var errorMessageComponent;

  if (hint) {
    var hintId = "".concat(id, "-hint");
    describedByValue += " ".concat(hintId);
    hintComponent = /*#__PURE__*/_react["default"].createElement(_.Hint, (0, _extends2["default"])({}, hint, {
      id: hintId,
      govukClassNames: govukClassNames
    }));
  }

  if (errorMessage) {
    var errorId = id ? "".concat(id, "-error") : '';
    describedByValue += " ".concat(errorId);
    errorMessageComponent = /*#__PURE__*/_react["default"].createElement(_.ErrorMessage, (0, _extends2["default"])({}, errorMessage, {
      id: errorId,
      govukClassNames: govukClassNames
    }));
  }

  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "".concat(classNames['govuk-form-group']).concat(errorMessage ? " ".concat(classNames['govuk-form-group--error']) : '', " ").concat((formGroup === null || formGroup === void 0 ? void 0 : formGroup.className) || '')
  }, /*#__PURE__*/_react["default"].createElement(_.Label, (0, _extends2["default"])({}, label, {
    htmlFor: id,
    govukClassNames: govukClassNames
  })), hintComponent, errorMessageComponent, /*#__PURE__*/_react["default"].createElement("textarea", (0, _extends2["default"])({}, attributes, {
    id: id,
    ref: ref,
    className: "".concat(classNames['govuk-textarea']).concat(errorMessage ? " ".concat(classNames['govuk-textarea--error']) : '', " ").concat(className || ''),
    "aria-describedby": describedByValue.trim() || null
  })));
});

exports.Textarea = Textarea;
Textarea.displayName = 'Textarea';
Textarea.defaultProps = {
  'aria-describedby': '',
  rows: 5,
  id: '',
  name: ''
};