@ntbjs/react-components 2.0.0-rc.9 → 2.0.2-rc.1

package/esm/components/inputs/MultiSelect/MultiSelect.styled.js

@@ -1,251 +0,0 @@
-import styled, { css } from 'styled-components';
-import { applyDefaultTheme } from '../../../utils/defaultTheme.js';
-import { ReactComponent as SvgClose } from '../../../icons/close.svg.js';
-import Select, { components } from 'react-select';
-import CreatableSelect$1 from '../../../node_modules/react-select/creatable/dist/react-select-creatable.esm.js';
-import { withAsyncPaginate, AsyncPaginate } from 'react-select-async-paginate';
-
-let _ = t => t,
-  _t,
-  _t2,
-  _t3,
-  _t4,
-  _t5,
-  _t6,
-  _t7,
-  _t8,
-  _t9,
-  _t10,
-  _t11,
-  _t12,
-  _t13,
-  _t14,
-  _t15,
-  _t16,
-  _t17,
-  _t18,
-  _t19,
-  _t20,
-  _t21,
-  _t22,
-  _t23,
-  _t24,
-  _t25,
-  _t26,
-  _t27;
-const AsyncCreatableSelectPaginate = withAsyncPaginate(CreatableSelect$1);
-const showMoreHeight = 114;
-const sharedStyle = css(_t || (_t = _`
-  font-family: ${0};
-  font-size: 12px;
-  font-weight: 400;
-  position: relative;
-`), props => props.theme.primaryFontFamily);
-const Label = styled.label.attrs(applyDefaultTheme)(_t2 || (_t2 = _`
-  ${0};
-  flex-basis: 33.33%;
-  font-size: 0.875rem;
-  line-height: 1rem;
-  cursor: pointer;
-  height: 19px;
-  display: flex;
-  align-items: center;
-`), props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700')));
-const MultiSelect = styled(Select).attrs(applyDefaultTheme)(_t3 || (_t3 = _`
-  ${0}
-`), sharedStyle);
-const CreatableMultiSelect = styled(CreatableSelect$1).attrs(applyDefaultTheme)(_t4 || (_t4 = _`
-  ${0}
-`), sharedStyle);
-const AsyncCreatableMultiSelect = styled(AsyncCreatableSelectPaginate).attrs(applyDefaultTheme)(_t5 || (_t5 = _`
-  ${0}
-`), sharedStyle);
-const AsyncMultiSelect = styled(AsyncPaginate).attrs(applyDefaultTheme)(_t6 || (_t6 = _`
-  ${0}
-`), sharedStyle);
-const MultiSelectWrapper = styled.div.attrs(applyDefaultTheme)(_t7 || (_t7 = _`
-  position: relative;
-`));
-const Control = styled(components.Control).attrs(applyDefaultTheme)(_t8 || (_t8 = _`
-  && {
-    align-items: flex-start;
-    background: transparent;
-    border: none;
-    box-shadow: none;
-  }
-
-  :hover {
-    cursor: ${0};
-  }
-`), props => !props.isDisabled && props.focused || props.readOnly ? 'default' : 'pointer');
-const ValueContainer = styled(components.ValueContainer)(_t9 || (_t9 = _`
-  && {
-    align-items: flex-start;
-    gap: 8px;
-    padding: 0;
-
-    max-height: ${0} !important;
-
-    ${0}
-  }
-`), props => {
-  return props.showMore ? props.error || props.warning ? '100%' : showMoreHeight + 16 + 'px' : '100%';
-}, props => (props.error || props.warning) && css(_t10 || (_t10 = _`
-        border: 1px solid;
-        border-radius: 3px;
-        padding: 4px;
-
-        border-color: ${0};
-      `), props => props.error ? props.theme.getColor('red-500') : props.warning ? props.theme.getColor('orange-500') : 'inherit'));
-const MultiValueWrapper = styled.div.attrs(applyDefaultTheme)(_t11 || (_t11 = _`
-  && {
-    border-radius: 3px;
-    margin: 0;
-  }
-`));
-const MultiValue = styled(components.MultiValue).attrs(applyDefaultTheme)(_t12 || (_t12 = _`
-  && {
-    border-radius: 3px;
-    margin: 0;
-
-    ${0}
-
-    ${0}
-
-    > div {
-      align-items: center;
-      display: flex;
-      font-size: 12px;
-      min-height: 26px;
-
-      :first-of-type {
-        padding: ${0};
-      }
-
-      :last-of-type:not(:only-child) {
-        padding: 0 8px 0 5px;
-        height: 100%;
-        width: fit-content;
-      }
-
-      :last-of-type:not(:only-child):hover {
-        background-color: ${0};
-        border-bottom-left-radius: 0;
-        border-top-left-radius: 0;
-        cursor: pointer;
-      }
-
-      svg {
-        stroke: white;
-        stroke-width: 2px;
-        width: 8px;
-      }
-
-    :hover {
-      cursor: pointer;
-    }
-  }
-`), props => props.theme.themeProp('background-color', props.theme.getColor('gray-600'), props.theme.getColor('gray-800')), props => props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-100')), props => props.isDisabled || props.readOnly ? '0 8px' : '0 3px 0 8px', props => props.theme.getColor('red-500'));
-const MultiValueRemove = styled(components.MultiValueRemove).attrs(applyDefaultTheme)(_t13 || (_t13 = _``));
-const Input = styled(components.Input).attrs(applyDefaultTheme)(_t14 || (_t14 = _`
-  align-self: center;
-  font-size: ${0};
-  min-width: 150px;
-
-  ${0}
-
-  ${0}
-  }
-`), props => props.$focused ? '14px' : '12px', props => props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900')), props => !props.$focused && css(_t15 || (_t15 = _`
-      ${0}
-
-      :before {
-        height: 100%;
-        white-space: nowrap;
-        width: fit-content;
-        content: '${0}';
-      }
-    `), props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500')), props => props.edittext));
-const DropdownMenu = styled(components.Menu).attrs(applyDefaultTheme)(_t16 || (_t16 = _`
-  font-size: 14px;
-
-  ${0}
-
-  ${0}
-`), props => props.theme.themeProp('background-color', props.theme.getColor('gray-600'), props.theme.getColor('white')), props => props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900')));
-const sharedOptionStyle = css(_t17 || (_t17 = _`
-  ${0}
-
-  ${0}
-
-  ${0}
-
-  :hover {
-    cursor: pointer;
-  }
-`), props => props.isFocused && css(_t18 || (_t18 = _`
-      ${0}
-    `), props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200'))), props => props.isSelected && css(_t19 || (_t19 = _`
-      ${0}
-
-      ${0}
-    `), props.theme.themeProp('background-color', 'transparent', 'transparent'), props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-900'))), props => props.isFocused && props.isSelected && css(_t20 || (_t20 = _`
-      ${0}
-    `), props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200'))));
-const Option = styled(components.Option).attrs(applyDefaultTheme)(_t21 || (_t21 = _`
-  ${0}
-`), sharedOptionStyle);
-const SelectedOption = styled(components.Option).attrs(applyDefaultTheme)(_t22 || (_t22 = _`
-  ${0}
-
-  display: flex !important;
-  justify-content: space-between;
-`), sharedOptionStyle);
-const DropdownOptionDeleteIcon = styled(SvgClose).attrs(applyDefaultTheme)(_t23 || (_t23 = _`
-  stroke-width: 1px;
-  width: 8px;
-
-  ${0}
-`), props => props.theme.themeProp('stroke', props.theme.getColor('gray-100'), props.theme.getColor('gray-900')));
-const ShowMoreWrapper = styled.div.attrs(applyDefaultTheme)(_t24 || (_t24 = _`
-  align-items: end;
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  left: 0;
-  position: absolute;
-  max-height: ${0}px;
-  top: 0;
-  width: 100%;
-
-  ${0}
-
-  :hover {
-    cursor: pointer;
-    text-decoration: underline;
-  }
-`), showMoreHeight + 16, props => props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('emerald-500')));
-const ShowMoreOverlay = styled.div.attrs(applyDefaultTheme)(_t25 || (_t25 = _`
-  align-items: end;
-  display: block;
-  height: 100%;
-  max-height: ${0}px;
-  left: 0;
-  top: 0;
-  width: 100%;
-
-  ${0}
-`), showMoreHeight, props => props.theme.themeProp('background', 'transparent linear-gradient(180deg, #12121200 0%, #12121230 40%, #12121279 70%, #121212 95%, #121212 100%) 0% 0% no-repeat padding-box', 'transparent linear-gradient(180deg, #fefefe00 0%, #fefefe30 40%, #fefefe79 70%, #fefefe 95%, #fefefe 100%) 0% 0% no-repeat padding-box'));
-const ShowMoreText = styled.div.attrs(applyDefaultTheme)(_t26 || (_t26 = _`
-  font-size: 0.875rem;
-  width: 100%;
-  ${0}
-`), props => props.theme.themeProp('background-color', '#121212', '#fefefe'));
-const ErrorMessage = styled.div.attrs(applyDefaultTheme)(_t27 || (_t27 = _`
-  color: ${0};
-  font-size: 0.75rem;
-  margin-top: 8px;
-  padding: 0 12px;
-`), props => props.error ? props.theme.getColor('red-500') : props.warning ? props.theme.getColor('orange-500') : 'inherit');
-
-export { AsyncCreatableMultiSelect, AsyncMultiSelect, Control, CreatableMultiSelect, DropdownMenu, DropdownOptionDeleteIcon, ErrorMessage, Input, Label, MultiSelect, MultiSelectWrapper, MultiValue, MultiValueRemove, MultiValueWrapper, Option, SelectedOption, ShowMoreOverlay, ShowMoreText, ShowMoreWrapper, ValueContainer };

package/esm/components/inputs/MultiSelect/inputs/MultiSelect/index.js

@@ -1 +0,0 @@
-export { default } from '../../MultiSelect.js';

package/esm/components/inputs/Radio/Radio.js

@@ -1,63 +0,0 @@
-import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import React from '../../../node_modules/react/index.js';
-import { nanoid } from 'nanoid';
-import PropTypes from '../../../node_modules/prop-types/index.js';
-import { Radio as Radio$2, RadioLabel } from './Radio.styled.js';
-import { r as react } from '../../../_virtual/index.js';
-
-const _excluded = ["name", "value", "checked", "defaultChecked", "disabled", "readOnly", "label", "className", "style", "onChange", "onBlur"];
-const Radio = React.forwardRef(function Radio(_ref, forwardedRef) {
-  let {
-      name,
-      value,
-      checked,
-      defaultChecked,
-      disabled,
-      readOnly,
-      label,
-      className,
-      style,
-      onChange,
-      onBlur
-    } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  const [uniqueId] = react.exports.useState(nanoid());
-  return React.createElement(Radio$2, {
-    htmlFor: uniqueId,
-    disabled: disabled,
-    readOnly: readOnly,
-    className: className,
-    style: style
-  }, React.createElement("input", _extends({
-    ref: forwardedRef,
-    type: "radio",
-    name: name,
-    value: value,
-    checked: checked,
-    defaultChecked: defaultChecked,
-    disabled: disabled,
-    readOnly: readOnly,
-    id: uniqueId,
-    onChange: onChange,
-    onBlur: onBlur
-  }, rest)), React.createElement(RadioLabel, null, label));
-});
-Radio.propTypes = process.env.NODE_ENV !== "production" ? {
-  label: PropTypes.any,
-  name: PropTypes.string.isRequired,
-  value: PropTypes.any.isRequired,
-  checked: PropTypes.bool,
-  defaultChecked: PropTypes.bool,
-  disabled: PropTypes.bool,
-  readOnly: PropTypes.bool,
-  className: PropTypes.string,
-  style: PropTypes.object,
-  onChange: PropTypes.func,
-  onBlur: PropTypes.func
-} : {};
-Radio.defaultProps = {
-  disabled: false
-};
-var Radio$1 = Radio;
-
-export { Radio$1 as default };

package/esm/components/inputs/Radio/Radio.styled.js

@@ -1,84 +0,0 @@
-import { math } from 'polished';
-import styled, { css } from 'styled-components';
-import { applyDefaultTheme } from '../../../utils/defaultTheme.js';
-
-let _ = t => t,
-  _t,
-  _t2,
-  _t3,
-  _t4;
-const radioSize = '18px';
-const RadioLabel = styled.div.attrs(applyDefaultTheme)(_t || (_t = _`
-  padding-left: ${0};
-  font-weight: 400;
-  font-size: 0.875rem;
-
-  ${0};
-`), math(`${radioSize} + 10px`), props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600')));
-const Radio = styled.label.attrs(applyDefaultTheme)(_t2 || (_t2 = _`
-  display: block;
-  position: relative;
-  cursor: pointer;
-  line-height: ${0};
-  user-select: none;
-
-  &::before {
-    content: '';
-    position: absolute;
-    border: 2px solid ${0};
-    width: ${0};
-    height: ${0};
-    top: 0;
-    border-radius: 50%;
-    transition: all 200ms;
-    box-sizing: border-box;
-  }
-
-  &::after {
-    content: '';
-    position: absolute;
-    width: 8px;
-    height: 8px;
-    top: 5px;
-    left: 5px;
-    border-radius: 50%;
-    transform: scale(0);
-    transition: all 200ms;
-  }
-
-  &:has(input:checked) {
-    ::before {
-      border-color: ${0};
-    }
-
-    ::after {
-      background: ${0};
-      transform: scale(1);
-    }
-
-    ${0} {
-      opacity: 1;
-    }
-  }
-  & {
-    input[type='radio'] {
-      position: absolute;
-      opacity: 0;
-      pointer-events: none;
-    }
-  }
-
-  ${0}
-
-  ${0}
-`), radioSize, props => props.theme.getColor('gray-300'), radioSize, radioSize, props => props.theme.getColor('emerald-500'), props => props.theme.getColor('emerald-500'), RadioLabel, props => props.readOnly && css(_t3 || (_t3 = _`
-      opacity: 0.5;
-      pointer-events: none;
-      user-select: text;
-    `)), props => props.disabled && css(_t4 || (_t4 = _`
-      opacity: 0.5;
-      cursor: not-allowed;
-      user-select: text;
-    `)));
-
-export { Radio, RadioLabel };

package/esm/components/inputs/Radio/inputs/Radio/index.js

@@ -1 +0,0 @@
-export { default } from '../../Radio.js';

package/esm/components/inputs/Switch/Switch.styled.js

@@ -1,110 +0,0 @@
-import { math, rgba } from 'polished';
-import styled, { css } from 'styled-components';
-import { applyDefaultTheme } from '../../../utils/defaultTheme.js';
-
-let _ = t => t,
-  _t,
-  _t2,
-  _t3,
-  _t4,
-  _t5,
-  _t6,
-  _t7,
-  _t8;
-const switchButtonSize = '16px';
-const Switch = styled.div.attrs(applyDefaultTheme)(_t || (_t = _`
-  * {
-    box-sizing: border-box;
-  }
-
-  display: flex;
-  flex-direction: column;
-
-  ${0}
-
-  ${0}
-`), props => props.readOnly && css(_t2 || (_t2 = _`
-      opacity: 0.5;
-      > * {
-        pointer-events: none;
-        user-select: text;
-      }
-    `)), props => props.disabled && css(_t3 || (_t3 = _`
-      opacity: 0.5;
-      cursor: not-allowed;
-      * {
-        pointer-events: none;
-        user-select: text;
-      }
-    `)));
-const SwitchIndicator = styled.div.attrs(applyDefaultTheme)(_t4 || (_t4 = _`
-  display: inline-block;
-  position: relative;
-  ${0}
-  height: ${0};
-  width: 32px;
-  border-radius: 20px;
-  border: 1px solid;
-  ${0}
-  transition: background 200ms;
-`), props => props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('gray-200')), math(`${switchButtonSize} + 2px`), props => props.theme.themeProp('border-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-300')));
-const SwitchIndicatorButton = styled.div.attrs(applyDefaultTheme)(_t5 || (_t5 = _`
-  position: absolute;
-  ${0}
-  height: ${0};
-  width: ${0};
-  border-radius: 50%;
-  box-shadow: ${0} 0 0px 2px 0px;
-  transition: left 200ms;
-`), props => props.theme.themeProp('background', props.theme.getColor('gray-200'), props.theme.getColor('white')), switchButtonSize, switchButtonSize, props => props.theme.getColor('gray-500'));
-const SwitchIndicatorLabelText = styled.div.attrs(applyDefaultTheme)(_t6 || (_t6 = _`
-  padding-left: 10px;
-  font-weight: 400;
-  font-size: 0.875rem;
-  line-height: 18px;
-
-  ${0};
-`), props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600')));
-const SwitchLabel = styled.label.attrs(applyDefaultTheme)(_t7 || (_t7 = _`
-  display: inline-flex;
-  margin-right: auto;
-  cursor: pointer;
-
-  input[type='checkbox'] {
-    position: absolute;
-    opacity: 0;
-  }
-
-  &:has(input[type='checkbox']:not(:checked)) {
-    ${0} {
-      left: 0;
-    }
-  }
-
-  &:has(input[type='checkbox']:checked) {
-    ${0} {
-      left: calc(100% - ${0});
-    }
-
-    ${0} {
-      background: ${0};
-
-      ${0}
-    }
-  }
-
-  &:has(input[type='checkbox']:focus-visible) {
-    ${0} {
-      ${0}
-    }
-  }
-`), SwitchIndicatorButton, SwitchIndicatorButton, switchButtonSize, SwitchIndicator, props => props.theme.getColor('emerald-500'), props => props.theme.themeProp('border-color', props.theme.getColor('gray-400'), props.theme.getColor('gray-300'), 1), SwitchIndicatorButton, props => props.theme.themeProp('outline', `8px solid ${rgba(props.theme.getColor('emerald-500'), 0.5)}`, `8px solid ${rgba(props.theme.getColor('emerald-500'), 0.3)}`, 1));
-const Description = styled.div.attrs(applyDefaultTheme)(_t8 || (_t8 = _`
-  margin: ${0} 0 0 0;
-  font-size: 0.75rem;
-  line-height: 1.333;
-
-  ${0};
-`), props => props.spaciousDescription ? '16px' : '6px', props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500')));
-
-export { Description, Switch, SwitchIndicator, SwitchIndicatorButton, SwitchIndicatorLabelText, SwitchLabel };

package/esm/components/inputs/Switch/inputs/Switch/index.js

@@ -1 +0,0 @@
-export { default } from '../../Switch.js';

package/esm/components/inputs/TextArea/TextArea.js

@@ -1,182 +0,0 @@
-import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import React from '../../../node_modules/react/index.js';
-import { isEmpty } from 'lodash';
-import useMergedRefs from '../../../node_modules/@restart/hooks/esm/useMergedRefs.js';
-import { nanoid } from 'nanoid';
-import PropTypes from '../../../node_modules/prop-types/index.js';
-import { ReactComponent as SvgEditNote } from '../../../icons/edit-note.svg.js';
-import { TextAreaContainter, Label, SuccessContainerLabel, TextInput, TextInputFieldIconAlert, TextInputField, SuccessContainer, InputIconContainer, TextInputLabel, Description } from './TextArea.styled.js';
-import Tooltip from '../../data/Tooltip/Tooltip.js';
-import { r as react } from '../../../_virtual/index.js';
-
-const _excluded = ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "autoComplete", "description", "type", "icon", "rows", "className", "style", "onChange", "onBlur", "noBorder", "instructionsTextArea", "loadingIcon", "successIcon", "padding", "descriptionToolTip", "borderRadius", "fieldLabel"];
-const TextArea = React.forwardRef(function TextArea(_ref, forwardedRef) {
-  let {
-      value,
-      defaultValue,
-      name,
-      label,
-      placeholder,
-      required,
-      disabled,
-      hidden,
-      readOnly,
-      edit,
-      autoComplete,
-      description,
-      type,
-      icon,
-      rows,
-      className,
-      style,
-      onChange,
-      onBlur,
-      noBorder,
-      instructionsTextArea,
-      loadingIcon,
-      successIcon,
-      padding,
-      descriptionToolTip,
-      borderRadius,
-      fieldLabel
-    } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  const textInputDomNode = react.exports.useRef(null);
-  const textInputRef = useMergedRefs(forwardedRef, textInputDomNode);
-  const [inputIsEmpty, setInputIsEmpty] = react.exports.useState(!(value || defaultValue));
-  const [autoFocus, setAutoFocus] = react.exports.useState(false);
-  const [uniqueId] = react.exports.useState(nanoid());
-  const memoizedDescriptionToolTip = react.exports.useMemo(() => {
-    return descriptionToolTip;
-  }, [descriptionToolTip]);
-  react.exports.useEffect(() => {
-    setAutoFocus(false);
-  }, [value, defaultValue]);
-  const onKeyDown = react.exports.useCallback(event => {
-    if (event.key === 'Enter') {
-      event.stopPropagation();
-    }
-  }, []);
-  const input = () => {
-    return React.createElement(TextAreaContainter, null, fieldLabel && React.createElement(Label, {
-      htmlFor: uniqueId,
-      disabled: disabled
-    }, fieldLabel, React.createElement(SuccessContainerLabel, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), React.createElement(TextInput, {
-      $fieldLabel: !isEmpty(fieldLabel),
-      disabled: disabled,
-      readOnly: readOnly,
-      type: type,
-      className: className,
-      style: style
-    }, React.createElement(TextInputFieldIconAlert, {
-      type: type
-    }, icon), React.createElement(TextInputField, _extends({
-      autoFocus: autoFocus,
-      borderRadius: borderRadius,
-      ref: textInputRef,
-      rows: rows,
-      value: value,
-      defaultValue: defaultValue,
-      name: name,
-      placeholder: placeholder || ' ',
-      required: required,
-      readOnly: readOnly,
-      disabled: disabled,
-      edit: edit,
-      instructionsTextArea: instructionsTextArea,
-      type: type,
-      autoComplete: autoComplete,
-      hasIcon: Boolean(icon),
-      icon: icon,
-      id: `text-input-${uniqueId}`,
-      key: uniqueId,
-      padding: padding,
-      onChange: e => {
-        if (e.target.value) {
-          setInputIsEmpty(false);
-          if (!autoFocus) {
-            setAutoFocus(true);
-          }
-        } else {
-          setInputIsEmpty(true);
-          if (!autoFocus) {
-            setAutoFocus(true);
-          }
-        }
-        onChange(e);
-      },
-      onKeyDown: onKeyDown,
-      onBlur: onBlur,
-      noBorder: noBorder
-    }, rest)), !fieldLabel && (type === 'loading' || type === 'success') && React.createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon), !readOnly && noBorder && React.createElement(InputIconContainer, {
-      disabled: disabled
-    }, React.createElement(SvgEditNote, {
-      className: padding === 'small' ? 'smallPadingIcon' : undefined
-    })), label && React.createElement(TextInputLabel, {
-      htmlFor: `text-input-${uniqueId}`,
-      hasPlaceholder: Boolean(placeholder),
-      hasIcon: Boolean(icon),
-      inputIsEmpty: inputIsEmpty,
-      type: type
-    }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React.createElement(Description, {
-      type: type
-    }, description)));
-  };
-  if (hidden) return null;
-  return React.createElement(React.Fragment, null, !memoizedDescriptionToolTip && input(), memoizedDescriptionToolTip && React.createElement("div", null, React.createElement(Tooltip, {
-    content: memoizedDescriptionToolTip,
-    key: "tooltipTextArea1",
-    placement: "bottom-end",
-    trigger: 'mouseenter',
-    zIndex: 999999
-  }, input())));
-});
-TextArea.defaultProps = {
-  rows: 4,
-  noBorder: false,
-  readOnly: false,
-  edit: false,
-  hidden: false,
-  type: '',
-  padding: 'medium',
-  instructionsTextArea: false,
-  descriptionToolTip: '',
-  isExpanded: () => {},
-  onChange: () => {},
-  borderRadius: 0
-};
-TextArea.propTypes = process.env.NODE_ENV !== "production" ? {
-  value: PropTypes.string,
-  defaultValue: PropTypes.string,
-  name: PropTypes.string,
-  label: PropTypes.string,
-  fieldLabel: PropTypes.string,
-  placeholder: PropTypes.string,
-  required: PropTypes.bool,
-  disabled: PropTypes.bool,
-  hidden: PropTypes.bool,
-  readOnly: PropTypes.bool,
-  edit: PropTypes.bool,
-  autoComplete: PropTypes.string,
-  description: PropTypes.string,
-  error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-  warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-  icon: PropTypes.element,
-  rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-  className: PropTypes.string,
-  style: PropTypes.object,
-  padding: PropTypes.oneOf(['small', 'medium', 'large']),
-  onChange: PropTypes.func,
-  onBlur: PropTypes.func,
-  noBorder: PropTypes.bool,
-  isExpanded: PropTypes.func,
-  type: PropTypes.oneOf(['', 'error', 'error-border', 'warning-border', 'warning', 'loading', 'success']),
-  instructionsTextArea: PropTypes.bool,
-  loadingIcon: PropTypes.element,
-  successIcon: PropTypes.element,
-  descriptionToolTip: PropTypes.string,
-  borderRadius: PropTypes.number
-} : {};
-var TextArea$1 = TextArea;
-
-export { TextArea$1 as default };