editorjs-blocks-react-renderer - npm Package Compare versions

Comparing version 1.2.0 to 1.2.1

dist/renderers/image/index.d.ts

 import { RenderFn } from '../..';
 export interface ImageBlockData {
-    file: {
+    file?: {
         url: string;
         name?: string;
     };
+    url?: string;
     caption: string;
@@ -8,0 +9,0 @@ withBorder: boolean;

dist/renderers/image/index.js

@@ -41,2 +41,3 @@ "use strict";
         ((_b = data === null || data === void 0 ? void 0 : data.file) === null || _b === void 0 ? void 0 : _b.url) && react_1.default.createElement("img", { src: data.file.url, alt: data.caption || data.file.name }),
+        (data === null || data === void 0 ? void 0 : data.url) && react_1.default.createElement("img", { src: data.url, alt: data.caption }),
         (data === null || data === void 0 ? void 0 : data.caption) && react_1.default.createElement("figcaption", null, (0, html_react_parser_1.default)(data.caption))));
@@ -43,0 +44,0 @@ };

dist/renderers/list/index.d.ts

 import { RenderFn } from '../..';
 export interface ListBlockData {
     style: 'ordered' | 'unordered';
-    items: string[];
+    items: NestedListItem[];
 }
+export declare type NestedListItem = {
+    content: string;
+    items: NestedListItem[];
+} | string;
 declare const List: RenderFn<ListBlockData>;
 export default List;

dist/renderers/list/index.js

@@ -13,2 +13,13 @@ "use strict";
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
@@ -20,2 +31,15 @@ return (mod && mod.__esModule) ? mod : { "default": mod };
 var html_react_parser_1 = __importDefault(require("html-react-parser"));
+var Bullet = function (_a) {
+    var children = _a.children;
+    return react_1.default.createElement("li", null, children);
+};
+var Group = function (_a) {
+    var Tag = _a.Tag, items = _a.items, props = __rest(_a, ["Tag", "items"]);
+    return (react_1.default.createElement(Tag, __assign({}, props), items.map(function (item, i) {
+        var _a;
+        return (react_1.default.createElement(Bullet, { key: i }, typeof item === 'string' ? ((0, html_react_parser_1.default)(item)) : (react_1.default.createElement(react_1.default.Fragment, null,
+            (0, html_react_parser_1.default)(item === null || item === void 0 ? void 0 : item.content),
+            ((_a = item === null || item === void 0 ? void 0 : item.items) === null || _a === void 0 ? void 0 : _a.length) > 0 && react_1.default.createElement(Group, __assign({ Tag: Tag, items: item.items }, props))))));
+    })));
+};
 var List = function (_a) {
@@ -28,5 +52,5 @@ var data = _a.data, _b = _a.className, className = _b === void 0 ? '' : _b;
     var Tag = ((data === null || data === void 0 ? void 0 : data.style) === 'ordered' ? "ol" : "ul");
-    return (react_1.default.createElement(Tag, __assign({}, props), data === null || data === void 0 ? void 0 : data.items.map(function (item, i) { return (react_1.default.createElement("li", { key: i }, (0, html_react_parser_1.default)(item))); })));
+    return data && react_1.default.createElement(Group, __assign({ Tag: Tag, items: data.items }, props));
 };
 exports.default = List;
 //# sourceMappingURL=index.js.map

dist/renderers/table/index.d.ts

 import { RenderFn } from '../..';
+declare type Row = string[];
+declare type Content = Row[];
 export interface TableBlockData {
-    content: string[][];
+    content: Content;
+    withHeadings?: boolean;
     header?: string[];
@@ -5,0 +8,0 @@ footer?: string[];

dist/renderers/table/index.js

@@ -19,2 +19,13 @@ "use strict";
 var html_react_parser_1 = __importDefault(require("html-react-parser"));
+var THead = function (_a) {
+    var row = _a.row;
+    return (react_1.default.createElement("thead", null,
+        react_1.default.createElement("tr", null, row === null || row === void 0 ? void 0 : row.map(function (cell, i) { return (react_1.default.createElement("th", { key: "" + i, scope: "col" }, (0, html_react_parser_1.default)(cell))); }))));
+};
+var Tr = function (_a) {
+    var row = _a.row, withHeadings = _a.withHeadings;
+    return (react_1.default.createElement("tr", null, row.map(function (cell, i) {
+        return i === 0 && withHeadings ? (react_1.default.createElement("th", { key: i, scope: "row" }, (0, html_react_parser_1.default)(cell))) : (react_1.default.createElement("td", { key: i }, (0, html_react_parser_1.default)(cell)));
+    })));
+};
 var Table = function (_a) {
@@ -26,14 +37,14 @@ var data = _a.data, _b = _a.className, className = _b === void 0 ? '' : _b;
     }
+    var content = (data === null || data === void 0 ? void 0 : data.withHeadings) ? data === null || data === void 0 ? void 0 : data.content.slice(1) : data === null || data === void 0 ? void 0 : data.content;
+    var header = (data === null || data === void 0 ? void 0 : data.withHeadings) ? data === null || data === void 0 ? void 0 : data.content[0] : data === null || data === void 0 ? void 0 : data.header;
+    var withRowHeadings = !!(data === null || data === void 0 ? void 0 : data.header);
     return (react_1.default.createElement("table", __assign({}, tableprops),
-        (data === null || data === void 0 ? void 0 : data.caption) && react_1.default.createElement("caption", null, (0, html_react_parser_1.default)(data.caption)),
-        (data === null || data === void 0 ? void 0 : data.header) && (react_1.default.createElement("thead", null,
-            react_1.default.createElement("tr", null, data.header.map(function (cell, i) { return (react_1.default.createElement("th", { key: "" + i }, (0, html_react_parser_1.default)(cell))); })))),
-        react_1.default.createElement("tbody", null, data === null || data === void 0 ? void 0 : data.content.map(function (row, i) { return (react_1.default.createElement("tr", { key: "" + i }, row.map(function (cell, j) {
-            var Tag = "t" + (j === 0 ? 'h' : 'd');
-            return react_1.default.createElement(Tag, { key: "" + i + j }, (0, html_react_parser_1.default)(cell));
-        }))); })),
+        react_1.default.createElement(react_1.default.Fragment, null,
+            (data === null || data === void 0 ? void 0 : data.caption) && react_1.default.createElement("caption", null, (0, html_react_parser_1.default)(data.caption)),
+            header && react_1.default.createElement(THead, { row: header })),
+        react_1.default.createElement("tbody", null, content === null || content === void 0 ? void 0 : content.map(function (row, i) { return (react_1.default.createElement(Tr, { key: i, row: row, withHeadings: withRowHeadings })); })),
         (data === null || data === void 0 ? void 0 : data.footer) && (react_1.default.createElement("tfoot", null,
-            react_1.default.createElement("tr", null, data === null || data === void 0 ? void 0 : data.footer.map(function (cell, i) { return (react_1.default.createElement("th", { key: "" + i }, (0, html_react_parser_1.default)(cell))); }))))));
+            react_1.default.createElement(Tr, { row: data === null || data === void 0 ? void 0 : data.footer, withHeadings: withRowHeadings })))));
 };
 exports.default = Table;
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "editorjs-blocks-react-renderer",
-  "version": "1.2.0",
-  "description": "EditorJS blocks renderer to semanticly beautiful html5 tags via React.",
+  "version": "1.2.1",
+  "description": "EditorJS blocks render to semanticly beautiful html5 tags via React.",
   "keywords": [
@@ -16,2 +16,3 @@ "editorjs",
     "html5",
+    "html",
     "blocks"
@@ -18,0 +19,0 @@ ],

README.md

@@ -5,4 +5,5 @@ # Editor.js Blocks React Renderer
 
-[![](https://flat.badgen.net/npm/v/editorjs-blocks-react-renderer?icon=npm)](https://www.npmjs.com/package/editorjs-blocks-react-renderer)
+[![](https://flat.badgen.net/npm/v/editorjs-blocks-react-renderer)](https://www.npmjs.com/package/editorjs-blocks-react-renderer)
 [![](https://flat.badgen.net/npm/license/editorjs-blocks-react-renderer)](https://www.npmjs.com/package/editorjs-blocks-react-renderer)
+[![](https://flat.badgen.net/npm/types/editorjs-blocks-react-renderer)](https://www.npmjs.com/package/editorjs-blocks-react-renderer)
 
@@ -53,4 +54,6 @@ An unnopinated React library that renders flexible HTML5 React components from [Editor.js](https://editorjs.io/) block style data.
 - Image
+- SimpleImage
 - Embed
 - List
+- NestedList
 - Table
@@ -57,0 +60,0 @@ - Quote

No alert changes

Improved metrics

Total package byte prevSize

43261

increased by13.23%

Number of package files

36

increased by9.09%

Lines of code

543

increased by12.89%

Number of lines in readme file

190

increased by1.6%

No dependency changes