Initial commit

Author: peternewnham

.babelrc

@@ -0,0 +1,9 @@
+{
+  "presets": [
+    "react",
+    "es2015"
+  ],
+  "plugins": [
+    "transform-object-assign"
+  ]
+}

.eslintrc

@@ -0,0 +1,22 @@
+{
+  "extends": "eslint:recommended",
+  "ecmaFeatures": {
+    "jsx": true,
+    "modules": true
+  },
+  "env": {
+    "browser": true,
+    "node": true,
+    "jasmine": true,
+    "es6": true
+  },
+  "plugins": [
+    "react"
+  ],
+  "rules": {
+    "semi": [2, "always"],
+    "quotes": [2, "single"],
+    "indent": [2, 2, {"SwitchCase": 1}],
+    "eol-last": 2
+  }
+}

.gitignore

@@ -0,0 +1,6 @@
+npm-debug.log
+.idea
+node_modules
+dist/
+coverage/
+lib/

LICENSE.md

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2016 Peter Newnham
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1 @@
+# React HTML Parser

karma.conf.js

@@ -0,0 +1,43 @@
+var webpackConfig = require('./webpack.config.test');
+
+module.exports = function(karma) {
+
+  karma.set({
+    files: [
+      {
+        pattern: 'tests.webpack.js',
+        watched: true
+      }
+    ],
+    autoWatch: true,
+    logLevel: karma.LOG_INFO,
+    basePath: '',
+    singleRun: false,
+    frameworks: [
+      'jasmine',
+      'jasmine-expect-jsx',
+      'phantomjs-shim'
+    ],
+    preprocessors: {
+      'tests.webpack.js': 'webpack'
+    },
+    browsers: ['PhantomJS'],
+    colors: true,
+    browserNoActivityTimeout: 100000,
+    webpackMiddleware: {
+      noInfo: true
+    },
+    webpack: webpackConfig,
+    reporters: [ 'spec', 'coverage' ],
+    coverageReporter: {
+      type: 'lcov',
+      dir: 'coverage/',
+      subdir: '.',
+      includeAllSources: true
+    },
+    specReporter: {
+      suppressSkipped: true
+    }
+  });
+
+};

package.json

@@ -0,0 +1,65 @@
+{
+  "name": "react-html-parser",
+  "version": "1.0.0",
+  "description": "Parse HTML into React components",
+  "main": "lib/index.js",
+  "jsnext:main": "src/index.js",
+  "scripts": {
+    "clean": "rimraf coverage dist lib",
+    "check": "npm run lint && npm run test",
+    "test": "karma start --single-run",
+    "test:watch": "karma start",
+    "lint": "eslint src test",
+    "build": "npm run build:lib && npm run build:umd && npm run build:umd:min",
+    "build:lib": "rimraf lib && babel ./src -d lib",
+    "build:umd": "webpack src/index.js dist/react-html-parser.js --config webpack.config.development.js",
+    "build:umd:min": "webpack src/index.js -p dist/react-html-parser.min.js --config webpack.config.production.js",
+    "prerelease": "npm run clean && npm run check",
+    "release": "npm run build",
+    "postrelease": "echo DONE",
+    "postreleases": "git push --follow-tags",
+    "release:patch": "npm run release",
+    "release:minor": "npm version minor && npm run release",
+    "release:major": "npm version major && npm run release"
+  },
+  "keywords": [
+    "react",
+    "html"
+  ],
+  "author": "Peter Newnham",
+  "license": "MIT",
+  "devDependencies": {
+    "babel": "^6.3.26",
+    "babel-cli": "^6.4.0",
+    "babel-core": "^6.4.0",
+    "babel-loader": "^6.2.1",
+    "babel-plugin-transform-object-assign": "^6.3.13",
+    "babel-preset-es2015": "^6.3.13",
+    "babel-preset-react": "^6.3.13",
+    "eslint-plugin-react": "3.15.0",
+    "html-webpack-plugin": "^1.7.0",
+    "inject-loader": "2.0.1",
+    "isparta-loader": "^2.0.0",
+    "jasmine-core": "^2.4.1",
+    "json-loader": "^0.5.4",
+    "karma": "^0.13.19",
+    "karma-coverage": "^0.5.3",
+    "karma-jasmine": "^0.3.6",
+    "karma-phantomjs-shim": "^1.2.0",
+    "karma-spec-reporter": "0.0.23",
+    "karma-webpack": "^1.7.0",
+    "phantomjs": "^1.9.19",
+    "react": "^0.14.6",
+    "react-addons-test-utils": "^0.14.6",
+    "react-dom": "^0.14.6",
+    "rimraf": "^2.5.0",
+    "webpack": "^1.12.11",
+    "webpack-dev-server": "^1.14.1"
+  },
+  "dependencies": {
+    "htmlparser2": "^3.9.0"
+  },
+  "peerDependencies": {
+    "react": "^0.13.0 || ^0.14.0"
+  }
+}

src/HtmlParser.js

@@ -0,0 +1,13 @@
+import htmlparser2 from 'htmlparser2';
+import ProcessNodes from './utils/ProcessNodes';
+
+/**
+ * Parses a HTML string and returns a list of React components generated from it
+ *
+ * @param {String} html The HTML to convert into React components
+ * @returns {Array} List of top level React elements
+ */
+export default function HtmlParser(html) {
+  const nodes = htmlparser2.parseDOM(html);
+  return ProcessNodes(nodes);
+}

src/elementTypes/StyleElementType.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import GenerateElementProps from '../utils/GeneratePropsFromAttributes';
+
+/**
+ * Converts a <style> element to a React element
+ *
+ * @param {Object} node The style node
+ * @param {String} key The key to give the React element
+ * @returns {React.Element} The React style element
+ */
+export default function StyleElementType(node, key) {
+
+  // The style element only ever has a single child which is the styles so try and find this to add as
+  // a child to the style element that will be created
+  let styles;
+  if (node.children.length > 0) {
+    styles = node.children[0].data;
+  }
+
+  // generate props
+  const props = GenerateElementProps(node.attribs, key);
+
+  // create and return the element
+  return React.createElement('style', props, styles);
+
+}

src/elementTypes/TagElementType.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import ProcessNodes from '../utils/ProcessNodes';
+import GeneratePropsFromAttributes from '../utils/GeneratePropsFromAttributes';
+import TransformTagName from '../utils/TransformTagName';
+
+/**
+ * Converts any element (excluding style - see StyleElementType - and script) to a react element.
+ *
+ * @param {Object} node The tag node
+ * @param {String} key The key to give the React element
+ * @returns {React.Element} The React tag element
+ */
+export default function TagElementType(node, key) {
+
+  // If the node has children process them
+  const children = ProcessNodes(node.children);
+
+  // generate props
+  const props = GeneratePropsFromAttributes(node.attribs, key);
+
+  // transform the tag name if needed
+  const tagName = TransformTagName(node.name);
+
+  // create and return the element
+  return React.createElement(tagName, props, children);
+}