jsx-pragma

1.0.6 • Public • Published

jsx-pragma

npm version

Small javascript library for transpiling JSX to DOM Elements.

Installation

npm i -D jsx-pragma

jsx-pragma provides functions for use with Babel to transpile JSX.

Usage

The following JSX

<div />

transpiles to HTMLDIVElement.

Add classes, ids, & common attributes

<ul className={styles.list} />

<img src={imgSrc} />

The eventListener attribute takes an array that contains exactly 2 elements: the event type and the function.

<span eventListener={['click', e => {
    console.log(e)
}]} />

Use a function as an element type to create functional components with custom attributes. Currently jsx-pragma only supports functions as elements, classes are not yet supported but could prove useful for managing component state.

const Component = ({ attributes: { items }}) => (
    <ul>
        {items.map(item => <li>{item.name}</li>)}
    </ul>
)

const items = ['foo' 'bar']

<Component items={items} />

Pass children to any element

const Component = ({ children }) => (
    <div>
    { children }
    </div>
)

<Component>
    <div></div>
    Hey! These divs aren't going to nest themselves!
</Component>

Readme

Keywords

none

Package Sidebar

Install

npm i jsx-pragma

Weekly Downloads

0

Version

1.0.6

License

MIT

Unpacked Size

15.7 kB

Total Files

11

Last publish

Collaborators

  • 5cotto