add render

dpck · Feb 17, 2019 · 0d04b36 · 0d04b36
1 parent ad0bb1a
commit 0d04b36
Show file tree

Hide file tree

Showing 7 changed files with 81 additions and 2 deletions.
diff --git a/.documentary/section-breaks/4.svg b/.documentary/section-breaks/4.svg
diff --git a/README.md b/README.md
@@ -14,6 +14,8 @@ yarn add -E @depack/context
 - [API](#api)
 - [class JSXContext](#class-jsxcontext)
   * [`getVNode(input: string): Preact.VNode`](#getvnodeinput-string-preactvnode)
+    * [`RenderConfig`](#type-renderconfig)
+  * [`render(vnode: VNode, opts?: RenderOpts, contexts?: Array<Context>): string`](#rendervnode-vnodeopts-renderoptscontexts-arraycontext-string)
 - [Using In A Test](#using-in-a-test)
 - [Copyright](#copyright)
 
@@ -62,7 +64,40 @@ VNode {
   key: undefined }
 ```
 
-<p align="center"><a href="#table-of-contents"><img src=".documentary/section-breaks/2.svg?sanitize=true"></a></p>
+<p align="center"><a href="#table-of-contents"><img src=".documentary/section-breaks/2.svg?sanitize=true" width="15"></a></p>
+
+### `render(`<br/>&nbsp;&nbsp;`vnode: VNode,`<br/>&nbsp;&nbsp;`opts?: RenderOpts,`<br/>&nbsp;&nbsp;`contexts?: Array<Context>,`<br/>`): string`
+
+Renders the JSX into the string.
+
+`import('preact').VNode` __<a name="type-vnode">`VNode`</a>__
+
+__<a name="type-renderconfig">`RenderConfig`</a>__: Rendering options.
+
+|    Name    |   Type    |                                                    Description                                                    | Default |
+| ---------- | --------- | ----------------------------------------------------------------------------------------------------------------- | ------- |
+| addDoctype | _boolean_ | Adds the `<!doctype html>` at the beginning of the return string.                                                 | `false` |
+| shallow    | _boolean_ | If `true`, renders nested Components as HTML elements (`<Foo a="b" />`).                                          | `false` |
+| xml        | _boolean_ | If `true`, uses self-closing tags for elements without children.                                                  | `false` |
+| pretty     | _boolean_ | If `true`, adds `  ` whitespace for readability. Pass a string to indicate the indentation character, e.g., `\t`. | `false` |
+| lineLength | _number_  | The number of characters on one line above which the line should be split in the `pretty` mode.                   | `40`    |
+
+```jsx
+import JSXContext from '@depack/context'
+
+const context = new JSXContext()
+const s = context.render(
+  <div id="id" className="Class" required>
+    <span>Example</span>
+  </div>
+)
+console.log(s)
+```
+```js
+<div id="id" class="Class" required><span>Example</span></div>
+```
+
+<p align="center"><a href="#table-of-contents"><img src=".documentary/section-breaks/3.svg?sanitize=true"></a></p>
 
 ## Using In A Test
 
@@ -154,7 +189,7 @@ For example, the pretty-printing adds the additional attribute and points to the
 /**/
 ```
 
-<p align="center"><a href="#table-of-contents"><img src=".documentary/section-breaks/3.svg?sanitize=true"></a></p>
+<p align="center"><a href="#table-of-contents"><img src=".documentary/section-breaks/4.svg?sanitize=true"></a></p>
 
 ## Copyright
 

diff --git a/documentary/1-API/index.md b/documentary/1-API/index.md
@@ -25,4 +25,21 @@ Transforms the string input into JSX VNode.
 %EXAMPLE: example/example.jsx, ../src => @depack/context%
 %FORK-js example example/example%
 
+%~ width="15"%
+
+```### render => string
+[
+  ["vnode", "VNode"],
+  ["opts?", "RenderOpts"],
+  ["contexts?", "Array<Context>"]
+]
+```
+
+Renders the JSX into the string.
+
+%TYPEDEF node_modules/@depack/render/types/index.xml%
+
+%EXAMPLE: example/render.jsx, ../src => @depack/context%
+%FORK-js example example/render%
+
 %~%
diff --git a/example/render.jsx b/example/render.jsx
@@ -0,0 +1,9 @@
+import JSXContext from '../src'
+
+const context = new JSXContext()
+const s = context.render(
+  <div id="id" className="Class" required>
+    <span>Example</span>
+  </div>
+)
+console.log(s)
diff --git a/package.json b/package.json
@@ -49,5 +49,8 @@
     "eslint-config-artdeco": "1.0.1",
     "yarn-s": "1.1.0",
     "zoroaster": "3.7.0"
+  },
+  "dependencies": {
+    "@depack/render": "1.1.0"
   }
 }
diff --git a/src/index.js b/src/index.js
@@ -1,6 +1,7 @@
 import jsx from '@a-la/jsx'
 import { runInNewContext } from 'vm'
 import { h as preact } from 'preact'
+import render from '@depack/render'
 
 /**
  * The class for context-testing JSX.
@@ -17,6 +18,9 @@ export default class JSXContext {
     const { test } = sandbox
     return test
   }
+  get render() {
+    return render
+  }
 }
 
 /* documentary types/index.xml */

diff --git a/yarn.lock b/yarn.lock
@@ -55,6 +55,11 @@
   resolved "https://registry.yarnpkg.com/@artdeco/clean-stack/-/clean-stack-1.0.1.tgz#7e4d3bb1b0ac62173b00e4bba7091f7847cdb088"
   integrity sha512-ZSavD8NpWA1/1SRCKrx8LZ5WfbKS1kRUIFOERJvR1jXqCAcbM3xWSP2VdCKEh4lCwWghSWQkotbpK6n+o1Y/xQ==
 
+"@depack/render@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@depack/render/-/render-1.1.0.tgz#1ef7d0dd095ad6043845d6161979c2831d30a50d"
+  integrity sha512-k7XY2kwiDo+20lU4RWnWh5Y0bPjodeQRNaHodHaKdNd5IiQpSCCtcdPMY2p1M7J16p1znNXr+R/1mhTzT9lKjw==
+
 "@wrote/clone@1.1.0":
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/@wrote/clone/-/clone-1.1.0.tgz#6f5d05b320c3294d6879f65a3950475249cdfcab"