@wordpress/block-editor
Version:
70 lines (64 loc) • 2.08 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _reactAutosizeTextarea = _interopRequireDefault(require("react-autosize-textarea"));
var _element = require("@wordpress/element");
var _data = require("@wordpress/data");
var _blocks = require("@wordpress/blocks");
var _store = require("../../store");
var _jsxRuntime = require("react/jsx-runtime");
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function BlockHTML({
clientId
}) {
const [html, setHtml] = (0, _element.useState)('');
const block = (0, _data.useSelect)(select => select(_store.store).getBlock(clientId), [clientId]);
const {
updateBlock
} = (0, _data.useDispatch)(_store.store);
const onChange = () => {
const blockType = (0, _blocks.getBlockType)(block.name);
if (!blockType) {
return;
}
const attributes = (0, _blocks.getBlockAttributes)(blockType, html, block.attributes);
// If html is empty we reset the block to the default HTML and mark it as valid to avoid triggering an error
const content = html ? html : (0, _blocks.getSaveContent)(blockType, attributes);
const [isValid] = html ? (0, _blocks.validateBlock)({
...block,
attributes,
originalContent: content
}) : [true];
updateBlock(clientId, {
attributes,
originalContent: content,
isValid
});
// Ensure the state is updated if we reset so it displays the default content.
if (!html) {
setHtml(content);
}
};
(0, _element.useEffect)(() => {
setHtml((0, _blocks.getBlockContent)(block));
}, [block]);
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactAutosizeTextarea.default, {
className: "block-editor-block-list__block-html-textarea",
value: html,
onBlur: onChange,
onChange: event => setHtml(event.target.value)
});
}
var _default = exports.default = BlockHTML;
//# sourceMappingURL=block-html.js.map