@wordpress/editor
Version:
Enhanced block editor for WordPress posts.
62 lines (60 loc) • 2.2 kB
JavaScript
/**
* WordPress dependencies
*/
import { useState } from '@wordpress/element';
import { __experimentalHStack as HStack, Button, TextareaControl } from '@wordpress/components';
import { _x } from '@wordpress/i18n';
/**
* Internal dependencies
*/
import { sanitizeCommentString } from './utils';
/**
* EditComment component.
*
* @param {Object} props - The component props.
* @param {Function} props.onSubmit - The function to call when updating the comment.
* @param {Function} props.onCancel - The function to call when canceling the comment update.
* @param {Object} props.thread - The comment thread object.
* @param {string} props.submitButtonText - The text to display on the submit button.
* @return {React.ReactNode} The CommentForm component.
*/
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
function CommentForm({
onSubmit,
onCancel,
thread,
submitButtonText
}) {
var _thread$content$raw;
const [inputComment, setInputComment] = useState((_thread$content$raw = thread?.content?.raw) !== null && _thread$content$raw !== void 0 ? _thread$content$raw : '');
return /*#__PURE__*/_jsxs(_Fragment, {
children: [/*#__PURE__*/_jsx(TextareaControl, {
__next40pxDefaultSize: true,
__nextHasNoMarginBottom: true,
value: inputComment !== null && inputComment !== void 0 ? inputComment : '',
onChange: setInputComment
}), /*#__PURE__*/_jsxs(HStack, {
alignment: "left",
spacing: "3",
justify: "flex-start",
children: [/*#__PURE__*/_jsx(Button, {
__next40pxDefaultSize: true,
accessibleWhenDisabled: true,
variant: "primary",
onClick: () => {
onSubmit(inputComment);
setInputComment('');
},
disabled: 0 === sanitizeCommentString(inputComment).length,
text: submitButtonText
}), /*#__PURE__*/_jsx(Button, {
__next40pxDefaultSize: true,
variant: "tertiary",
onClick: onCancel,
text: _x('Cancel', 'Cancel comment button')
})]
})]
});
}
export default CommentForm;
//# sourceMappingURL=comment-form.js.map