# simplified-jsx-to-ast

> Converts basic JSX code into a JSON representation, which can be used by React.createElement

Latest version **0.4.0** (published 2021-02-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install simplified-jsx-to-ast
pnpm add simplified-jsx-to-ast
yarn add simplified-jsx-to-ast
bun add simplified-jsx-to-ast
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.4.0 |
| Published | 2021-02-01 |
| First published | 2021-02-01 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=8 |
| Dependencies | 6 |
| Unpacked size | 24.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 2 |
| Author | Dennis Morhardt & Andrey Lapshov |
| Maintainers | a_lapshov |
| Keywords | jsx, convert, json, createElement, react, ast |

## Links

- npm: https://www.npmjs.com/package/simplified-jsx-to-ast
- Repository: https://github.com/andrewLapshov/simplified-jsx-to-json/tree/ast-props
- npm.io page: https://npm.io/package/simplified-jsx-to-ast

## Dependencies (6)

- [acorn](https://npm.io/package/acorn.md) ^7.1.1
- [acorn-jsx](https://npm.io/package/acorn-jsx.md) ^5.2.0
- [is-string](https://npm.io/package/is-string.md) ^1.0.5
- [svg-tag-names](https://npm.io/package/svg-tag-names.md) ^2.0.1
- [html-tag-names](https://npm.io/package/html-tag-names.md) ^1.1.5
- [style-to-object](https://npm.io/package/style-to-object.md) ^0.3.0

## Alternatives

- [@mapbox/jsonlint-lines-primitives](https://npm.io/package/@mapbox/jsonlint-lines-primitives.md) — 5.3M weekly downloads
- [reftools](https://npm.io/package/reftools.md) — 3.5M weekly downloads
- [@hey-api/openapi-ts](https://npm.io/package/@hey-api/openapi-ts.md) — 3.5M weekly downloads
- [@mapbox/geojson-rewind](https://npm.io/package/@mapbox/geojson-rewind.md) — 2.4M weekly downloads
- [turbo-stream](https://npm.io/package/turbo-stream.md) — 1.7M weekly downloads

## Recent versions

- 0.4.0 (latest) — 2021-02-01
- 0.3.0 — 2021-02-01

## README

# simplified-jsx-to-ast

![npm](https://img.shields.io/npm/v/simplified-jsx-to-ast)

> Mod of original `simplified-jsx-to-json` package.
> Converts simplified JSX code into a JSON AST representation, which can be used by `React.createElement`
> Supports props values from object argument.

## Install

```
$ npm install simplified-jsx-to-ast
```

## Usage

```js
const jsxToJson = require('simplified-jsx-to-json');

jsxToJson('<Test myProp={true}>My Child</Test>');
//=> {
//     type: "Test",
//     props: { myProp: true },
//     children: [
//       {
//         type: "Fragment",
//         props: {},
//         children: "Test",
//       },
//     ],
//   }
```

## Features

* `<Test />`: Self-closing JSX tags
* `<Test myProp="string">`: String props
* `` <Test myProp={`string`}> ``: Template props
* `<Test myProp>`: True props
* `<Test myProp={false}>`: Boolean props
* `<Test myProp={34}>`: Number props
* `<Test myProp={3 + 3 + 3}>`: Props with arithmetic, comparison or bitwise operators
* `<Test myProp={['Test', true, 34]}>`: Arrays (with strings, numbers or booleans)
* `<Test myProp={{ test: 34 }}>`: Objects with string keys and string, number or boolean value
* `<>Test</>`: Fragments
* HTML/SVG DOM attributes are converted to correct React equivalent (`class` -> `className`)

## License

MIT © [Dennis Morhardt](https://dennismorhardt.de)

Modified by Andrey Lapshov

---
_Source: https://npm.io/package/simplified-jsx-to-ast · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._