UNPKG

@hhgtech/hhg-components

Version:
43 lines (37 loc) 1.59 kB
import React__default from 'react'; import styled from '@emotion/styled'; import { L as Label } from './index-cf3c860d.js'; import { theme } from './miscTheme.js'; const StyledTextArea = styled.div ` textarea { width: 100%; height: var(--textarea-height, 116px); padding: 1rem; border: 1px solid ${theme.colors.gray200}; border-radius: 6px; color: ${theme.colors.gray800}; font-size: 14px; resize: none; &:focus { box-shadow: 0px 0px 2px 2px #91caff; } &::placeholder { color: ${theme.colors.gray500}; } &:disabled { background-color: ${theme.colors.neutral50}; cursor: not-allowed; } } `; /** * @deprecated Consider to use at '@hhgtech/hhg-components/mantine' */ const TextArea = React__default.forwardRef(({ height, placeholder, labelText, labelColor, id, name, onChange, value, className, onKeyPress, disabled = false, }, ref) => { return (React__default.createElement(StyledTextArea, { className: className, style: { ['--textarea-height']: height || '116px' } }, labelText && (React__default.createElement(Label, { size: "label2", style: { color: labelColor || '#595959' }, htmlFor: id }, labelText)), React__default.createElement("textarea", { name: name, ref: ref, placeholder: placeholder, id: id, onChange: (e) => onChange && onChange(e.target.value), // eslint-disable-next-line @typescript-eslint/no-explicit-any onKeyPress: (e) => onKeyPress && onKeyPress(e), value: value, disabled: disabled }))); }); export { TextArea as T };