let { label, value, ...forwardedProps } = props; const Container = styled.div` display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; padding: 0px; gap: 0.45em; width: 100%; `; const Label = styled.label` font-style: normal; font-weight: 600; font-size: 0.95em; line-height: 1.25em; color: #344054; margin-top: 3%; `; const Input = styled.textarea` box-sizing: border-box; display: flex; flex-direction: row; align-items: center; padding: 0.5em 0.75em; width: 100%; gap: 0.5em; background: #ffffff; border: 1px solid #d0d5dd; box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05); border-radius: 4px; margin-top: 3px; `; return ( <Container> <Label>{label}</Label> <Input as="textArea" placeholder={keyPlaceholder} value={value} ref="forwardedRef" row={1} /> </Container> );