burdy
Version:
Open Source Headless Platform
94 lines (93 loc) • 4.26 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.withCustomRichtext = exports.withRichtext = exports.useRichtext = void 0;
const react_1 = __importStar(require("react"));
const draft_js_1 = require("draft-js");
const hoc_1 = require("../helpers/hoc");
const DynamicRichtextContext = (0, react_1.createContext)({});
const RichtextContextProvider = ({ children, defaultKeyMap = [], defaultEditorState, }) => {
const editor = (0, react_1.useRef)();
const [editorState, setEditorState] = (0, react_1.useState)(defaultEditorState !== null && defaultEditorState !== void 0 ? defaultEditorState : (() => draft_js_1.EditorState.createEmpty()));
const [keyMap, setKeyMap] = (0, react_1.useState)(defaultKeyMap);
const [editorProps, setEditorProps] = (0, react_1.useState)();
const [forceUpdate, setForceUpdate] = (0, react_1.useState)(false);
const forceUpdateFn = (0, react_1.useCallback)(() => {
setForceUpdate(!forceUpdate);
}, [forceUpdate]);
const toggleInlineStyle = (style) => {
setEditorState(draft_js_1.RichUtils.toggleInlineStyle(editorState, style));
};
const toggleBlockType = (blockType) => {
setEditorState(draft_js_1.RichUtils.toggleBlockType(editorState, blockType));
};
const handleKeypress = (e) => {
var _a, _b;
const { key } = e;
const availableKeyMaps = keyMap.filter((item) => {
if (item.key !== key) {
return false;
}
if ((item === null || item === void 0 ? void 0 : item.ctrlKey) && !e.ctrlKey) {
return false;
}
if ((item === null || item === void 0 ? void 0 : item.altKey) && !e.altKey) {
return false;
}
return true;
});
return (_b = (_a = availableKeyMaps === null || availableKeyMaps === void 0 ? void 0 : availableKeyMaps[0]) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : (0, draft_js_1.getDefaultKeyBinding)(e);
};
const handleKeyCommand = (command) => {
const keyCommand = keyMap.find((k) => k.name === command);
if (keyCommand === null || keyCommand === void 0 ? void 0 : keyCommand.handle) {
keyCommand.handle();
return 'handled';
}
const newState = draft_js_1.RichUtils.handleKeyCommand(editorState, command);
if (newState) {
setEditorState(newState);
return 'handled';
}
return 'not-handled';
};
return (react_1.default.createElement(DynamicRichtextContext.Provider, { value: {
editor,
editorState,
setEditorState,
toggleBlockType,
toggleInlineStyle,
keyMap,
setKeyMap,
handleKeypress,
handleKeyCommand,
editorProps,
setEditorProps,
forceUpdate: forceUpdateFn,
forceUpdateState: forceUpdate,
} }, children));
};
const useRichtext = () => (0, react_1.useContext)(DynamicRichtextContext);
exports.useRichtext = useRichtext;
exports.withRichtext = (0, hoc_1.withWrapper)(RichtextContextProvider);
const withCustomRichtext = (props) => (0, hoc_1.withWrapper)(RichtextContextProvider, props);
exports.withCustomRichtext = withCustomRichtext;
exports.default = RichtextContextProvider;