notion-content-render - npm Package Compare versions

Comparing version 0.2.12 to 1.0.0

dist/index.d.ts

@@ -42,4 +42,5 @@ import type { Block, HeadingOneBlock, HeadingThreeBlock, HeadingTwoBlock, ParagraphBlock, RichText, ToDoBlock, ToggleBlock } from "@notionhq/client/build/src/api-types";
     renderRichText: (richText: RichText[]) => B;
+    renderBlocks: (block: Block[]) => B[];
 };
 export default function <B>(styleFactory: StyleFactory<B>): Maker<B>;
 export {};

dist/index.js

@@ -22,2 +22,8 @@ "use strict";
 }
+function isBulletListItem(block) {
+    return block.type === exports.BLOCK_TYPES.BULLETED_LIST_ITEM;
+}
+function isNumberedListItem(block) {
+    return block.type === exports.BLOCK_TYPES.NUMBERED_LIST_ITEM;
+}
 function default_1(styleFactory) {
@@ -68,3 +74,3 @@ function toHeading_1(block) {
     function toBulletListItem(bulletItem) {
-        var bulletItemContent = toRichTextBlock(bulletItem);
+        var bulletItemContent = toRichTextBlock(bulletItem.bulleted_list_item.text);
         return styleFactory.bulletListItem(bulletItemContent);
@@ -75,2 +81,9 @@ }
     }
+    function toNumberedListItem(numberListItem) {
+        var bulletItemContent = toRichTextBlock(numberListItem.numbered_list_item.text);
+        return styleFactory.numberedListItem(bulletItemContent);
+    }
+    function toNumberedList(content) {
+        return styleFactory.numberedList(content);
+    }
     function toToggle(content) {
@@ -81,26 +94,74 @@ var title = toRichTextBlock(content.toggle.text);
     }
+    function toTodo(content) {
+        var title = toRichTextBlock(content.to_do.text);
+        return styleFactory.todo(content.to_do.checked, title, content);
+    }
+    function renderBlock(block) {
+        switch (block.type) {
+            case exports.BLOCK_TYPES.HEADING_1:
+                return toHeading_1(block);
+            case exports.BLOCK_TYPES.HEADING_2:
+                return toHeading_2(block);
+            case exports.BLOCK_TYPES.HEADING_3:
+                return toHeading_3(block);
+            case exports.BLOCK_TYPES.PARAGRAPH:
+                return toParagraph(block);
+            case exports.BLOCK_TYPES.BULLETED_LIST_ITEM:
+                return toBulletListItem(block);
+            case exports.BLOCK_TYPES.NUMBERED_LIST_ITEM:
+                return toNumberedListItem(block);
+            case exports.BLOCK_TYPES.TO_DO:
+                return toTodo(block);
+            case exports.BLOCK_TYPES.TOGGLE:
+                return toToggle(block);
+            default:
+                return styleFactory.unsupported(block);
+        }
+    }
+    function renderBlocks(blocks) {
+        var index = 0;
+        var result = [];
+        function hasNext() {
+            return blocks.length > index;
+        }
+        function isNext(predicate) {
+            index++;
+            return hasNext() && predicate(blocks[index]);
+        }
+        while (hasNext()) {
+            var item = blocks[index];
+            if (!isNumberedListItem(item) && !isBulletListItem(item)) {
+                result.push(renderBlock(item));
+                index++;
+                continue;
+            }
+            if (isNumberedListItem(item)) {
+                var numbered = [];
+                numbered.push(renderBlock(item));
+                while (isNext(isNumberedListItem)) {
+                    numbered.push(renderBlock(blocks[index]));
+                }
+                result.push(toNumberedList(numbered));
+                index++;
+                continue;
+            }
+            if (isBulletListItem(item)) {
+                var numbered = [];
+                numbered.push(renderBlock(item));
+                while (isNext(isBulletListItem)) {
+                    numbered.push(renderBlock(blocks[index]));
+                }
+                result.push(toBulletList(numbered));
+                index++;
+                continue;
+            }
+        }
+        return result;
+    }
     return {
         renderRichText: toRichTextBlock,
-        renderBlock: function (block) {
-            switch (block.type) {
-                case exports.BLOCK_TYPES.HEADING_1:
-                    return toHeading_1(block);
-                case exports.BLOCK_TYPES.HEADING_2:
-                    return toHeading_2(block);
-                case exports.BLOCK_TYPES.HEADING_3:
-                    return toHeading_3(block);
-                case exports.BLOCK_TYPES.PARAGRAPH:
-                    return toParagraph(block);
-                case exports.BLOCK_TYPES.BULLETED_LIST_ITEM:
-                    return toBulletList([
-                        toBulletListItem(block.bulleted_list_item.text),
-                    ]);
-                case exports.BLOCK_TYPES.TOGGLE:
-                    return toToggle(block);
-                default:
-                    return styleFactory.unsupported(block);
-            }
-        }
+        renderBlock: renderBlock,
+        renderBlocks: renderBlocks
     };
 }
 exports["default"] = default_1;

dist/react.style.d.ts

 import React from "react";
 import type { StyleFactory } from "./index";
-declare const ReactStyleFactory: StyleFactory<React.FunctionComponent>;
+declare const ReactStyleFactory: StyleFactory<React.FunctionComponent<any>>;
 export default ReactStyleFactory;

dist/react.style.js

 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
@@ -8,76 +19,76 @@ return (mod && mod.__esModule) ? mod : { "default": mod };
 var ReactStyleFactory = {
-    bold: function (Child) { return function () {
-        return (react_1["default"].createElement("b", null,
+    bold: function (Child) { return function (props) {
+        return (react_1["default"].createElement("b", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
-    bulletList: function (Children) { return function () {
+    bulletList: function (Children) { return function (props) {
         var i = 0;
-        return (react_1["default"].createElement("ul", null, Children.map(function (Child) { return (react_1["default"].createElement(Child, { key: i++ })); })));
+        return (react_1["default"].createElement("ul", __assign({}, props), Children.map(function (Child) { return (react_1["default"].createElement(Child, { key: i++ })); })));
     }; },
-    bulletListItem: function (Child) { return function () {
-        return (react_1["default"].createElement("li", null,
+    bulletListItem: function (Child) { return function (props) {
+        return (react_1["default"].createElement("li", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
-    heading_1: function (Child) { return function () {
-        return (react_1["default"].createElement("h1", null,
+    heading_1: function (Child) { return function (props) {
+        return (react_1["default"].createElement("h1", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
-    heading_2: function (Child) { return function () {
-        return (react_1["default"].createElement("h2", null,
+    heading_2: function (Child) { return function (props) {
+        return (react_1["default"].createElement("h2", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
-    heading_3: function (Child) { return function () {
-        return (react_1["default"].createElement("h3", null,
+    heading_3: function (Child) { return function (props) {
+        return (react_1["default"].createElement("h3", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
-    italic: function (Child) { return function () {
-        return (react_1["default"].createElement("i", null,
+    italic: function (Child) { return function (props) {
+        return (react_1["default"].createElement("i", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
-    inlineCode: function (Child) { return function () {
-        return (react_1["default"].createElement("code", null,
+    inlineCode: function (Child) { return function (props) {
+        return (react_1["default"].createElement("code", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
-    paragraph: function (Child) { return function () {
-        return (react_1["default"].createElement("p", null,
+    paragraph: function (Child) { return function (props) {
+        return (react_1["default"].createElement("p", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
-    strikethrough: function (Child) { return function () {
-        return (react_1["default"].createElement("s", null,
+    strikethrough: function (Child) { return function (props) {
+        return (react_1["default"].createElement("s", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
-    underline: function (Child) { return function () {
-        return (react_1["default"].createElement("u", null,
+    underline: function (Child) { return function (props) {
+        return (react_1["default"].createElement("u", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
     text: function (Child) { return function () { return react_1["default"].createElement(react_1["default"].Fragment, null, Child); }; },
-    richText: function (Children) { return function () {
+    richText: function (Children) { return function (props) {
         var i = 0;
         return (react_1["default"].createElement(react_1["default"].Fragment, null, Children.map(function (Child) { return (react_1["default"].createElement(Child, { key: i++ })); })));
     }; },
-    numberedList: function (Children) { return function () {
+    numberedList: function (Children) { return function (props) {
         var i = 0;
-        return (react_1["default"].createElement("ol", null, Children.map(function (Child) { return (react_1["default"].createElement(Child, { key: i++ })); })));
+        return (react_1["default"].createElement("ol", __assign({}, props), Children.map(function (Child) { return (react_1["default"].createElement(Child, { key: i++ })); })));
     }; },
-    numberedListItem: function (Child) { return function () {
-        return (react_1["default"].createElement("li", null,
+    numberedListItem: function (Child) { return function (props) {
+        return (react_1["default"].createElement("li", __assign({}, props),
             react_1["default"].createElement(Child, null)));
     }; },
-    toggle: function (Title, Content) { return function () {
-        return (react_1["default"].createElement("details", null,
+    toggle: function (Title, Content) { return function (props) {
+        return (react_1["default"].createElement("details", __assign({}, props),
             react_1["default"].createElement("summary", null,
                 react_1["default"].createElement(Title, null)),
-            react_1["default"].createElement(Content, null)));
+            Content && react_1["default"].createElement(Content, null)));
     }; },
-    todo: function (checked, Content) { return function () {
+    todo: function (checked, Content) { return function (props) {
         return (react_1["default"].createElement(react_1["default"].Fragment, null,
-            react_1["default"].createElement("input", { type: "checkbox", checked: checked }),
+            react_1["default"].createElement("input", __assign({}, props, { type: "checkbox", checked: checked })),
             react_1["default"].createElement(Content, null)));
     }; },
-    link: function (Content, href) { return function () {
-        return (react_1["default"].createElement("a", { href: href },
+    link: function (Content, href) { return function (props) {
+        return (react_1["default"].createElement("a", __assign({ href: href }, props),
             react_1["default"].createElement(Content, null)));
     }; },
-    unsupported: function () { return function () { return react_1["default"].createElement(react_1["default"].Fragment, null); }; }
+    unsupported: function (props) { return function () { return react_1["default"].createElement(react_1["default"].Fragment, null); }; }
 };
 exports["default"] = ReactStyleFactory;

package.json

 {
   "name": "notion-content-render",
-  "version": "0.2.12",
+  "version": "1.0.0",
   "description": "A library to render notion content structure to React or MD",
@@ -35,3 +35,3 @@ "main": "dist/index.js",
   "devDependencies": {
-    "@notionhq/client": "^0.2.0",
+    "@notionhq/client": "^0.2.1",
     "@testing-library/jest-dom": "^5.14.1",
@@ -38,0 +38,0 @@ "@testing-library/react": "^12.0.0",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

17662

increased by19.82%

Lines of code

332

increased by28.19%

Number of low quality alerts

1

decreased by-50%

No dependency changes