@primer/react/dist/Textarea/Textarea.js

An implementation of GitHub's Primer Design System using React

import { c } from 'react-compiler-runtime';
import React from 'react';
import { TextInputBaseWrapper } from '../internal/components/TextInputWrapper.js';
import classes from './TextArea.module.css.js';
import { jsx } from 'react/jsx-runtime';

const DEFAULT_TEXTAREA_ROWS = 7;
const DEFAULT_TEXTAREA_COLS = 30;
const DEFAULT_TEXTAREA_RESIZE = 'both';
/**
 * An accessible, native textarea component that supports validation states.
 * This component accepts all native HTML <textarea> attributes as props.
 */
const Textarea = /*#__PURE__*/React.forwardRef((t0, ref) => {
  const $ = c(37);
  let block;
  let className;
  let contrast;
  let disabled;
  let maxHeight;
  let minHeight;
  let required;
  let rest;
  let style;
  let t1;
  let t2;
  let t3;
  let validationStatus;
  let value;
  if ($[0] !== t0) {
    ({
      value,
      disabled,
      required,
      validationStatus,
      rows: t1,
      cols: t2,
      resize: t3,
      block,
      contrast,
      className,
      minHeight,
      maxHeight,
      style,
      ...rest
    } = t0);
    $[0] = t0;
    $[1] = block;
    $[2] = className;
    $[3] = contrast;
    $[4] = disabled;
    $[5] = maxHeight;
    $[6] = minHeight;
    $[7] = required;
    $[8] = rest;
    $[9] = style;
    $[10] = t1;
    $[11] = t2;
    $[12] = t3;
    $[13] = validationStatus;
    $[14] = value;
  } else {
    block = $[1];
    className = $[2];
    contrast = $[3];
    disabled = $[4];
    maxHeight = $[5];
    minHeight = $[6];
    required = $[7];
    rest = $[8];
    style = $[9];
    t1 = $[10];
    t2 = $[11];
    t3 = $[12];
    validationStatus = $[13];
    value = $[14];
  }
  const rows = t1 === undefined ? DEFAULT_TEXTAREA_ROWS : t1;
  const cols = t2 === undefined ? DEFAULT_TEXTAREA_COLS : t2;
  const resize = t3 === undefined ? DEFAULT_TEXTAREA_RESIZE : t3;
  const t4 = validationStatus === "error" ? "true" : "false";
  let t5;
  if ($[15] !== maxHeight || $[16] !== minHeight || $[17] !== style) {
    t5 = {
      minHeight,
      maxHeight,
      ...style
    };
    $[15] = maxHeight;
    $[16] = minHeight;
    $[17] = style;
    $[18] = t5;
  } else {
    t5 = $[18];
  }
  let t6;
  if ($[19] !== cols || $[20] !== disabled || $[21] !== ref || $[22] !== required || $[23] !== resize || $[24] !== rest || $[25] !== rows || $[26] !== t4 || $[27] !== t5 || $[28] !== value) {
    t6 = /*#__PURE__*/jsx("textarea", {
      value: value,
      "data-resize": resize,
      "aria-required": required,
      "aria-invalid": t4,
      ref: ref,
      disabled: disabled,
      rows: rows,
      cols: cols,
      className: classes.TextArea,
      style: t5,
      ...rest
    });
    $[19] = cols;
    $[20] = disabled;
    $[21] = ref;
    $[22] = required;
    $[23] = resize;
    $[24] = rest;
    $[25] = rows;
    $[26] = t4;
    $[27] = t5;
    $[28] = value;
    $[29] = t6;
  } else {
    t6 = $[29];
  }
  let t7;
  if ($[30] !== block || $[31] !== className || $[32] !== contrast || $[33] !== disabled || $[34] !== t6 || $[35] !== validationStatus) {
    t7 = /*#__PURE__*/jsx(TextInputBaseWrapper, {
      validationStatus: validationStatus,
      disabled: disabled,
      block: block,
      contrast: contrast,
      className: className,
      children: t6
    });
    $[30] = block;
    $[31] = className;
    $[32] = contrast;
    $[33] = disabled;
    $[34] = t6;
    $[35] = validationStatus;
    $[36] = t7;
  } else {
    t7 = $[36];
  }
  return t7;
});
Textarea.displayName = 'Textarea';
Textarea.__SLOT__ = Symbol('Textarea');

export { DEFAULT_TEXTAREA_COLS, DEFAULT_TEXTAREA_RESIZE, DEFAULT_TEXTAREA_ROWS, Textarea as default };