import React from 'react';
import { useTranslation } from '../../../../providers/Translation/index.js';
import useField from '../../../useField/index.js';
const baseClass = 'section-title';
/**
 * An input field representing the block's `blockName` property - responsible for reading and saving the `blockName`
 * property from/into the provided path.
 */ const SectionTitle = (props)=>{
    const { customOnChange, customValue, path, readOnly } = props;
    const { setValue, value } = useField({
        path
    });
    const { t } = useTranslation();
    const classes = [
        baseClass
    ].filter(Boolean).join(' ');
    const onChange = customOnChange || ((e)=>{
        e.stopPropagation();
        e.preventDefault();
        setValue(e.target.value);
    });
    return /*#__PURE__*/ React.createElement("div", {
        className: classes,
        "data-value": customValue || value
    }, /*#__PURE__*/ React.createElement("input", {
        className: `${baseClass}__input`,
        id: path,
        name: path,
        onChange: onChange,
        placeholder: t('general:untitled'),
        readOnly: readOnly,
        type: "text",
        value: customValue || value || ''
    }));
};
export default SectionTitle;

//# sourceMappingURL=index.js.map