@dnb/eufemia 10.4.2 → 10.6.0

package/es/components/textarea/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","names":["React","PropTypes","classnames","FormLabel","FormStatus","isTrue","makeUniqueId","extendPropsWithContextInClassComponent","validateDOMAttributes","processChildren","getStatusState","combineDescribedBy","warn","dispatchCustomElementEvent","includeValidProps","AlignmentHelper","spacingPropTypes","createSpacingClasses","skeletonDOMAttributes","createSkeletonClass","Context","Suffix","Textarea","PureComponent","getDerivedStateFromProps","props","state","value","getValue","_listenForPropChanges","_value","on_state_update","textarea_state","textareaState","hasValue","String","length","constructor","_defineProperty","event","_ref","current","setState","target","autoresize","prepareAutosize","rows","getRows","ret","setAutosize","elem","style","height","e","_heightOffset","offsetHeight","clientHeight","lineHeight","getLineHeight","newHeight","scrollHeight","maxRows","parseFloat","autoresize_max_rows","maxHeight","inner_ref","createRef","_id","id","componentDidMount","window","resizeObserver","ResizeObserver","observe","document","body","addEventListener","componentWillUnmount","disconnect","removeEventListener","Math","floor","getComputedStyle","render","_this$context","defaultProps","skeleton","context","getTranslation","FormRow","label","label_direction","label_sr_only","status","status_state","status_props","status_no_animation","globalStatus","suffix","disabled","stretch","placeholder","align","textarea_class","readOnly","textarea_attributes","class","_className","className","children","textarea_element","_textarea_element","attributes","_objectWithoutProperties","_excluded","showStatus","TextareaElement","textareaAttributes","JSON","parse","textareaParams","_objectSpread","role","name","onChange","onChangeHandler","onFocus","onFocusHandler","onBlur","onBlurHandler","onKeyDown","onKeyDownHandler","mainParams","innerParams","shellParams","placeholderStyle","createElement","for_id","text","sr_only","_AlignmentHelper","_extends","show","text_id","no_animation","ref","_span","cols","on_change","on_focus","on_blur","on_key_down","process","env","NODE_ENV","propTypes","string","oneOfType","func","node","oneOf","bool","object","shape","message","number"],"sources":["../../../../src/components/textarea/Textarea.js"],"sourcesContent":["/**\n * Web Textarea Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport FormLabel from '../form-label/FormLabel'\nimport FormStatus from '../form-status/FormStatus'\nimport {\n  isTrue,\n  makeUniqueId,\n  extendPropsWithContextInClassComponent,\n  validateDOMAttributes,\n  processChildren,\n  getStatusState,\n  combineDescribedBy,\n  warn,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport { includeValidProps } from '../form-row/FormRowHelpers'\nimport AlignmentHelper from '../../shared/AlignmentHelper'\nimport {\n  spacingPropTypes,\n  createSpacingClasses,\n} from '../space/SpacingHelper'\nimport {\n  skeletonDOMAttributes,\n  createSkeletonClass,\n} from '../skeleton/SkeletonHelper'\n\nimport Context from '../../shared/Context'\nimport Suffix from '../../shared/helpers/Suffix'\n\n/**\n * The textarea component is an umbrella component for all textareas which share the same style as the classic `text` textarea field.\n */\nexport default class Textarea extends React.PureComponent {\n  static contextType = Context\n\n  static propTypes = {\n    value: PropTypes.string,\n    id: PropTypes.string,\n    label: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    label_direction: PropTypes.oneOf(['horizontal', 'vertical']),\n    label_sr_only: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    status: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.bool,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    textarea_state: PropTypes.string,\n    status_state: PropTypes.string,\n    status_props: PropTypes.object,\n    status_no_animation: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.bool,\n    ]),\n    globalStatus: PropTypes.shape({\n      id: PropTypes.string,\n      message: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n    }),\n    suffix: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    placeholder: PropTypes.string,\n    align: PropTypes.oneOf(['left', 'right']),\n    stretch: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    disabled: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    skeleton: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    autoresize: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    autoresize_max_rows: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.number,\n    ]),\n    class: PropTypes.string,\n    textarea_class: PropTypes.string,\n    textarea_attributes: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.object,\n    ]),\n    readOnly: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n    cols: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n    inner_ref: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),\n\n    ...spacingPropTypes,\n\n    className: PropTypes.string,\n    textarea_element: PropTypes.oneOfType([\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n\n    on_change: PropTypes.func,\n    on_focus: PropTypes.func,\n    on_blur: PropTypes.func,\n    on_key_down: PropTypes.func,\n    on_state_update: PropTypes.func,\n  }\n\n  static defaultProps = {\n    value: 'initval',\n    id: null,\n    label: null,\n    label_direction: null,\n    label_sr_only: null,\n    status: null,\n    textarea_state: null,\n    status_state: 'error',\n    status_props: null,\n    status_no_animation: null,\n    globalStatus: null,\n    suffix: null,\n    placeholder: null,\n    align: null,\n    stretch: null,\n    disabled: null,\n    skeleton: null,\n    autoresize: null,\n    autoresize_max_rows: null,\n    textarea_class: null,\n    class: null,\n    textarea_attributes: null,\n    readOnly: false,\n    rows: null,\n    cols: null,\n    inner_ref: null,\n\n    className: null,\n    textarea_element: null,\n    children: null,\n\n    on_change: null,\n    on_focus: null,\n    on_blur: null,\n    on_key_down: null,\n    on_state_update: null,\n  }\n\n  static getDerivedStateFromProps(props, state) {\n    const value = Textarea.getValue(props)\n    if (\n      state._listenForPropChanges &&\n      value !== 'initval' &&\n      value !== state.value\n    ) {\n      if (\n        value !== state.value &&\n        value !== state._value &&\n        typeof props.on_state_update === 'function'\n      ) {\n        dispatchCustomElementEvent({ props }, 'on_state_update', { value })\n      }\n      state.value = value\n    }\n    if (props.textarea_state) {\n      state.textareaState = props.textarea_state\n    }\n    state._listenForPropChanges = true\n    return state\n  }\n\n  static hasValue(value) {\n    return (\n      ((typeof value === 'string' || typeof value === 'number') &&\n        String(value).length > 0) ||\n      false\n    )\n  }\n\n  static getValue(props) {\n    const value = processChildren(props)\n    if (value === '' || Textarea.hasValue(value)) {\n      return value\n    }\n    return props.value\n  }\n\n  state = {\n    textareaState: 'virgin',\n    value: null,\n    _value: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    this._ref = props.inner_ref || React.createRef()\n    this._id = props.id || makeUniqueId() // cause we need an id anyway\n\n    // make sure we don't trigger getDerivedStateFromProps on startup\n    this.state._listenForPropChanges = true\n    if (props.textarea_state) {\n      this.state.textareaState = props.textarea_state\n    }\n    this.state._value = props.value\n  }\n  componentDidMount() {\n    if (isTrue(this.props.autoresize) && typeof window !== 'undefined') {\n      this.setAutosize()\n      try {\n        this.resizeObserver = new ResizeObserver(this.setAutosize)\n        this.resizeObserver.observe(document.body)\n      } catch (e) {\n        window.addEventListener('resize', this.setAutosize)\n      }\n    }\n  }\n  componentWillUnmount() {\n    if (this.resizeObserver) {\n      this.resizeObserver.disconnect()\n      this.resizeObserver = null\n    }\n    if (typeof window !== 'undefined') {\n      window.removeEventListener('resize', this.setAutosize)\n    }\n  }\n  onFocusHandler = (event) => {\n    const { value } = this._ref.current\n    this.setState({\n      value,\n      _listenForPropChanges: false,\n      textareaState: 'focus',\n    })\n    dispatchCustomElementEvent(this, 'on_focus', { value, event })\n  }\n  onBlurHandler = (event) => {\n    const { value } = event.target\n    this.setState({\n      value,\n      _listenForPropChanges: false,\n      textareaState: Textarea.hasValue(value) ? 'dirty' : 'initial',\n    })\n    dispatchCustomElementEvent(this, 'on_blur', { value, event })\n  }\n  onChangeHandler = (event) => {\n    const { value } = event.target\n\n    if (isTrue(this.props.autoresize)) {\n      this.prepareAutosize()\n    }\n\n    const rows = this.getRows(value)\n\n    const ret = dispatchCustomElementEvent(this, 'on_change', {\n      value,\n      rows,\n      event,\n    })\n    if (ret !== false) {\n      this.setState({ value, _listenForPropChanges: false })\n      if (isTrue(this.props.autoresize)) {\n        this.setAutosize(rows)\n      }\n    }\n  }\n  onKeyDownHandler = (event) => {\n    const rows = this.getRows()\n    const { value } = event.target\n    dispatchCustomElementEvent(this, 'on_key_down', {\n      value,\n      rows,\n      event,\n    })\n  }\n  prepareAutosize = () => {\n    const elem = this._ref.current\n    if (!elem) {\n      return // stop here if no element was gotten\n    }\n    try {\n      elem.style.height = 'auto'\n    } catch (e) {\n      warn(e)\n    }\n  }\n  setAutosize = (rows = null) => {\n    const elem = this._ref.current\n    if (!elem) {\n      return // stop here if no element was gotten\n    }\n    try {\n      if (typeof this._heightOffset === 'undefined') {\n        this._heightOffset = elem.offsetHeight - elem.clientHeight\n      }\n\n      elem.style.height = 'auto'\n\n      // get rows after we set height to auto, this way we get 100% correct rows\n      const lineHeight = this.getLineHeight()\n      let newHeight = elem.scrollHeight + this._heightOffset\n      if (!rows) {\n        rows = this.getRows()\n      }\n\n      if (rows === 1) {\n        if (newHeight > lineHeight) {\n          newHeight = lineHeight\n        }\n      }\n\n      const maxRows = parseFloat(this.props.autoresize_max_rows)\n      if (maxRows > 0) {\n        const maxHeight = maxRows * lineHeight\n\n        if (rows > maxRows || newHeight > maxHeight) {\n          newHeight = maxHeight\n        }\n      }\n\n      elem.style.height = newHeight + 'px'\n    } catch (e) {\n      warn(e)\n    }\n  }\n  getRows() {\n    return (\n      Math.floor(this._ref.current.scrollHeight / this.getLineHeight()) ||\n      1\n    )\n  }\n  getLineHeight() {\n    return parseFloat(getComputedStyle(this._ref.current).lineHeight) || 0\n  }\n  render() {\n    // use only the props from context, who are available here anyway\n    const props = extendPropsWithContextInClassComponent(\n      this.props,\n      Textarea.defaultProps,\n      { skeleton: this.context?.skeleton },\n      this.context.getTranslation(this.props).Textarea,\n      includeValidProps(this.context.FormRow),\n      this.context.Textarea\n    )\n\n    const {\n      label,\n      label_direction,\n      label_sr_only,\n      status,\n      status_state,\n      status_props,\n      status_no_animation,\n      globalStatus,\n      suffix,\n      disabled,\n      skeleton,\n      stretch,\n      placeholder,\n      align,\n      textarea_class,\n      readOnly,\n      textarea_attributes,\n      class: _className,\n      className,\n\n      autoresize,\n      autoresize_max_rows, //eslint-disable-line\n      id: _id, //eslint-disable-line\n      children, //eslint-disable-line\n      value: _value, //eslint-disable-line\n      textarea_element: _textarea_element, //eslint-disable-line\n\n      ...attributes\n    } = props\n\n    const { value, textareaState } = this.state\n\n    const id = this._id\n    const showStatus = getStatusState(status)\n    const hasValue = Textarea.hasValue(value)\n\n    // pass along all props we wish to have as params\n    let { textarea_element: TextareaElement } = props\n\n    const textareaAttributes = textarea_attributes\n      ? typeof textarea_attributes === 'string'\n        ? JSON.parse(textarea_attributes)\n        : textarea_attributes\n      : {}\n\n    const textareaParams = {\n      className: classnames('dnb-textarea__textarea', textarea_class),\n      role: 'textbox',\n      value: hasValue ? value : '',\n      id,\n      disabled: isTrue(disabled) || isTrue(skeleton),\n      name: id,\n      'aria-placeholder': placeholder,\n      ...attributes,\n      ...textareaAttributes,\n      onChange: this.onChangeHandler,\n      onFocus: this.onFocusHandler,\n      onBlur: this.onBlurHandler,\n      // onPaste: this.onChangeHandler,\n      onKeyDown: this.onKeyDownHandler,\n    }\n\n    // we may considder using: aria-details\n    if (showStatus || suffix) {\n      textareaParams['aria-describedby'] = combineDescribedBy(\n        textareaParams,\n        showStatus ? id + '-status' : null,\n        suffix ? id + '-suffix' : null\n      )\n    }\n    if (readOnly) {\n      textareaParams['aria-readonly'] = textareaParams.readOnly = true\n    }\n\n    const mainParams = {\n      className: classnames(\n        'dnb-textarea',\n        `dnb-textarea--${textareaState}`,\n        hasValue && 'dnb-textarea--has-content',\n        align && `dnb-textarea__align--${align}`,\n        status && `dnb-textarea__status--${status_state}`,\n        autoresize && 'dnb-textarea__autoresize',\n        label_direction && `dnb-textarea--${label_direction}`,\n        isTrue(stretch) && `dnb-textarea--stretch`,\n        'dnb-form-component',\n        createSkeletonClass(null, skeleton),\n        createSpacingClasses(props),\n        _className,\n        className\n      ),\n    }\n\n    const innerParams = {\n      className: classnames(\n        'dnb-textarea__inner',\n        createSkeletonClass('shape', skeleton, this.context)\n      ),\n    }\n\n    const shellParams = {\n      className: classnames('dnb-textarea__shell'),\n    }\n\n    if (isTrue(disabled) || isTrue(skeleton)) {\n      shellParams['aria-disabled'] = true\n    }\n\n    // to show the ending dots on a placeholder, if the text is longer\n    const placeholderStyle =\n      parseFloat(this.props.rows) > 0\n        ? {\n            '--textarea-rows': parseFloat(this.props.rows),\n            // '--textarea-cols': parseFloat(this.props.cols)\n          }\n        : null\n\n    skeletonDOMAttributes(innerParams, skeleton, this.context)\n\n    // also used for code markup simulation\n    validateDOMAttributes(this.props, textareaParams)\n    validateDOMAttributes(null, innerParams)\n    validateDOMAttributes(null, shellParams)\n\n    if (TextareaElement && typeof TextareaElement === 'function') {\n      TextareaElement = TextareaElement(textareaParams, this._ref)\n    } else if (!TextareaElement && _textarea_element) {\n      TextareaElement = _textarea_element\n    }\n\n    return (\n      <span {...mainParams}>\n        {label && (\n          <FormLabel\n            id={id + '-label'}\n            for_id={id}\n            text={label}\n            label_direction={label_direction}\n            sr_only={label_sr_only}\n            disabled={disabled}\n            skeleton={skeleton}\n          />\n        )}\n\n        <span {...innerParams}>\n          <AlignmentHelper />\n\n          <FormStatus\n            show={showStatus}\n            id={id + '-form-status'}\n            globalStatus={globalStatus}\n            label={label}\n            text_id={id + '-status'} // used for \"aria-describedby\"\n            text={status}\n            state={status_state}\n            no_animation={status_no_animation}\n            skeleton={skeleton}\n            {...status_props}\n          />\n\n          <span className=\"dnb-textarea__row\">\n            <span {...shellParams}>\n              {TextareaElement || (\n                <textarea ref={this._ref} {...textareaParams} />\n              )}\n\n              {placeholder && (\n                <span\n                  aria-hidden\n                  className={classnames(\n                    'dnb-textarea__placeholder',\n                    align ? `dnb-textarea__align--${align}` : null\n                  )}\n                  style={placeholderStyle}\n                >\n                  {placeholder}\n                </span>\n              )}\n\n              <span className=\"dnb-textarea__state\" />\n            </span>\n\n            {suffix && (\n              <Suffix\n                className=\"dnb-textarea__suffix\"\n                id={id + '-suffix'} // used for \"aria-describedby\"\n                context={props}\n              >\n                {suffix}\n              </Suffix>\n            )}\n          </span>\n        </span>\n      </span>\n    )\n  }\n}\n"],"mappings":";;;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,SAAS,MAAM,yBAAyB;AAC/C,OAAOC,UAAU,MAAM,2BAA2B;AAClD,SACEC,MAAM,EACNC,YAAY,EACZC,sCAAsC,EACtCC,qBAAqB,EACrBC,eAAe,EACfC,cAAc,EACdC,kBAAkB,EAClBC,IAAI,EACJC,0BAA0B,QACrB,+BAA+B;AACtC,SAASC,iBAAiB,QAAQ,4BAA4B;AAC9D,OAAOC,eAAe,MAAM,8BAA8B;AAC1D,SACEC,gBAAgB,EAChBC,oBAAoB,QACf,wBAAwB;AAC/B,SACEC,qBAAqB,EACrBC,mBAAmB,QACd,4BAA4B;AAEnC,OAAOC,OAAO,MAAM,sBAAsB;AAC1C,OAAOC,MAAM,MAAM,6BAA6B;AAKhD,eAAe,MAAMC,QAAQ,SAAStB,KAAK,CAACuB,aAAa,CAAC;EA+GxD,OAAOC,wBAAwBA,CAACC,KAAK,EAAEC,KAAK,EAAE;IAC5C,MAAMC,KAAK,GAAGL,QAAQ,CAACM,QAAQ,CAACH,KAAK,CAAC;IACtC,IACEC,KAAK,CAACG,qBAAqB,IAC3BF,KAAK,KAAK,SAAS,IACnBA,KAAK,KAAKD,KAAK,CAACC,KAAK,EACrB;MACA,IACEA,KAAK,KAAKD,KAAK,CAACC,KAAK,IACrBA,KAAK,KAAKD,KAAK,CAACI,MAAM,IACtB,OAAOL,KAAK,CAACM,eAAe,KAAK,UAAU,EAC3C;QACAlB,0BAA0B,CAAC;UAAEY;QAAM,CAAC,EAAE,iBAAiB,EAAE;UAAEE;QAAM,CAAC,CAAC;MACrE;MACAD,KAAK,CAACC,KAAK,GAAGA,KAAK;IACrB;IACA,IAAIF,KAAK,CAACO,cAAc,EAAE;MACxBN,KAAK,CAACO,aAAa,GAAGR,KAAK,CAACO,cAAc;IAC5C;IACAN,KAAK,CAACG,qBAAqB,GAAG,IAAI;IAClC,OAAOH,KAAK;EACd;EAEA,OAAOQ,QAAQA,CAACP,KAAK,EAAE;IACrB,OACG,CAAC,OAAOA,KAAK,KAAK,QAAQ,IAAI,OAAOA,KAAK,KAAK,QAAQ,KACtDQ,MAAM,CAACR,KAAK,CAAC,CAACS,MAAM,GAAG,CAAC,IAC1B,KAAK;EAET;EAEA,OAAOR,QAAQA,CAACH,KAAK,EAAE;IACrB,MAAME,KAAK,GAAGlB,eAAe,CAACgB,KAAK,CAAC;IACpC,IAAIE,KAAK,KAAK,EAAE,IAAIL,QAAQ,CAACY,QAAQ,CAACP,KAAK,CAAC,EAAE;MAC5C,OAAOA,KAAK;IACd;IACA,OAAOF,KAAK,CAACE,KAAK;EACpB;EAQAU,WAAWA,CAACZ,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAAAa,eAAA,gBAPN;MACNL,aAAa,EAAE,QAAQ;MACvBN,KAAK,EAAE,IAAI;MACXG,MAAM,EAAE;IACV,CAAC;IAAAQ,eAAA,yBAmCiBC,KAAK,IAAK;MAC1B,MAAM;QAAEZ;MAAM,CAAC,GAAG,IAAI,CAACa,IAAI,CAACC,OAAO;MACnC,IAAI,CAACC,QAAQ,CAAC;QACZf,KAAK;QACLE,qBAAqB,EAAE,KAAK;QAC5BI,aAAa,EAAE;MACjB,CAAC,CAAC;MACFpB,0BAA0B,CAAC,IAAI,EAAE,UAAU,EAAE;QAAEc,KAAK;QAAEY;MAAM,CAAC,CAAC;IAChE,CAAC;IAAAD,eAAA,wBACgBC,KAAK,IAAK;MACzB,MAAM;QAAEZ;MAAM,CAAC,GAAGY,KAAK,CAACI,MAAM;MAC9B,IAAI,CAACD,QAAQ,CAAC;QACZf,KAAK;QACLE,qBAAqB,EAAE,KAAK;QAC5BI,aAAa,EAAEX,QAAQ,CAACY,QAAQ,CAACP,KAAK,CAAC,GAAG,OAAO,GAAG;MACtD,CAAC,CAAC;MACFd,0BAA0B,CAAC,IAAI,EAAE,SAAS,EAAE;QAAEc,KAAK;QAAEY;MAAM,CAAC,CAAC;IAC/D,CAAC;IAAAD,eAAA,0BACkBC,KAAK,IAAK;MAC3B,MAAM;QAAEZ;MAAM,CAAC,GAAGY,KAAK,CAACI,MAAM;MAE9B,IAAItC,MAAM,CAAC,IAAI,CAACoB,KAAK,CAACmB,UAAU,CAAC,EAAE;QACjC,IAAI,CAACC,eAAe,CAAC,CAAC;MACxB;MAEA,MAAMC,IAAI,GAAG,IAAI,CAACC,OAAO,CAACpB,KAAK,CAAC;MAEhC,MAAMqB,GAAG,GAAGnC,0BAA0B,CAAC,IAAI,EAAE,WAAW,EAAE;QACxDc,KAAK;QACLmB,IAAI;QACJP;MACF,CAAC,CAAC;MACF,IAAIS,GAAG,KAAK,KAAK,EAAE;QACjB,IAAI,CAACN,QAAQ,CAAC;UAAEf,KAAK;UAAEE,qBAAqB,EAAE;QAAM,CAAC,CAAC;QACtD,IAAIxB,MAAM,CAAC,IAAI,CAACoB,KAAK,CAACmB,UAAU,CAAC,EAAE;UACjC,IAAI,CAACK,WAAW,CAACH,IAAI,CAAC;QACxB;MACF;IACF,CAAC;IAAAR,eAAA,2BACmBC,KAAK,IAAK;MAC5B,MAAMO,IAAI,GAAG,IAAI,CAACC,OAAO,CAAC,CAAC;MAC3B,MAAM;QAAEpB;MAAM,CAAC,GAAGY,KAAK,CAACI,MAAM;MAC9B9B,0BAA0B,CAAC,IAAI,EAAE,aAAa,EAAE;QAC9Cc,KAAK;QACLmB,IAAI;QACJP;MACF,CAAC,CAAC;IACJ,CAAC;IAAAD,eAAA,0BACiB,MAAM;MACtB,MAAMY,IAAI,GAAG,IAAI,CAACV,IAAI,CAACC,OAAO;MAC9B,IAAI,CAACS,IAAI,EAAE;QACT;MACF;MACA,IAAI;QACFA,IAAI,CAACC,KAAK,CAACC,MAAM,GAAG,MAAM;MAC5B,CAAC,CAAC,OAAOC,CAAC,EAAE;QACVzC,IAAI,CAACyC,CAAC,CAAC;MACT;IACF,CAAC;IAAAf,eAAA,sBACa,CAACQ,IAAI,GAAG,IAAI,KAAK;MAC7B,MAAMI,IAAI,GAAG,IAAI,CAACV,IAAI,CAACC,OAAO;MAC9B,IAAI,CAACS,IAAI,EAAE;QACT;MACF;MACA,IAAI;QACF,IAAI,OAAO,IAAI,CAACI,aAAa,KAAK,WAAW,EAAE;UAC7C,IAAI,CAACA,aAAa,GAAGJ,IAAI,CAACK,YAAY,GAAGL,IAAI,CAACM,YAAY;QAC5D;QAEAN,IAAI,CAACC,KAAK,CAACC,MAAM,GAAG,MAAM;QAG1B,MAAMK,UAAU,GAAG,IAAI,CAACC,aAAa,CAAC,CAAC;QACvC,IAAIC,SAAS,GAAGT,IAAI,CAACU,YAAY,GAAG,IAAI,CAACN,aAAa;QACtD,IAAI,CAACR,IAAI,EAAE;UACTA,IAAI,GAAG,IAAI,CAACC,OAAO,CAAC,CAAC;QACvB;QAEA,IAAID,IAAI,KAAK,CAAC,EAAE;UACd,IAAIa,SAAS,GAAGF,UAAU,EAAE;YAC1BE,SAAS,GAAGF,UAAU;UACxB;QACF;QAEA,MAAMI,OAAO,GAAGC,UAAU,CAAC,IAAI,CAACrC,KAAK,CAACsC,mBAAmB,CAAC;QAC1D,IAAIF,OAAO,GAAG,CAAC,EAAE;UACf,MAAMG,SAAS,GAAGH,OAAO,GAAGJ,UAAU;UAEtC,IAAIX,IAAI,GAAGe,OAAO,IAAIF,SAAS,GAAGK,SAAS,EAAE;YAC3CL,SAAS,GAAGK,SAAS;UACvB;QACF;QAEAd,IAAI,CAACC,KAAK,CAACC,MAAM,GAAGO,SAAS,GAAG,IAAI;MACtC,CAAC,CAAC,OAAON,CAAC,EAAE;QACVzC,IAAI,CAACyC,CAAC,CAAC;MACT;IACF,CAAC;IA/HC,IAAI,CAACb,IAAI,GAAGf,KAAK,CAACwC,SAAS,IAAIjE,KAAK,CAACkE,SAAS,CAAC,CAAC;IAChD,IAAI,CAACC,GAAG,GAAG1C,KAAK,CAAC2C,EAAE,IAAI9D,YAAY,CAAC,CAAC;IAGrC,IAAI,CAACoB,KAAK,CAACG,qBAAqB,GAAG,IAAI;IACvC,IAAIJ,KAAK,CAACO,cAAc,EAAE;MACxB,IAAI,CAACN,KAAK,CAACO,aAAa,GAAGR,KAAK,CAACO,cAAc;IACjD;IACA,IAAI,CAACN,KAAK,CAACI,MAAM,GAAGL,KAAK,CAACE,KAAK;EACjC;EACA0C,iBAAiBA,CAAA,EAAG;IAClB,IAAIhE,MAAM,CAAC,IAAI,CAACoB,KAAK,CAACmB,UAAU,CAAC,IAAI,OAAO0B,MAAM,KAAK,WAAW,EAAE;MAClE,IAAI,CAACrB,WAAW,CAAC,CAAC;MAClB,IAAI;QACF,IAAI,CAACsB,cAAc,GAAG,IAAIC,cAAc,CAAC,IAAI,CAACvB,WAAW,CAAC;QAC1D,IAAI,CAACsB,cAAc,CAACE,OAAO,CAACC,QAAQ,CAACC,IAAI,CAAC;MAC5C,CAAC,CAAC,OAAOtB,CAAC,EAAE;QACViB,MAAM,CAACM,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC3B,WAAW,CAAC;MACrD;IACF;EACF;EACA4B,oBAAoBA,CAAA,EAAG;IACrB,IAAI,IAAI,CAACN,cAAc,EAAE;MACvB,IAAI,CAACA,cAAc,CAACO,UAAU,CAAC,CAAC;MAChC,IAAI,CAACP,cAAc,GAAG,IAAI;IAC5B;IACA,IAAI,OAAOD,MAAM,KAAK,WAAW,EAAE;MACjCA,MAAM,CAACS,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC9B,WAAW,CAAC;IACxD;EACF;EAmGAF,OAAOA,CAAA,EAAG;IACR,OACEiC,IAAI,CAACC,KAAK,CAAC,IAAI,CAACzC,IAAI,CAACC,OAAO,CAACmB,YAAY,GAAG,IAAI,CAACF,aAAa,CAAC,CAAC,CAAC,IACjE,CAAC;EAEL;EACAA,aAAaA,CAAA,EAAG;IACd,OAAOI,UAAU,CAACoB,gBAAgB,CAAC,IAAI,CAAC1C,IAAI,CAACC,OAAO,CAAC,CAACgB,UAAU,CAAC,IAAI,CAAC;EACxE;EACA0B,MAAMA,CAAA,EAAG;IAAA,IAAAC,aAAA;IAEP,MAAM3D,KAAK,GAAGlB,sCAAsC,CAClD,IAAI,CAACkB,KAAK,EACVH,QAAQ,CAAC+D,YAAY,EACrB;MAAEC,QAAQ,GAAAF,aAAA,GAAE,IAAI,CAACG,OAAO,cAAAH,aAAA,uBAAZA,aAAA,CAAcE;IAAS,CAAC,EACpC,IAAI,CAACC,OAAO,CAACC,cAAc,CAAC,IAAI,CAAC/D,KAAK,CAAC,CAACH,QAAQ,EAChDR,iBAAiB,CAAC,IAAI,CAACyE,OAAO,CAACE,OAAO,CAAC,EACvC,IAAI,CAACF,OAAO,CAACjE,QACf,CAAC;IAED,MAAM;QACJoE,KAAK;QACLC,eAAe;QACfC,aAAa;QACbC,MAAM;QACNC,YAAY;QACZC,YAAY;QACZC,mBAAmB;QACnBC,YAAY;QACZC,MAAM;QACNC,QAAQ;QACRb,QAAQ;QACRc,OAAO;QACPC,WAAW;QACXC,KAAK;QACLC,cAAc;QACdC,QAAQ;QACRC,mBAAmB;QACnBC,KAAK,EAAEC,UAAU;QACjBC,SAAS;QAEThE,UAAU;QACVmB,mBAAmB;QACnBK,EAAE,EAAED,GAAG;QACP0C,QAAQ;QACRlF,KAAK,EAAEG,MAAM;QACbgF,gBAAgB,EAAEC;MAGpB,CAAC,GAAGtF,KAAK;MADJuF,UAAU,GAAAC,wBAAA,CACXxF,KAAK,EAAAyF,SAAA;IAET,MAAM;MAAEvF,KAAK;MAAEM;IAAc,CAAC,GAAG,IAAI,CAACP,KAAK;IAE3C,MAAM0C,EAAE,GAAG,IAAI,CAACD,GAAG;IACnB,MAAMgD,UAAU,GAAGzG,cAAc,CAACmF,MAAM,CAAC;IACzC,MAAM3D,QAAQ,GAAGZ,QAAQ,CAACY,QAAQ,CAACP,KAAK,CAAC;IAGzC,IAAI;MAAEmF,gBAAgB,EAAEM;IAAgB,CAAC,GAAG3F,KAAK;IAEjD,MAAM4F,kBAAkB,GAAGZ,mBAAmB,GAC1C,OAAOA,mBAAmB,KAAK,QAAQ,GACrCa,IAAI,CAACC,KAAK,CAACd,mBAAmB,CAAC,GAC/BA,mBAAmB,GACrB,CAAC,CAAC;IAEN,MAAMe,cAAc,GAAAC,aAAA,CAAAA,aAAA,CAAAA,aAAA;MAClBb,SAAS,EAAE1G,UAAU,CAAC,wBAAwB,EAAEqG,cAAc,CAAC;MAC/DmB,IAAI,EAAE,SAAS;MACf/F,KAAK,EAAEO,QAAQ,GAAGP,KAAK,GAAG,EAAE;MAC5ByC,EAAE;MACF+B,QAAQ,EAAE9F,MAAM,CAAC8F,QAAQ,CAAC,IAAI9F,MAAM,CAACiF,QAAQ,CAAC;MAC9CqC,IAAI,EAAEvD,EAAE;MACR,kBAAkB,EAAEiC;IAAW,GAC5BW,UAAU,GACVK,kBAAkB;MACrBO,QAAQ,EAAE,IAAI,CAACC,eAAe;MAC9BC,OAAO,EAAE,IAAI,CAACC,cAAc;MAC5BC,MAAM,EAAE,IAAI,CAACC,aAAa;MAE1BC,SAAS,EAAE,IAAI,CAACC;IAAgB,EACjC;IAGD,IAAIhB,UAAU,IAAIjB,MAAM,EAAE;MACxBsB,cAAc,CAAC,kBAAkB,CAAC,GAAG7G,kBAAkB,CACrD6G,cAAc,EACdL,UAAU,GAAG/C,EAAE,GAAG,SAAS,GAAG,IAAI,EAClC8B,MAAM,GAAG9B,EAAE,GAAG,SAAS,GAAG,IAC5B,CAAC;IACH;IACA,IAAIoC,QAAQ,EAAE;MACZgB,cAAc,CAAC,eAAe,CAAC,GAAGA,cAAc,CAAChB,QAAQ,GAAG,IAAI;IAClE;IAEA,MAAM4B,UAAU,GAAG;MACjBxB,SAAS,EAAE1G,UAAU,+BAEF+B,aAAa,uBAQ9Bd,mBAAmB,CAAC,IAAI,EAAEmE,QAAQ,CAAC,EACnCrE,oBAAoB,CAACQ,KAAK,CAAC,EAC3BkF,UAAU,EACVC,SAAS,EAVT1E,QAAQ,IAAI,2BAA2B,EACvCoE,KAAK,IAAK,wBAAuBA,KAAM,EAAC,EACxCT,MAAM,IAAK,yBAAwBC,YAAa,EAAC,EACjDlD,UAAU,IAAI,0BAA0B,EACxC+C,eAAe,IAAK,iBAAgBA,eAAgB,EAAC,EACrDtF,MAAM,CAAC+F,OAAO,CAAC,IAAK,uBAMtB;IACF,CAAC;IAED,MAAMiC,WAAW,GAAG;MAClBzB,SAAS,EAAE1G,UAAU,CACnB,qBAAqB,EACrBiB,mBAAmB,CAAC,OAAO,EAAEmE,QAAQ,EAAE,IAAI,CAACC,OAAO,CACrD;IACF,CAAC;IAED,MAAM+C,WAAW,GAAG;MAClB1B,SAAS,EAAa;IACxB,CAAC;IAED,IAAIvG,MAAM,CAAC8F,QAAQ,CAAC,IAAI9F,MAAM,CAACiF,QAAQ,CAAC,EAAE;MACxCgD,WAAW,CAAC,eAAe,CAAC,GAAG,IAAI;IACrC;IAGA,MAAMC,gBAAgB,GACpBzE,UAAU,CAAC,IAAI,CAACrC,KAAK,CAACqB,IAAI,CAAC,GAAG,CAAC,GAC3B;MACE,iBAAiB,EAAEgB,UAAU,CAAC,IAAI,CAACrC,KAAK,CAACqB,IAAI;IAE/C,CAAC,GACD,IAAI;IAEV5B,qBAAqB,CAACmH,WAAW,EAAE/C,QAAQ,EAAE,IAAI,CAACC,OAAO,CAAC;IAG1D/E,qBAAqB,CAAC,IAAI,CAACiB,KAAK,EAAE+F,cAAc,CAAC;IACjDhH,qBAAqB,CAAC,IAAI,EAAE6H,WAAW,CAAC;IACxC7H,qBAAqB,CAAC,IAAI,EAAE8H,WAAW,CAAC;IAExC,IAAIlB,eAAe,IAAI,OAAOA,eAAe,KAAK,UAAU,EAAE;MAC5DA,eAAe,GAAGA,eAAe,CAACI,cAAc,EAAE,IAAI,CAAChF,IAAI,CAAC;IAC9D,CAAC,MAAM,IAAI,CAAC4E,eAAe,IAAIL,iBAAiB,EAAE;MAChDK,eAAe,GAAGL,iBAAiB;IACrC;IAEA,OACE/G,KAAA,CAAAwI,aAAA,SAAUJ,UAAU,EACjB1C,KAAK,IACJ1F,KAAA,CAAAwI,aAAA,CAACrI,SAAS;MACRiE,EAAE,EAAEA,EAAE,GAAG,QAAS;MAClBqE,MAAM,EAAErE,EAAG;MACXsE,IAAI,EAAEhD,KAAM;MACZC,eAAe,EAAEA,eAAgB;MACjCgD,OAAO,EAAE/C,aAAc;MACvBO,QAAQ,EAAEA,QAAS;MACnBb,QAAQ,EAAEA;IAAS,CACpB,CACF,EAEDtF,KAAA,CAAAwI,aAAA,SAAUH,WAAW,EAAAO,gBAAA,KAAAA,gBAAA,GACnB5I,KAAA,CAAAwI,aAAA,CAACzH,eAAe,MAAE,CAAC,GAEnBf,KAAA,CAAAwI,aAAA,CAACpI,UAAU,EAAAyI,QAAA;MACTC,IAAI,EAAE3B,UAAW;MACjB/C,EAAE,EAAEA,EAAE,GAAG,cAAe;MACxB6B,YAAY,EAAEA,YAAa;MAC3BP,KAAK,EAAEA,KAAM;MACbqD,OAAO,EAAE3E,EAAE,GAAG,SAAU;MACxBsE,IAAI,EAAE7C,MAAO;MACbnE,KAAK,EAAEoE,YAAa;MACpBkD,YAAY,EAAEhD,mBAAoB;MAClCV,QAAQ,EAAEA;IAAS,GACfS,YAAY,CACjB,CAAC,EAEF/F,KAAA,CAAAwI,aAAA;MAAM5B,SAAS,EAAC;IAAmB,GACjC5G,KAAA,CAAAwI,aAAA,SAAUF,WAAW,EAClBlB,eAAe,IACdpH,KAAA,CAAAwI,aAAA,aAAAK,QAAA;MAAUI,GAAG,EAAE,IAAI,CAACzG;IAAK,GAAKgF,cAAc,CAAG,CAChD,EAEAnB,WAAW,IACVrG,KAAA,CAAAwI,aAAA;MACE,mBAAW;MACX5B,SAAS,EACP,2BAA2B,IAC3BN,KAAK,4BAA2BA,KAAM,QACtC;MACFnD,KAAK,EAAEoF;IAAiB,GAEvBlC,WACG,CACP,EAAA6C,KAAA,KAAAA,KAAA,GAEDlJ,KAAA,CAAAwI,aAAA;MAAM5B,SAAS,EAAC;IAAqB,CAAE,CAAC,CACpC,CAAC,EAENV,MAAM,IACLlG,KAAA,CAAAwI,aAAA,CAACnH,MAAM;MACLuF,SAAS,EAAC,sBAAsB;MAChCxC,EAAE,EAAEA,EAAE,GAAG,SAAU;MACnBmB,OAAO,EAAE9D;IAAM,GAEdyE,MACK,CAEN,CACF,CACF,CAAC;EAEX;AACF;AAAC5D,eAAA,CAvfoBhB,QAAQ,iBACNF,OAAO;AAAAkB,eAAA,CADThB,QAAQ,kBAwEL;EACpBK,KAAK,EAAE,SAAS;EAChByC,EAAE,EAAE,IAAI;EACRsB,KAAK,EAAE,IAAI;EACXC,eAAe,EAAE,IAAI;EACrBC,aAAa,EAAE,IAAI;EACnBC,MAAM,EAAE,IAAI;EACZ7D,cAAc,EAAE,IAAI;EACpB8D,YAAY,EAAE,OAAO;EACrBC,YAAY,EAAE,IAAI;EAClBC,mBAAmB,EAAE,IAAI;EACzBC,YAAY,EAAE,IAAI;EAClBC,MAAM,EAAE,IAAI;EACZG,WAAW,EAAE,IAAI;EACjBC,KAAK,EAAE,IAAI;EACXF,OAAO,EAAE,IAAI;EACbD,QAAQ,EAAE,IAAI;EACdb,QAAQ,EAAE,IAAI;EACd1C,UAAU,EAAE,IAAI;EAChBmB,mBAAmB,EAAE,IAAI;EACzBwC,cAAc,EAAE,IAAI;EACpBG,KAAK,EAAE,IAAI;EACXD,mBAAmB,EAAE,IAAI;EACzBD,QAAQ,EAAE,KAAK;EACf1D,IAAI,EAAE,IAAI;EACVqG,IAAI,EAAE,IAAI;EACVlF,SAAS,EAAE,IAAI;EAEf2C,SAAS,EAAE,IAAI;EACfE,gBAAgB,EAAE,IAAI;EACtBD,QAAQ,EAAE,IAAI;EAEduC,SAAS,EAAE,IAAI;EACfC,QAAQ,EAAE,IAAI;EACdC,OAAO,EAAE,IAAI;EACbC,WAAW,EAAE,IAAI;EACjBxH,eAAe,EAAE;AACnB,CAAC;AAAAyH,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBA7GkBpI,QAAQ,CAGpBqI,SAAS,GAAAlC,aAAA,CAAAA,aAAA;EACd9F,KAAK,EAAE1B,SAAS,CAAC2J,MAAM;EACvBxF,EAAE,EAAEnE,SAAS,CAAC2J,MAAM;EACpBlE,KAAK,EAAEzF,SAAS,CAAC4J,SAAS,CAAC,CACzB5J,SAAS,CAAC2J,MAAM,EAChB3J,SAAS,CAAC6J,IAAI,EACd7J,SAAS,CAAC8J,IAAI,CACf,CAAC;EACFpE,eAAe,EAAE1F,SAAS,CAAC+J,KAAK,CAAC,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC;EAC5DpE,aAAa,EAAE3F,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAAC2J,MAAM,EAAE3J,SAAS,CAACgK,IAAI,CAAC,CAAC;EACtEpE,MAAM,EAAE5F,SAAS,CAAC4J,SAAS,CAAC,CAC1B5J,SAAS,CAAC2J,MAAM,EAChB3J,SAAS,CAACgK,IAAI,EACdhK,SAAS,CAAC6J,IAAI,EACd7J,SAAS,CAAC8J,IAAI,CACf,CAAC;EACF/H,cAAc,EAAE/B,SAAS,CAAC2J,MAAM;EAChC9D,YAAY,EAAE7F,SAAS,CAAC2J,MAAM;EAC9B7D,YAAY,EAAE9F,SAAS,CAACiK,MAAM;EAC9BlE,mBAAmB,EAAE/F,SAAS,CAAC4J,SAAS,CAAC,CACvC5J,SAAS,CAAC2J,MAAM,EAChB3J,SAAS,CAACgK,IAAI,CACf,CAAC;EACFhE,YAAY,EAAEhG,SAAS,CAACkK,KAAK,CAAC;IAC5B/F,EAAE,EAAEnE,SAAS,CAAC2J,MAAM;IACpBQ,OAAO,EAAEnK,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAAC2J,MAAM,EAAE3J,SAAS,CAAC8J,IAAI,CAAC;EACjE,CAAC,CAAC;EACF7D,MAAM,EAAEjG,SAAS,CAAC4J,SAAS,CAAC,CAC1B5J,SAAS,CAAC2J,MAAM,EAChB3J,SAAS,CAAC6J,IAAI,EACd7J,SAAS,CAAC8J,IAAI,CACf,CAAC;EACF1D,WAAW,EAAEpG,SAAS,CAAC2J,MAAM;EAC7BtD,KAAK,EAAErG,SAAS,CAAC+J,KAAK,CAAC,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;EACzC5D,OAAO,EAAEnG,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAAC2J,MAAM,EAAE3J,SAAS,CAACgK,IAAI,CAAC,CAAC;EAChE9D,QAAQ,EAAElG,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAAC2J,MAAM,EAAE3J,SAAS,CAACgK,IAAI,CAAC,CAAC;EACjE3E,QAAQ,EAAErF,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAAC2J,MAAM,EAAE3J,SAAS,CAACgK,IAAI,CAAC,CAAC;EACjErH,UAAU,EAAE3C,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAAC2J,MAAM,EAAE3J,SAAS,CAACgK,IAAI,CAAC,CAAC;EACnElG,mBAAmB,EAAE9D,SAAS,CAAC4J,SAAS,CAAC,CACvC5J,SAAS,CAAC2J,MAAM,EAChB3J,SAAS,CAACoK,MAAM,CACjB,CAAC;EACF3D,KAAK,EAAEzG,SAAS,CAAC2J,MAAM;EACvBrD,cAAc,EAAEtG,SAAS,CAAC2J,MAAM;EAChCnD,mBAAmB,EAAExG,SAAS,CAAC4J,SAAS,CAAC,CACvC5J,SAAS,CAAC2J,MAAM,EAChB3J,SAAS,CAACiK,MAAM,CACjB,CAAC;EACF1D,QAAQ,EAAEvG,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAAC2J,MAAM,EAAE3J,SAAS,CAACgK,IAAI,CAAC,CAAC;EACjEnH,IAAI,EAAE7C,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAACoK,MAAM,EAAEpK,SAAS,CAAC2J,MAAM,CAAC,CAAC;EAC/DT,IAAI,EAAElJ,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAACoK,MAAM,EAAEpK,SAAS,CAAC2J,MAAM,CAAC,CAAC;EAC/D3F,SAAS,EAAEhE,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAAC6J,IAAI,EAAE7J,SAAS,CAACiK,MAAM,CAAC;AAAC,GAE/DlJ,gBAAgB;EAEnB4F,SAAS,EAAE3G,SAAS,CAAC2J,MAAM;EAC3B9C,gBAAgB,EAAE7G,SAAS,CAAC4J,SAAS,CAAC,CACpC5J,SAAS,CAAC6J,IAAI,EACd7J,SAAS,CAAC8J,IAAI,CACf,CAAC;EACFlD,QAAQ,EAAE5G,SAAS,CAAC4J,SAAS,CAAC,CAAC5J,SAAS,CAAC8J,IAAI,EAAE9J,SAAS,CAAC6J,IAAI,CAAC,CAAC;EAE/DV,SAAS,EAAEnJ,SAAS,CAAC6J,IAAI;EACzBT,QAAQ,EAAEpJ,SAAS,CAAC6J,IAAI;EACxBR,OAAO,EAAErJ,SAAS,CAAC6J,IAAI;EACvBP,WAAW,EAAEtJ,SAAS,CAAC6J,IAAI;EAC3B/H,eAAe,EAAE9B,SAAS,CAAC6J;AAAI"}
+{"version":3,"file":"Textarea.js","names":["React","PropTypes","classnames","FormLabel","FormStatus","isTrue","makeUniqueId","extendPropsWithContextInClassComponent","validateDOMAttributes","processChildren","getStatusState","combineDescribedBy","warn","dispatchCustomElementEvent","includeValidProps","AlignmentHelper","spacingPropTypes","createSpacingClasses","skeletonDOMAttributes","createSkeletonClass","Context","Suffix","Textarea","PureComponent","getDerivedStateFromProps","props","state","value","getValue","_listenForPropChanges","_value","on_state_update","textarea_state","textareaState","hasValue","String","length","constructor","_defineProperty","event","_ref","current","setState","target","autoresize","prepareAutosize","rows","getRows","ret","setAutosize","elem","style","height","e","_heightOffset","offsetHeight","clientHeight","lineHeight","getLineHeight","newHeight","scrollHeight","maxRows","parseFloat","autoresize_max_rows","maxHeight","inner_ref","createRef","_id","id","componentDidMount","window","resizeObserver","ResizeObserver","observe","document","body","addEventListener","componentWillUnmount","disconnect","removeEventListener","Math","floor","getComputedStyle","render","_this$context","defaultProps","skeleton","context","getTranslation","FormRow","label","label_direction","label_sr_only","status","status_state","status_props","status_no_animation","globalStatus","suffix","disabled","stretch","placeholder","align","textarea_class","readOnly","textarea_attributes","class","_className","className","children","textarea_element","_textarea_element","attributes","_objectWithoutProperties","_excluded","showStatus","TextareaElement","textareaAttributes","JSON","parse","textareaParams","_objectSpread","role","name","onChange","onChangeHandler","onFocus","onFocusHandler","onBlur","onBlurHandler","onKeyDown","onKeyDownHandler","mainParams","innerParams","shellParams","placeholderStyle","createElement","for_id","text","sr_only","_AlignmentHelper","_extends","show","text_id","no_animation","ref","_span","cols","on_change","on_focus","on_blur","on_key_down","process","env","NODE_ENV","propTypes","string","oneOfType","func","node","oneOf","bool","object","shape","message","number"],"sources":["../../../../src/components/textarea/Textarea.js"],"sourcesContent":["/**\n * Web Textarea Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport FormLabel from '../form-label/FormLabel'\nimport FormStatus from '../form-status/FormStatus'\nimport {\n  isTrue,\n  makeUniqueId,\n  extendPropsWithContextInClassComponent,\n  validateDOMAttributes,\n  processChildren,\n  getStatusState,\n  combineDescribedBy,\n  warn,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport { includeValidProps } from '../form-row/FormRowHelpers'\nimport AlignmentHelper from '../../shared/AlignmentHelper'\nimport {\n  spacingPropTypes,\n  createSpacingClasses,\n} from '../space/SpacingHelper'\nimport {\n  skeletonDOMAttributes,\n  createSkeletonClass,\n} from '../skeleton/SkeletonHelper'\n\nimport Context from '../../shared/Context'\nimport Suffix from '../../shared/helpers/Suffix'\n\n/**\n * The textarea component is an umbrella component for all textareas which share the same style as the classic `text` textarea field.\n */\nexport default class Textarea extends React.PureComponent {\n  static contextType = Context\n\n  static propTypes = {\n    value: PropTypes.string,\n    id: PropTypes.string,\n    label: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    label_direction: PropTypes.oneOf(['horizontal', 'vertical']),\n    label_sr_only: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    status: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.bool,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    textarea_state: PropTypes.string,\n    status_state: PropTypes.string,\n    status_props: PropTypes.object,\n    status_no_animation: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.bool,\n    ]),\n    globalStatus: PropTypes.shape({\n      id: PropTypes.string,\n      message: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n    }),\n    suffix: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    placeholder: PropTypes.string,\n    align: PropTypes.oneOf(['left', 'right']),\n    stretch: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    disabled: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    skeleton: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    autoresize: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    autoresize_max_rows: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.number,\n    ]),\n    class: PropTypes.string,\n    textarea_class: PropTypes.string,\n    textarea_attributes: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.object,\n    ]),\n    readOnly: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n    cols: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n    inner_ref: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),\n\n    ...spacingPropTypes,\n\n    className: PropTypes.string,\n    textarea_element: PropTypes.oneOfType([\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n\n    on_change: PropTypes.func,\n    on_focus: PropTypes.func,\n    on_blur: PropTypes.func,\n    on_key_down: PropTypes.func,\n    on_state_update: PropTypes.func,\n  }\n\n  static defaultProps = {\n    value: 'initval',\n    id: null,\n    label: null,\n    label_direction: null,\n    label_sr_only: null,\n    status: null,\n    textarea_state: null,\n    status_state: 'error',\n    status_props: null,\n    status_no_animation: null,\n    globalStatus: null,\n    suffix: null,\n    placeholder: null,\n    align: null,\n    stretch: null,\n    disabled: null,\n    skeleton: null,\n    autoresize: null,\n    autoresize_max_rows: null,\n    textarea_class: null,\n    class: null,\n    textarea_attributes: null,\n    readOnly: false,\n    rows: null,\n    cols: null,\n    inner_ref: null,\n\n    className: null,\n    textarea_element: null,\n    children: null,\n\n    on_change: null,\n    on_focus: null,\n    on_blur: null,\n    on_key_down: null,\n    on_state_update: null,\n  }\n\n  static getDerivedStateFromProps(props, state) {\n    const value = Textarea.getValue(props)\n    if (\n      state._listenForPropChanges &&\n      value !== 'initval' &&\n      value !== state.value\n    ) {\n      if (\n        value !== state.value &&\n        value !== state._value &&\n        typeof props.on_state_update === 'function'\n      ) {\n        dispatchCustomElementEvent({ props }, 'on_state_update', { value })\n      }\n      state.value = value\n    }\n    if (props.textarea_state) {\n      state.textareaState = props.textarea_state\n    }\n    state._listenForPropChanges = true\n    return state\n  }\n\n  static hasValue(value) {\n    return (\n      ((typeof value === 'string' || typeof value === 'number') &&\n        String(value).length > 0) ||\n      false\n    )\n  }\n\n  static getValue(props) {\n    const value = processChildren(props)\n    if (value === '' || Textarea.hasValue(value)) {\n      return value\n    }\n    return props.value\n  }\n\n  state = {\n    textareaState: 'virgin',\n    value: null,\n    _value: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    this._ref = props.inner_ref || React.createRef()\n    this._id = props.id || makeUniqueId() // cause we need an id anyway\n\n    // make sure we don't trigger getDerivedStateFromProps on startup\n    this.state._listenForPropChanges = true\n    if (props.textarea_state) {\n      this.state.textareaState = props.textarea_state\n    }\n    this.state._value = props.value\n  }\n  componentDidMount() {\n    if (isTrue(this.props.autoresize) && typeof window !== 'undefined') {\n      this.setAutosize()\n      try {\n        this.resizeObserver = new ResizeObserver(this.setAutosize)\n        this.resizeObserver.observe(document.body)\n      } catch (e) {\n        window.addEventListener('resize', this.setAutosize)\n      }\n    }\n  }\n  componentWillUnmount() {\n    if (this.resizeObserver) {\n      this.resizeObserver.disconnect()\n      this.resizeObserver = null\n    }\n    if (typeof window !== 'undefined') {\n      window.removeEventListener('resize', this.setAutosize)\n    }\n  }\n  onFocusHandler = (event) => {\n    const { value } = this._ref.current\n    this.setState({\n      value,\n      _listenForPropChanges: false,\n      textareaState: 'focus',\n    })\n    dispatchCustomElementEvent(this, 'on_focus', { value, event })\n  }\n  onBlurHandler = (event) => {\n    const { value } = event.target\n    this.setState({\n      value,\n      _listenForPropChanges: false,\n      textareaState: Textarea.hasValue(value) ? 'dirty' : 'initial',\n    })\n    dispatchCustomElementEvent(this, 'on_blur', { value, event })\n  }\n  onChangeHandler = (event) => {\n    const { value } = event.target\n\n    if (isTrue(this.props.autoresize)) {\n      this.prepareAutosize()\n    }\n\n    const rows = this.getRows(value)\n\n    const ret = dispatchCustomElementEvent(this, 'on_change', {\n      value,\n      rows,\n      event,\n    })\n    if (ret !== false) {\n      this.setState({ value, _listenForPropChanges: false })\n      if (isTrue(this.props.autoresize)) {\n        this.setAutosize(rows)\n      }\n    }\n  }\n  onKeyDownHandler = (event) => {\n    const rows = this.getRows()\n    const { value } = event.target\n    dispatchCustomElementEvent(this, 'on_key_down', {\n      value,\n      rows,\n      event,\n    })\n  }\n  prepareAutosize = () => {\n    const elem = this._ref.current\n    if (!elem) {\n      return // stop here if no element was gotten\n    }\n    try {\n      elem.style.height = 'auto'\n    } catch (e) {\n      warn(e)\n    }\n  }\n  setAutosize = (rows = null) => {\n    const elem = this._ref.current\n    if (!elem) {\n      return // stop here if no element was gotten\n    }\n    try {\n      if (typeof this._heightOffset === 'undefined') {\n        this._heightOffset = elem.offsetHeight - elem.clientHeight\n      }\n\n      elem.style.height = 'auto'\n\n      // get rows after we set height to auto, this way we get 100% correct rows\n      const lineHeight = this.getLineHeight()\n      let newHeight = elem.scrollHeight + this._heightOffset\n      if (!rows) {\n        rows = this.getRows()\n      }\n\n      if (rows === 1) {\n        if (newHeight > lineHeight) {\n          newHeight = lineHeight\n        }\n      }\n\n      const maxRows = parseFloat(this.props.autoresize_max_rows)\n      if (maxRows > 0) {\n        const maxHeight = maxRows * lineHeight\n\n        if (rows > maxRows || newHeight > maxHeight) {\n          newHeight = maxHeight\n        }\n      }\n\n      elem.style.height = newHeight + 'px'\n    } catch (e) {\n      warn(e)\n    }\n  }\n  getRows() {\n    return (\n      Math.floor(this._ref.current.scrollHeight / this.getLineHeight()) ||\n      1\n    )\n  }\n  getLineHeight() {\n    return parseFloat(getComputedStyle(this._ref.current).lineHeight) || 0\n  }\n  render() {\n    // use only the props from context, who are available here anyway\n    const props = extendPropsWithContextInClassComponent(\n      this.props,\n      Textarea.defaultProps,\n      { skeleton: this.context?.skeleton },\n      this.context.getTranslation(this.props).Textarea,\n      includeValidProps(this.context.FormRow),\n      this.context.Textarea\n    )\n\n    const {\n      label,\n      label_direction,\n      label_sr_only,\n      status,\n      status_state,\n      status_props,\n      status_no_animation,\n      globalStatus,\n      suffix,\n      disabled,\n      skeleton,\n      stretch,\n      placeholder,\n      align,\n      textarea_class,\n      readOnly,\n      textarea_attributes,\n      class: _className,\n      className,\n\n      autoresize,\n      autoresize_max_rows, //eslint-disable-line\n      id: _id, //eslint-disable-line\n      children, //eslint-disable-line\n      value: _value, //eslint-disable-line\n      textarea_element: _textarea_element, //eslint-disable-line\n\n      ...attributes\n    } = props\n\n    const { value, textareaState } = this.state\n\n    const id = this._id\n    const showStatus = getStatusState(status)\n    const hasValue = Textarea.hasValue(value)\n\n    // pass along all props we wish to have as params\n    let { textarea_element: TextareaElement } = props\n\n    const textareaAttributes = textarea_attributes\n      ? typeof textarea_attributes === 'string'\n        ? JSON.parse(textarea_attributes)\n        : textarea_attributes\n      : {}\n\n    const textareaParams = {\n      className: classnames('dnb-textarea__textarea', textarea_class),\n      role: 'textbox',\n      value: hasValue ? value : '',\n      id,\n      disabled: isTrue(disabled) || isTrue(skeleton),\n      name: id,\n      'aria-placeholder': placeholder,\n      ...attributes,\n      ...textareaAttributes,\n      onChange: this.onChangeHandler,\n      onFocus: this.onFocusHandler,\n      onBlur: this.onBlurHandler,\n      // onPaste: this.onChangeHandler,\n      onKeyDown: this.onKeyDownHandler,\n    }\n\n    // we may consider using: aria-details\n    if (showStatus || suffix) {\n      textareaParams['aria-describedby'] = combineDescribedBy(\n        textareaParams,\n        showStatus ? id + '-status' : null,\n        suffix ? id + '-suffix' : null\n      )\n    }\n    if (readOnly) {\n      textareaParams['aria-readonly'] = textareaParams.readOnly = true\n    }\n\n    const mainParams = {\n      className: classnames(\n        'dnb-textarea',\n        `dnb-textarea--${textareaState}`,\n        hasValue && 'dnb-textarea--has-content',\n        align && `dnb-textarea__align--${align}`,\n        status && `dnb-textarea__status--${status_state}`,\n        autoresize && 'dnb-textarea__autoresize',\n        label_direction && `dnb-textarea--${label_direction}`,\n        isTrue(stretch) && `dnb-textarea--stretch`,\n        'dnb-form-component',\n        createSkeletonClass(null, skeleton),\n        createSpacingClasses(props),\n        _className,\n        className\n      ),\n    }\n\n    const innerParams = {\n      className: classnames(\n        'dnb-textarea__inner',\n        createSkeletonClass('shape', skeleton, this.context)\n      ),\n    }\n\n    const shellParams = {\n      className: classnames('dnb-textarea__shell'),\n    }\n\n    if (isTrue(disabled) || isTrue(skeleton)) {\n      shellParams['aria-disabled'] = true\n    }\n\n    // to show the ending dots on a placeholder, if the text is longer\n    const placeholderStyle =\n      parseFloat(this.props.rows) > 0\n        ? {\n            '--textarea-rows': parseFloat(this.props.rows),\n            // '--textarea-cols': parseFloat(this.props.cols)\n          }\n        : null\n\n    skeletonDOMAttributes(innerParams, skeleton, this.context)\n\n    // also used for code markup simulation\n    validateDOMAttributes(this.props, textareaParams)\n    validateDOMAttributes(null, innerParams)\n    validateDOMAttributes(null, shellParams)\n\n    if (TextareaElement && typeof TextareaElement === 'function') {\n      TextareaElement = TextareaElement(textareaParams, this._ref)\n    } else if (!TextareaElement && _textarea_element) {\n      TextareaElement = _textarea_element\n    }\n\n    return (\n      <span {...mainParams}>\n        {label && (\n          <FormLabel\n            id={id + '-label'}\n            for_id={id}\n            text={label}\n            label_direction={label_direction}\n            sr_only={label_sr_only}\n            disabled={disabled}\n            skeleton={skeleton}\n          />\n        )}\n\n        <span {...innerParams}>\n          <AlignmentHelper />\n\n          <FormStatus\n            show={showStatus}\n            id={id + '-form-status'}\n            globalStatus={globalStatus}\n            label={label}\n            text_id={id + '-status'} // used for \"aria-describedby\"\n            text={status}\n            state={status_state}\n            no_animation={status_no_animation}\n            skeleton={skeleton}\n            {...status_props}\n          />\n\n          <span className=\"dnb-textarea__row\">\n            <span {...shellParams}>\n              {TextareaElement || (\n                <textarea ref={this._ref} {...textareaParams} />\n              )}\n\n              {placeholder && (\n                <span\n                  aria-hidden\n                  className={classnames(\n                    'dnb-textarea__placeholder',\n                    align ? `dnb-textarea__align--${align}` : null\n                  )}\n                  style={placeholderStyle}\n                >\n                  {placeholder}\n                </span>\n              )}\n\n              <span className=\"dnb-textarea__state\" />\n            </span>\n\n            {suffix && (\n              <Suffix\n                className=\"dnb-textarea__suffix\"\n                id={id + '-suffix'} // used for \"aria-describedby\"\n                context={props}\n              >\n                {suffix}\n              </Suffix>\n            )}\n          </span>\n        </span>\n      </span>\n    )\n  }\n}\n"],"mappings":"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"}

package/es/components/textarea/style/dnb-textarea.css

@@ -7,6 +7,7 @@
  */
 .dnb-textarea {
   --textarea-padding-width: 0.5rem;
+  --textarea-rows: 2;
   display: inline-flex;
   font-size: var(--font-size-small);
   line-height: var(--line-height-basis);
@@ -48,6 +49,33 @@
   outline: none;
   font-size: var(--font-size-basis);
   line-height: var(--line-height-basis);
+  overflow-y: auto;
+  overscroll-behavior: contain;
+  -webkit-overflow-scrolling: touch;
+  -ms-overflow-style: auto;
+  scrollbar-color: var(--scrollbar-thumb-color, #888) transparent;
+}
+html:not([data-visual-test]) .dnb-textarea__textarea {
+  scroll-behavior: smooth;
+}
+@supports not (scrollbar-color: auto) {
+  .dnb-textarea__textarea::-webkit-scrollbar {
+    border-radius: var(--scrollbar-thumb-width, 0.5rem);
+    background-color: var(--scrollbar-track-color, #eee);
+  }
+  .dnb-textarea__textarea::-webkit-scrollbar:vertical {
+    width: var(--scrollbar-track-width, 0.5rem);
+  }
+  .dnb-textarea__textarea::-webkit-scrollbar:horizontal {
+    height: var(--scrollbar-track-width, 0.5rem);
+  }
+  .dnb-textarea__textarea::-webkit-scrollbar-thumb {
+    background-color: var(--scrollbar-thumb-color, #888);
+    border-radius: var(--scrollbar-thumb-width, 0.5rem);
+  }
+  .dnb-textarea__textarea::-webkit-scrollbar-thumb:hover {
+    background-color: var(--scrollbar-thumb-hover-color, #666);
+  }
 }
 .dnb-textarea__placeholder {
   pointer-events: none;
@@ -58,6 +86,9 @@
   overflow: hidden;
   width: 100%;
   height: 100%;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: var(--textarea-rows, 2);
   cursor: auto;
   border: none;
   margin: 0;
@@ -75,8 +106,15 @@
 .dnb-textarea__autoresize .dnb-textarea__textarea {
   resize: none;
 }
+.dnb-textarea--disabled .dnb-textarea__textarea, .dnb-textarea__textarea[disabled] {
+  -webkit-user-select: none;
+          user-select: none;
+}
+.dnb-textarea--disabled .dnb-textarea__textarea::-webkit-scrollbar, .dnb-textarea__textarea[disabled]::-webkit-scrollbar {
+  width: 0;
+}
 .dnb-textarea--has-content .dnb-textarea__textarea ~ .dnb-textarea__placeholder, .dnb-textarea--focus .dnb-textarea__textarea:not([disabled]):not([readonly]) ~ .dnb-textarea__placeholder {
-  opacity: 0.5;
+  display: none;
 }
 .dnb-textarea__inner > .dnb-form-status {
   order: 2;

package/es/components/textarea/style/dnb-textarea.min.css

@@ -1 +1 @@
-.dnb-textarea{--textarea-padding-width:0.5rem;display:inline-flex;font-size:var(--font-size-small);line-height:var(--line-height-basis)}.dnb-textarea__inner{display:inline-flex;flex-direction:column;margin:var(--textarea-padding-width)}.dnb-textarea__shell{display:inline-flex;font-size:var(--font-size-basis);position:relative}.dnb-textarea__state{background-color:var(--color-white);border-radius:.25rem;bottom:-.5rem;box-shadow:0 0 0 .0625rem var(--color-sea-green);left:-.5rem;position:absolute;right:-.5rem;top:-.5rem;z-index:1}.dnb-textarea__row{display:inline-flex}.dnb-textarea__suffix{padding-left:1.5rem}.dnb-textarea__textarea{position:relative;z-index:2}.dnb-textarea__placeholder,.dnb-textarea__textarea{border:none;cursor:auto;font-size:var(--font-size-basis);line-height:var(--line-height-basis);margin:0;outline:none;padding:0 var(--textarea-padding-width)}.dnb-textarea__placeholder{height:100%;left:0;overflow:hidden;pointer-events:none;position:absolute;top:0;width:100%;z-index:3}.dnb-textarea__placeholder,.dnb-textarea__textarea{text-align:left}.dnb-textarea__align--right .dnb-textarea__placeholder,.dnb-textarea__align--right .dnb-textarea__textarea{text-align:right}.dnb-textarea__autoresize .dnb-textarea__textarea{resize:none}.dnb-textarea--focus .dnb-textarea__textarea:not([disabled]):not([readonly])~.dnb-textarea__placeholder,.dnb-textarea--has-content .dnb-textarea__textarea~.dnb-textarea__placeholder{opacity:.5}.dnb-textarea__inner>.dnb-form-status{margin:1rem 0 0 calc(0px - var(--textarea-padding-width));order:2}.dnb-textarea:not(.dnb-textarea--vertical) .dnb-form-label{margin-top:.5rem}.dnb-textarea--vertical{align-items:flex-start;display:flex;flex-direction:column}.dnb-textarea:not(.dnb-textarea--vertical)[class*=__status]{align-items:flex-start}.dnb-textarea:not(.dnb-textarea--vertical)[class*=__status]>.dnb-form-label{margin-top:.25rem}@media screen and (max-width:40em){.dnb-textarea{flex-wrap:wrap}.dnb-textarea>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-textarea--stretch{display:flex;flex-grow:1}.dnb-textarea--stretch .dnb-textarea__inner{flex-grow:1}.dnb-textarea--stretch .dnb-textarea__inner,.dnb-textarea--stretch .dnb-textarea__shell,.dnb-textarea--stretch .dnb-textarea__textarea{width:100%}.dnb-textarea--stretch .dnb-form-label+.dnb-textarea__inner{width:auto}.dnb-form-row--horizontal .dnb-textarea--stretch,.dnb-textarea--vertical.dnb-textarea--stretch .dnb-textarea__inner{width:100%}@media screen and (max-width:40em){.dnb-responsive-component .dnb-textarea{align-items:flex-start;display:flex;flex-direction:column;margin-bottom:.5rem}.dnb-responsive-component .dnb-textarea>.dnb-form-label{margin-bottom:.5rem}}html[data-visual-test] .dnb-textarea__textarea{caret-color:var(--color-white)}.dnb-textarea.dnb-skeleton .dnb-textarea__inner{border-radius:.25rem;margin:0}.dnb-textarea.dnb-skeleton .dnb-textarea__inner .dnb-textarea__shell{margin:var(--textarea-padding-width)}.dnb-textarea.dnb-skeleton .dnb-textarea__state,.dnb-textarea.dnb-skeleton .dnb-textarea__textarea{visibility:hidden}
+.dnb-textarea{--textarea-padding-width:0.5rem;--textarea-rows:2;display:inline-flex;font-size:var(--font-size-small);line-height:var(--line-height-basis)}.dnb-textarea__inner{display:inline-flex;flex-direction:column;margin:var(--textarea-padding-width)}.dnb-textarea__shell{display:inline-flex;font-size:var(--font-size-basis);position:relative}.dnb-textarea__state{background-color:var(--color-white);border-radius:.25rem;bottom:-.5rem;box-shadow:0 0 0 .0625rem var(--color-sea-green);left:-.5rem;position:absolute;right:-.5rem;top:-.5rem;z-index:1}.dnb-textarea__row{display:inline-flex}.dnb-textarea__suffix{padding-left:1.5rem}.dnb-textarea__textarea{-webkit-overflow-scrolling:touch;-ms-overflow-style:auto;border:none;cursor:auto;font-size:var(--font-size-basis);line-height:var(--line-height-basis);margin:0;outline:none;overflow-y:auto;overscroll-behavior:contain;padding:0 var(--textarea-padding-width);position:relative;scrollbar-color:var(--scrollbar-thumb-color,#888) transparent;z-index:2}html:not([data-visual-test]) .dnb-textarea__textarea{scroll-behavior:smooth}@supports not (scrollbar-color:auto){.dnb-textarea__textarea::-webkit-scrollbar{background-color:var(--scrollbar-track-color,#eee);border-radius:var(--scrollbar-thumb-width,.5rem)}.dnb-textarea__textarea::-webkit-scrollbar:vertical{width:var(--scrollbar-track-width,.5rem)}.dnb-textarea__textarea::-webkit-scrollbar:horizontal{height:var(--scrollbar-track-width,.5rem)}.dnb-textarea__textarea::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb-color,#888);border-radius:var(--scrollbar-thumb-width,.5rem)}.dnb-textarea__textarea::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-thumb-hover-color,#666)}}.dnb-textarea__placeholder{-webkit-box-orient:vertical;-webkit-line-clamp:var(--textarea-rows,2);border:none;cursor:auto;display:-webkit-box;font-size:var(--font-size-basis);height:100%;left:0;line-height:var(--line-height-basis);margin:0;outline:none;overflow:hidden;padding:0 var(--textarea-padding-width);pointer-events:none;position:absolute;top:0;width:100%;z-index:3}.dnb-textarea__placeholder,.dnb-textarea__textarea{text-align:left}.dnb-textarea__align--right .dnb-textarea__placeholder,.dnb-textarea__align--right .dnb-textarea__textarea{text-align:right}.dnb-textarea__autoresize .dnb-textarea__textarea{resize:none}.dnb-textarea--disabled .dnb-textarea__textarea,.dnb-textarea__textarea[disabled]{-webkit-user-select:none;user-select:none}.dnb-textarea--disabled .dnb-textarea__textarea::-webkit-scrollbar,.dnb-textarea__textarea[disabled]::-webkit-scrollbar{width:0}.dnb-textarea--focus .dnb-textarea__textarea:not([disabled]):not([readonly])~.dnb-textarea__placeholder,.dnb-textarea--has-content .dnb-textarea__textarea~.dnb-textarea__placeholder{display:none}.dnb-textarea__inner>.dnb-form-status{margin:1rem 0 0 calc(0px - var(--textarea-padding-width));order:2}.dnb-textarea:not(.dnb-textarea--vertical) .dnb-form-label{margin-top:.5rem}.dnb-textarea--vertical{align-items:flex-start;display:flex;flex-direction:column}.dnb-textarea:not(.dnb-textarea--vertical)[class*=__status]{align-items:flex-start}.dnb-textarea:not(.dnb-textarea--vertical)[class*=__status]>.dnb-form-label{margin-top:.25rem}@media screen and (max-width:40em){.dnb-textarea{flex-wrap:wrap}.dnb-textarea>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-textarea--stretch{display:flex;flex-grow:1}.dnb-textarea--stretch .dnb-textarea__inner{flex-grow:1}.dnb-textarea--stretch .dnb-textarea__inner,.dnb-textarea--stretch .dnb-textarea__shell,.dnb-textarea--stretch .dnb-textarea__textarea{width:100%}.dnb-textarea--stretch .dnb-form-label+.dnb-textarea__inner{width:auto}.dnb-form-row--horizontal .dnb-textarea--stretch,.dnb-textarea--vertical.dnb-textarea--stretch .dnb-textarea__inner{width:100%}@media screen and (max-width:40em){.dnb-responsive-component .dnb-textarea{align-items:flex-start;display:flex;flex-direction:column;margin-bottom:.5rem}.dnb-responsive-component .dnb-textarea>.dnb-form-label{margin-bottom:.5rem}}html[data-visual-test] .dnb-textarea__textarea{caret-color:var(--color-white)}.dnb-textarea.dnb-skeleton .dnb-textarea__inner{border-radius:.25rem;margin:0}.dnb-textarea.dnb-skeleton .dnb-textarea__inner .dnb-textarea__shell{margin:var(--textarea-padding-width)}.dnb-textarea.dnb-skeleton .dnb-textarea__state,.dnb-textarea.dnb-skeleton .dnb-textarea__textarea{visibility:hidden}

package/es/components/textarea/style/dnb-textarea.scss

@@ -19,6 +19,7 @@
 
 .dnb-textarea {
   --textarea-padding-width: 0.5rem;
+  --textarea-rows: 2; // using variable so it can be dynamically changed by react component
 
   display: inline-flex;
 
@@ -67,6 +68,8 @@
     z-index: 2;
 
     @include textareaStyleCommon();
+
+    @include scrollY(auto);
   }
 
   &__placeholder {
@@ -81,6 +84,13 @@
     width: 100%; // to get overflow working properly
     height: 100%; // to get overflow working properly
 
+    // Required for line-clamp
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+
+    // Limit the text block to two lines
+    -webkit-line-clamp: var(--textarea-rows, 2);
+
     @include textareaStyleCommon();
   }
 
@@ -98,10 +108,19 @@
     resize: none;
   }
 
+  // disabled
+  &--disabled &__textarea,
+  &__textarea[disabled] {
+    user-select: none; // Safari / Touch fix
+    &::-webkit-scrollbar {
+      width: 0;
+    }
+  }
+
   // hide placeholder on focus
   &--has-content &__textarea ~ &__placeholder,
   &--focus &__textarea:not([disabled], [readonly]) ~ &__placeholder {
-    opacity: 0.5;
+    display: none;
   }
 
   &__inner > .dnb-form-status {

package/es/components/textarea/style/themes/dnb-textarea-theme-sbanken.css

@@ -0,0 +1,61 @@
+/*
+* Textarea theme
+*
+*/
+/*
+ * Utilities
+ */
+.dnb-textarea {
+  --textarea-border-color: var(--sb-color-gray-dark-2);
+  --textarea-border-width: 0.0625rem;
+}
+.dnb-textarea__state {
+  transition: border-radius 0.25s ease-out;
+  --border-color: var(--textarea-border-color);
+  --border-width: var(--textarea-border-width);
+  box-shadow: inset 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+.dnb-textarea__textarea {
+  --textarea-color: var(--textarea-color--default);
+  --textarea-color--default: var(--color-black);
+  --textarea-color--active: var(--color-black);
+  color: var(--textarea-color);
+  background-color: transparent;
+}
+.dnb-textarea__placeholder {
+  color: var(--sb-color-gray-dark-3);
+}
+.dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):hover ~ .dnb-textarea__state {
+  --textarea-border-color: var(--sb-color-violet);
+  --textarea-border-width: 0.125rem;
+}
+.dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):focus {
+  --textarea-color: var(--textarea-color--active);
+}
+.dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):focus ~ .dnb-textarea__state {
+  --textarea-border-color: var(--sb-color-violet);
+  border-radius: 1.5rem;
+  outline: none;
+}
+html[data-whatinput=keyboard] .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):focus ~ .dnb-textarea__state {
+  --border-color: var(--focus-ring-color);
+  --border-width: var(--focus-ring-width);
+  box-shadow: inset 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+.dnb-textarea--disabled .dnb-textarea__textarea, .dnb-textarea__textarea[disabled] {
+  color: var(--sb-color-gray-dark-2);
+  background-color: var(--sb-color-gray-light);
+}
+.dnb-textarea--disabled .dnb-textarea__textarea ~ .dnb-textarea__state, .dnb-textarea__textarea[disabled] ~ .dnb-textarea__state {
+  --textarea-border-color: var(--sb-color-gray-dark-2);
+  background-color: var(--sb-color-gray-light);
+}
+.dnb-textarea__status--error .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled) {
+  --textarea-color--default: var(--sb-color-red);
+  --textarea-color--active: var(--color-black);
+}
+.dnb-textarea__status--error .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled) ~ .dnb-textarea__state {
+  --textarea-border-color: var(--sb-color-red);
+}

package/es/components/textarea/style/themes/dnb-textarea-theme-sbanken.min.css

@@ -0,0 +1 @@
+.dnb-textarea{--textarea-border-color:var(--sb-color-gray-dark-2);--textarea-border-width:0.0625rem}.dnb-textarea__state{--border-color:var(--textarea-border-color);--border-width:var(--textarea-border-width);border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color);transition:border-radius .25s ease-out}.dnb-textarea__textarea{--textarea-color:var(--textarea-color--default);--textarea-color--default:var(--color-black);--textarea-color--active:var(--color-black);background-color:transparent;color:var(--textarea-color)}.dnb-textarea__placeholder{color:var(--sb-color-gray-dark-3)}.dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):hover~.dnb-textarea__state{--textarea-border-color:var(--sb-color-violet);--textarea-border-width:0.125rem}.dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):focus{--textarea-color:var(--textarea-color--active)}.dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):focus~.dnb-textarea__state{--textarea-border-color:var(--sb-color-violet);border-radius:1.5rem;outline:none}html[data-whatinput=keyboard] .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):focus~.dnb-textarea__state{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color)}.dnb-textarea--disabled .dnb-textarea__textarea,.dnb-textarea__textarea[disabled]{background-color:var(--sb-color-gray-light);color:var(--sb-color-gray-dark-2)}.dnb-textarea--disabled .dnb-textarea__textarea~.dnb-textarea__state,.dnb-textarea__textarea[disabled]~.dnb-textarea__state{--textarea-border-color:var(--sb-color-gray-dark-2);background-color:var(--sb-color-gray-light)}.dnb-textarea__status--error .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled){--textarea-color--default:var(--sb-color-red);--textarea-color--active:var(--color-black)}.dnb-textarea__status--error .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled)~.dnb-textarea__state{--textarea-border-color:var(--sb-color-red)}

package/es/components/textarea/style/themes/dnb-textarea-theme-sbanken.scss

@@ -0,0 +1,72 @@
+/*
+* Textarea theme
+*
+*/
+
+@import '../../../../style/core/utilities.scss';
+
+.dnb-textarea {
+  --textarea-border-color: var(--sb-color-gray-dark-2);
+  --textarea-border-width: 0.0625rem;
+
+  &__state {
+    transition: border-radius 0.25s ease-out;
+    @include fakeBorder(
+      var(--textarea-border-color),
+      var(--textarea-border-width),
+      inset
+    );
+  }
+
+  &__textarea {
+    --textarea-color: var(--textarea-color--default);
+    --textarea-color--default: var(--color-black);
+    --textarea-color--active: var(--color-black);
+
+    color: var(--textarea-color);
+    background-color: transparent;
+  }
+
+  &__placeholder {
+    color: var(--sb-color-gray-dark-3);
+  }
+
+  // hover
+  &__textarea:not([disabled]):not(#{&}--disabled):hover ~ &__state {
+    --textarea-border-color: var(--sb-color-violet);
+    --textarea-border-width: 0.125rem;
+  }
+
+  // focus
+  &__textarea:not([disabled]):not(#{&}--disabled):focus {
+    --textarea-color: var(--textarea-color--active);
+
+    ~ .dnb-textarea__state {
+      --textarea-border-color: var(--sb-color-violet);
+      border-radius: 1.5rem;
+      @include focusRing(null, null, inset);
+    }
+  }
+
+  // disabled
+  &--disabled &__textarea,
+  &__textarea[disabled] {
+    color: var(--sb-color-gray-dark-2);
+    background-color: var(--sb-color-gray-light);
+
+    ~ .dnb-textarea__state {
+      --textarea-border-color: var(--sb-color-gray-dark-2);
+      background-color: var(--sb-color-gray-light);
+    }
+  }
+
+  // with status_state = "error"
+  &__status--error &__textarea:not([disabled]):not(#{&}--disabled) {
+    --textarea-color--default: var(--sb-color-red);
+    --textarea-color--active: var(--color-black);
+
+    ~ .dnb-textarea__state {
+      --textarea-border-color: var(--sb-color-red);
+    }
+  }
+}

package/es/components/textarea/style/themes/dnb-textarea-theme-ui.css

@@ -5,63 +5,25 @@
 /*
  * Utilities
  */
-.dnb-textarea {
-  --textarea-rows: 2;
-}
 .dnb-textarea__textarea {
   color: var(--color-black);
   background-color: var(--color-white);
-  overflow-y: auto;
-  overscroll-behavior: contain;
-  -webkit-overflow-scrolling: touch;
-  -ms-overflow-style: auto;
-  scrollbar-color: var(--scrollbar-thumb-color, #888) transparent;
 }
 .dnb-textarea__textarea ::selection {
   background-color: var(--color-mint-green);
   color: var(--color-black);
   text-shadow: none;
 }
-html:not([data-visual-test]) .dnb-textarea__textarea {
-  scroll-behavior: smooth;
-}
-@supports not (scrollbar-color: auto) {
-  .dnb-textarea__textarea::-webkit-scrollbar {
-    border-radius: var(--scrollbar-thumb-width, 0.5rem);
-    background-color: var(--scrollbar-track-color, #eee);
-  }
-  .dnb-textarea__textarea::-webkit-scrollbar:vertical {
-    width: var(--scrollbar-track-width, 0.5rem);
-  }
-  .dnb-textarea__textarea::-webkit-scrollbar:horizontal {
-    height: var(--scrollbar-track-width, 0.5rem);
-  }
-  .dnb-textarea__textarea::-webkit-scrollbar-thumb {
-    background-color: var(--scrollbar-thumb-color, #888);
-    border-radius: var(--scrollbar-thumb-width, 0.5rem);
-  }
-  .dnb-textarea__textarea::-webkit-scrollbar-thumb:hover {
-    background-color: var(--scrollbar-thumb-hover-color, #666);
-  }
-}
 .dnb-textarea__placeholder {
   color: var(--color-black-55);
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: var(--textarea-rows, 2);
 }
 .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):focus ~ .dnb-textarea__state, .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):hover ~ .dnb-textarea__state {
   box-shadow: 0 0 0 0.125rem var(--color-emerald-green);
 }
 .dnb-textarea--disabled .dnb-textarea__textarea, .dnb-textarea__textarea[disabled] {
-  -webkit-user-select: none;
-          user-select: none;
   color: var(--color-black-55);
   background-color: var(--color-black-3);
 }
-.dnb-textarea--disabled .dnb-textarea__textarea::-webkit-scrollbar, .dnb-textarea__textarea[disabled]::-webkit-scrollbar {
-  width: 0;
-}
 .dnb-textarea--disabled .dnb-textarea__state, .dnb-textarea__textarea[disabled] ~ .dnb-textarea__state {
   box-shadow: 0 0 0 0.0625rem var(--color-black-55);
   background-color: var(--color-black-3);
@@ -80,7 +42,4 @@ html:not([data-visual-test]) .dnb-textarea__textarea {
   --border-width: 0.125rem;
   box-shadow: 0 0 0 var(--border-width) var(--border-color);
   border-color: transparent;
-}
-.dnb-textarea--has-content .dnb-textarea__textarea ~ .dnb-textarea__placeholder, .dnb-textarea--focus .dnb-textarea__textarea:not([disabled]):not([readonly]) ~ .dnb-textarea__placeholder {
-  display: none;
 }

package/es/components/textarea/style/themes/dnb-textarea-theme-ui.min.css

@@ -1 +1 @@
-.dnb-textarea{--textarea-rows:2}.dnb-textarea__textarea{-webkit-overflow-scrolling:touch;-ms-overflow-style:auto;background-color:var(--color-white);color:var(--color-black);overflow-y:auto;overscroll-behavior:contain;scrollbar-color:var(--scrollbar-thumb-color,#888) transparent}.dnb-textarea__textarea ::selection{background-color:var(--color-mint-green);color:var(--color-black);text-shadow:none}html:not([data-visual-test]) .dnb-textarea__textarea{scroll-behavior:smooth}@supports not (scrollbar-color:auto){.dnb-textarea__textarea::-webkit-scrollbar{background-color:var(--scrollbar-track-color,#eee);border-radius:var(--scrollbar-thumb-width,.5rem)}.dnb-textarea__textarea::-webkit-scrollbar:vertical{width:var(--scrollbar-track-width,.5rem)}.dnb-textarea__textarea::-webkit-scrollbar:horizontal{height:var(--scrollbar-track-width,.5rem)}.dnb-textarea__textarea::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb-color,#888);border-radius:var(--scrollbar-thumb-width,.5rem)}.dnb-textarea__textarea::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-thumb-hover-color,#666)}}.dnb-textarea__placeholder{-webkit-box-orient:vertical;-webkit-line-clamp:var(--textarea-rows,2);color:var(--color-black-55);display:-webkit-box}.dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):focus~.dnb-textarea__state,.dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):hover~.dnb-textarea__state{box-shadow:0 0 0 .125rem var(--color-emerald-green)}.dnb-textarea--disabled .dnb-textarea__textarea,.dnb-textarea__textarea[disabled]{background-color:var(--color-black-3);color:var(--color-black-55);-webkit-user-select:none;user-select:none}.dnb-textarea--disabled .dnb-textarea__textarea::-webkit-scrollbar,.dnb-textarea__textarea[disabled]::-webkit-scrollbar{width:0}.dnb-textarea--disabled .dnb-textarea__state,.dnb-textarea__textarea[disabled]~.dnb-textarea__state{background-color:var(--color-black-3);box-shadow:0 0 0 .0625rem var(--color-black-55)}.dnb-textarea__status--error:not(.dnb-textarea--focus) .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled),.dnb-textarea__status--error:not(.dnb-textarea--focus) .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):hover{color:var(--color-fire-red)}.dnb-textarea__status--error:not(.dnb-textarea--focus) .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled)~.dnb-textarea__state{--border-color:var(--color-fire-red);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-textarea__status--error:not(.dnb-textarea--focus) .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):hover~.dnb-textarea__state{--border-color:var(--color-fire-red);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-textarea--focus .dnb-textarea__textarea:not([disabled]):not([readonly])~.dnb-textarea__placeholder,.dnb-textarea--has-content .dnb-textarea__textarea~.dnb-textarea__placeholder{display:none}
+.dnb-textarea__textarea{background-color:var(--color-white);color:var(--color-black)}.dnb-textarea__textarea ::selection{background-color:var(--color-mint-green);color:var(--color-black);text-shadow:none}.dnb-textarea__placeholder{color:var(--color-black-55)}.dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):focus~.dnb-textarea__state,.dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):hover~.dnb-textarea__state{box-shadow:0 0 0 .125rem var(--color-emerald-green)}.dnb-textarea--disabled .dnb-textarea__textarea,.dnb-textarea__textarea[disabled]{background-color:var(--color-black-3);color:var(--color-black-55)}.dnb-textarea--disabled .dnb-textarea__state,.dnb-textarea__textarea[disabled]~.dnb-textarea__state{background-color:var(--color-black-3);box-shadow:0 0 0 .0625rem var(--color-black-55)}.dnb-textarea__status--error:not(.dnb-textarea--focus) .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled),.dnb-textarea__status--error:not(.dnb-textarea--focus) .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):hover{color:var(--color-fire-red)}.dnb-textarea__status--error:not(.dnb-textarea--focus) .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled)~.dnb-textarea__state{--border-color:var(--color-fire-red);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-textarea__status--error:not(.dnb-textarea--focus) .dnb-textarea__textarea:not([disabled]):not(.dnb-textarea--disabled):hover~.dnb-textarea__state{--border-color:var(--color-fire-red);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}

package/es/components/textarea/style/themes/dnb-textarea-theme-ui.scss

@@ -6,8 +6,6 @@
 @import '../../../../style/core/utilities.scss';
 
 .dnb-textarea {
-  --textarea-rows: 2;
-
   &__textarea {
     color: var(--color-black);
     background-color: var(--color-white);
@@ -17,19 +15,10 @@
       color: var(--color-black);
       text-shadow: none;
     }
-
-    @include scrollY(auto);
   }
 
   &__placeholder {
     color: var(--color-black-55);
-
-    // Required for line-clamp
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-
-    // Limit the text block to two lines
-    -webkit-line-clamp: var(--textarea-rows, 2);
   }
 
   &__textarea:not([disabled]):not(#{&}--disabled):focus ~ &__state,
@@ -46,11 +35,6 @@
   // disabled
   &--disabled &__textarea,
   &__textarea[disabled] {
-    user-select: none; // Safari / Touch fix
-    &::-webkit-scrollbar {
-      width: 0;
-    }
-
     color: var(--color-black-55);
     background-color: var(--color-black-3);
   }
@@ -78,10 +62,4 @@
     ~ &__state {
     @include fakeBorder(var(--color-fire-red), 0.125rem);
   }
-
-  // hide placeholder on focus
-  &--has-content &__textarea ~ &__placeholder,
-  &--focus &__textarea:not([disabled], [readonly]) ~ &__placeholder {
-    display: none;
-  }
 }