jsx

Useful utilities for working with JSX.

Source:

Methods

(static) arrayToJSX(arropt) → {Array.<ReactElement>}

Source:

Converts an array of plain objects describing React Elements to an array of React Elements.

Example
import {arrayToJSX} from 'webcompiler';
// or - import {arrayToJSX} from 'webcompiler/lib/jsx';
// or - var arrayToJSX = require('webcompiler').arrayToJSX;
// or - var arrayToJSX = require('webcompiler/lib/jsx').arrayToJSX;

<div>{arrayToJSX([{type: 'h1', children: ['Hello world!']}])}</div>
Parameters:
Name Type Attributes Default Description
arr Array.<(string|Object)> <optional>
 []

an array of plain objects describing React Elements
Returns:

an array of React Elements

Type
Array.<ReactElement>

(static) flatten(…args) → {Array.<*>}

Source:

Recursively flattens args, removes falsy values and combines string values.

Can be used as a simple optimization step on the JSX children-to-be to simplify the resulting DOM structure by joining adjacent text nodes together.

Example
import {flatten} from 'webcompiler';
// or - import {flatten} from 'webcompiler/lib/jsx';
// or - var flatten = require('webcompiler').flatten;
// or - var flatten = require('webcompiler/lib/jsx').flatten;

flatten('lorem ', ['ipsum ', null, ['dolor ', ['sit ', ['amet']]]]); // ["lorem ipsum dolor sit amet"]
Parameters:
Name Type Attributes Description
args * <repeatable>

the input values
Returns:

the flattened result

Type
Array.<*>

(static) htmlToArray(htmlopt) → {Array.<(string|Object)>}

Source:

Converts an arbitrary HTML string to an array of plain objects describing React Elements for easy serialization/unserialization.

Example
import {htmlToArray} from 'webcompiler';
// or - import {htmlToArray} from 'webcompiler/lib/jsx';
// or - var htmlToArray = require('webcompiler').htmlToArray;
// or - var htmlToArray = require('webcompiler/lib/jsx').htmlToArray;

htmlToArray('<h1>Hello world!</h1>'); // [{type: 'h1', children: ['Hello world!']}]
Parameters:
Name Type Attributes Default Description
html string <optional>
 ""

an arbitrary HTML string
Returns:

an array of plain objects describing React Elements

Type
Array.<(string|Object)>

(static) htmlToJSX(htmlopt) → {Array.<ReactElement>}

Source:

Converts an arbitrary HTML string to an array of React Elements.

Example
import {htmlToJSX} from 'webcompiler';
// or - import {htmlToJSX} from 'webcompiler/lib/jsx';
// or - var htmlToJSX = require('webcompiler').htmlToJSX;
// or - var htmlToJSX = require('webcompiler/lib/jsx').htmlToJSX;

<div>{htmlToJSX('<h1>Hello world!</h1>')}</div>
Parameters:
Name Type Attributes Default Description
html string <optional>
 ""

an arbitrary HTML string
Returns:

an array of React Elements

Type
Array.<ReactElement>