editor-react-parser
Version:
A renderer for editorjs block data for react
58 lines (57 loc) • 3.02 kB
JavaScript
import parse from "html-react-parser";
import React from "react";
export var AlertAlignment;
(function (AlertAlignment) {
AlertAlignment["left"] = "left";
AlertAlignment["right"] = "right";
AlertAlignment["center"] = "center";
})(AlertAlignment || (AlertAlignment = {}));
export var AlertType;
(function (AlertType) {
AlertType["info"] = "info";
AlertType["success"] = "success";
AlertType["danger"] = "danger";
AlertType["light"] = "light";
AlertType["dark"] = "dark";
AlertType["warning"] = "warning";
AlertType["primary"] = "primary";
})(AlertType || (AlertType = {}));
var defaultAlertConfig = {
classNames: {
baseElement: "mt-2 p-2 mt-2 px-4 flex bg-opacity-50 shadow-sm rounded-lg",
info: "mt-2 bg-gray-300 text-gray-600",
success: "mt-2 bg-green-100 text-green-800",
danger: "mt-2 bg-red-200 text-red-800",
light: "mt-2 bg-white text-gray-600",
dark: "mt-2 bg-gray-900 text-gray-300 bg-opacity-85",
warning: "mt-2 bg-orange-100 text-orange-800",
primary: "mt-2 bg-gray-300 text-gray-600",
textCenter: "text-center",
textRight: "text-right",
textLeft: "",
},
};
var AlertBlock = function (_a) {
var _b, _c;
var item = _a.item, config = _a.config;
// Assign all defined config values to default config
var currentConfig = Object.assign({}, defaultAlertConfig, config);
var classNames = currentConfig.classNames;
return (React.createElement("figure", { key: item.id, className: (classNames === null || classNames === void 0 ? void 0 : classNames.baseElement) +
" " +
(_b = {},
_b[AlertType.info] = classNames === null || classNames === void 0 ? void 0 : classNames.info,
_b[AlertType.success] = classNames === null || classNames === void 0 ? void 0 : classNames.success,
_b[AlertType.danger] = classNames === null || classNames === void 0 ? void 0 : classNames.danger,
_b[AlertType.light] = classNames === null || classNames === void 0 ? void 0 : classNames.light,
_b[AlertType.dark] = classNames === null || classNames === void 0 ? void 0 : classNames.dark,
_b[AlertType.warning] = classNames === null || classNames === void 0 ? void 0 : classNames.warning,
_b[AlertType.primary] = classNames === null || classNames === void 0 ? void 0 : classNames.primary,
_b)[item.data.type] },
React.createElement("figcaption", { className: (_c = {},
_c[AlertAlignment.center] = classNames === null || classNames === void 0 ? void 0 : classNames.textCenter,
_c[AlertAlignment.right] = classNames === null || classNames === void 0 ? void 0 : classNames.textRight,
_c[AlertAlignment.left] = classNames === null || classNames === void 0 ? void 0 : classNames.textLeft,
_c)[item.data.align] }, parse(item.data.message))));
};
export default AlertBlock;