From e7b83537c2cce0e089e599613025f37169be3b68 Mon Sep 17 00:00:00 2001 From: danvim Date: Mon, 27 Nov 2023 00:34:01 +0800 Subject: [PATCH] Change spelling --- README.md | 12 ++++++------ index.html | 3 +-- package.json | 2 +- src/__tests__/PdfRenderer.test.tsx | 17 +++++++++++++++-- src/demo/App.tsx | 2 +- 5 files changed, 24 insertions(+), 12 deletions(-) diff --git a/README.md b/README.md index abd8111..d29c6ce 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ -# React PDF Make Reconciler +# React pdfmake Reconciler -This package lets you create PDFs using PDF Make and React. +This package lets you create PDFs using pdfmake and React. [![npm version](https://img.shields.io/npm/v/react-pdfmake-reconciler.svg?logo=npm)](https://www.npmjs.com/package/react-pdfmake-reconciler) @@ -14,7 +14,7 @@ npm i react-pdfmake-reconciler ## Features -- Write complex PDF in JSX. Render JSX into PDF Make content structure. +- Write complex PDF in JSX. Render JSX into pdfmake content structure. - Utilize React features like: - Context. Note that outside React contexts do not penetrate into PDF renderer. - Components @@ -22,7 +22,7 @@ npm i react-pdfmake-reconciler - Working React update loop, (although it is unlikely to trigger user events inside PDF.), e.g. - async setState calls - useEffect call -- TypeScript typing for PDF Make Components (`` components) +- TypeScript typing for pdfmake Components (`` components) - React Developer Tools support ![React Developer Tools Demo](./screenshots/react-devtools-demo.png) @@ -73,7 +73,7 @@ const document = PdfRenderer.renderOnce(Hello World!); ### PDF elements -Newly defined intrinsic elements by this package have the `pdf-` prefix. Roughly speaking, each type of PDF Make content object corresponds to one element type, where the property specifying the `Content` is mapped to the `children` prop. For example: +Newly defined intrinsic elements by this package have the `pdf-` prefix. Roughly speaking, each type of pdfmake content object corresponds to one element type, where the property specifying the `Content` is mapped to the `children` prop. For example: ```tsx const pdfMakeContent = { @@ -118,7 +118,7 @@ const pdfNode = ( ### PdfPreview -`` provides an easy way to render your React PDF Make Reconciler JSX in the browser. You can also debug your PDF JSX using the [React Developer Tools](https://chromewebstore.google.com/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi) browser extension. +`` provides an easy way to render your React pdfmake Reconciler JSX in the browser. You can also debug your PDF JSX using the [React Developer Tools](https://chromewebstore.google.com/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi) browser extension. ```tsx import { FC, StrictMode } from "react"; diff --git a/index.html b/index.html index f7db950..c0e322c 100644 --- a/index.html +++ b/index.html @@ -2,9 +2,8 @@ - - React PDF Make Reconciler Demo + React pdfmake Reconciler Demo
diff --git a/package.json b/package.json index 1e65864..d1d7de8 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "type": "module", "license": "MIT", "author": "Daniel Cheung", - "description": "Writing PDF Make with React JSX using React Reconciler.", + "description": "Writing pdfmake with React JSX using React Reconciler.", "keywords": [ "react", "pdfmake", diff --git a/src/__tests__/PdfRenderer.test.tsx b/src/__tests__/PdfRenderer.test.tsx index c09534c..ec8cc09 100644 --- a/src/__tests__/PdfRenderer.test.tsx +++ b/src/__tests__/PdfRenderer.test.tsx @@ -1,11 +1,11 @@ import { describe, expect, test } from "vitest"; import { PdfRenderer } from "../PdfRenderer.tsx"; -import { FC, useEffect, useState } from "react"; +import { FC, Fragment, useEffect, useState } from "react"; import { PdfFooter, PdfHeader } from "../components"; import { DynamicPdfNode } from "../types/DynamicPdfNode.tsx"; describe("PdfRenderer", () => { - describe("PDF Make Content", () => { + describe("pdfmake Content", () => { test("string", () => { expect(PdfRenderer.renderOnce("Hello World!").content).toEqual( "Hello World!", @@ -260,6 +260,19 @@ describe("PdfRenderer", () => { PdfRenderer.renderOnce(Hello World!).content, ).toEqual(["Hello World!"]); }); + + test("fragment", () => { + expect( + PdfRenderer.renderOnce( + + {["Hello", World!]} + , + ).content, + ).toEqual({ + $__reactPdfMakeType: "pdf-stack", + stack: ["Hello", "World!"], + }); + }); }); describe("renderOnce", () => { diff --git a/src/demo/App.tsx b/src/demo/App.tsx index fc50f78..122cf07 100644 --- a/src/demo/App.tsx +++ b/src/demo/App.tsx @@ -51,7 +51,7 @@ function App() { return ( <> -

React PDF Make Reconciler

+

React pdfmake Reconciler

NPM Package