ToolJet/frontend/src/Editor/Components/TextArea.jsx

39 lines
1.1 KiB
React
Raw Normal View History

import React, { useState, useEffect } from 'react';
export const TextArea = function TextArea({ height, properties, styles, setExposedVariable, registerAction }) {
const [value, setValue] = useState(properties.value);
2021-04-30 06:31:32 +00:00
useEffect(() => {
setValue(properties.value);
setExposedVariable('value', properties.value);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [properties.value]);
2021-04-14 11:32:03 +00:00
registerAction('setText', async function (text) {
setValue(text);
setExposedVariable('value', text);
});
registerAction('clear', async function () {
setValue('');
setExposedVariable('value', '');
});
2021-04-30 06:31:32 +00:00
return (
<textarea
disabled={styles.disabledState}
2021-04-30 06:31:32 +00:00
onChange={(e) => {
setValue(e.target.value);
setExposedVariable('value', e.target.value);
2021-04-30 06:31:32 +00:00
}}
type="text"
className="form-control textarea"
placeholder={properties.placeholder}
style={{
height,
resize: 'none',
display: styles.visibility ? '' : 'none',
borderRadius: `${styles.borderRadius}px`,
}}
value={value}
2021-04-30 06:31:32 +00:00
></textarea>
);
2021-04-10 04:51:19 +00:00
};