myprojectpackageprav
Version:
My package in npm
27 lines • 2.83 kB
JavaScript
import React, { useState } from 'react';
import { Editor } from 'react-draft-wysiwyg';
import { EditorState } from 'draft-js';
import "./richtext.css";
import InputLabel from './input-label';
// import { EditorState, convertToRaw, ContentState, convertFromHTML } from 'draft-js'
var RichTextEditor = function (inputProps) {
var _a, _b;
var _c = useState(EditorState.createEmpty()), editorState = _c[0], setEditorState = _c[1];
var onSetEditorState = function (newState) {
setEditorState(newState);
};
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.formClassName },
(inputProps === null || inputProps === void 0 ? void 0 : inputProps.label) && React.createElement(InputLabel, { labelProps: { htmlFor: (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps.inputProps) === null || _a === void 0 ? void 0 : _a.id }, className: (_b = inputProps === null || inputProps === void 0 ? void 0 : inputProps.inputProps) === null || _b === void 0 ? void 0 : _b.className, label: inputProps === null || inputProps === void 0 ? void 0 : inputProps.label, infoLabel: inputProps === null || inputProps === void 0 ? void 0 : inputProps.info, isinfoLabel: inputProps === null || inputProps === void 0 ? void 0 : inputProps.isInfo, isinfoIcon: inputProps === null || inputProps === void 0 ? void 0 : inputProps.infoIcon, isinfoClassName: inputProps === null || inputProps === void 0 ? void 0 : inputProps.infoClassName, mandatory: inputProps === null || inputProps === void 0 ? void 0 : inputProps.isMandatory }),
React.createElement(Editor, { editorState: editorState, onEditorStateChange: onSetEditorState, toolbar: {
options: ['blockType', 'inline', 'fontSize', 'fontFamily', 'list', 'textAlign', 'colorPicker', 'link', 'image', 'remove'],
inline: { inDropdown: true },
list: { inDropdown: true },
textAlign: { inDropdown: true },
link: { inDropdown: true },
history: { inDropdown: true }
}, placeholder: (inputProps === null || inputProps === void 0 ? void 0 : inputProps.placeholder) || "Enter ".concat(inputProps === null || inputProps === void 0 ? void 0 : inputProps.label), "aria-label": inputProps === null || inputProps === void 0 ? void 0 : inputProps.label, useref: inputProps === null || inputProps === void 0 ? void 0 : inputProps.useref })),
(inputProps === null || inputProps === void 0 ? void 0 : inputProps.hint) && React.createElement("div", null, inputProps === null || inputProps === void 0 ? void 0 : inputProps.hint)));
};
export default RichTextEditor;
//# sourceMappingURL=rich-text.js.map