@contensis/canvas-react - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

dist/canvas-react.d.ts

 import * as react from 'react';
+import { FunctionComponent, ClassType, Component as Component$1, ComponentClass } from 'react';
 
@@ -300,3 +301,3 @@ type InlineBlock = FragmentBlock | AnchorBlock | LinkBlock | InlineEntryBlock;
 type WithChildren = {
-    children?: JSX.Element;
+    children?: JSX.Element | undefined;
 };
@@ -313,3 +314,3 @@ type RendererProps = {
 }>;
-type BlockRenderer<T extends Block> = (props: RenderBlockPropsWithChildren<T>) => JSX.Element;
+type BlockRenderer<T extends Block> = Renderer<RenderBlockPropsWithChildren<T>>;
 type BlockRenderers = {
@@ -324,5 +325,5 @@ [TType in Block['type']]: BlockRenderer<TypedBlock<TType>>;
 type RenderDecoratorPropsWithChildren = RenderDecoratorProps & WithChildren & Attributes;
-type DecoratorRenderer = (props: RenderDecoratorPropsWithChildren) => JSX.Element;
+type DecoratorRenderer = Renderer<RenderDecoratorPropsWithChildren>;
 type DecoratorRenderers = Record<DecoratorType, DecoratorRenderer>;
-type ComponentRenderer = (props: RenderBlockPropsWithChildren<ComponentBlock>) => JSX.Element;
+type ComponentRenderer = Renderer<RenderBlockPropsWithChildren<ComponentBlock>>;
 type ComponentRenderers = Record<string, ComponentRenderer>;
@@ -339,8 +340,30 @@ type RendererContextValue = {
 };
-type RendererContextProviderProps = {
-    children: JSX.Element;
-} & RendererOverridesContextValue;
+type RendererContextProviderProps = WithChildren & RendererOverridesContextValue;
 
 declare const RendererContext: react.Context<RendererContextValue>;
+/**
+ * Provides context to the <Renderer> component to return Canvas data as React components
+ *
+ *  @link https://www.npmjs.com/package/@contensis/canvas-react#usage
+ *
+ * @param blocks - Override the default rendering of Canvas content blocks
+ * @param components - Render method for Contensis Components within the Canvas field
+ * @param decorators - Override the rendering of HTML elements within a text field
+ *
+ * @example
+ * <RenderContextProvider blocks={{ _table: Table }} components={{ banner: Banner }} decorators={{ strong: Strong }}>
+ *      <Renderer data={data} />
+ * </RenderContextProvider>
+ *
+ */
 declare function RenderContextProvider(props: RendererContextProviderProps): JSX.Element;
+type Renderer<TProps> = FunctionComponent<TProps> | ClassType<TProps, Component$1<TProps>, ComponentClass<TProps>>;
+/**
+ * The default render method for processing Canvas data
+ *
+ * @link https://www.npmjs.com/package/@contensis/canvas-react#usage
+ *
+ * @param data - Accepts Canvas data
+ *
+ * */
 declare function Renderer(props: RendererProps): JSX.Element;
@@ -399,2 +422,6 @@ declare function Anchor(props: RenderBlockPropsWithChildren<AnchorBlock>): JSX.Element;
 }
+declare function Quote(props: RenderBlockPropsWithChildren<QuoteBlock>): JSX.Element;
+declare namespace Quote {
+    var Children: (props: RenderBlockProps<QuoteBlock>) => JSX.Element;
+}
 declare function Table(props: RenderBlockPropsWithChildren<TableBlock>): JSX.Element;
@@ -486,2 +513,2 @@ declare namespace Table {
 
-export { Anchor, type AnchorBlock, type Block, type BlockRenderer, Code, type CodeBlock, Component, type ComponentBlock, type DecoratorType, Delete, Divider, type DividerBlock, Emphasis, Fragment, type FragmentBlock, Heading, type HeadingBlock, Image, type ImageBlock, InlineCode, InlineEntry, type InlineEntryBlock, Insert, Keyboard, LineBreak, Link, type LinkBlock, List, type ListBlock, ListItem, type ListItemBlock, Mark, Panel, type PanelBlock, Paragraph, type ParagraphBlock, type QuoteBlock, type RenderBlockProps, type RenderBlockPropsWithChildren, RenderContextProvider, type RenderDecoratorProps, type RenderDecoratorPropsWithChildren, Renderer, RendererContext, Strikethrough, Strong, Subscript, Superscript, Table, type TableBlock, TableBody, type TableBodyBlock, TableCaption, type TableCaptionBlock, TableCell, type TableCellBlock, TableFooter, type TableFooterBlock, TableHeader, type TableHeaderBlock, TableHeaderCell, type TableHeaderCellBlock, TableRow, type TableRowBlock, Underline, Variable };
+export { Anchor, type AnchorBlock, type Block, type BlockRenderer, Code, type CodeBlock, Component, type ComponentBlock, type DecoratorType, Delete, Divider, type DividerBlock, Emphasis, Fragment, type FragmentBlock, Heading, type HeadingBlock, Image, type ImageBlock, InlineCode, InlineEntry, type InlineEntryBlock, Insert, Keyboard, LineBreak, Link, type LinkBlock, List, type ListBlock, ListItem, type ListItemBlock, Mark, Panel, type PanelBlock, Paragraph, type ParagraphBlock, Quote, type QuoteBlock, type RenderBlockProps, type RenderBlockPropsWithChildren, RenderContextProvider, type RenderDecoratorProps, type RenderDecoratorPropsWithChildren, Renderer, RendererContext, Strikethrough, Strong, Subscript, Superscript, Table, type TableBlock, TableBody, type TableBodyBlock, TableCaption, type TableCaptionBlock, TableCell, type TableCellBlock, TableFooter, type TableFooterBlock, TableHeader, type TableHeaderBlock, TableHeaderCell, type TableHeaderCellBlock, TableRow, type TableRowBlock, Underline, Variable };

dist/canvas-react.js

@@ -43,2 +43,3 @@ "use strict";
   Paragraph: () => Paragraph,
+  Quote: () => Quote,
   RenderContextProvider: () => RenderContextProvider,
@@ -72,3 +73,4 @@ Renderer: () => Renderer,
     const blockType = type;
-    prev[blockType] = overrideBlocks?.[blockType] || BLOCK_RENDERERS[blockType];
+    const renderer = overrideBlocks?.[blockType] || BLOCK_RENDERERS[blockType];
+    prev[blockType] = renderer;
     return prev;
@@ -142,3 +144,3 @@ }, {});
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("figcaption", { children: props.caption })
-  ] }) : props.children;
+  ] }) : props.children || null;
 }
@@ -498,2 +500,3 @@ function RenderBlockChildrenFactory() {
   Paragraph,
+  Quote,
   RenderContextProvider,
@@ -500,0 +503,0 @@ Renderer,

package.json

 {
   "name": "@contensis/canvas-react",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Render canvas content with React",
@@ -29,2 +29,3 @@ "keywords": [
   "scripts": {
+    "start": "npm run build",
     "prebuild": "npm run tsc",
@@ -31,0 +32,0 @@ "build": "tsup --dts-resolve",

README.md

@@ -123,3 +123,3 @@ # @contensis/canvas-react
   const book = props.block?.value;
-  if (!book) return <></>;
+  if (!book) return null;
   return (
@@ -126,0 +126,0 @@ <div className="card mb-3">

No alert changes

Improved metrics

Total package byte prevSize

171472

increased by2.35%

Lines of code

1493

increased by2.19%

No dependency changes