Apply Pastanaga Icon system, add all icons.

package.json

@@ -19,51 +19,44 @@
     "email": "plone-developers@lists.sourceforge.net"
   },
   "homepage": "https://plone.org",
-  "keywords": ["plone", "react", "mosaic"],
+  "keywords": [
+    "plone",
+    "react",
+    "mosaic"
+  ],
   "main": "src/server.jsx",
   "scripts": {
-    "test:start":
-      "DEBUG=plone-react:* npm-run-all -ln prestart start & npm-run-all -ln wait-for-frontend",
+    "test:start": "DEBUG=plone-react:* npm-run-all -ln prestart start & npm-run-all -ln wait-for-frontend",
     "start": "NODE_ENV=production npm-run-all prod",
     "dev": "NODE_ENV=development npm-run-all dev:build",
-    "dev:build":
-      "npm-run-all -ln clear:dist prepare:dev:build i18n:build development",
-    "development":
-      "npm-run-all -ln --parallel build:dev:client build:dev:server run:dev:server",
-    "prepare:dev:build":
-      "universal-webpack --settings ./webpack/universal-webpack-settings.js prepare",
+    "dev:build": "npm-run-all -ln clear:dist prepare:dev:build i18n:build development",
+    "development": "npm-run-all -ln --parallel build:dev:client build:dev:server run:dev:server",
+    "prepare:dev:build": "universal-webpack --settings ./webpack/universal-webpack-settings.js prepare",
     "build:dev:client": "better-npm-run run_dev_client",
     "build:dev:server": "better-npm-run build_dev_server",
     "run:dev:server": "better-npm-run run_dev_server",
     "clear:dist": "rm -rf dist",
-    "build":
-      "npm-run-all clear:dist prod:build:client i18n:build prod:build:server",
-    "build:analyse":
-      "npm run build && node_modules/webpack-bundle-analyzer/lib/bin/analyzer.js dist/stats.json",
+    "build": "npm-run-all clear:dist prod:build:client i18n:build prod:build:server",
+    "build:analyse": "npm run build && node_modules/webpack-bundle-analyzer/lib/bin/analyzer.js dist/stats.json",
     "prod": "npm-run-all prod:build:client prod:build:server run:prod:server",
     "prod:build:client": "better-npm-run build_prod_client",
     "prod:build:server": "better-npm-run build_prod_server",
     "run:prod:server": "better-npm-run run_prod_server",
     "jsdoc": "npm-run-all 'jsdoc:*'",
     "jsdoc:src": "jsdoc -c jsdoc.src.json; : 'ignore minor errors'",
     "jsdoc:api": "jsdoc -c jsdoc.api.json; : 'ignore minor errors'",
-    "lint":
-      "./node_modules/eslint/bin/eslint.js -c .eslintrc src --format checkstyle --output-file eslint.xml",
+    "lint": "./node_modules/eslint/bin/eslint.js -c .eslintrc src --format checkstyle --output-file eslint.xml",
     "lint:fix": "./node_modules/eslint/bin/eslint.js -c .eslintrc src --fix",
-    "prettier":
-      "./node_modules/prettier/bin/prettier.js -l 'src/**/*.js' 'src/**/*.jsx'",
-    "prettier:fix":
-      "./node_modules/prettier/bin/prettier.js --write 'src/**/*.js' 'src/**/*.jsx'",
+    "prettier": "./node_modules/prettier/bin/prettier.js -l 'src/**/*.js' 'src/**/*.jsx'",
+    "prettier:fix": "./node_modules/prettier/bin/prettier.js --write 'src/**/*.js' 'src/**/*.jsx'",
     "flow": "./node_modules/flow-bin/cli.js",
     "watch:test:unit": "better-npm-run watch_test_unit",
     "test": "npm-run-all prettier lint flow test:unit",
     "test:unit": "better-npm-run test_unit",
     "test:unit:ci": "better-npm-run test_unit_ci",
     "test:unit:fix": "yarn run test:unit -- -u",
-    "coverage":
-      "npm-run-all test && cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js",
-    "wait-for-frontend":
-      "wget --retry-connrefused --spider ${PROTRACTOR_URL:-http://localhost:4300}",
+    "coverage": "npm-run-all test && cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js",
+    "wait-for-frontend": "wget --retry-connrefused --spider ${PROTRACTOR_URL:-http://localhost:4300}",
     "webdriver-update": "webdriver-manager update",
     "docs": "raml2html docs/api/index.raml > src/static/docs/index.html",
     "i18n": "npm-run-all i18n:sync i18n:build",
@@ -73,7 +66,9 @@
   },
   "jest": {
     "testRegex": "(/__tests__/.*|\\.(test))\\.(js|jsx)$",
-    "snapshotSerializers": ["enzyme-to-json/serializer"],
+    "snapshotSerializers": [
+      "enzyme-to-json/serializer"
+    ],
     "transform": {
       "^.+\\.js(x)?$": "babel-jest",
       "^.+\\.scss$": "jest-css-modules",
@@ -91,7 +86,9 @@
     "globals": {
       "__CLIENT__": true
     },
-    "setupFiles": ["./test-setup.js"]
+    "setupFiles": [
+      "./test-setup.js"
+    ]
   },
   "betterScripts": {
     "run_dev_client": {
@@ -101,25 +98,21 @@
       }
     },
     "build_dev_server": {
-      "command":
-        "webpack --config ./webpack/webpack.config.server.dev.entry.js --watch --hot --colors --display-error-details"
+      "command": "webpack --config ./webpack/webpack.config.server.dev.entry.js --watch --hot --colors --display-error-details"
     },
     "run_dev_server": {
-      "command":
-        "nodemon --watch ./src/server.jsx --watch ./src --watch ./dist/server.js ./src/start-server.js --exec babel-node",
+      "command": "nodemon --watch ./src/server.jsx --watch ./src --watch ./dist/server.js ./src/start-server.js --exec babel-node",
       "env": {
         "PORT": 4300,
         "DEBUG": "plone-react:*",
         "DEBUG_LEVELS": "trace"
       }
     },
     "build_prod_client": {
-      "command":
-        "webpack --colors --display-error-details --config ./webpack/webpack.config.client.prod.entry.js"
+      "command": "webpack --colors --display-error-details --config ./webpack/webpack.config.client.prod.entry.js"
     },
     "build_prod_server": {
-      "command":
-        "webpack --colors --display-error-details --config ./webpack/webpack.config.server.prod.entry.js"
+      "command": "webpack --colors --display-error-details --config ./webpack/webpack.config.server.prod.entry.js"
     },
     "run_prod_server": {
       "command": "./node_modules/.bin/babel-node ./src/start-server-prod.js",
@@ -128,8 +121,7 @@
       }
     },
     "test_unit": "jest --no-cache --runInBand",
-    "test_unit_ci":
-      "jest --no-cache --runInBand --testResultsProcessor='jest-junit' --coverage",
+    "test_unit_ci": "jest --no-cache --runInBand --testResultsProcessor='jest-junit' --coverage",
     "watch_test_unit": "jest --watch --no-cache --runInBand"
   },
   "dependencies": {
@@ -284,6 +276,9 @@
     "stylelint-config-standard": "18.0.0",
     "supertest": "3.0.0",
     "supertest-as-promised": "4.0.2",
+    "svg-loader": "0.0.2",
+    "svgo": "1.0.4",
+    "svgo-loader": "2.1.0",
     "timekeeper": "2.0.0",
     "webpack-bundle-analyzer": "2.9.1",
     "webpack-dev-middleware": "2.0.4",

src/components/index.js

@@ -33,6 +33,7 @@ export Search from './theme/Search/Search';
 export SearchTags from './theme/Search/SearchTags';
 export TabularView from './theme/View/TabularView';
 export View from './theme/View/View';
+export Icon from './theme/Icon/Icon';
 
 export Actions from './manage/Actions/Actions';
 export Add from './manage/Add/Add';

src/components/theme/Icon/Icon.jsx

@@ -0,0 +1,30 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const defaultSize = '100%';
+
+const Icon = ({ name, size, color }) => (
+  <svg
+    xmlns={name.attributes.xmlns}
+    viewBox={name.attributes.viewBox}
+    style={{ height: size, width: 'auto', fill: color }}
+    dangerouslySetInnerHTML={{ __html: name.content }}
+  />
+);
+
+Icon.propTypes = {
+  name: PropTypes.shape({
+    xmlns: PropTypes.string,
+    viewBox: PropTypes.string,
+    content: PropTypes.string,
+  }).isRequired,
+  size: PropTypes.string,
+  color: PropTypes.string,
+};
+
+Icon.defaultProps = {
+  size: defaultSize,
+  color: null,
+};
+
+export default Icon;